@pie-lib/text-select 1.32.2 → 1.32.3-next.155

package/lib/token-select/token.js

@@ -1,168 +1,216 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = exports.TokenTypes = exports.Token = void 0;
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _styles = require("@material-ui/core/styles");
-
+var _styles = require("@mui/material/styles");
 var _classnames = _interopRequireDefault(require("classnames"));
-
-var _Check = _interopRequireDefault(require("@material-ui/icons/Check"));
-
-var _Close = _interopRequireDefault(require("@material-ui/icons/Close"));
-
+var _Check = _interopRequireDefault(require("@mui/icons-material/Check"));
+var _Close = _interopRequireDefault(require("@mui/icons-material/Close"));
 var _renderUi = require("@pie-lib/render-ui");
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 // we need to use a larger line height for the token to be more readable
-var LINE_HEIGHT_MULTIPLIER = 3.2; // we need a bit more space for correctness indicators
-
+var LINE_HEIGHT_MULTIPLIER = 3.2;
+// we need a bit more space for correctness indicators
 var CORRECTNESS_LINE_HEIGHT_MULTIPLIER = 3.4;
 var CORRECTNESS_PADDING = 2;
 
-var Wrapper = function Wrapper(_ref) {
-  var useWrapper = _ref.useWrapper,
-      children = _ref.children,
-      classNameContainer = _ref.classNameContainer,
-      iconClass = _ref.iconClass,
-      Icon = _ref.Icon;
-  return useWrapper ? /*#__PURE__*/_react["default"].createElement("span", {
-    className: classNameContainer
-  }, children, /*#__PURE__*/_react["default"].createElement(Icon, {
-    className: iconClass
-  })) : children;
+// Styled components for different token states
+var StyledToken = (0, _styles.styled)('span')(function (_ref) {
+  var theme = _ref.theme;
+  return (0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({
+    cursor: 'pointer',
+    textIndent: 0,
+    '&.disabled': {
+      cursor: 'inherit',
+      color: _renderUi.color.disabled()
+    },
+    '&.disabledBlack': {
+      cursor: 'inherit',
+      pointerEvents: 'none'
+    },
+    '&.disabledAndSelected': {
+      backgroundColor: _renderUi.color.blueGrey100()
+    }
+  }, "@media (min-width: ".concat(theme.breakpoints.values.md, "px)"), {
+    '&.selectable:hover': {
+      backgroundColor: _renderUi.color.blueGrey300(),
+      color: theme.palette.common.black,
+      '& > *': {
+        backgroundColor: _renderUi.color.blueGrey300()
+      }
+    }
+  }), '&.selected', {
+    backgroundColor: _renderUi.color.blueGrey100(),
+    color: theme.palette.common.black,
+    lineHeight: "".concat(parseFloat(theme.spacing(1)) * LINE_HEIGHT_MULTIPLIER, "px"),
+    border: "solid 2px ".concat(_renderUi.color.blueGrey900()),
+    borderRadius: '4px',
+    '& > *': {
+      backgroundColor: _renderUi.color.blueGrey100()
+    }
+  }), '&.highlight', {
+    border: "dashed 2px ".concat(_renderUi.color.blueGrey600()),
+    borderRadius: '4px',
+    lineHeight: "".concat(parseFloat(theme.spacing(1)) * LINE_HEIGHT_MULTIPLIER, "px")
+  }), '&.print', {
+    border: "dashed 2px ".concat(_renderUi.color.blueGrey600()),
+    borderRadius: '4px',
+    lineHeight: "".concat(parseFloat(theme.spacing(1)) * LINE_HEIGHT_MULTIPLIER, "px"),
+    color: _renderUi.color.text()
+  }), '&.custom', {
+    display: 'initial'
+  });
+});
+var StyledCommonTokenStyle = (0, _styles.styled)('span')(function (_ref3) {
+  var theme = _ref3.theme;
+  return {
+    position: 'relative',
+    borderRadius: '4px',
+    color: theme.palette.common.black,
+    lineHeight: "".concat(parseFloat(theme.spacing(1)) * CORRECTNESS_LINE_HEIGHT_MULTIPLIER + CORRECTNESS_PADDING, "px"),
+    padding: "".concat(CORRECTNESS_PADDING, "px")
+  };
+});
+var StyledCorrectContainer = (0, _styles.styled)(StyledCommonTokenStyle)(function () {
+  return {
+    border: "".concat(_renderUi.color.correctTertiary(), " solid 2px")
+  };
+});
+var StyledIncorrectContainer = (0, _styles.styled)(StyledCommonTokenStyle)(function () {
+  return {
+    border: "".concat(_renderUi.color.incorrectWithIcon(), " solid 2px")
+  };
+});
+var StyledMissingContainer = (0, _styles.styled)(StyledCommonTokenStyle)(function () {
+  return {
+    border: "".concat(_renderUi.color.incorrectWithIcon(), " dashed 2px")
+  };
+});
+var baseIconStyles = {
+  color: _renderUi.color.white(),
+  position: 'absolute',
+  top: '-8px',
+  left: '-8px',
+  borderRadius: '50%',
+  fontSize: '12px',
+  padding: '2px',
+  display: 'inline-block'
+};
+var StyledCorrectCheckIcon = (0, _styles.styled)(_Check["default"])(function () {
+  return _objectSpread(_objectSpread({}, baseIconStyles), {}, {
+    backgroundColor: _renderUi.color.correctTertiary()
+  });
+});
+var StyledIncorrectCloseIcon = (0, _styles.styled)(_Close["default"])(function () {
+  return _objectSpread(_objectSpread({}, baseIconStyles), {}, {
+    backgroundColor: _renderUi.color.incorrectWithIcon()
+  });
+});
+var Wrapper = function Wrapper(_ref4) {
+  var useWrapper = _ref4.useWrapper,
+    children = _ref4.children,
+    Container = _ref4.Container,
+    Icon = _ref4.Icon;
+  return useWrapper ? /*#__PURE__*/_react["default"].createElement(Container, null, children, Icon ? /*#__PURE__*/_react["default"].createElement(Icon, null) : null) : children;
 };
