@skbkontur/react-ui 0.0.0-044e274f2c → 0.0.0-07d08325b0

package/cjs/components/Token/Token.styles.js

@@ -1,6 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.globalClasses = exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
-
-var _Emotion = require("../../lib/theming/Emotion");
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = exports.globalClasses = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
 
 
 var _Token = require("./Token.mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
@@ -9,14 +7,13 @@ var globalClasses = exports.globalClasses = (0, _Emotion.prefix)('token')({
   removeIcon: 'remove-icon'
 });
 
-var getStyles = exports.getStyles = function getStyles(emotion) {return (
-    (0, _Emotion.memoizeStyle)({
-      token: function token(t) {
-        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n        display: inline-flex;\n        align-items: center;\n        border-radius: ", ";\n      border: solid ", " transparent;\n        min-width: 0;\n        word-break: break-all;\n        user-select: none;\n\n        &:hover {\n          cursor: pointer;\n        }\n      "])),
+var styles = exports.styles = (0, _Emotion.memoizeStyle)({
+  token: function token(t) {
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-flex;\n      align-items: center;\n      border-radius: ", ";\n      border: solid ", " transparent;\n      min-width: 0;\n      word-break: break-all;\n      user-select: none;\n\n      &:hover {\n        cursor: pointer;\n      }\n    "])),
 
 
-        t.tokenBorderRadius,
-        t.tokenBorderWidth);
+    t.tokenBorderRadius,
+    t.tokenBorderWidth);
 
 
 
@@ -25,116 +22,116 @@ var getStyles = exports.getStyles = function getStyles(emotion) {return (
 
 
 
-      },
+  },
 
-      tokenSmall: function tokenSmall(t) {
-        return emotion.css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
-        (0, _Token.tokenSizeMixin)(emotion)(
-          t.tokenPaddingYSmall,
-          t.tokenPaddingXSmall,
-          t.tokenLineHeightSmall,
-          t.tokenFontSizeSmall,
-          t.tokenMarginYSmall,
-          t.tokenMarginXSmall
-        ));
+  tokenSmall: function tokenSmall(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Token.tokenSizeMixin)(
+      t.tokenPaddingYSmall,
+      t.tokenPaddingXSmall,
+      t.tokenLineHeightSmall,
+      t.tokenFontSizeSmall,
+      t.tokenMarginYSmall,
+      t.tokenMarginXSmall
+    ));
 
-      },
+  },
 
-      tokenMedium: function tokenMedium(t) {
-        return emotion.css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
-        (0, _Token.tokenSizeMixin)(emotion)(
-          t.tokenPaddingYMedium,
-          t.tokenPaddingXMedium,
-          t.tokenLineHeightMedium,
-          t.tokenFontSizeMedium,
-          t.tokenMarginYMedium,
-          t.tokenMarginXMedium
-        ));
+  tokenMedium: function tokenMedium(t) {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Token.tokenSizeMixin)(
+      t.tokenPaddingYMedium,
+      t.tokenPaddingXMedium,
+      t.tokenLineHeightMedium,
+      t.tokenFontSizeMedium,
+      t.tokenMarginYMedium,
+      t.tokenMarginXMedium
+    ));
 
-      },
+  },
 
-      tokenLarge: function tokenLarge(t) {
-        return emotion.css(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n        ", ";\n      "])),
-        (0, _Token.tokenSizeMixin)(emotion)(
-          t.tokenPaddingYLarge,
-          t.tokenPaddingXLarge,
-          t.tokenLineHeightLarge,
-          t.tokenFontSizeLarge,
-          t.tokenMarginYLarge,
-          t.tokenMarginXLarge
-        ));
+  tokenLarge: function tokenLarge(t) {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    (0, _Token.tokenSizeMixin)(
+      t.tokenPaddingYLarge,
+      t.tokenPaddingXLarge,
+      t.tokenLineHeightLarge,
+      t.tokenFontSizeLarge,
+      t.tokenMarginYLarge,
+      t.tokenMarginXLarge
+    ));
 
-      },
+  },
 
-      tokenIdle: function tokenIdle(t) {
-        return emotion.css(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n        color: ", ";\n        background: ", ";\n        border-color: ", ";\n        background-clip: border-box;\n      "])),
-        t.tokenColor,
-        t.tokenBg,
-        t.tokenBorderColor);
+  tokenIdle: function tokenIdle(t) {
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      background: ", ";\n      border-color: ", ";\n      background-clip: border-box;\n    "])),
+    t.tokenColor,
+    t.tokenBg,
+    t.tokenBorderColor);
 
 
-      },
+  },
 
-      tokenHover: function tokenHover(t) {
-        return emotion.css(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n        &:hover {\n          color: ", ";\n          background: ", ";\n          border: solid ", " ", ";\n        }\n      "])),
+  tokenHover: function tokenHover(t) {
+    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        color: ", ";\n        background: ", ";\n        border: solid ", " ", ";\n      }\n    "])),
 
-        t.tokenColorHover,
-        t.tokenBgHover,
-        t.tokenBorderWidth, t.tokenBorderColorHover);
+    t.tokenColorHover,
+    t.tokenBgHover,
+    t.tokenBorderWidth, t.tokenBorderColorHover);
 
 
-      },
+  },
 
-      tokenActive: function tokenActive(t) {
-        return emotion.css(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n        color: ", ";\n        background: ", ";\n        border: solid ", " ", ";\n      "])),
-        t.tokenColorActive,
-        t.tokenBgActive,
-        t.tokenBorderWidth, t.tokenBorderColorActive);
+  tokenActive: function tokenActive(t) {
+    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      background: ", ";\n      border: solid ", " ", ";\n    "])),
+    t.tokenColorActive,
+    t.tokenBgActive,
+    t.tokenBorderWidth, t.tokenBorderColorActive);
 
-      },
+  },
 
-      tokenError: function tokenError(t) {
-        return emotion.css(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n        border: solid ", " ", ";\n        box-shadow: 0 0 0 ", " ", ";\n      "])),
-        t.tokenBorderWidth, t.tokenBorderColorError,
-        t.tokenOutlineWidth, t.tokenBorderColorError);
+  tokenError: function tokenError(t) {
+    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: solid ", " ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])),
+    t.tokenBorderWidth, t.tokenBorderColorError,
+    t.tokenOutlineWidth, t.tokenBorderColorError);
 
-      },
+  },
 
-      tokenWarning: function tokenWarning(t) {
-        return emotion.css(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n        border: solid ", " ", ";\n        box-shadow: 0 0 0 ", " ", ";\n      "])),
-        t.tokenBorderWidth, t.tokenBorderColorWarning,
-        t.tokenOutlineWidth, t.tokenBorderColorWarning);
+  tokenWarning: function tokenWarning(t) {
+    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: solid ", " ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])),
+    t.tokenBorderWidth, t.tokenBorderColorWarning,
+    t.tokenOutlineWidth, t.tokenBorderColorWarning);
 
-      },
+  },
 
