@hipay/hipay-material-ui 2.3.0-rcstyleguide-beta5 → 2.3.1-rc1

package/es/old_components/HiSelectableList/HiSelectableListItem.js

@@ -1,427 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.styles = void 0;
-
-var _extends2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/extends"));
-
-var _classCallCheck2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/createClass"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/getPrototypeOf"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/inherits"));
-
-var _defineProperty2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty"));
-
-var _objectSpread2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/objectSpread2"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _ListItem = _interopRequireDefault(require("@material-ui/core/ListItem"));
-
-var _ListSubheader = _interopRequireDefault(require("@material-ui/core/ListSubheader"));
-
-var _HiIcon = _interopRequireDefault(require("../HiIcon"));
-
-var _HiCheckbox = _interopRequireDefault(require("../HiCheckbox"));
-
-var _HiColoredLabel = _interopRequireDefault(require("../HiColoredLabel"));
-
-var _HiLoader = _interopRequireDefault(require("../HiLoader"));
-
-var _styles = require("@material-ui/core/styles");
-
-var _helpers = require("../utils/helpers");
-
-var _pure = _interopRequireDefault(require("recompose/pure"));
-
-var _keycode = _interopRequireDefault(require("keycode"));
-
-var PureListSubheader = (0, _pure.default)(_ListSubheader.default);
-var PureListItem = (0, _pure.default)(_ListItem.default);
-
-var styles = function styles(theme) {
-  return {
-    root: {
-      paddingLeft: 4
-    },
-    listItem: {
-      backgroundColor: theme.palette.background3,
-      color: theme.palette.neutral.dark,
-      padding: '5px 12px 5px 0px',
-      fontWeight: theme.typography.fontWeightRegular,
-      maxHeight: 56,
-      display: 'inline-flex',
-      alignItems: 'center',
-      cursor: 'pointer',
-      '&$listItemInlineWithInfoWithoutSecondary': {
-        justifyContent: 'space-between'
-      },
-      '&$listItemWithoutSecondaryInline': {
-        display: 'block'
-      },
-      '&$inline': {
-        minHeight: 40,
-        '& $secondaryLabel': {
-          display: 'inline-block'
-        }
-      },
-      '&:focus': {
-        backgroundColor: theme.palette.action.hover,
-        outline: 'none'
-      }
-    },
-    listItemWithoutSecondaryInline: {},
-    listItemInlineWithInfoWithoutSecondary: {},
-    listItemHover: {
-      '&:hover:not($disabled):not($pinned)': {
-        backgroundColor: theme.palette.action.hover,
-        fontWeight: theme.typography.fontWeightMedium
-      }
-    },
-    centered: {
-      textAlign: 'center',
-      width: '100%'
-    },
-    disabled: {
-      fontWeight: theme.typography.fontWeightLight,
-      cursor: 'default',
-      opacity: 'inherit'
-    },
-    selected: {
-      backgroundColor: theme.palette.action.selected
-    },
-    pinned: {
-      display: 'inherit',
-      marginRight: 8,
-      backgroundColor: theme.palette.background3
-    },
-    thin: {
-      fontWeight: theme.typography.fontWeightLight
-    },
-    loader: {
-      textAlign: 'center',
-      width: 1,
-      height: 22,
-      padding: '8px 0',
-      margin: 'auto'
-    },
-    listItemContent: (0, _objectSpread2.default)({}, theme.typography.b1, {
-      fontWeight: 'inherit',
-      width: '100%',
-      minWidth: '50%',
-      padding: '5px 0',
-      '&$listItemContentSelected': {
-        marginBottom: 1,
-        marginLeft: -4
-      },
-      '& strong': {
-        fontWeight: theme.typography.fontWeightMedium
-      },
-      display: 'contents'
-    }),
-    listItemContentSelected: {},
-    label: {
-      maxWidth: '100%',
-      whiteSpace: 'nowrap',
-      overflow: 'hidden',
-      textOverflow: 'ellipsis',
-      display: 'inline-block',
-      margin: '1px 0',
-      paddingLeft: 4
-    },
-    primaryHighlight: {
-      fontWeight: theme.typography.fontWeightMedium,
-      color: theme.palette.primary.main,
-      textTransform: 'uppercase'
-    },
-    secondaryLabel: (0, _objectSpread2.default)({}, theme.typography.b3, {
-      color: theme.palette.neutral.main,
-      fontWeight: theme.typography.fontWeightLight,
-      fontSize: 11,
-      marginLeft: 4
-    }),
-    inline: {},
-    info: (0, _objectSpread2.default)({}, theme.typography.b3, {
-      color: theme.palette.neutral.main,
-      fontWeight: theme.typography.fontWeightLight,
-      fontSize: 12,
-      textOverflow: 'ellipsis',
-      textAlign: 'right',
-      alignSelf: 'center'
-    }),
-    img: {
-      width: 24,
-      height: 'auto',
-      margin: '1px 4px 3px 4px',
-      verticalAlign: 'middle'
-    },
-    icon: {
-      margin: '0 4px',
-      verticalAlign: 'middle'
-    },
-    labelContent: {
-      display: '-webkit-flex',
-      alignItems: 'center',
-      maxWidth: '85%',
-      '&$labelWithoutSecondaryInline': {
-        maxWidth: '100%'
-      }
-    },
-    labelWithoutSecondaryInline: {},
-    infosContent: {
-      display: 'flex',
-      alignItems: 'center',
-      width: '100%',
-      justifyContent: 'space-between',
-      '&$infosInlineWithoutSecondary': {
-        width: 'auto'
-      },
-      '&$infosWithoutSecondaryInline': {
-        paddingLeft: 28
-      }
-    },
-    infosInlineWithoutSecondary: {},
-    infosWithSecondaryInline: {},
-    infosWithoutSecondaryInline: {}
-  };
-};
-/**
- * Construit un élément de liste sélectionnable (avec checkbox)
- * - la sélection/déséclection d'un item est géré avec KeyDown
- */
-
-
-exports.styles = styles;
-
-var HiSelectableListItem =
-/*#__PURE__*/
-function (_React$PureComponent) {
-  (0, _inherits2.default)(HiSelectableListItem, _React$PureComponent);
-
-  function HiSelectableListItem(props) {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, HiSelectableListItem);
-    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(HiSelectableListItem).call(this, props));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setHover", function (hover) {
-      return function () {
-        _this.setState({
-          hover: hover
-        });
-      };
-    });
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleKeyDown", function (item) {
-      return function (event) {
-        var key = (0, _keycode.default)(event);
-
-        if (key === 'space' || key === 'enter') {
-          event.preventDefault();
-          event.stopPropagation();
-
-          if (item) {
-            _this.props.onSelect(null, item);
-          }
-        }
-      };
-    });
-    _this.state = {
-      hover: false
-    };
-    _this.buildItemLabel = _this.buildItemLabel.bind((0, _assertThisInitialized2.default)(_this));
-    _this.setHover = _this.setHover.bind((0, _assertThisInitialized2.default)(_this));
-    return _this;
-  }
-
-  (0, _createClass2.default)(HiSelectableListItem, [{
-    key: "buildItemLabel",
-
-    /**
-     * Build item label with highlight and/or colored label
-     *
-     * @returns {*}
-     */
-    value: function buildItemLabel() {
-      var _this$props = this.props,
-          classes = _this$props.classes,
-          color = _this$props.color,
-          label = _this$props.label,
-          labelHighlight = _this$props.labelHighlight,
-          selected = _this$props.selected;
-
-      if (labelHighlight) {
-        var spanHighlight = _react.default.createElement("span", {
-          // eslint-disable-next-line react/no-danger
-          dangerouslySetInnerHTML: {
-            __html: (0, _helpers.escapeHTML)(labelHighlight)
-          }
-        });
-
-        if (color && selected) {
-          return _react.default.createElement(_HiColoredLabel.default, {
-            color: color,
-            label: spanHighlight
-          });
-        }
-
-        return _react.default.createElement("span", {
-          className: classes.label
-        }, spanHighlight);
-      }
-
-      if (color && selected) {
-        return _react.default.createElement(_HiColoredLabel.default, {
-          className: classes.coloredLabel,
-          color: color,
-          label: label
-        });
-      }
-
-      return _react.default.createElement("div", {
-        className: classes.label,
-        title: label
-      }, label);
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _classNames, _classNames3, _classNames4;
-
-      var _this$props2 = this.props,
-          centered = _this$props2.centered,
-          classes = _this$props2.classes,
-          selected = _this$props2.selected,
-          disabled = _this$props2.disabled,
-          fallbackImage = _this$props2.fallbackImage,
-          hideCheckbox = _this$props2.hideCheckbox,
-          onSelect = _this$props2.onSelect,
-          indeterminate = _this$props2.indeterminate,
-          indeterminateIcon = _this$props2.indeterminateIcon,
-          icon = _this$props2.icon,
-          id = _this$props2.id,
-          img = _this$props2.img,
-          info = _this$props2.info,
-          hoverIcon = _this$props2.hoverIcon,
-          checkedIcon = _this$props2.checkedIcon,
-          level = _this$props2.level,
-          paddingLeft = _this$props2.paddingLeft,
-          pinned = _this$props2.pinned,
-          secondaryInline = _this$props2.secondaryInline,
-          secondaryLabel = _this$props2.secondaryLabel,
-          thin = _this$props2.thin,
-          type = _this$props2.type,
-          color = _this$props2.color,
-          item = _this$props2.item; // Return simple loader list item
-
-      if (type === 'loader') {
-        return _react.default.createElement(_ListItem.default, null, _react.default.createElement(_HiLoader.default, {
-          loading: true,
-          className: classes.loader,
-          size: 8
-        }));
-      }
-
-      var displayedIcon;
-
-      if (!disabled && this.state.hover) {
-        displayedIcon = hoverIcon;
-      } else if (icon) {
-        displayedIcon = icon;
-      }
-
-      var ListItemComponentName = pinned ? PureListSubheader : PureListItem;
-      return _react.default.createElement(ListItemComponentName, (0, _extends2.default)({
-        id: id,
-        tabIndex: disabled ? '-1' : 0,
-        key: "li-".concat(id),
-        classes: {
-          root: classes.root
-        },
-        className: (0, _classnames.default)(classes.listItem, classes.listItemHover, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.disabled, disabled), (0, _defineProperty2.default)(_classNames, classes.selected, selected), (0, _defineProperty2.default)(_classNames, classes.thin, thin), (0, _defineProperty2.default)(_classNames, classes.pinned, pinned), (0, _defineProperty2.default)(_classNames, classes.inline, secondaryInline), (0, _defineProperty2.default)(_classNames, classes.listItemWithoutSecondaryInline, !secondaryInline), (0, _defineProperty2.default)(_classNames, classes.listItemInlineWithInfoWithoutSecondary, secondaryInline && info && !secondaryLabel), _classNames)),
-        disabled: disabled
-      }, disabled || {
-        onClick: onSelect,
-        onMouseEnter: this.setHover(true),
-        onMouseLeave: this.setHover(false),
-        onKeyDown: this.handleKeyDown(item)
-      }, {
-        style: {
-          paddingLeft: "".concat(paddingLeft + level * 32, "px")
-        }
-      }), _react.default.createElement("div", {
-        className: (0, _classnames.default)(classes.labelContent, (0, _defineProperty2.default)({}, classes.labelWithoutSecondaryInline, !secondaryInline || !secondaryLabel && !info))
-      }, !hideCheckbox && !pinned && _react.default.createElement(_HiCheckbox.default, {
-        tabIndex: 0,
-        classes: {
-          root: !secondaryInline ? classes.checkboxWithSecondaryInline : classes.checkbox
-        },
-        checked: selected,
-        checkedIcon: checkedIcon,
-        color: disabled ? 'inherit' : 'primary',
-        disabled: disabled,
-        icon: displayedIcon,
-        indeterminate: indeterminate,
-        indeterminateIcon: indeterminateIcon
-      }), type === 'image' && img && _react.default.createElement("img", {
-        src: img,
-        alt: '',
-        onError: function onError(e) {
-          if (fallbackImage) {
-            e.target.src = "".concat(fallbackImage);
-          } else {
-            e.target.style.display = 'none';
-          }
-        },
-        className: classes.img
-      }), _react.default.createElement("div", {
-        className: (0, _classnames.default)(classes.listItemContent, (_classNames3 = {}, (0, _defineProperty2.default)(_classNames3, classes.centered, centered), (0, _defineProperty2.default)(_classNames3, classes.primaryHighlight, type === 'primary-highlight'), (0, _defineProperty2.default)(_classNames3, classes.listItemContentSelected, selected && color), _classNames3)),
-        "data-id": id
-      }, type === 'icon' && icon && hideCheckbox && _react.default.createElement(_HiIcon.default, {
-        icon: icon,
-        className: classes.icon
-      }), this.buildItemLabel())), _react.default.createElement("div", {
-        className: (0, _classnames.default)(classes.infosContent, (_classNames4 = {}, (0, _defineProperty2.default)(_classNames4, classes.infosWithoutSecondaryInline, !secondaryInline), (0, _defineProperty2.default)(_classNames4, classes.infosWithSecondaryInline, !secondaryInline), (0, _defineProperty2.default)(_classNames4, classes.infosInlineWithoutSecondary, secondaryInline && !secondaryLabel), _classNames4))
-      }, !!secondaryLabel && _react.default.createElement("div", {
-        className: (0, _classnames.default)(classes.secondaryLabel, (0, _defineProperty2.default)({}, classes.inline, secondaryInline))
-      }, secondaryLabel), !!info && _react.default.createElement("span", {
-        className: (0, _classnames.default)(classes.info)
-      }, info)));
-    }
-  }]);
-  return HiSelectableListItem;
-}(_react.default.PureComponent);
-
-(0, _defineProperty2.default)(HiSelectableListItem, "defaultProps", {
-  centered: false,
-  disabled: false,
-  hideCheckbox: false,
-  hoverIcon: 'check_box_outline_blank',
-  checkedIcon: 'check_box',
-  indeterminateIcon: 'indeterminate_check_box',
-  indeterminate: false,
-  level: 0,
-  paddingLeft: 4,
-  pinned: false,
-  secondaryInline: true,
-  selected: false,
-  thin: false
-});
-
-var _default = (0, _styles.withStyles)(styles, {
-  hiComponent: true,
-  name: 'HmuiHiSelectableListItem'
-})(HiSelectableListItem);
-
-exports.default = _default;

