text: import React from 'react';
  import PropTypes from 'prop-types';
  
  /**
   * @category controls
   * @component label
   * @variations collab-ui-react
   */
  
  const Label = ({ className, htmlFor, label, theme, ...props }) => {
    return (
      <label
        className={
          `${className ? ` ${className}` : ''}`+
          `${theme ? ` cui-label--${theme}` : ''}`
        }
        htmlFor={htmlFor}
        {...props}
      >
        <span>{label}</span>
      </label>
    );
  };
  
  Label.propTypes = {
    /** @prop HTML class name for associated Input | '' */
    className: PropTypes.string,
    /** @prop HTML ID for associated Input | null */
    htmlFor: PropTypes.string.isRequired,
    /** @prop Required Label text | null */
    label: PropTypes.string.isRequired,
    /** @prop Set Label's color theme | '' */
    theme: PropTypes.string,
  };
  
  Label.defaultProps = {
    className: '',
    htmlFor: null,
    label: null,
    theme: '',
  };
  
  Label.displayName = 'Label';
  
  export default Label;
  
  /**
  * @name Default Label
  * @description Labels are useful.
  *
  * @category controls
  * @component label
  * @section default
  *
  * @js
  import { Label } from '@collab-ui/react';
  
  export default function LabelDefault() {
    return (
      <Label
        htmlFor='label1'
        label='Default Label'
      />
    );
  }
  
  **/
  