-      tokenDisabled: function tokenDisabled(t) {
-        return emotion.css(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n        user-select: text;\n        cursor: text;\n        color: ", ";\n        pointer-events: none;\n        border: solid 1px ", ";\n\n        .", " {\n          visibility: hidden;\n        }\n      "])),
+  tokenDisabled: function tokenDisabled(t) {
+    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      user-select: text;\n      cursor: text;\n      color: ", ";\n      pointer-events: none;\n      border: solid 1px ", ";\n\n      .", " {\n        visibility: hidden;\n      }\n    "])),
 
 
-        t.tokenTextColorDisabled,
+    t.tokenTextColorDisabled,
 
-        t.tokenBorderColorDisabled,
+    t.tokenBorderColorDisabled,
 
-        globalClasses.removeIcon);
+    globalClasses.removeIcon);
 
 
 
-      },
+  },
 
-      text: function text() {
-        return emotion.css(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n        display: inline-block;\n      "])));
+  text: function text() {
+    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n    "])));
 
 
-      },
+  },
 
-      removeIcon: function removeIcon(t) {
-        return emotion.css(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n        height: ", ";\n        width: ", ";\n        flex-shrink: 0;\n        padding: ", " ", ";\n        box-sizing: ", ";\n        margin-left: ", ";\n        transition: none;\n        fill: currentColor;\n        opacity: 0.5;\n        line-height: 0;\n        display: inline-block;\n\n        &:hover {\n          opacity: 1;\n        }\n      "])),
-        t.tokenRemoveIconSize,
-        t.tokenRemoveIconSize,
+  removeIcon: function removeIcon(t) {
+    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: ", ";\n      width: ", ";\n      flex-shrink: 0;\n      padding: ", " ", ";\n      box-sizing: ", ";\n      margin-left: ", ";\n      transition: none;\n      fill: currentColor;\n      opacity: 0.5;\n      line-height: 0;\n      display: inline-block;\n\n      &:hover {\n        opacity: 1;\n      }\n    "])),
+    t.tokenRemoveIconSize,
+    t.tokenRemoveIconSize,
 
-        t.tokenRemoveIconPaddingY, t.tokenRemoveIconPaddingX,
-        t.tokenRemoveIconBoxSizing,
-        t.tokenRemoveIconGap);
+    t.tokenRemoveIconPaddingY, t.tokenRemoveIconPaddingX,
+    t.tokenRemoveIconBoxSizing,
+    t.tokenRemoveIconGap);
 
 
 
@@ -145,10 +142,10 @@ var getStyles = exports.getStyles = function getStyles(emotion) {return (
 
 
 
-      },
+  },
 
-      helperText: function helperText() {
-        return emotion.css(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n        max-width: 100%;\n        word-break: break-all;\n\n        // don't collapse spaces\n        // so they get counted in width\n        white-space: pre-wrap;\n      "])));
+  helperText: function helperText() {
+    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      max-width: 100%;\n      word-break: break-all;\n\n      // don't collapse spaces\n      // so they get counted in width\n      white-space: pre-wrap;\n    "])));
 
 
 
@@ -156,30 +153,30 @@ var getStyles = exports.getStyles = function getStyles(emotion) {return (
 
 
 
-      },
-      helperContainer: function helperContainer() {
-        return emotion.css(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n        display: flex;\n        position: absolute;\n        visibility: hidden;\n      "])));
+  },
+  helperContainer: function helperContainer() {
+    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: flex;\n      position: absolute;\n      visibility: hidden;\n    "])));
 
 
 
 
-      },
-      helperContainerSmall: function helperContainerSmall(t) {
-        return emotion.css(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n        left: ", ";\n        right: ", ";\n      "])),
-        t.tokenInputPaddingXSmall,
-        t.tokenInputPaddingXSmall);
+  },
+  helperContainerSmall: function helperContainerSmall(t) {
+    return (0, _Emotion.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n      left: ", ";\n      right: ", ";\n    "])),
+    t.tokenInputPaddingXSmall,
+    t.tokenInputPaddingXSmall);
 
-      },
-      helperContainerMedium: function helperContainerMedium(t) {
-        return emotion.css(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n        left: ", ";\n        right: ", ";\n      "])),
-        t.tokenInputPaddingXMedium,
-        t.tokenInputPaddingXMedium);
+  },
+  helperContainerMedium: function helperContainerMedium(t) {
+    return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n      left: ", ";\n      right: ", ";\n    "])),
+    t.tokenInputPaddingXMedium,
+    t.tokenInputPaddingXMedium);
 
-      },
-      helperContainerLarge: function helperContainerLarge(t) {
-        return emotion.css(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteralLoose2.default)(["\n        left: ", ";\n        right: ", ";\n      "])),
-        t.tokenInputPaddingXLarge,
-        t.tokenInputPaddingXLarge);
+  },
+  helperContainerLarge: function helperContainerLarge(t) {
+    return (0, _Emotion.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteralLoose2.default)(["\n      left: ", ";\n      right: ", ";\n    "])),
+    t.tokenInputPaddingXLarge,
+    t.tokenInputPaddingXLarge);
 
-      }
-    }));};
+  }
+});