package/es/old_components/HiSelectableList/index.js

@@ -1,31 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _HiSelectableList.default;
-  }
-});
-Object.defineProperty(exports, "HiSelectableListItem", {
-  enumerable: true,
-  get: function get() {
-    return _HiSelectableListItem.default;
-  }
-});
-Object.defineProperty(exports, "HiSelectableListHierarchic", {
-  enumerable: true,
-  get: function get() {
-    return _HiSelectableListHierarchic.default;
-  }
-});
-
-var _HiSelectableList = _interopRequireDefault(require("./HiSelectableList"));
-
-var _HiSelectableListItem = _interopRequireDefault(require("./HiSelectableListItem"));
-
-var _HiSelectableListHierarchic = _interopRequireDefault(require("./HiSelectableListHierarchic"));

package/es/old_components/HiSwitch/HiSwitch.js

@@ -1,201 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.styles = void 0;
-
-var _extends2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/extends"));
-
-var _defineProperty2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/defineProperty"));
-
-var _objectWithoutProperties2 = _interopRequireDefault(require("/home/mfazio/dev/projects/hmui-styleguide/node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/objectWithoutProperties"));
-
-var _react = _interopRequireDefault(require("react"));
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _SwitchBase = _interopRequireDefault(require("@material-ui/core/internal/SwitchBase"));
-
-var _Check = _interopRequireDefault(require("@material-ui/icons/Check"));
-
-var _helpers = require("../utils/helpers");
-
-var _styles = require("@material-ui/core/styles");
-
-var styles = function styles(theme) {
-  return {
-    root: {
-      display: 'inline-flex',
-      width: 62,
-      position: 'relative',
-      flexShrink: 0,
-      zIndex: 0
-    },
-    bar: {
-      borderRadius: 7,
-      display: 'block',
-      position: 'absolute',
-      width: 34,
-      height: 14,
-      top: '50%',
-      marginTop: -7,
-      left: '50%',
-      marginLeft: -17,
-      transition: theme.transitions.create(['opacity', 'background-color'], {
-        duration: theme.transitions.duration.shortest
-      }),
-      backgroundColor: theme.palette.type === 'light' ? theme.palette.neutral.main : '#fff',
-      opacity: theme.palette.type === 'light' ? 0.38 : 0.3
-    },
-    icon: {
-      boxShadow: theme.shadows[1],
-      width: 20,
-      height: 20,
-      borderRadius: '50%',
-      backgroundColor: theme.palette.background2,
-      color: theme.palette.background2,
-      padding: 2
-    },
-    iconDisabled: {
-      backgroundColor: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[800],
-      color: theme.palette.type === 'light' ? theme.palette.grey[50] : theme.palette.grey[400],
-      '&:not($iconChecked)': {
-        color: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[800]
-      }
-    },
-    // For SwitchBase
-    switchBaseRoot: {
-      zIndex: 1,
-      color: theme.palette.type === 'light' ? theme.palette.grey[50] : theme.palette.grey[400],
-      transition: theme.transitions.create('transform', {
-        duration: theme.transitions.duration.shortest
-      }),
-      height: 40,
-      width: 40
-    },
-    disabled: {
-      color: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[800],
-      '& + $bar': {
-        backgroundColor: theme.palette.type === 'light' ? '#000' : '#fff',
-        opacity: theme.palette.type === 'light' ? 0.12 : 0.1
-      }
-    },
-    iconChecked: {},
-    iconCheckedPrimary: {
-      backgroundColor: theme.palette.primary.main,
-      color: theme.palette.primary.contrastText
-    },
-    iconCheckedSecondary: {
-      backgroundColor: theme.palette.secondary.main,
-      color: theme.palette.secondary.contrastText
-    },
-    iconCheckedPositive: {
-      backgroundColor: theme.palette.positive.main,
-      color: theme.palette.positive.contrastText
-    },
-    iconCheckedNegative: {
-      backgroundColor: theme.palette.negative.main,
-      color: theme.palette.negative.contrastText
-    },
-    iconCheckedMiddle: {
-      backgroundColor: theme.palette.middle.main,
-      color: theme.palette.middle.contrastText
-    },
-    iconCheckedNeutral: {
-      backgroundColor: theme.palette.neutral.main,
-      color: theme.palette.neutral.contrastText
-    },
-    checkedPrimary: {
-      transform: 'translateX(18px)',
-      '& + $bar': {
-        backgroundColor: theme.palette.primary.main,
-        opacity: 0.5
-      }
-    },
-    checkedSecondary: {
-      transform: 'translateX(18px)',
-      '& + $bar': {
-        backgroundColor: theme.palette.secondary.main,
-        opacity: 0.5
-      }
-    },
-    checkedPositive: {
-      transform: 'translateX(18px)',
-      '& + $bar': {
-        backgroundColor: theme.palette.positive.main,
-        opacity: 0.5
-      }
-    },
-    checkedNegative: {
-      transform: 'translateX(18px)',
-      '& + $bar': {
-        backgroundColor: theme.palette.negative.main,
-        opacity: 0.5
-      }
-    },
-    checkedMiddle: {
-      transform: 'translateX(18px)',
-      '& + $bar': {
-        backgroundColor: theme.palette.middle.main,
-        opacity: 0.5
-      }
-    },
-    checkedNeutral: {
-      transform: 'translateX(18px)',
-      '& + $bar': {
-        backgroundColor: theme.palette.neutral.main,
-        opacity: 0.5
-      }
-    }
-  };
-};
-
-exports.styles = styles;
-
-function HiSwitch(props) {
-  var _classNames;
-
-  var classes = props.classes,
-      className = props.className,
-      checked = props.checked,
-      color = props.color,
-      disabled = props.disabled,
-      other = (0, _objectWithoutProperties2.default)(props, ["classes", "className", "checked", "color", "disabled"]);
-  var isHiColor = ['primary', 'secondary', 'positive', 'negative', 'middle', 'neutral'].includes(color);
-  var iconClass = (0, _classnames.default)(classes.icon, (_classNames = {}, (0, _defineProperty2.default)(_classNames, classes.iconChecked, checked), (0, _defineProperty2.default)(_classNames, classes.iconCheckedNeutral, !disabled && checked && !isHiColor), (0, _defineProperty2.default)(_classNames, classes["iconChecked".concat((0, _helpers.capitalize)(color))], !disabled && checked && isHiColor), (0, _defineProperty2.default)(_classNames, classes.iconDisabled, disabled), _classNames));
-
-  var icon = _react.default.createElement(_Check.default, {
-    className: iconClass
-  });
-
-  return _react.default.createElement("div", {
-    className: (0, _classnames.default)(classes.root, className)
-  }, _react.default.createElement(_SwitchBase.default, (0, _extends2.default)({
-    type: "checkbox",
-    icon: icon,
-    classes: {
-      root: classes.switchBaseRoot,
-      checked: isHiColor && !disabled ? classes["checked".concat((0, _helpers.capitalize)(color))] : classes.checkedNeutral,
-      disabled: classes.disabled
-    },
-    checkedIcon: icon,
-    checked: checked,
-    disabled: disabled
-  }, other)), _react.default.createElement("div", {
-    className: classes.bar
-  }));
-}
-
-HiSwitch.defaultProps = {
-  color: 'inherit'
-};
-
-var _default = (0, _styles.withStyles)(styles, {
-  hiComponent: true,
-  name: 'HmuiHiSwitch'
-})(HiSwitch);
-
-exports.default = _default;