-
 Wrapper.propTypes = {
   useWrapper: _propTypes["default"].bool,
-  classNameContainer: _propTypes["default"].string,
-  iconClass: _propTypes["default"].string,
-  Icon: _propTypes["default"].func,
-  children: _propTypes["default"].element
+  Container: _propTypes["default"].elementType,
+  Icon: _propTypes["default"].elementType,
+  children: _propTypes["default"].node
 };
-var TokenTypes = {
+var TokenTypes = exports.TokenTypes = {
   text: _propTypes["default"].string,
   selectable: _propTypes["default"].bool
 };
-exports.TokenTypes = TokenTypes;
-
-var Token = /*#__PURE__*/function (_React$Component) {
-  (0, _inherits2["default"])(Token, _React$Component);
-
-  var _super = _createSuper(Token);
-
+var Token = exports.Token = /*#__PURE__*/function (_React$Component) {
   function Token() {
     var _this;
-
     (0, _classCallCheck2["default"])(this, Token);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getClassAndIconConfig", function () {
+    _this = _callSuper(this, Token, [].concat(args));
+    (0, _defineProperty2["default"])(_this, "getClassAndIconConfig", function () {
       var _this$props = _this.props,
-          selectable = _this$props.selectable,
-          selected = _this$props.selected,
-          classes = _this$props.classes,
-          classNameProp = _this$props.className,
-          disabled = _this$props.disabled,
-          highlight = _this$props.highlight,
-          correct = _this$props.correct,
-          animationsDisabled = _this$props.animationsDisabled,
-          isMissing = _this$props.isMissing;
+        selectable = _this$props.selectable,
+        selected = _this$props.selected,
+        classNameProp = _this$props.className,
+        disabled = _this$props.disabled,
+        highlight = _this$props.highlight,
+        correct = _this$props.correct,
+        animationsDisabled = _this$props.animationsDisabled,
+        isMissing = _this$props.isMissing;
       var isTouchEnabled = 'ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0;
       var baseClassName = Token.rootClassName;
-      var classNameContainer;
+      var Container;
       var Icon;
-      var iconClass;
-
       if (correct === undefined && selected && disabled) {
         return {
-          className: (0, _classnames["default"])(classes.token, classes.selected, classes.disabledBlack)
+          className: (0, _classnames["default"])(baseClassName, 'selected', 'disabledBlack', classNameProp),
+          Component: StyledToken
         };
       }
-
       if (correct !== undefined) {
         var isCorrect = correct === true;
         return {
-          className: (0, _classnames["default"])(baseClassName, classes.custom),
-          classNameContainer: (0, _classnames["default"])(isCorrect ? classes.correct : classes.incorrect, classes.commonTokenStyle),
-          Icon: isCorrect ? _Check["default"] : _Close["default"],
-          iconClass: (0, _classnames["default"])(classes.correctnessIndicatorIcon, isCorrect ? classes.correctIcon : classes.incorrectIcon)
+          className: (0, _classnames["default"])(baseClassName, 'custom', classNameProp),
+          Component: StyledToken,
+          Container: isCorrect ? StyledCorrectContainer : StyledIncorrectContainer,
+          Icon: isCorrect ? StyledCorrectCheckIcon : StyledIncorrectCloseIcon
         };
       }
-
       if (isMissing) {
         return {
-          className: (0, _classnames["default"])(baseClassName, classes.custom, classes.missing, classes.commonTokenStyle),
-          classNameContainer: classes.commonTokenStyle,
-          Icon: _Close["default"],
-          iconClass: (0, _classnames["default"])(classes.correctnessIndicatorIcon, classes.incorrectIcon)
+          className: (0, _classnames["default"])(baseClassName, 'custom', 'missing', classNameProp),
+          Component: StyledToken,
+          Container: StyledMissingContainer,
+          Icon: StyledIncorrectCloseIcon
         };
       }
-
       return {
-        className: (0, _classnames["default"])(baseClassName, classes.token, disabled && classes.disabled, selectable && !disabled && !isTouchEnabled && classes.selectable, selected && !disabled && classes.selected, selected && disabled && classes.disabledAndSelected, highlight && selectable && !disabled && !selected && classes.highlight, animationsDisabled && classes.print, classNameProp),
-        classNameContainer: classNameContainer,
-        Icon: Icon,
-        iconClass: iconClass
+        className: (0, _classnames["default"])(baseClassName, disabled && 'disabled', selectable && !disabled && !isTouchEnabled && 'selectable', selected && !disabled && 'selected', selected && disabled && 'disabledAndSelected', highlight && selectable && !disabled && !selected && 'highlight', animationsDisabled && 'print', classNameProp),
+        Component: StyledToken,
+        Container: Container,
+        Icon: Icon
       };
     });
     return _this;
   }
-
-  (0, _createClass2["default"])(Token, [{
+  (0, _inherits2["default"])(Token, _React$Component);
+  return (0, _createClass2["default"])(Token, [{
     key: "render",
     value: function render() {
       var _this$props2 = this.props,
-          text = _this$props2.text,
-          index = _this$props2.index,
-          correct = _this$props2.correct,
-          isMissing = _this$props2.isMissing;
-
+        text = _this$props2.text,
+        index = _this$props2.index,
+        correct = _this$props2.correct,
+        isMissing = _this$props2.isMissing;
       var _this$getClassAndIcon = this.getClassAndIconConfig(),
-          className = _this$getClassAndIcon.className,
-          classNameContainer = _this$getClassAndIcon.classNameContainer,
-          Icon = _this$getClassAndIcon.Icon,
-          iconClass = _this$getClassAndIcon.iconClass;
-
+        className = _this$getClassAndIcon.className,
+        Component = _this$getClassAndIcon.Component,
+        Container = _this$getClassAndIcon.Container,
+        Icon = _this$getClassAndIcon.Icon;
+      var TokenComponent = Component || StyledToken;
       return /*#__PURE__*/_react["default"].createElement(Wrapper, {
         useWrapper: correct !== undefined || isMissing,
-        classNameContainer: classNameContainer,
-        iconClass: iconClass,
+        Container: Container,
         Icon: Icon
-      }, /*#__PURE__*/_react["default"].createElement("span", {
+      }, /*#__PURE__*/_react["default"].createElement(TokenComponent, {
         className: className,
         dangerouslySetInnerHTML: {
           __html: (text || '').replace(/\n/g, '<br>')
@@ -171,13 +219,9 @@ var Token = /*#__PURE__*/function (_React$Component) {
       }));
     }
   }]);
-  return Token;
 }(_react["default"].Component);
-
-exports.Token = Token;
 (0, _defineProperty2["default"])(Token, "rootClassName", 'tokenRootClass');
 (0, _defineProperty2["default"])(Token, "propTypes", _objectSpread(_objectSpread({}, TokenTypes), {}, {
-  classes: _propTypes["default"].object.isRequired,
   text: _propTypes["default"].string.isRequired,
   className: _propTypes["default"].string,
   disabled: _propTypes["default"].bool,
@@ -188,89 +232,5 @@ exports.Token = Token;
   selectable: false,
   text: ''
 });
-
-var _default = (0, _styles.withStyles)(function (theme) {
-  return {
-    token: {
-      cursor: 'pointer',
-      textIndent: 0
-    },
-    disabled: {
-      cursor: 'inherit',
-      color: _renderUi.color.disabled()
-    },
-    disabledBlack: {
-      cursor: 'inherit'
-    },
-    disabledAndSelected: {
-      backgroundColor: _renderUi.color.blueGrey100()
-    },
-    selectable: (0, _defineProperty2["default"])({}, theme.breakpoints.up(769), {
-      '&:hover': {
-        backgroundColor: _renderUi.color.blueGrey300(),
-        color: theme.palette.common.black,
-        '& > *': {
-          backgroundColor: _renderUi.color.blueGrey300()
-        }
-      }
-    }),
-    selected: {
-      backgroundColor: _renderUi.color.blueGrey100(),
-      color: theme.palette.common.black,
-      lineHeight: "".concat(theme.spacing.unit * LINE_HEIGHT_MULTIPLIER, "px"),
-      border: "solid 2px ".concat(_renderUi.color.blueGrey900()),
-      borderRadius: '4px',
-      '& > *': {
-        backgroundColor: _renderUi.color.blueGrey100()
-      }
-    },
-    highlight: {
-      border: "dashed 2px ".concat(_renderUi.color.blueGrey600()),
-      borderRadius: '4px',
-      lineHeight: "".concat(theme.spacing.unit * LINE_HEIGHT_MULTIPLIER, "px")
-    },
-    print: {
-      border: "dashed 2px ".concat(_renderUi.color.blueGrey600()),
-      borderRadius: '4px',
-      lineHeight: "".concat(theme.spacing.unit * LINE_HEIGHT_MULTIPLIER, "px"),
-      color: _renderUi.color.text()
-    },
-    custom: {
-      display: 'initial'
-    },
-    commonTokenStyle: {
-      position: 'relative',
-      borderRadius: '4px',
-      color: theme.palette.common.black,
-      lineHeight: "".concat(theme.spacing.unit * CORRECTNESS_LINE_HEIGHT_MULTIPLIER + CORRECTNESS_PADDING, "px"),
-      padding: "".concat(CORRECTNESS_PADDING, "px")
-    },
-    correct: {
-      border: "".concat(_renderUi.color.correctTertiary(), " solid 2px")
-    },
-    incorrect: {
-      border: "".concat(_renderUi.color.incorrectWithIcon(), " solid 2px")
-    },
-    missing: {
-      border: "".concat(_renderUi.color.incorrectWithIcon(), " dashed 2px")
-    },
-    incorrectIcon: {
-      backgroundColor: _renderUi.color.incorrectWithIcon()
-    },
-    correctIcon: {
-      backgroundColor: _renderUi.color.correctTertiary()
-    },
-    correctnessIndicatorIcon: {
-      color: _renderUi.color.white(),
-      position: 'absolute',
-      top: '-8px',
-      left: '-8px',
-      borderRadius: '50%',
-      fontSize: '12px',
-      padding: '2px'
-    }
-  };
-})(Token);
-
-exports["default"] = _default;
+var _default = exports["default"] = Token;
 //# sourceMappingURL=token.js.map

package/lib/token-select/token.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/token-select/token.jsx"],"names":["LINE_HEIGHT_MULTIPLIER","CORRECTNESS_LINE_HEIGHT_MULTIPLIER","CORRECTNESS_PADDING","Wrapper","useWrapper","children","classNameContainer","iconClass","Icon","propTypes","PropTypes","bool","string","func","element","TokenTypes","text","selectable","Token","props","selected","classes","classNameProp","className","disabled","highlight","correct","animationsDisabled","isMissing","isTouchEnabled","window","navigator","maxTouchPoints","msMaxTouchPoints","baseClassName","rootClassName","undefined","token","disabledBlack","isCorrect","custom","incorrect","commonTokenStyle","Check","Close","correctnessIndicatorIcon","correctIcon","incorrectIcon","missing","disabledAndSelected","print","index","getClassAndIconConfig","__html","replace","React","Component","object","isRequired","theme","cursor","textIndent","color","backgroundColor","blueGrey100","breakpoints","up","blueGrey300","palette","common","black","lineHeight","spacing","unit","border","blueGrey900","borderRadius","blueGrey600","display","position","padding","correctTertiary","incorrectWithIcon","white","top","left","fontSize"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport Check from '@material-ui/icons/Check';\nimport Close from '@material-ui/icons/Close';\n\nimport { color } from '@pie-lib/render-ui';\n\n// we need to use a larger line height for the token to be more readable\nconst LINE_HEIGHT_MULTIPLIER = 3.2;\n// we need a bit more space for correctness indicators\nconst CORRECTNESS_LINE_HEIGHT_MULTIPLIER = 3.4;\nconst CORRECTNESS_PADDING = 2;\n\nconst Wrapper = ({ useWrapper, children, classNameContainer, iconClass, Icon }) =>\n  useWrapper ? (\n    <span className={classNameContainer}>\n      {children}\n      <Icon className={iconClass} />\n    </span>\n  ) : (\n    children\n  );\n\nWrapper.propTypes = {\n  useWrapper: PropTypes.bool,\n  classNameContainer: PropTypes.string,\n  iconClass: PropTypes.string,\n  Icon: PropTypes.func,\n  children: PropTypes.element,\n};\n\nexport const TokenTypes = {\n  text: PropTypes.string,\n  selectable: PropTypes.bool,\n};\n\nexport class Token extends React.Component {\n  static rootClassName = 'tokenRootClass';\n\n  static propTypes = {\n    ...TokenTypes,\n    classes: PropTypes.object.isRequired,\n    text: PropTypes.string.isRequired,\n    className: PropTypes.string,\n    disabled: PropTypes.bool,\n    highlight: PropTypes.bool,\n    correct: PropTypes.bool,\n  };\n\n  static defaultProps = {\n    selectable: false,\n    text: '',\n  };\n\n  getClassAndIconConfig = () => {\n    const {\n      selectable,\n      selected,\n      classes,\n      className: classNameProp,\n      disabled,\n      highlight,\n      correct,\n      animationsDisabled,\n      isMissing,\n    } = this.props;\n    const isTouchEnabled = 'ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0;\n    const baseClassName = Token.rootClassName;\n    let classNameContainer;\n    let Icon;\n    let iconClass;\n\n    if (correct === undefined && selected && disabled) {\n      return {\n        className: classNames(classes.token, classes.selected, classes.disabledBlack),\n      };\n    }\n\n    if (correct !== undefined) {\n      const isCorrect = correct === true;\n      return {\n        className: classNames(baseClassName, classes.custom),\n        classNameContainer: classNames(isCorrect ? classes.correct : classes.incorrect, classes.commonTokenStyle),\n        Icon: isCorrect ? Check : Close,\n        iconClass: classNames(\n          classes.correctnessIndicatorIcon,\n          isCorrect ? classes.correctIcon : classes.incorrectIcon,\n        ),\n      };\n    }\n\n    if (isMissing) {\n      return {\n        className: classNames(baseClassName, classes.custom, classes.missing, classes.commonTokenStyle),\n        classNameContainer: classes.commonTokenStyle,\n        Icon: Close,\n        iconClass: classNames(classes.correctnessIndicatorIcon, classes.incorrectIcon),\n      };\n    }\n\n    return {\n      className: classNames(\n        baseClassName,\n        classes.token,\n        disabled && classes.disabled,\n        selectable && !disabled && !isTouchEnabled && classes.selectable,\n        selected && !disabled && classes.selected,\n        selected && disabled && classes.disabledAndSelected,\n        highlight && selectable && !disabled && !selected && classes.highlight,\n        animationsDisabled && classes.print,\n        classNameProp,\n      ),\n      classNameContainer,\n      Icon,\n      iconClass,\n    };\n  };\n\n  render() {\n    const { text, index, correct, isMissing } = this.props;\n    const { className, classNameContainer, Icon, iconClass } = this.getClassAndIconConfig();\n\n    return (\n      <Wrapper\n        useWrapper={correct !== undefined || isMissing}\n        classNameContainer={classNameContainer}\n        iconClass={iconClass}\n        Icon={Icon}\n      >\n        <span\n          className={className}\n          dangerouslySetInnerHTML={{ __html: (text || '').replace(/\\n/g, '<br>') }}\n          data-indexkey={index}\n        />\n      </Wrapper>\n    );\n  }\n}\n\nexport default withStyles((theme) => {\n  return {\n    token: {\n      cursor: 'pointer',\n      textIndent: 0,\n    },\n    disabled: {\n      cursor: 'inherit',\n      color: color.disabled(),\n    },\n    disabledBlack: {\n      cursor: 'inherit',\n    },\n    disabledAndSelected: {\n      backgroundColor: color.blueGrey100(),\n    },\n    selectable: {\n      [theme.breakpoints.up(769)]: {\n        '&:hover': {\n          backgroundColor: color.blueGrey300(),\n          color: theme.palette.common.black,\n          '& > *': {\n            backgroundColor: color.blueGrey300(),\n          },\n        },\n      },\n    },\n    selected: {\n      backgroundColor: color.blueGrey100(),\n      color: theme.palette.common.black,\n      lineHeight: `${theme.spacing.unit * LINE_HEIGHT_MULTIPLIER}px`,\n      border: `solid 2px ${color.blueGrey900()}`,\n      borderRadius: '4px',\n      '& > *': {\n        backgroundColor: color.blueGrey100(),\n      },\n    },\n    highlight: {\n      border: `dashed 2px ${color.blueGrey600()}`,\n      borderRadius: '4px',\n      lineHeight: `${theme.spacing.unit * LINE_HEIGHT_MULTIPLIER}px`,\n    },\n    print: {\n      border: `dashed 2px ${color.blueGrey600()}`,\n      borderRadius: '4px',\n      lineHeight: `${theme.spacing.unit * LINE_HEIGHT_MULTIPLIER}px`,\n      color: color.text(),\n    },\n    custom: {\n      display: 'initial',\n    },\n    commonTokenStyle: {\n      position: 'relative',\n      borderRadius: '4px',\n      color: theme.palette.common.black,\n      lineHeight: `${theme.spacing.unit * CORRECTNESS_LINE_HEIGHT_MULTIPLIER + CORRECTNESS_PADDING}px`,\n      padding: `${CORRECTNESS_PADDING}px`,\n    },\n    correct: {\n      border: `${color.correctTertiary()} solid 2px`,\n    },\n    incorrect: {\n      border: `${color.incorrectWithIcon()} solid 2px`,\n    },\n    missing: {\n      border: `${color.incorrectWithIcon()} dashed 2px`,\n    },\n    incorrectIcon: {\n      backgroundColor: color.incorrectWithIcon(),\n    },\n    correctIcon: {\n      backgroundColor: color.correctTertiary(),\n    },\n    correctnessIndicatorIcon: {\n      color: color.white(),\n      position: 'absolute',\n      top: '-8px',\n      left: '-8px',\n      borderRadius: '50%',\n      fontSize: '12px',\n      padding: '2px',\n    },\n  };\n})(Token);\n"],"file":"token.js"}
+{"version":3,"file":"token.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_classnames","_Check","_Close","_renderUi","_callSuper","t","o","e","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","call","ownKeys","r","Object","keys","getOwnPropertySymbols","filter","getOwnPropertyDescriptor","enumerable","push","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","defineProperty","LINE_HEIGHT_MULTIPLIER","CORRECTNESS_LINE_HEIGHT_MULTIPLIER","CORRECTNESS_PADDING","StyledToken","styled","_ref","theme","cursor","textIndent","color","disabled","pointerEvents","backgroundColor","blueGrey100","concat","breakpoints","values","md","blueGrey300","palette","common","black","lineHeight","parseFloat","spacing","border","blueGrey900","borderRadius","blueGrey600","text","display","StyledCommonTokenStyle","_ref3","position","padding","StyledCorrectContainer","correctTertiary","StyledIncorrectContainer","incorrectWithIcon","StyledMissingContainer","baseIconStyles","white","top","left","fontSize","StyledCorrectCheckIcon","Check","StyledIncorrectCloseIcon","Close","Wrapper","_ref4","useWrapper","children","Container","Icon","createElement","propTypes","PropTypes","bool","elementType","node","TokenTypes","exports","string","selectable","Token","_React$Component","_this","_classCallCheck2","_len","args","Array","_key","_this$props","props","selected","classNameProp","className","highlight","correct","animationsDisabled","isMissing","isTouchEnabled","window","navigator","maxTouchPoints","msMaxTouchPoints","baseClassName","rootClassName","undefined","classNames","Component","isCorrect","_inherits2","_createClass2","key","value","render","_this$props2","index","_this$getClassAndIcon","getClassAndIconConfig","TokenComponent","dangerouslySetInnerHTML","__html","replace","React","isRequired","_default"],"sources":["../../src/token-select/token.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport classNames from 'classnames';\nimport Check from '@mui/icons-material/Check';\nimport Close from '@mui/icons-material/Close';\n\nimport { color } from '@pie-lib/render-ui';\n\n// we need to use a larger line height for the token to be more readable\nconst LINE_HEIGHT_MULTIPLIER = 3.2;\n// we need a bit more space for correctness indicators\nconst CORRECTNESS_LINE_HEIGHT_MULTIPLIER = 3.4;\nconst CORRECTNESS_PADDING = 2;\n\n// Styled components for different token states\nconst StyledToken = styled('span')(({ theme }) => ({\n  cursor: 'pointer',\n  textIndent: 0,\n  '&.disabled': {\n    cursor: 'inherit',\n    color: color.disabled(),\n  },\n  '&.disabledBlack': {\n    cursor: 'inherit',\n    pointerEvents: 'none',\n  },\n  '&.disabledAndSelected': {\n    backgroundColor: color.blueGrey100(),\n  },\n  [`@media (min-width: ${theme.breakpoints.values.md}px)`]: {\n    '&.selectable:hover': {\n      backgroundColor: color.blueGrey300(),\n      color: theme.palette.common.black,\n      '& > *': {\n        backgroundColor: color.blueGrey300(),\n      },\n    },\n  },\n  '&.selected': {\n    backgroundColor: color.blueGrey100(),\n    color: theme.palette.common.black,\n    lineHeight: `${parseFloat(theme.spacing(1)) * LINE_HEIGHT_MULTIPLIER}px`,\n    border: `solid 2px ${color.blueGrey900()}`,\n    borderRadius: '4px',\n    '& > *': {\n      backgroundColor: color.blueGrey100(),\n    },\n  },\n  '&.highlight': {\n    border: `dashed 2px ${color.blueGrey600()}`,\n    borderRadius: '4px',\n    lineHeight: `${parseFloat(theme.spacing(1)) * LINE_HEIGHT_MULTIPLIER}px`,\n  },\n  '&.print': {\n    border: `dashed 2px ${color.blueGrey600()}`,\n    borderRadius: '4px',\n    lineHeight: `${parseFloat(theme.spacing(1)) * LINE_HEIGHT_MULTIPLIER}px`,\n    color: color.text(),\n  },\n  '&.custom': {\n    display: 'initial',\n  },\n}));\n\nconst StyledCommonTokenStyle = styled('span')(({ theme }) => ({\n  position: 'relative',\n  borderRadius: '4px',\n  color: theme.palette.common.black,\n  lineHeight: `${parseFloat(theme.spacing(1)) * CORRECTNESS_LINE_HEIGHT_MULTIPLIER + CORRECTNESS_PADDING}px`,\n  padding: `${CORRECTNESS_PADDING}px`,\n}));\n\nconst StyledCorrectContainer = styled(StyledCommonTokenStyle)(() => ({\n  border: `${color.correctTertiary()} solid 2px`,\n}));\n\nconst StyledIncorrectContainer = styled(StyledCommonTokenStyle)(() => ({\n  border: `${color.incorrectWithIcon()} solid 2px`,\n}));\n\nconst StyledMissingContainer = styled(StyledCommonTokenStyle)(() => ({\n  border: `${color.incorrectWithIcon()} dashed 2px`,\n}));\n\nconst baseIconStyles = {\n  color: color.white(),\n  position: 'absolute',\n  top: '-8px',\n  left: '-8px',\n  borderRadius: '50%',\n  fontSize: '12px',\n  padding: '2px',\n  display: 'inline-block',\n};\n\nconst StyledCorrectCheckIcon = styled(Check)(() => ({\n  ...baseIconStyles,\n  backgroundColor: color.correctTertiary(),\n}));\n\nconst StyledIncorrectCloseIcon = styled(Close)(() => ({\n  ...baseIconStyles,\n  backgroundColor: color.incorrectWithIcon(),\n}));\n\nconst Wrapper = ({ useWrapper, children, Container, Icon }) =>\n  useWrapper ? (\n    <Container>\n      {children}\n      {Icon ? <Icon /> : null}\n    </Container>\n  ) : (\n    children\n  );\n\nWrapper.propTypes = {\n  useWrapper: PropTypes.bool,\n  Container: PropTypes.elementType,\n  Icon: PropTypes.elementType,\n  children: PropTypes.node,\n};\n\nexport const TokenTypes = {\n  text: PropTypes.string,\n  selectable: PropTypes.bool,\n};\n\nexport class Token extends React.Component {\n  static rootClassName = 'tokenRootClass';\n\n  static propTypes = {\n    ...TokenTypes,\n    text: PropTypes.string.isRequired,\n    className: PropTypes.string,\n    disabled: PropTypes.bool,\n    highlight: PropTypes.bool,\n    correct: PropTypes.bool,\n  };\n\n  static defaultProps = {\n    selectable: false,\n    text: '',\n  };\n\n  getClassAndIconConfig = () => {\n    const {\n      selectable,\n      selected,\n      className: classNameProp,\n      disabled,\n      highlight,\n      correct,\n      animationsDisabled,\n      isMissing,\n    } = this.props;\n    const isTouchEnabled = 'ontouchstart' in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0;\n    const baseClassName = Token.rootClassName;\n    let Container;\n    let Icon;\n\n    if (correct === undefined && selected && disabled) {\n      return {\n        className: classNames(baseClassName, 'selected', 'disabledBlack', classNameProp),\n        Component: StyledToken,\n      };\n    }\n\n    if (correct !== undefined) {\n      const isCorrect = correct === true;\n      return {\n        className: classNames(baseClassName, 'custom', classNameProp),\n        Component: StyledToken,\n        Container: isCorrect ? StyledCorrectContainer : StyledIncorrectContainer,\n        Icon: isCorrect ? StyledCorrectCheckIcon : StyledIncorrectCloseIcon,\n      };\n    }\n\n    if (isMissing) {\n      return {\n        className: classNames(baseClassName, 'custom', 'missing', classNameProp),\n        Component: StyledToken,\n        Container: StyledMissingContainer,\n        Icon: StyledIncorrectCloseIcon,\n      };\n    }\n\n    return {\n      className: classNames(\n        baseClassName,\n        disabled && 'disabled',\n        selectable && !disabled && !isTouchEnabled && 'selectable',\n        selected && !disabled && 'selected',\n        selected && disabled && 'disabledAndSelected',\n        highlight && selectable && !disabled && !selected && 'highlight',\n        animationsDisabled && 'print',\n        classNameProp,\n      ),\n      Component: StyledToken,\n      Container,\n      Icon,\n    };\n  };\n\n  render() {\n    const { text, index, correct, isMissing } = this.props;\n    const { className, Component, Container, Icon } = this.getClassAndIconConfig();\n\n    const TokenComponent = Component || StyledToken;\n\n    return (\n      <Wrapper\n        useWrapper={correct !== undefined || isMissing}\n        Container={Container}\n        Icon={Icon}\n      >\n        <TokenComponent\n          className={className}\n          dangerouslySetInnerHTML={{ __html: (text || '').replace(/\\n/g, '<br>') }}\n          data-indexkey={index}\n        />\n      </Wrapper>\n    );\n  }\n}\n\nexport default Token;\n"],"mappings":"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","ignoreList":[]}