package/cjs/components/Token/Token.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Emotion","require","_Token","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_templateObject14","_templateObject15","_templateObject16","_templateObject17","globalClasses","exports","prefix","removeIcon","getStyles","emotion","memoizeStyle","token","t","css","_taggedTemplateLiteralLoose2","default","tokenBorderRadius","tokenBorderWidth","tokenSmall","tokenSizeMixin","tokenPaddingYSmall","tokenPaddingXSmall","tokenLineHeightSmall","tokenFontSizeSmall","tokenMarginYSmall","tokenMarginXSmall","tokenMedium","tokenPaddingYMedium","tokenPaddingXMedium","tokenLineHeightMedium","tokenFontSizeMedium","tokenMarginYMedium","tokenMarginXMedium","tokenLarge","tokenPaddingYLarge","tokenPaddingXLarge","tokenLineHeightLarge","tokenFontSizeLarge","tokenMarginYLarge","tokenMarginXLarge","tokenIdle","tokenColor","tokenBg","tokenBorderColor","tokenHover","tokenColorHover","tokenBgHover","tokenBorderColorHover","tokenActive","tokenColorActive","tokenBgActive","tokenBorderColorActive","tokenError","tokenBorderColorError","tokenOutlineWidth","tokenWarning","tokenBorderColorWarning","tokenDisabled","tokenTextColorDisabled","tokenBorderColorDisabled","text","tokenRemoveIconSize","tokenRemoveIconPaddingY","tokenRemoveIconPaddingX","tokenRemoveIconBoxSizing","tokenRemoveIconGap","helperText","helperContainer","helperContainerSmall","tokenInputPaddingXSmall","helperContainerMedium","tokenInputPaddingXMedium","helperContainerLarge","tokenInputPaddingXLarge"],"sources":["Token.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nimport { tokenSizeMixin } from './Token.mixins';\n\nexport const globalClasses = prefix('token')({\n  removeIcon: 'remove-icon',\n});\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    token(t: Theme) {\n      return emotion.css`\n        display: inline-flex;\n        align-items: center;\n        border-radius: ${t.tokenBorderRadius};\n      border: solid ${t.tokenBorderWidth} transparent;\n        min-width: 0;\n        word-break: break-all;\n        user-select: none;\n\n        &:hover {\n          cursor: pointer;\n        }\n      `;\n    },\n\n    tokenSmall(t: Theme) {\n      return emotion.css`\n        ${tokenSizeMixin(emotion)(\n          t.tokenPaddingYSmall,\n          t.tokenPaddingXSmall,\n          t.tokenLineHeightSmall,\n          t.tokenFontSizeSmall,\n          t.tokenMarginYSmall,\n          t.tokenMarginXSmall,\n        )};\n      `;\n    },\n\n    tokenMedium(t: Theme) {\n      return emotion.css`\n        ${tokenSizeMixin(emotion)(\n          t.tokenPaddingYMedium,\n          t.tokenPaddingXMedium,\n          t.tokenLineHeightMedium,\n          t.tokenFontSizeMedium,\n          t.tokenMarginYMedium,\n          t.tokenMarginXMedium,\n        )};\n      `;\n    },\n\n    tokenLarge(t: Theme) {\n      return emotion.css`\n        ${tokenSizeMixin(emotion)(\n          t.tokenPaddingYLarge,\n          t.tokenPaddingXLarge,\n          t.tokenLineHeightLarge,\n          t.tokenFontSizeLarge,\n          t.tokenMarginYLarge,\n          t.tokenMarginXLarge,\n        )};\n      `;\n    },\n\n    tokenIdle(t: Theme) {\n      return emotion.css`\n        color: ${t.tokenColor};\n        background: ${t.tokenBg};\n        border-color: ${t.tokenBorderColor};\n        background-clip: border-box;\n      `;\n    },\n\n    tokenHover(t: Theme) {\n      return emotion.css`\n        &:hover {\n          color: ${t.tokenColorHover};\n          background: ${t.tokenBgHover};\n          border: solid ${t.tokenBorderWidth} ${t.tokenBorderColorHover};\n        }\n      `;\n    },\n\n    tokenActive(t: Theme) {\n      return emotion.css`\n        color: ${t.tokenColorActive};\n        background: ${t.tokenBgActive};\n        border: solid ${t.tokenBorderWidth} ${t.tokenBorderColorActive};\n      `;\n    },\n\n    tokenError(t: Theme) {\n      return emotion.css`\n        border: solid ${t.tokenBorderWidth} ${t.tokenBorderColorError};\n        box-shadow: 0 0 0 ${t.tokenOutlineWidth} ${t.tokenBorderColorError};\n      `;\n    },\n\n    tokenWarning(t: Theme) {\n      return emotion.css`\n        border: solid ${t.tokenBorderWidth} ${t.tokenBorderColorWarning};\n        box-shadow: 0 0 0 ${t.tokenOutlineWidth} ${t.tokenBorderColorWarning};\n      `;\n    },\n\n    tokenDisabled(t: Theme) {\n      return emotion.css`\n        user-select: text;\n        cursor: text;\n        color: ${t.tokenTextColorDisabled};\n        pointer-events: none;\n        border: solid 1px ${t.tokenBorderColorDisabled};\n\n        .${globalClasses.removeIcon} {\n          visibility: hidden;\n        }\n      `;\n    },\n\n    text() {\n      return emotion.css`\n        display: inline-block;\n      `;\n    },\n\n    removeIcon(t: Theme) {\n      return emotion.css`\n        height: ${t.tokenRemoveIconSize};\n        width: ${t.tokenRemoveIconSize};\n        flex-shrink: 0;\n        padding: ${t.tokenRemoveIconPaddingY} ${t.tokenRemoveIconPaddingX};\n        box-sizing: ${t.tokenRemoveIconBoxSizing};\n        margin-left: ${t.tokenRemoveIconGap};\n        transition: none;\n        fill: currentColor;\n        opacity: 0.5;\n        line-height: 0;\n        display: inline-block;\n\n        &:hover {\n          opacity: 1;\n        }\n      `;\n    },\n\n    helperText() {\n      return emotion.css`\n        max-width: 100%;\n        word-break: break-all;\n\n        // don't collapse spaces\n        // so they get counted in width\n        white-space: pre-wrap;\n      `;\n    },\n    helperContainer() {\n      return emotion.css`\n        display: flex;\n        position: absolute;\n        visibility: hidden;\n      `;\n    },\n    helperContainerSmall(t: Theme) {\n      return emotion.css`\n        left: ${t.tokenInputPaddingXSmall};\n        right: ${t.tokenInputPaddingXSmall};\n      `;\n    },\n    helperContainerMedium(t: Theme) {\n      return emotion.css`\n        left: ${t.tokenInputPaddingXMedium};\n        right: ${t.tokenInputPaddingXMedium};\n      `;\n    },\n    helperContainerLarge(t: Theme) {\n      return emotion.css`\n        left: ${t.tokenInputPaddingXLarge};\n        right: ${t.tokenInputPaddingXLarge};\n      `;\n    },\n  });\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_Emotion","require","_Token","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_templateObject14","_templateObject15","_templateObject16","_templateObject17","globalClasses","exports","prefix","removeIcon","styles","memoizeStyle","token","t","css","_taggedTemplateLiteralLoose2","default","tokenBorderRadius","tokenBorderWidth","tokenSmall","tokenSizeMixin","tokenPaddingYSmall","tokenPaddingXSmall","tokenLineHeightSmall","tokenFontSizeSmall","tokenMarginYSmall","tokenMarginXSmall","tokenMedium","tokenPaddingYMedium","tokenPaddingXMedium","tokenLineHeightMedium","tokenFontSizeMedium","tokenMarginYMedium","tokenMarginXMedium","tokenLarge","tokenPaddingYLarge","tokenPaddingXLarge","tokenLineHeightLarge","tokenFontSizeLarge","tokenMarginYLarge","tokenMarginXLarge","tokenIdle","tokenColor","tokenBg","tokenBorderColor","tokenHover","tokenColorHover","tokenBgHover","tokenBorderColorHover","tokenActive","tokenColorActive","tokenBgActive","tokenBorderColorActive","tokenError","tokenBorderColorError","tokenOutlineWidth","tokenWarning","tokenBorderColorWarning","tokenDisabled","tokenTextColorDisabled","tokenBorderColorDisabled","text","tokenRemoveIconSize","tokenRemoveIconPaddingY","tokenRemoveIconPaddingX","tokenRemoveIconBoxSizing","tokenRemoveIconGap","helperText","helperContainer","helperContainerSmall","tokenInputPaddingXSmall","helperContainerMedium","tokenInputPaddingXMedium","helperContainerLarge","tokenInputPaddingXLarge"],"sources":["Token.styles.ts"],"sourcesContent":["import { css, memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nimport { tokenSizeMixin } from './Token.mixins';\n\nexport const globalClasses = prefix('token')({\n  removeIcon: 'remove-icon',\n});\n\nexport const styles = memoizeStyle({\n  token(t: Theme) {\n    return css`\n      display: inline-flex;\n      align-items: center;\n      border-radius: ${t.tokenBorderRadius};\n      border: solid ${t.tokenBorderWidth} transparent;\n      min-width: 0;\n      word-break: break-all;\n      user-select: none;\n\n      &:hover {\n        cursor: pointer;\n      }\n    `;\n  },\n\n  tokenSmall(t: Theme) {\n    return css`\n      ${tokenSizeMixin(\n        t.tokenPaddingYSmall,\n        t.tokenPaddingXSmall,\n        t.tokenLineHeightSmall,\n        t.tokenFontSizeSmall,\n        t.tokenMarginYSmall,\n        t.tokenMarginXSmall,\n      )};\n    `;\n  },\n\n  tokenMedium(t: Theme) {\n    return css`\n      ${tokenSizeMixin(\n        t.tokenPaddingYMedium,\n        t.tokenPaddingXMedium,\n        t.tokenLineHeightMedium,\n        t.tokenFontSizeMedium,\n        t.tokenMarginYMedium,\n        t.tokenMarginXMedium,\n      )};\n    `;\n  },\n\n  tokenLarge(t: Theme) {\n    return css`\n      ${tokenSizeMixin(\n        t.tokenPaddingYLarge,\n        t.tokenPaddingXLarge,\n        t.tokenLineHeightLarge,\n        t.tokenFontSizeLarge,\n        t.tokenMarginYLarge,\n        t.tokenMarginXLarge,\n      )};\n    `;\n  },\n\n  tokenIdle(t: Theme) {\n    return css`\n      color: ${t.tokenColor};\n      background: ${t.tokenBg};\n      border-color: ${t.tokenBorderColor};\n      background-clip: border-box;\n    `;\n  },\n\n  tokenHover(t: Theme) {\n    return css`\n      &:hover {\n        color: ${t.tokenColorHover};\n        background: ${t.tokenBgHover};\n        border: solid ${t.tokenBorderWidth} ${t.tokenBorderColorHover};\n      }\n    `;\n  },\n\n  tokenActive(t: Theme) {\n    return css`\n      color: ${t.tokenColorActive};\n      background: ${t.tokenBgActive};\n      border: solid ${t.tokenBorderWidth} ${t.tokenBorderColorActive};\n    `;\n  },\n\n  tokenError(t: Theme) {\n    return css`\n      border: solid ${t.tokenBorderWidth} ${t.tokenBorderColorError};\n      box-shadow: 0 0 0 ${t.tokenOutlineWidth} ${t.tokenBorderColorError};\n    `;\n  },\n\n  tokenWarning(t: Theme) {\n    return css`\n      border: solid ${t.tokenBorderWidth} ${t.tokenBorderColorWarning};\n      box-shadow: 0 0 0 ${t.tokenOutlineWidth} ${t.tokenBorderColorWarning};\n    `;\n  },\n\n  tokenDisabled(t: Theme) {\n    return css`\n      user-select: text;\n      cursor: text;\n      color: ${t.tokenTextColorDisabled};\n      pointer-events: none;\n      border: solid 1px ${t.tokenBorderColorDisabled};\n\n      .${globalClasses.removeIcon} {\n        visibility: hidden;\n      }\n    `;\n  },\n\n  text() {\n    return css`\n      display: inline-block;\n    `;\n  },\n\n  removeIcon(t: Theme) {\n    return css`\n      height: ${t.tokenRemoveIconSize};\n      width: ${t.tokenRemoveIconSize};\n      flex-shrink: 0;\n      padding: ${t.tokenRemoveIconPaddingY} ${t.tokenRemoveIconPaddingX};\n      box-sizing: ${t.tokenRemoveIconBoxSizing};\n      margin-left: ${t.tokenRemoveIconGap};\n      transition: none;\n      fill: currentColor;\n      opacity: 0.5;\n      line-height: 0;\n      display: inline-block;\n\n      &:hover {\n        opacity: 1;\n      }\n    `;\n  },\n\n  helperText() {\n    return css`\n      max-width: 100%;\n      word-break: break-all;\n\n      // don't collapse spaces\n      // so they get counted in width\n      white-space: pre-wrap;\n    `;\n  },\n  helperContainer() {\n    return css`\n      display: flex;\n      position: absolute;\n      visibility: hidden;\n    `;\n  },\n  helperContainerSmall(t: Theme) {\n    return css`\n      left: ${t.tokenInputPaddingXSmall};\n      right: ${t.tokenInputPaddingXSmall};\n    `;\n  },\n  helperContainerMedium(t: Theme) {\n    return css`\n      left: ${t.tokenInputPaddingXMedium};\n      right: ${t.tokenInputPaddingXMedium};\n    `;\n  },\n  helperContainerLarge(t: Theme) {\n    return css`\n      left: ${t.tokenInputPaddingXLarge};\n      right: ${t.tokenInputPaddingXLarge};\n    `;\n  },\n});\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/Token/TokenView.d.ts

@@ -1,8 +1,11 @@
 import React, { ReactNode } from 'react';
 import { TokenSize } from './Token';
 export interface TokenViewProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Задает размер контрола. */
     size?: TokenSize;
+    /** Задает компонент крестика для удаления токена. */
     closeButton?: ReactNode;
+    /** Определяет, скрывать ли крестик для удаления токена. */
     hideCloseButton?: boolean;
 }
 export declare function TokenView(props: TokenViewProps): React.JSX.Element;

