@mskcc/carbon-react/es/components/ToggleSmall/ToggleSmall.Skeleton.js

Carbon react components for the MSKCC DSM

/**
 * MSKCC 2021, 2024
 */

import { extends as _extends, defineProperty as _defineProperty } from '../../_virtual/_rollupPluginBabelHelpers.js';
import PropTypes from 'prop-types';
import React__default from 'react';
import cx from 'classnames';
import { PrefixContext } from '../../internal/usePrefix.js';

var _path;
class ToggleSmallSkeleton extends React__default.Component {
  render() {
    const {
      id,
      labelText,
      className,
      ...rest
    } = this.props;
    return /*#__PURE__*/React__default.createElement(PrefixContext.Consumer, null, prefix => {
      return /*#__PURE__*/React__default.createElement("div", _extends({
        className: cx(`${prefix}--form-item`, className)
      }, rest), /*#__PURE__*/React__default.createElement("input", {
        type: "checkbox",
        id: id,
        className: `${prefix}--toggle ${prefix}--toggle--small ${prefix}--skeleton`
      }), /*#__PURE__*/React__default.createElement("label", {
        className: `${prefix}--toggle__label ${prefix}--skeleton`,
        htmlFor: id
      }, labelText && /*#__PURE__*/React__default.createElement("span", {
        className: `${prefix}--toggle__label-text`
      }, labelText), /*#__PURE__*/React__default.createElement("span", {
        className: `${prefix}--toggle__appearance`
      }, /*#__PURE__*/React__default.createElement("svg", {
        className: `${prefix}--toggle__check`,
        width: "6px",
        height: "5px",
        viewBox: "0 0 6 5"
      }, _path || (_path = /*#__PURE__*/React__default.createElement("path", {
        d: "M2.2403 2.7299L4.9245 0 6 1.1117 2.2384 5 0 2.6863 1.0612 1.511z"
      }))))));
    });
  }
}
_defineProperty(ToggleSmallSkeleton, "propTypes", {
  ['aria-label']: PropTypes.string.isRequired,
  /**
   * Specify an optional className to add to the form item wrapper.
   */
  className: PropTypes.string,
  /**
   * Provide an id that unique represents the underlying `<input>`
   */
  id: PropTypes.string,
  /**
   * Provide the text that will be read by a screen reader when visiting this
   * control
   * `aria-label` is always required but will be null if `labelText` is also
   * provided
   */
  labelText: PropTypes.string
});
_defineProperty(ToggleSmallSkeleton, "defaultProps", {
  ['aria-label']: 'Toggle is loading'
});

export { ToggleSmallSkeleton, ToggleSmallSkeleton as default };