All files / Label Label.js

100% Statements 5/5
100% Branches 5/5
100% Functions 1/1
100% Lines 5/5

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57                                                    53x 53x 53x                                     3x 3x                
/* eslint css-modules/no-unused-class: [2, { markAsUsed: [
  'small', 'medium', 'large', 'title', 'subtitle', 'default', 'primary', 'secondary', 'danger', 'mandatory'
]}] */
import React from 'react';
import { defaultProps } from './props/defaultProps';
import { propTypes } from './props/propTypes';
import style from './Label.module.css';
import colors from './LabelColors.module.css';
 
export default class Label extends React.Component {
  render() {
    let {
      text,
      type,
      palette,
      size,
      clipped,
      htmlFor,
      title,
      onClick,
      dataId,
      dataSelectorId,
      variant,
      customClass,
      id,
      a11y={}
    } = this.props;
    const { tabIndex} = a11y;
    return (
      <label
        className={`${style.label} ${style[type]} ${style[size]} ${colors[palette]} ${style[`font_${variant}`]}
          ${clipped ? style.dotted : ''} ${onClick ? style.pointer : style.cursor} ${customClass} `}
        htmlFor={htmlFor}
        data-title={title}
        data-id={dataId}
        data-test-id={dataId}
        data-selector-id={dataSelectorId}
        onClick={onClick}
        id={id}
        tabIndex={tabIndex}
      >
        {text}
      </label>
    );
  }
}
 
Label.defaultProps = defaultProps;
Label.propTypes = propTypes;
 
// if (__DOCS__) {
//   Label.docs = {
//     componentGroup: 'Form Elements',
//     folderName: 'Style Guide'
//   };
// }