package/cjs/components/Token/TokenView.js

@@ -1,8 +1,8 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.TokenView = TokenView;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
 
 var _CommonWrapper = require("../../internal/CommonWrapper");
-var _Emotion = require("../../lib/theming/Emotion");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
+var _Emotion = require("../../lib/theming/Emotion");
 
 
 var _Token = require("./Token.styles");var _excluded = ["size", "children", "closeButton", "hideCloseButton", "className"];
@@ -13,33 +13,33 @@ var _Token = require("./Token.styles");var _excluded = ["size", "children", "clo
 
 
 
-function TokenView(props) {var _emotion$cx;
+
+
+
+function TokenView(props) {var _cx;
   var _props$size = props.size,size = _props$size === void 0 ? 'small' : _props$size,children = props.children,closeButton = props.closeButton,hideCloseButton = props.hideCloseButton,className = props.className,rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
-  var emotion = (0, _react.useContext)(_Emotion.EmotionContext);
-  var styles = (0, _Token.getStyles)(emotion);
-
   var getSizeClassName = function getSizeClassName(size) {
     switch (size) {
       case 'large':
-        return styles.tokenLarge(theme);
+        return _Token.styles.tokenLarge(theme);
       case 'medium':
-        return styles.tokenMedium(theme);
+        return _Token.styles.tokenMedium(theme);
       case 'small':
       default:
-        return styles.tokenSmall(theme);
+        return _Token.styles.tokenSmall(theme);
     }
   };
   var closeButtonNode = hideCloseButton ? null : /*#__PURE__*/
-  _react.default.createElement("span", { className: emotion.cx(styles.removeIcon(theme), _Token.globalClasses.removeIcon) }, closeButton);
+  _react.default.createElement("span", { className: (0, _Emotion.cx)(_Token.styles.removeIcon(theme), _Token.globalClasses.removeIcon) }, closeButton);
 
 
   return /*#__PURE__*/(
     _react.default.createElement(_CommonWrapper.CommonWrapper, props, /*#__PURE__*/
     _react.default.createElement("div", (0, _extends2.default)({},
     rest, {
-      className: emotion.cx(getSizeClassName(size), (_emotion$cx = {}, _emotion$cx[
-      styles.token(theme)] = true, _emotion$cx)
+      className: (0, _Emotion.cx)(getSizeClassName(size), (_cx = {}, _cx[
+      _Token.styles.token(theme)] = true, _cx)
       ) }),
 
     children,

package/cjs/components/Token/TokenView.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_CommonWrapper","_Emotion","_ThemeContext","_Token","_excluded","TokenView","props","_emotion$cx","_props$size","size","children","closeButton","hideCloseButton","className","rest","_objectWithoutPropertiesLoose2","default","theme","useContext","ThemeContext","emotion","EmotionContext","styles","getStyles","getSizeClassName","tokenLarge","tokenMedium","tokenSmall","closeButtonNode","createElement","cx","removeIcon","globalClasses","CommonWrapper","_extends2","token"],"sources":["TokenView.tsx"],"sourcesContent":["import React, { ReactNode, useContext } from 'react';\n\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport { EmotionContext } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { TokenSize } from './Token';\nimport { getStyles, globalClasses } from './Token.styles';\n\nexport interface TokenViewProps extends React.HTMLAttributes<HTMLDivElement> {\n  size?: TokenSize;\n  closeButton?: ReactNode;\n  hideCloseButton?: boolean;\n}\n\nexport function TokenView(props: TokenViewProps) {\n  const { size = 'small', children, closeButton, hideCloseButton, className, ...rest } = props;\n  const theme = useContext(ThemeContext);\n  const emotion = useContext(EmotionContext);\n  const styles = getStyles(emotion);\n\n  const getSizeClassName = (size: TokenSize) => {\n    switch (size) {\n      case 'large':\n        return styles.tokenLarge(theme);\n      case 'medium':\n        return styles.tokenMedium(theme);\n      case 'small':\n      default:\n        return styles.tokenSmall(theme);\n    }\n  };\n  const closeButtonNode = hideCloseButton ? null : (\n    <span className={emotion.cx(styles.removeIcon(theme), globalClasses.removeIcon)}>{closeButton}</span>\n  );\n\n  return (\n    <CommonWrapper {...props}>\n      <div\n        {...rest}\n        className={emotion.cx(getSizeClassName(size), {\n          [styles.token(theme)]: true,\n        })}\n      >\n        {children}\n        {closeButtonNode}\n      </div>\n    </CommonWrapper>\n  );\n}\n"],"mappings":"+cAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;;AAEA,IAAAC,cAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AACA,IAAAG,aAAA,GAAAH,OAAA;;;AAGA,IAAAI,MAAA,GAAAJ,OAAA,mBAA0D,IAAAK,SAAA;;;;;;;;AAQnD,SAASC,SAASA,CAACC,KAAqB,EAAE,KAAAC,WAAA;EAC/C,IAAAC,WAAA,GAAuFF,KAAK,CAApFG,IAAI,CAAJA,IAAI,GAAAD,WAAA,cAAG,OAAO,GAAAA,WAAA,CAAEE,QAAQ,GAAuDJ,KAAK,CAApEI,QAAQ,CAAEC,WAAW,GAA0CL,KAAK,CAA1DK,WAAW,CAAEC,eAAe,GAAyBN,KAAK,CAA7CM,eAAe,CAAEC,SAAS,GAAcP,KAAK,CAA5BO,SAAS,CAAKC,IAAI,OAAAC,8BAAA,CAAAC,OAAA,EAAKV,KAAK,EAAAF,SAAA;EAC5F,IAAMa,KAAK,GAAG,IAAAC,iBAAU,EAACC,0BAAY,CAAC;EACtC,IAAMC,OAAO,GAAG,IAAAF,iBAAU,EAACG,uBAAc,CAAC;EAC1C,IAAMC,MAAM,GAAG,IAAAC,gBAAS,EAACH,OAAO,CAAC;;EAEjC,IAAMI,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIf,IAAe,EAAK;IAC5C,QAAQA,IAAI;MACV,KAAK,OAAO;QACV,OAAOa,MAAM,CAACG,UAAU,CAACR,KAAK,CAAC;MACjC,KAAK,QAAQ;QACX,OAAOK,MAAM,CAACI,WAAW,CAACT,KAAK,CAAC;MAClC,KAAK,OAAO;MACZ;QACE,OAAOK,MAAM,CAACK,UAAU,CAACV,KAAK,CAAC;IACnC;EACF,CAAC;EACD,IAAMW,eAAe,GAAGhB,eAAe,GAAG,IAAI;EAC5Cf,MAAA,CAAAmB,OAAA,CAAAa,aAAA,WAAMhB,SAAS,EAAEO,OAAO,CAACU,EAAE,CAACR,MAAM,CAACS,UAAU,CAACd,KAAK,CAAC,EAAEe,oBAAa,CAACD,UAAU,CAAE,IAAEpB,WAAkB,CACrG;;;EAED;IACEd,MAAA,CAAAmB,OAAA,CAAAa,aAAA,CAAC7B,cAAA,CAAAiC,aAAa,EAAK3B,KAAK;IACtBT,MAAA,CAAAmB,OAAA,CAAAa,aAAA,YAAAK,SAAA,CAAAlB,OAAA;IACMF,IAAI;MACRD,SAAS,EAAEO,OAAO,CAACU,EAAE,CAACN,gBAAgB,CAACf,IAAI,CAAC,GAAAF,WAAA,OAAAA,WAAA;MACzCe,MAAM,CAACa,KAAK,CAAClB,KAAK,CAAC,IAAG,IAAI,EAAAV,WAAA;MAC5B,CAAE;;IAEFG,QAAQ;IACRkB;IACE;IACQ,CAAC;;AAEpB","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_CommonWrapper","_ThemeContext","_Emotion","_Token","_excluded","TokenView","props","_cx","_props$size","size","children","closeButton","hideCloseButton","className","rest","_objectWithoutPropertiesLoose2","default","theme","useContext","ThemeContext","getSizeClassName","styles","tokenLarge","tokenMedium","tokenSmall","closeButtonNode","createElement","cx","removeIcon","globalClasses","CommonWrapper","_extends2","token"],"sources":["TokenView.tsx"],"sourcesContent":["import React, { ReactNode, useContext } from 'react';\n\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { TokenSize } from './Token';\nimport { globalClasses, styles } from './Token.styles';\n\nexport interface TokenViewProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Задает размер контрола. */\n  size?: TokenSize;\n  /** Задает компонент крестика для удаления токена. */\n  closeButton?: ReactNode;\n  /** Определяет, скрывать ли крестик для удаления токена. */\n  hideCloseButton?: boolean;\n}\n\nexport function TokenView(props: TokenViewProps) {\n  const { size = 'small', children, closeButton, hideCloseButton, className, ...rest } = props;\n  const theme = useContext(ThemeContext);\n  const getSizeClassName = (size: TokenSize) => {\n    switch (size) {\n      case 'large':\n        return styles.tokenLarge(theme);\n      case 'medium':\n        return styles.tokenMedium(theme);\n      case 'small':\n      default:\n        return styles.tokenSmall(theme);\n    }\n  };\n  const closeButtonNode = hideCloseButton ? null : (\n    <span className={cx(styles.removeIcon(theme), globalClasses.removeIcon)}>{closeButton}</span>\n  );\n\n  return (\n    <CommonWrapper {...props}>\n      <div\n        {...rest}\n        className={cx(getSizeClassName(size), {\n          [styles.token(theme)]: true,\n        })}\n      >\n        {children}\n        {closeButtonNode}\n      </div>\n    </CommonWrapper>\n  );\n}\n"],"mappings":"+cAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;;AAEA,IAAAC,cAAA,GAAAD,OAAA;AACA,IAAAE,aAAA,GAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;;;AAGA,IAAAI,MAAA,GAAAJ,OAAA,mBAAuD,IAAAK,SAAA;;;;;;;;;;;AAWhD,SAASC,SAASA,CAACC,KAAqB,EAAE,KAAAC,GAAA;EAC/C,IAAAC,WAAA,GAAuFF,KAAK,CAApFG,IAAI,CAAJA,IAAI,GAAAD,WAAA,cAAG,OAAO,GAAAA,WAAA,CAAEE,QAAQ,GAAuDJ,KAAK,CAApEI,QAAQ,CAAEC,WAAW,GAA0CL,KAAK,CAA1DK,WAAW,CAAEC,eAAe,GAAyBN,KAAK,CAA7CM,eAAe,CAAEC,SAAS,GAAcP,KAAK,CAA5BO,SAAS,CAAKC,IAAI,OAAAC,8BAAA,CAAAC,OAAA,EAAKV,KAAK,EAAAF,SAAA;EAC5F,IAAMa,KAAK,GAAG,IAAAC,iBAAU,EAACC,0BAAY,CAAC;EACtC,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIX,IAAe,EAAK;IAC5C,QAAQA,IAAI;MACV,KAAK,OAAO;QACV,OAAOY,aAAM,CAACC,UAAU,CAACL,KAAK,CAAC;MACjC,KAAK,QAAQ;QACX,OAAOI,aAAM,CAACE,WAAW,CAACN,KAAK,CAAC;MAClC,KAAK,OAAO;MACZ;QACE,OAAOI,aAAM,CAACG,UAAU,CAACP,KAAK,CAAC;IACnC;EACF,CAAC;EACD,IAAMQ,eAAe,GAAGb,eAAe,GAAG,IAAI;EAC5Cf,MAAA,CAAAmB,OAAA,CAAAU,aAAA,WAAMb,SAAS,EAAE,IAAAc,WAAE,EAACN,aAAM,CAACO,UAAU,CAACX,KAAK,CAAC,EAAEY,oBAAa,CAACD,UAAU,CAAE,IAAEjB,WAAkB,CAC7F;;;EAED;IACEd,MAAA,CAAAmB,OAAA,CAAAU,aAAA,CAAC1B,cAAA,CAAA8B,aAAa,EAAKxB,KAAK;IACtBT,MAAA,CAAAmB,OAAA,CAAAU,aAAA,YAAAK,SAAA,CAAAf,OAAA;IACMF,IAAI;MACRD,SAAS,EAAE,IAAAc,WAAE,EAACP,gBAAgB,CAACX,IAAI,CAAC,GAAAF,GAAA,OAAAA,GAAA;MACjCc,aAAM,CAACW,KAAK,CAACf,KAAK,CAAC,IAAG,IAAI,EAAAV,GAAA;MAC5B,CAAE;;IAEFG,QAAQ;IACRe;IACE;IACQ,CAAC;;AAEpB","ignoreList":[]}

package/cjs/components/Token/__docs__/Token.mdx

@@ -0,0 +1,28 @@
+import * as TokenStories from './Token.docs.stories.tsx';
+import { Primary, ArgTypes, Stories, Description } from '@storybook/blocks';
+import { Meta } from '../../../.storybook/Meta';
+
+<Meta of={TokenStories} />
+
+# Token
+
+[Компонент в Контур.Гайдах](https://guides.kontur.ru/components/input-fields/tokens/)
+
+[Компонент в Figma](https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=230%3A2955)
+
+<Description />
+
+## Базовый пример
+
+<Primary />
+
+## Пропы
+
+<details>
+  <summary>Открыть таблицу с пропами</summary>
+  <ArgTypes />
+</details>
+
+## Примеры использования
+
+<Stories title="" includePrimary={false} />

package/cjs/components/TokenInput/TextWidthHelper.d.ts

@@ -2,8 +2,11 @@ import React from 'react';
 import { Theme } from '../../lib/theming/Theme';
 import { TokenSize } from '../Token';
 export interface TextWidthHelperProps {
+    /** Задает текст в поле ввода, еще не ставший токеном. */
     text?: string;
+    /** Задает объект с переменными темы. Он будет объединён с темой из контекста. */
     theme: Theme;
+    /** Задает размер контрола. */
     size: TokenSize;
 }
 /**
@@ -11,12 +14,9 @@ export interface TextWidthHelperProps {
  * для последующего выставления размеров input
  */
 export declare class TextWidthHelper extends React.Component<TextWidthHelperProps> {
-    private emotion;
-    private styles;
     private element;
     private getSizeClassName;
     render(): React.JSX.Element;
-    renderMain(): React.JSX.Element;
     getTextWidth(): number;
     getTextHeight(): number;
     private elementRef;

package/cjs/components/TokenInput/TextWidthHelper.js

@@ -1,6 +1,5 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.TextWidthHelper = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
-
 var _Emotion = require("../../lib/theming/Emotion");
 
 var _getDOMRect = require("../../lib/dom/getDOMRect");
@@ -17,13 +16,16 @@ var THIN_SPACE = "\u2009";
 
 
 
+
+
+
+
+
 /**
  * Херпер позволяет вычислить размеры блока с текстом
  * для последующего выставления размеров input
  */var
 TextWidthHelper = exports.TextWidthHelper = /*#__PURE__*/function (_React$Component) {function TextWidthHelper() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
-
-
     element = null;_this.
 
 
@@ -59,17 +61,4 @@ TextWidthHelper = exports.TextWidthHelper = /*#__PURE__*/function (_React$Compon
 
 
 
-
-
-
-
-
-
-
-
-
-
-
-
-
-    elementRef = function (node) {return _this.element = node;};return _this;}(0, _inheritsLoose2.default)(TextWidthHelper, _React$Component);var _proto = TextWidthHelper.prototype;_proto.getSizeClassName = function getSizeClassName(size) {var styles = this.styles;switch (size) {case 'large':return styles.helperContainerLarge(this.props.theme);case 'medium':return styles.helperContainerMedium(this.props.theme);case 'small':default:return styles.helperContainerSmall(this.props.theme);}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_Emotion.EmotionConsumer, null, function (emotion) {_this2.emotion = emotion;_this2.styles = (0, _Token.getStyles)(_this2.emotion);return _this2.renderMain();});};_proto.renderMain = function renderMain() {return /*#__PURE__*/_react.default.createElement(_TokenView.TokenView, { size: this.props.size, className: this.emotion.cx(this.styles.helperContainer(), this.getSizeClassName(this.props.size)) }, /*#__PURE__*/_react.default.createElement("div", { className: this.styles.helperText(), ref: this.elementRef }, this.props.text || THIN_SPACE));};_proto.getTextWidth = function getTextWidth() {return (0, _getDOMRect.getDOMRect)(this.element).width;};_proto.getTextHeight = function getTextHeight() {return (0, _getDOMRect.getDOMRect)(this.element).height;};return TextWidthHelper;}(_react.default.Component);
+    elementRef = function (node) {return _this.element = node;};return _this;}(0, _inheritsLoose2.default)(TextWidthHelper, _React$Component);var _proto = TextWidthHelper.prototype;_proto.getSizeClassName = function getSizeClassName(size) {switch (size) {case 'large':return _Token.styles.helperContainerLarge(this.props.theme);case 'medium':return _Token.styles.helperContainerMedium(this.props.theme);case 'small':default:return _Token.styles.helperContainerSmall(this.props.theme);}};_proto.render = function render() {return /*#__PURE__*/_react.default.createElement(_TokenView.TokenView, { size: this.props.size, className: (0, _Emotion.cx)(_Token.styles.helperContainer(), this.getSizeClassName(this.props.size)) }, /*#__PURE__*/_react.default.createElement("div", { className: _Token.styles.helperText(), ref: this.elementRef }, this.props.text || THIN_SPACE));};_proto.getTextWidth = function getTextWidth() {return (0, _getDOMRect.getDOMRect)(this.element).width;};_proto.getTextHeight = function getTextHeight() {return (0, _getDOMRect.getDOMRect)(this.element).height;};return TextWidthHelper;}(_react.default.Component);

package/cjs/components/TokenInput/TextWidthHelper.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_Emotion","_getDOMRect","_TokenView","_Token","THIN_SPACE","TextWidthHelper","exports","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","element","elementRef","node","_inheritsLoose2","default","_proto","prototype","getSizeClassName","size","styles","helperContainerLarge","props","theme","helperContainerMedium","helperContainerSmall","render","_this2","createElement","EmotionConsumer","emotion","getStyles","renderMain","TokenView","className","cx","helperContainer","helperText","ref","text","getTextWidth","getDOMRect","width","getTextHeight","height","React","Component"],"sources":["TextWidthHelper.tsx"],"sourcesContent":["import React from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\nimport { TokenView } from '../Token/TokenView';\nimport { TokenSize } from '../Token';\nimport { getStyles } from '../Token/Token.styles';\n\n// a thin character to preserve some space\n// for the caret visibillity in the input\nconst THIN_SPACE = '\\u2009';\n\nexport interface TextWidthHelperProps {\n  text?: string;\n  theme: Theme;\n  size: TokenSize;\n}\n/**\n * Херпер позволяет вычислить размеры блока с текстом\n * для последующего выставления размеров input\n */\nexport class TextWidthHelper extends React.Component<TextWidthHelperProps> {\n  private emotion!: Emotion;\n  private styles!: ReturnType<typeof getStyles>;\n  private element: HTMLDivElement | null = null;\n\n  private getSizeClassName(size: TokenSize) {\n    const styles = this.styles;\n    switch (size) {\n      case 'large':\n        return styles.helperContainerLarge(this.props.theme);\n      case 'medium':\n        return styles.helperContainerMedium(this.props.theme);\n      case 'small':\n      default:\n        return styles.helperContainerSmall(this.props.theme);\n    }\n  }\n\n  public render() {\n    return (\n      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\n          this.styles = getStyles(this.emotion);\n          return this.renderMain();\n        }}\n      </EmotionConsumer>\n    );\n  }\n\n  public renderMain() {\n    return (\n      <TokenView\n        size={this.props.size}\n        className={this.emotion.cx(this.styles.helperContainer(), this.getSizeClassName(this.props.size))}\n      >\n        <div className={this.styles.helperText()} ref={this.elementRef}>\n          {this.props.text || THIN_SPACE}\n        </div>\n      </TokenView>\n    );\n  }\n\n  public getTextWidth(): number {\n    return getDOMRect(this.element).width;\n  }\n\n  public getTextHeight(): number {\n    return getDOMRect(this.element).height;\n  }\n\n  private elementRef = (node: HTMLDivElement) => (this.element = node);\n}\n"],"mappings":"mQAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;;;AAGA,IAAAC,QAAA,GAAAD,OAAA;;AAEA,IAAAE,WAAA,GAAAF,OAAA;AACA,IAAAG,UAAA,GAAAH,OAAA;;AAEA,IAAAI,MAAA,GAAAJ,OAAA;;AAEA;AACA;AACA,IAAMK,UAAU,GAAG,QAAQ;;;;;;;AAO3B;AACA;AACA;AACA,GAHA;AAIaC,eAAe,GAAAC,OAAA,CAAAD,eAAA,0BAAAE,gBAAA,YAAAF,gBAAA,OAAAG,KAAA,UAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA,KAAAF,IAAA,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA,GAAAN,KAAA,GAAAD,gBAAA,CAAAQ,IAAA,CAAAC,KAAA,CAAAT,gBAAA,SAAAU,MAAA,CAAAL,IAAA,WAAAJ,KAAA;;;IAGlBU,OAAO,GAA0B,IAAI,CAAAV,KAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgDrCW,UAAU,GAAG,UAACC,IAAoB,UAAMZ,KAAA,CAAKU,OAAO,GAAGE,IAAI,EAAC,QAAAZ,KAAA,MAAAa,eAAA,CAAAC,OAAA,EAAAjB,eAAA,EAAAE,gBAAA,MAAAgB,MAAA,GAAAlB,eAAA,CAAAmB,SAAA,CAAAD,MAAA,CA9C5DE,gBAAgB,GAAxB,SAAAA,iBAAyBC,IAAe,EAAE,CACxC,IAAMC,MAAM,GAAG,IAAI,CAACA,MAAM,CAC1B,QAAQD,IAAI,GACV,KAAK,OAAO,CACV,OAAOC,MAAM,CAACC,oBAAoB,CAAC,IAAI,CAACC,KAAK,CAACC,KAAK,CAAC,CACtD,KAAK,QAAQ,CACX,OAAOH,MAAM,CAACI,qBAAqB,CAAC,IAAI,CAACF,KAAK,CAACC,KAAK,CAAC,CACvD,KAAK,OAAO,CACZ,QACE,OAAOH,MAAM,CAACK,oBAAoB,CAAC,IAAI,CAACH,KAAK,CAACC,KAAK,CAAC,CACxD,CACF,CAAC,CAAAP,MAAA,CAEMU,MAAM,GAAb,SAAAA,OAAA,EAAgB,KAAAC,MAAA,QACd,oBACErC,MAAA,CAAAyB,OAAA,CAAAa,aAAA,CAACnC,QAAA,CAAAoC,eAAe,QACb,UAACC,OAAO,EAAK,CACZH,MAAI,CAACG,OAAO,GAAGA,OAAO,CACtBH,MAAI,CAACP,MAAM,GAAG,IAAAW,gBAAS,EAACJ,MAAI,CAACG,OAAO,CAAC,CACrC,OAAOH,MAAI,CAACK,UAAU,CAAC,CAAC,CAC1B,CACe,CAAC,CAEtB,CAAC,CAAAhB,MAAA,CAEMgB,UAAU,GAAjB,SAAAA,WAAA,EAAoB,CAClB,oBACE1C,MAAA,CAAAyB,OAAA,CAAAa,aAAA,CAACjC,UAAA,CAAAsC,SAAS,IACRd,IAAI,EAAE,IAAI,CAACG,KAAK,CAACH,IAAK,EACtBe,SAAS,EAAE,IAAI,CAACJ,OAAO,CAACK,EAAE,CAAC,IAAI,CAACf,MAAM,CAACgB,eAAe,CAAC,CAAC,EAAE,IAAI,CAAClB,gBAAgB,CAAC,IAAI,CAACI,KAAK,CAACH,IAAI,CAAC,CAAE,iBAElG7B,MAAA,CAAAyB,OAAA,CAAAa,aAAA,UAAKM,SAAS,EAAE,IAAI,CAACd,MAAM,CAACiB,UAAU,CAAC,CAAE,EAACC,GAAG,EAAE,IAAI,CAAC1B,UAAW,IAC5D,IAAI,CAACU,KAAK,CAACiB,IAAI,IAAI1C,UACjB,CACI,CAAC,CAEhB,CAAC,CAAAmB,MAAA,CAEMwB,YAAY,GAAnB,SAAAA,aAAA,EAA8B,CAC5B,OAAO,IAAAC,sBAAU,EAAC,IAAI,CAAC9B,OAAO,CAAC,CAAC+B,KAAK,CACvC,CAAC,CAAA1B,MAAA,CAEM2B,aAAa,GAApB,SAAAA,cAAA,EAA+B,CAC7B,OAAO,IAAAF,sBAAU,EAAC,IAAI,CAAC9B,OAAO,CAAC,CAACiC,MAAM,CACxC,CAAC,QAAA9C,eAAA,GAjDkC+C,cAAK,CAACC,SAAS","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_Emotion","_getDOMRect","_TokenView","_Token","THIN_SPACE","TextWidthHelper","exports","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","element","elementRef","node","_inheritsLoose2","default","_proto","prototype","getSizeClassName","size","styles","helperContainerLarge","props","theme","helperContainerMedium","helperContainerSmall","render","createElement","TokenView","className","cx","helperContainer","helperText","ref","text","getTextWidth","getDOMRect","width","getTextHeight","height","React","Component"],"sources":["TextWidthHelper.tsx"],"sourcesContent":["import React from 'react';\n\nimport { cx } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\nimport { TokenView } from '../Token/TokenView';\nimport { TokenSize } from '../Token';\nimport { styles } from '../Token/Token.styles';\n\n// a thin character to preserve some space\n// for the caret visibillity in the input\nconst THIN_SPACE = '\\u2009';\n\nexport interface TextWidthHelperProps {\n  /** Задает текст в поле ввода, еще не ставший токеном. */\n  text?: string;\n\n  /** Задает объект с переменными темы. Он будет объединён с темой из контекста. */\n  theme: Theme;\n\n  /** Задает размер контрола. */\n  size: TokenSize;\n}\n/**\n * Херпер позволяет вычислить размеры блока с текстом\n * для последующего выставления размеров input\n */\nexport class TextWidthHelper extends React.Component<TextWidthHelperProps> {\n  private element: HTMLDivElement | null = null;\n\n  private getSizeClassName(size: TokenSize) {\n    switch (size) {\n      case 'large':\n        return styles.helperContainerLarge(this.props.theme);\n      case 'medium':\n        return styles.helperContainerMedium(this.props.theme);\n      case 'small':\n      default:\n        return styles.helperContainerSmall(this.props.theme);\n    }\n  }\n\n  public render() {\n    return (\n      <TokenView\n        size={this.props.size}\n        className={cx(styles.helperContainer(), this.getSizeClassName(this.props.size))}\n      >\n        <div className={styles.helperText()} ref={this.elementRef}>\n          {this.props.text || THIN_SPACE}\n        </div>\n      </TokenView>\n    );\n  }\n\n  public getTextWidth(): number {\n    return getDOMRect(this.element).width;\n  }\n\n  public getTextHeight(): number {\n    return getDOMRect(this.element).height;\n  }\n\n  private elementRef = (node: HTMLDivElement) => (this.element = node);\n}\n"],"mappings":"mQAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;;AAEA,IAAAC,QAAA,GAAAD,OAAA;;AAEA,IAAAE,WAAA,GAAAF,OAAA;AACA,IAAAG,UAAA,GAAAH,OAAA;;AAEA,IAAAI,MAAA,GAAAJ,OAAA;;AAEA;AACA;AACA,IAAMK,UAAU,GAAG,QAAQ;;;;;;;;;;;;AAY3B;AACA;AACA;AACA,GAHA;AAIaC,eAAe,GAAAC,OAAA,CAAAD,eAAA,0BAAAE,gBAAA,YAAAF,gBAAA,OAAAG,KAAA,UAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA,KAAAF,IAAA,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA,GAAAN,KAAA,GAAAD,gBAAA,CAAAQ,IAAA,CAAAC,KAAA,CAAAT,gBAAA,SAAAU,MAAA,CAAAL,IAAA,WAAAJ,KAAA;IAClBU,OAAO,GAA0B,IAAI,CAAAV,KAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAmCrCW,UAAU,GAAG,UAACC,IAAoB,UAAMZ,KAAA,CAAKU,OAAO,GAAGE,IAAI,EAAC,QAAAZ,KAAA,MAAAa,eAAA,CAAAC,OAAA,EAAAjB,eAAA,EAAAE,gBAAA,MAAAgB,MAAA,GAAAlB,eAAA,CAAAmB,SAAA,CAAAD,MAAA,CAjC5DE,gBAAgB,GAAxB,SAAAA,iBAAyBC,IAAe,EAAE,CACxC,QAAQA,IAAI,GACV,KAAK,OAAO,CACV,OAAOC,aAAM,CAACC,oBAAoB,CAAC,IAAI,CAACC,KAAK,CAACC,KAAK,CAAC,CACtD,KAAK,QAAQ,CACX,OAAOH,aAAM,CAACI,qBAAqB,CAAC,IAAI,CAACF,KAAK,CAACC,KAAK,CAAC,CACvD,KAAK,OAAO,CACZ,QACE,OAAOH,aAAM,CAACK,oBAAoB,CAAC,IAAI,CAACH,KAAK,CAACC,KAAK,CAAC,CACxD,CACF,CAAC,CAAAP,MAAA,CAEMU,MAAM,GAAb,SAAAA,OAAA,EAAgB,CACd,oBACEpC,MAAA,CAAAyB,OAAA,CAAAY,aAAA,CAAChC,UAAA,CAAAiC,SAAS,IACRT,IAAI,EAAE,IAAI,CAACG,KAAK,CAACH,IAAK,EACtBU,SAAS,EAAE,IAAAC,WAAE,EAACV,aAAM,CAACW,eAAe,CAAC,CAAC,EAAE,IAAI,CAACb,gBAAgB,CAAC,IAAI,CAACI,KAAK,CAACH,IAAI,CAAC,CAAE,iBAEhF7B,MAAA,CAAAyB,OAAA,CAAAY,aAAA,UAAKE,SAAS,EAAET,aAAM,CAACY,UAAU,CAAC,CAAE,EAACC,GAAG,EAAE,IAAI,CAACrB,UAAW,IACvD,IAAI,CAACU,KAAK,CAACY,IAAI,IAAIrC,UACjB,CACI,CAAC,CAEhB,CAAC,CAAAmB,MAAA,CAEMmB,YAAY,GAAnB,SAAAA,aAAA,EAA8B,CAC5B,OAAO,IAAAC,sBAAU,EAAC,IAAI,CAACzB,OAAO,CAAC,CAAC0B,KAAK,CACvC,CAAC,CAAArB,MAAA,CAEMsB,aAAa,GAApB,SAAAA,cAAA,EAA+B,CAC7B,OAAO,IAAAF,sBAAU,EAAC,IAAI,CAACzB,OAAO,CAAC,CAAC4B,MAAM,CACxC,CAAC,QAAAzC,eAAA,GAlCkC0C,cAAK,CAACC,SAAS","ignoreList":[]}