@skbkontur/react-ui 0.0.0-cb54865bf2 → 0.0.0-ccbe7cf017

package/cjs/components/TokenInput/TokenInput.styles.js

@@ -1,54 +1,83 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.jsStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");function _templateObject7() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      pointer-events: none;\n      /* fix text color in safari */\n      -webkit-text-fill-color: currentcolor;\n      color: ", ";\n    "]);_templateObject7 = function _templateObject7() {return data;};return data;}function _templateObject6() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      min-width: 0;\n      max-width: 100%;\n      width: 50px;\n      background: transparent;\n      border: none;\n      box-shadow: none;\n      outline: none;\n      font-family: inherit;\n      padding: 0 0 0 5px;\n      font-size: ", ";\n      height: ", ";\n      line-height: ", ";\n      -webkit-appearance: none;\n      white-space: nowrap;\n      text-overflow: clip;\n      background-clip: padding-box;\n      transition: background-color 0.15s ease-in;\n\n      &::-ms-clear {\n        display: none;\n      }\n      &::placeholder {\n        color: ", ";\n        -webkit-text-fill-color: ", ";\n      }\n      &:focus::placeholder {\n        color: ", ";\n        -webkit-text-fill-color: ", ";\n      }\n      /* fix firefox placeholder opacity */\n      &:-moz-placeholder {\n        opacity: 1;\n      }\n      &::-moz-placeholder {\n        opacity: 1;\n      }\n    "]);_templateObject6 = function _templateObject6() {return data;};return data;}function _templateObject5() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      border-color: ", ";\n      box-shadow: none;\n    "]);_templateObject5 = function _templateObject5() {return data;};return data;}function _templateObject4() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "]);_templateObject4 = function _templateObject4() {return data;};return data;}function _templateObject3() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "]);_templateObject3 = function _templateObject3() {return data;};return data;}function _templateObject2() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "]);_templateObject2 = function _templateObject2() {return data;};return data;}function _templateObject() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      background-color: ", ";\n      box-shadow: ", ";\n      border: ", " solid ", ";\n      border-top-color: ", ";\n      box-sizing: border-box;\n      cursor: text;\n      padding: ", " ", ";\n      display: flex;\n      flex-wrap: wrap;\n      align-items: start;\n      outline: none;\n    "]);_templateObject = function _templateObject() {return data;};return data;}
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
 
 
-var styles = {
+var mixins = {
+  inputAndHelperCommonStyles: function inputAndHelperCommonStyles(t) {
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0 ", " 0 ", ";\n      line-height: ", ";\n      font-size: ", ";\n    "])),
+    t.tokenInputInputPaddingRight, t.tokenInputInputPaddingLeft,
+    t.tokenInputLineHeight,
+    t.tokenInputFontSize);
+
+  },
+  inputAndHelperCommonEditingStyles: function inputAndHelperCommonEditingStyles(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin: ", " ", ";\n      padding: 0 ", " 0 ", ";\n      line-height: ", ";\n    "])),
+    t.tokenMarginY, t.tokenMarginX,
+    t.tokenInputInputPaddingRight, t.tokenPaddingX,
+    t.tokenLineHeight);
+
+  } };
+
+
+var styles = (0, _Emotion.memoizeStyle)({
   label: function label(t) {
-    return (0, _Emotion.css)(_templateObject(),
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background-color: ", ";\n      box-shadow: ", ";\n      border: ", " solid ", ";\n      border-top-color: ", ";\n      box-sizing: border-box;\n      cursor: text;\n      padding: ", " ", ";\n      display: flex;\n      flex-wrap: wrap;\n      align-items: start;\n      outline: none;\n      position: relative;\n      border-radius: ", ";\n    "])),
     t.tokenInputBg,
     t.tokenInputShadow,
     t.tokenInputBorderWidth, t.tokenInputBorderColor,
     t.tokenInputBorderTopColor,
 
 
-    t.tokenInputPaddingY, t.tokenInputPaddingX);
+    t.tokenInputPaddingY, t.tokenInputPaddingX,
 
 
 
 
 
+    t.tokenInputBorderRadius);
+
+  },
+
+  hovering: function hovering(t) {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:hover {\n        border-color: ", ";\n      }\n    "])),
+
+    t.tokenInputBorderColorHover);
+
+
   },
 
   warning: function warning(t) {
-    return (0, _Emotion.css)(_templateObject2(),
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])),
     t.tokenInputBorderWidth, t.tokenInputBorderColorWarning,
     t.tokenInputOutlineWidth, t.tokenInputBorderColorWarning);
 
   },
 
   error: function error(t) {
-    return (0, _Emotion.css)(_templateObject3(),
+    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])),
     t.tokenInputBorderWidth, t.tokenInputBorderColorError,
     t.tokenInputOutlineWidth, t.tokenInputBorderColorError);
 
   },
 
   labelFocused: function labelFocused(t) {
-    return (0, _Emotion.css)(_templateObject4(),
+    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])),
     t.tokenInputBorderWidth, t.tokenInputBorderColorFocus,
     t.tokenInputOutlineWidth, t.tokenInputBorderColorFocus);
 
   },
 
   labelDisabled: function labelDisabled(t) {
-    return (0, _Emotion.css)(_templateObject5(),
+    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      background-clip: ", ";\n      border-color: ", ";\n      box-shadow: none;\n      cursor: default;\n    "])),
     t.tokenInputDisabledBg,
+    t.inputDisabledBackgroundClip,
     t.tokenInputDisabledBorderColor);
 
 
+
   },
 
   input: function input(t) {
-    return (0, _Emotion.css)(_templateObject6(),
+    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      min-width: 0;\n      max-width: 100%;\n      width: 50px;\n      background: transparent;\n      border: none;\n      box-shadow: none;\n      outline: none;\n      font-family: inherit;\n      margin: ", " 0 ", " 0;\n      overflow: hidden;\n      resize: none;\n      height: ", ";\n      -webkit-appearance: none;\n      text-overflow: clip;\n      background-clip: padding-box;\n      transition: background-color 0.15s ease-in;\n      color: ", ";\n      box-sizing: border-box;\n      word-break: break-all;\n\n      ", ";\n\n      &::-ms-clear {\n        display: none;\n      }\n      &::placeholder {\n        color: ", ";\n        -webkit-text-fill-color: ", ";\n      }\n      &:disabled::placeholder {\n        color: ", ";\n        -webkit-text-fill-color: ", ";\n      }\n      &:focus::placeholder {\n        color: ", ";\n        -webkit-text-fill-color: ", ";\n      }\n      /* fix firefox placeholder opacity */\n      &:-moz-placeholder {\n        opacity: 1;\n      }\n      &::-moz-placeholder {\n        opacity: 1;\n      }\n    "])),
 
 
 
@@ -57,16 +86,20 @@ var styles = {
 
 
 
+    t.tokenMarginY, t.tokenMarginY,
+
 
-    t.tokenInputFontSize,
-    t.tokenInputLineHeight,
     t.tokenInputLineHeight,
 
 
 
 
+    t.tokenInputTextColor,
+
 
 
+    mixins.inputAndHelperCommonStyles(t),
+
 
 
 
@@ -75,6 +108,10 @@ var styles = {
     t.tokenInputPlaceholderColor,
 
 
+    t.tokenInputPlaceholderColorDisabled,
+    t.tokenInputPlaceholderColorDisabled,
+
+
     t.tokenInputPlaceholderColorLight,
     t.tokenInputPlaceholderColorLight);
 
@@ -86,16 +123,66 @@ var styles = {
 
 
 
+  },
+
+  helperContainer: function helperContainer(t) {
+    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: flex;\n      position: absolute;\n      top: 0;\n      left: 0;\n      right: 0;\n      padding: ", " ", ";\n      visibility: hidden;\n    "])),
+
+
+
+
+
+    t.tokenInputPaddingY, t.tokenInputPaddingX);
+
+
+  },
+
+  helperText: function helperText(t) {
+    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (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\n      ", "\n    "])),
+
+
+
+
+
+
+
+    mixins.inputAndHelperCommonStyles(t));
+
+  },
+
+  helperTextEditing: function helperTextEditing(t) {
+    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n\n      font-size: ", ";\n      padding-bottom: ", ";\n    "])),
+    mixins.inputAndHelperCommonEditingStyles(t),
+
+    t.tokenFontSize,
+    t.tokenLegacyTextShift);
+
   },
 
   inputDisabled: function inputDisabled(t) {
-    return (0, _Emotion.css)(_templateObject7(),
+    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      pointer-events: none;\n      /* fix text color in safari */\n      -webkit-text-fill-color: currentcolor;\n      color: ", ";\n    "])),
 
 
 
     t.tokenInputTextColorDisabled);
 
-  } };
+  },
+
+  inputEditing: function inputEditing(t) {
+    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    mixins.inputAndHelperCommonEditingStyles(t));
+
+  },
+
+  reservedInput: function reservedInput(t) {
+    return (0, _Emotion.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n      min-width: 2px;\n      min-height: ", ";\n      line-height: ", ";\n      font-size: ", ";\n      margin: ", " 0 ", " 0;\n      padding: 0 ", " 0 ", ";\n      color: ", ";\n      word-break: break-all;\n    "])),
+
+    t.tokenInputLineHeight,
+    t.tokenInputLineHeight,
+    t.tokenInputFontSize,
+    t.tokenMarginY, t.tokenMarginY,
+    t.tokenInputInputPaddingRight, t.tokenInputInputPaddingLeft,
+    t.tokenInputTextColorDisabled);
 
 
-var jsStyles = (0, _Emotion.memoizeStyle)(styles);exports.jsStyles = jsStyles;
+  } });exports.styles = styles;

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

@@ -1 +1 @@
-{"version":3,"sources":["TokenInput.styles.ts"],"names":["styles","label","t","css","tokenInputBg","tokenInputShadow","tokenInputBorderWidth","tokenInputBorderColor","tokenInputBorderTopColor","tokenInputPaddingY","tokenInputPaddingX","warning","tokenInputBorderColorWarning","tokenInputOutlineWidth","error","tokenInputBorderColorError","labelFocused","tokenInputBorderColorFocus","labelDisabled","tokenInputDisabledBg","tokenInputDisabledBorderColor","input","tokenInputFontSize","tokenInputLineHeight","tokenInputPlaceholderColor","tokenInputPlaceholderColorLight","inputDisabled","tokenInputTextColorDisabled","jsStyles"],"mappings":"8QAAA,oD;;;AAGA,IAAMA,MAAM,GAAG;AACbC,EAAAA,KADa,iBACPC,CADO,EACG;AACd,eAAOC,YAAP;AACsBD,IAAAA,CAAC,CAACE,YADxB;AAEgBF,IAAAA,CAAC,CAACG,gBAFlB;AAGYH,IAAAA,CAAC,CAACI,qBAHd,EAG6CJ,CAAC,CAACK,qBAH/C;AAIsBL,IAAAA,CAAC,CAACM,wBAJxB;;;AAOaN,IAAAA,CAAC,CAACO,kBAPf,EAOqCP,CAAC,CAACQ,kBAPvC;;;;;;AAaD,GAfY;;AAiBbC,EAAAA,OAjBa,mBAiBLT,CAjBK,EAiBK;AAChB,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACI,qBADd,EAC6CJ,CAAC,CAACU,4BAD/C;AAEsBV,IAAAA,CAAC,CAACW,sBAFxB,EAEkDX,CAAC,CAACU,4BAFpD;;AAID,GAtBY;;AAwBbE,EAAAA,KAxBa,iBAwBPZ,CAxBO,EAwBG;AACd,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACI,qBADd,EAC6CJ,CAAC,CAACa,0BAD/C;AAEsBb,IAAAA,CAAC,CAACW,sBAFxB,EAEkDX,CAAC,CAACa,0BAFpD;;AAID,GA7BY;;AA+BbC,EAAAA,YA/Ba,wBA+BAd,CA/BA,EA+BU;AACrB,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACI,qBADd,EAC6CJ,CAAC,CAACe,0BAD/C;AAEsBf,IAAAA,CAAC,CAACW,sBAFxB,EAEkDX,CAAC,CAACe,0BAFpD;;AAID,GApCY;;AAsCbC,EAAAA,aAtCa,yBAsCChB,CAtCD,EAsCW;AACtB,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACiB,oBADlB;AAEkBjB,IAAAA,CAAC,CAACkB,6BAFpB;;;AAKD,GA5CY;;AA8CbC,EAAAA,KA9Ca,iBA8CPnB,CA9CO,EA8CG;AACd,eAAOC,YAAP;;;;;;;;;;AAUeD,IAAAA,CAAC,CAACoB,kBAVjB;AAWYpB,IAAAA,CAAC,CAACqB,oBAXd;AAYiBrB,IAAAA,CAAC,CAACqB,oBAZnB;;;;;;;;;;;AAuBarB,IAAAA,CAAC,CAACsB,0BAvBf;AAwB+BtB,IAAAA,CAAC,CAACsB,0BAxBjC;;;AA2BatB,IAAAA,CAAC,CAACuB,+BA3Bf;AA4B+BvB,IAAAA,CAAC,CAACuB,+BA5BjC;;;;;;;;;;AAsCD,GArFY;;AAuFbC,EAAAA,aAvFa,yBAuFCxB,CAvFD,EAuFW;AACtB,eAAOC,YAAP;;;;AAIWD,IAAAA,CAAC,CAACyB,2BAJb;;AAMD,GA9FY,EAAf;;;AAiGO,IAAMC,QAAQ,GAAG,2BAAa5B,MAAb,CAAjB,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\nimport { Theme } from '../../lib/theming/Theme';\r\n\r\nconst styles = {\r\n  label(t: Theme) {\r\n    return css`\r\n      background-color: ${t.tokenInputBg};\r\n      box-shadow: ${t.tokenInputShadow};\r\n      border: ${t.tokenInputBorderWidth} solid ${t.tokenInputBorderColor};\r\n      border-top-color: ${t.tokenInputBorderTopColor};\r\n      box-sizing: border-box;\r\n      cursor: text;\r\n      padding: ${t.tokenInputPaddingY} ${t.tokenInputPaddingX};\r\n      display: flex;\r\n      flex-wrap: wrap;\r\n      align-items: start;\r\n      outline: none;\r\n    `;\r\n  },\r\n\r\n  warning(t: Theme) {\r\n    return css`\r\n      border: ${t.tokenInputBorderWidth} solid ${t.tokenInputBorderColorWarning};\r\n      box-shadow: 0 0 0 ${t.tokenInputOutlineWidth} ${t.tokenInputBorderColorWarning};\r\n    `;\r\n  },\r\n\r\n  error(t: Theme) {\r\n    return css`\r\n      border: ${t.tokenInputBorderWidth} solid ${t.tokenInputBorderColorError};\r\n      box-shadow: 0 0 0 ${t.tokenInputOutlineWidth} ${t.tokenInputBorderColorError};\r\n    `;\r\n  },\r\n\r\n  labelFocused(t: Theme) {\r\n    return css`\r\n      border: ${t.tokenInputBorderWidth} solid ${t.tokenInputBorderColorFocus};\r\n      box-shadow: 0 0 0 ${t.tokenInputOutlineWidth} ${t.tokenInputBorderColorFocus};\r\n    `;\r\n  },\r\n\r\n  labelDisabled(t: Theme) {\r\n    return css`\r\n      background: ${t.tokenInputDisabledBg};\r\n      border-color: ${t.tokenInputDisabledBorderColor};\r\n      box-shadow: none;\r\n    `;\r\n  },\r\n\r\n  input(t: Theme) {\r\n    return css`\r\n      min-width: 0;\r\n      max-width: 100%;\r\n      width: 50px;\r\n      background: transparent;\r\n      border: none;\r\n      box-shadow: none;\r\n      outline: none;\r\n      font-family: inherit;\r\n      padding: 0 0 0 5px;\r\n      font-size: ${t.tokenInputFontSize};\r\n      height: ${t.tokenInputLineHeight};\r\n      line-height: ${t.tokenInputLineHeight};\r\n      -webkit-appearance: none;\r\n      white-space: nowrap;\r\n      text-overflow: clip;\r\n      background-clip: padding-box;\r\n      transition: background-color 0.15s ease-in;\r\n\r\n      &::-ms-clear {\r\n        display: none;\r\n      }\r\n      &::placeholder {\r\n        color: ${t.tokenInputPlaceholderColor};\r\n        -webkit-text-fill-color: ${t.tokenInputPlaceholderColor};\r\n      }\r\n      &:focus::placeholder {\r\n        color: ${t.tokenInputPlaceholderColorLight};\r\n        -webkit-text-fill-color: ${t.tokenInputPlaceholderColorLight};\r\n      }\r\n      /* fix firefox placeholder opacity */\r\n      &:-moz-placeholder {\r\n        opacity: 1;\r\n      }\r\n      &::-moz-placeholder {\r\n        opacity: 1;\r\n      }\r\n    `;\r\n  },\r\n\r\n  inputDisabled(t: Theme) {\r\n    return css`\r\n      pointer-events: none;\r\n      /* fix text color in safari */\r\n      -webkit-text-fill-color: currentcolor;\r\n      color: ${t.tokenInputTextColorDisabled};\r\n    `;\r\n  },\r\n};\r\n\r\nexport const jsStyles = memoizeStyle(styles);\r\n"]}
+{"version":3,"sources":["TokenInput.styles.ts"],"names":["mixins","inputAndHelperCommonStyles","t","css","tokenInputInputPaddingRight","tokenInputInputPaddingLeft","tokenInputLineHeight","tokenInputFontSize","inputAndHelperCommonEditingStyles","tokenMarginY","tokenMarginX","tokenPaddingX","tokenLineHeight","styles","label","tokenInputBg","tokenInputShadow","tokenInputBorderWidth","tokenInputBorderColor","tokenInputBorderTopColor","tokenInputPaddingY","tokenInputPaddingX","tokenInputBorderRadius","hovering","tokenInputBorderColorHover","warning","tokenInputBorderColorWarning","tokenInputOutlineWidth","error","tokenInputBorderColorError","labelFocused","tokenInputBorderColorFocus","labelDisabled","tokenInputDisabledBg","inputDisabledBackgroundClip","tokenInputDisabledBorderColor","input","tokenInputTextColor","tokenInputPlaceholderColor","tokenInputPlaceholderColorDisabled","tokenInputPlaceholderColorLight","helperContainer","helperText","helperTextEditing","tokenFontSize","tokenLegacyTextShift","inputDisabled","tokenInputTextColorDisabled","inputEditing","reservedInput"],"mappings":"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","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nconst mixins = {\n  inputAndHelperCommonStyles(t: Theme) {\n    return css`\n      padding: 0 ${t.tokenInputInputPaddingRight} 0 ${t.tokenInputInputPaddingLeft};\n      line-height: ${t.tokenInputLineHeight};\n      font-size: ${t.tokenInputFontSize};\n    `;\n  },\n  inputAndHelperCommonEditingStyles(t: Theme) {\n    return css`\n      margin: ${t.tokenMarginY} ${t.tokenMarginX};\n      padding: 0 ${t.tokenInputInputPaddingRight} 0 ${t.tokenPaddingX};\n      line-height: ${t.tokenLineHeight};\n    `;\n  },\n};\n\nexport const styles = memoizeStyle({\n  label(t: Theme) {\n    return css`\n      background-color: ${t.tokenInputBg};\n      box-shadow: ${t.tokenInputShadow};\n      border: ${t.tokenInputBorderWidth} solid ${t.tokenInputBorderColor};\n      border-top-color: ${t.tokenInputBorderTopColor};\n      box-sizing: border-box;\n      cursor: text;\n      padding: ${t.tokenInputPaddingY} ${t.tokenInputPaddingX};\n      display: flex;\n      flex-wrap: wrap;\n      align-items: start;\n      outline: none;\n      position: relative;\n      border-radius: ${t.tokenInputBorderRadius};\n    `;\n  },\n\n  hovering(t: Theme) {\n    return css`\n      &:hover {\n        border-color: ${t.tokenInputBorderColorHover};\n      }\n    `;\n  },\n\n  warning(t: Theme) {\n    return css`\n      border: ${t.tokenInputBorderWidth} solid ${t.tokenInputBorderColorWarning};\n      box-shadow: 0 0 0 ${t.tokenInputOutlineWidth} ${t.tokenInputBorderColorWarning};\n    `;\n  },\n\n  error(t: Theme) {\n    return css`\n      border: ${t.tokenInputBorderWidth} solid ${t.tokenInputBorderColorError};\n      box-shadow: 0 0 0 ${t.tokenInputOutlineWidth} ${t.tokenInputBorderColorError};\n    `;\n  },\n\n  labelFocused(t: Theme) {\n    return css`\n      border: ${t.tokenInputBorderWidth} solid ${t.tokenInputBorderColorFocus};\n      box-shadow: 0 0 0 ${t.tokenInputOutlineWidth} ${t.tokenInputBorderColorFocus};\n    `;\n  },\n\n  labelDisabled(t: Theme) {\n    return css`\n      background: ${t.tokenInputDisabledBg};\n      background-clip: ${t.inputDisabledBackgroundClip};\n      border-color: ${t.tokenInputDisabledBorderColor};\n      box-shadow: none;\n      cursor: default;\n    `;\n  },\n\n  input(t: Theme) {\n    return css`\n      min-width: 0;\n      max-width: 100%;\n      width: 50px;\n      background: transparent;\n      border: none;\n      box-shadow: none;\n      outline: none;\n      font-family: inherit;\n      margin: ${t.tokenMarginY} 0 ${t.tokenMarginY} 0;\n      overflow: hidden;\n      resize: none;\n      height: ${t.tokenInputLineHeight};\n      -webkit-appearance: none;\n      text-overflow: clip;\n      background-clip: padding-box;\n      transition: background-color 0.15s ease-in;\n      color: ${t.tokenInputTextColor};\n      box-sizing: border-box;\n      word-break: break-all;\n\n      ${mixins.inputAndHelperCommonStyles(t)};\n\n      &::-ms-clear {\n        display: none;\n      }\n      &::placeholder {\n        color: ${t.tokenInputPlaceholderColor};\n        -webkit-text-fill-color: ${t.tokenInputPlaceholderColor};\n      }\n      &:disabled::placeholder {\n        color: ${t.tokenInputPlaceholderColorDisabled};\n        -webkit-text-fill-color: ${t.tokenInputPlaceholderColorDisabled};\n      }\n      &:focus::placeholder {\n        color: ${t.tokenInputPlaceholderColorLight};\n        -webkit-text-fill-color: ${t.tokenInputPlaceholderColorLight};\n      }\n      /* fix firefox placeholder opacity */\n      &:-moz-placeholder {\n        opacity: 1;\n      }\n      &::-moz-placeholder {\n        opacity: 1;\n      }\n    `;\n  },\n\n  helperContainer(t: Theme) {\n    return css`\n      display: flex;\n      position: absolute;\n      top: 0;\n      left: 0;\n      right: 0;\n      padding: ${t.tokenInputPaddingY} ${t.tokenInputPaddingX};\n      visibility: hidden;\n    `;\n  },\n\n  helperText(t: Theme) {\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      ${mixins.inputAndHelperCommonStyles(t)}\n    `;\n  },\n\n  helperTextEditing(t: Theme) {\n    return css`\n      ${mixins.inputAndHelperCommonEditingStyles(t)};\n\n      font-size: ${t.tokenFontSize};\n      padding-bottom: ${t.tokenLegacyTextShift};\n    `;\n  },\n\n  inputDisabled(t: Theme) {\n    return css`\n      pointer-events: none;\n      /* fix text color in safari */\n      -webkit-text-fill-color: currentcolor;\n      color: ${t.tokenInputTextColorDisabled};\n    `;\n  },\n\n  inputEditing(t: Theme) {\n    return css`\n      ${mixins.inputAndHelperCommonEditingStyles(t)};\n    `;\n  },\n\n  reservedInput(t: Theme) {\n    return css`\n      min-width: 2px;\n      min-height: ${t.tokenInputLineHeight};\n      line-height: ${t.tokenInputLineHeight};\n      font-size: ${t.tokenInputFontSize};\n      margin: ${t.tokenMarginY} 0 ${t.tokenMarginY} 0;\n      padding: 0 ${t.tokenInputInputPaddingRight} 0 ${t.tokenInputInputPaddingLeft};\n      color: ${t.tokenInputTextColorDisabled};\n      word-break: break-all;\n    `;\n  },\n});\n"]}

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

@@ -1,14 +1,18 @@
 import React from 'react';
+import { PopupProps } from '../../internal/Popup';
 import { ComboBoxMenuProps } from '../../internal/CustomComboBox';
+import { TokenInputMenuAlign, TokenInputProps } from './TokenInput';
 export interface TokenInputMenuProps<T> extends ComboBoxMenuProps<T> {
-    anchorElement: HTMLElement;
+    anchorElement: PopupProps['anchorElement'];
+    menuWidth: TokenInputProps<string>['menuWidth'];
+    menuAlign: TokenInputMenuAlign;
 }
 export declare class TokenInputMenu<T = string> extends React.Component<TokenInputMenuProps<T>> {
     static __KONTUR_REACT_UI__: string;
     private theme;
     private menu;
     render(): JSX.Element;
-    getMenuRef: () => any;
+    getMenuRef: () => any | null;
     private renderMain;
     private getPopupMargin;
     private menuRef;

package/cjs/components/TokenInput/TokenInputMenu.js

@@ -1,10 +1,15 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.TokenInputMenu = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
+var _ThemeFactory = require("../../lib/theming/ThemeFactory");
 var _Popup = require("../../internal/Popup");
 var _CustomComboBox = require("../../internal/CustomComboBox");
 
 
-var _ThemeContext = require("../../lib/theming/ThemeContext");var
+var _ThemeContext = require("../../lib/theming/ThemeContext");
+
+var _TokenInput = require("./TokenInput");var
+
+
 
 
 
@@ -13,7 +18,7 @@ var _ThemeContext = require("../../lib/theming/ThemeContext");var
 TokenInputMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(TokenInputMenu, _React$Component);function TokenInputMenu() {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.
 
 
-    theme = void 0;_this.
+
 
     menu = null;_this.
 
@@ -24,6 +29,18 @@ TokenInputMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.d
 
 
 
+
+
+
+
+
+
+
+
+
+
+
+
 
 
 
@@ -61,6 +78,13 @@ TokenInputMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.d
 
 
 
+
+
+
+
+
+
+
 
 
 
@@ -72,7 +96,9 @@ TokenInputMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.d
     getPopupMargin = function () {
       var paddingY = parseInt(_this.theme.tokenInputPaddingY, 10) || 0;
       var outlineWidth = parseInt(_this.theme.controlOutlineWidth, 10) || 0;
-      return paddingY + outlineWidth;
+      var marginY = parseInt(_this.theme.tokenMarginY, 10) || 0;
+
+      return paddingY + outlineWidth + marginY;
     };_this.
 
-    menuRef = function (node) {return _this.menu = node;};return _this;}var _proto = TokenInputMenu.prototype;_proto.render = function render() {var _this2 = this;return _react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this$props = this.props,loading = _this$props.loading,maxMenuHeight = _this$props.maxMenuHeight,renderTotalCount = _this$props.renderTotalCount,totalCount = _this$props.totalCount,opened = _this$props.opened,items = _this$props.items,renderNotFound = _this$props.renderNotFound,renderItem = _this$props.renderItem,onValueChange = _this$props.onValueChange,renderAddButton = _this$props.renderAddButton;return _react.default.createElement(_Popup.Popup, { opened: opened, positions: ['bottom left'], anchorElement: this.props.anchorElement, margin: this.getPopupMargin(), popupOffset: 5 }, _react.default.createElement(_CustomComboBox.ComboBoxMenu, { items: items, loading: loading, maxMenuHeight: maxMenuHeight, onValueChange: onValueChange, opened: opened, refMenu: this.menuRef, renderTotalCount: renderTotalCount, renderItem: renderItem, renderNotFound: renderNotFound, totalCount: totalCount, renderAddButton: renderAddButton }));};return TokenInputMenu;}(_react.default.Component);exports.TokenInputMenu = TokenInputMenu;TokenInputMenu.__KONTUR_REACT_UI__ = 'TokenInputMenu';
+    menuRef = function (node) {return _this.menu = node;};return _this;}var _proto = TokenInputMenu.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _ThemeFactory.ThemeFactory.create({ popupMargin: _this2.getPopupMargin() + 'px', popupBackground: _this2.theme.tokenInputMenuPopupBg }, theme) }, _this2.renderMain());});};_proto.renderMain = function renderMain() {var _this$props = this.props,loading = _this$props.loading,maxMenuHeight = _this$props.maxMenuHeight,renderTotalCount = _this$props.renderTotalCount,totalCount = _this$props.totalCount,opened = _this$props.opened,items = _this$props.items,renderNotFound = _this$props.renderNotFound,renderItem = _this$props.renderItem,onValueChange = _this$props.onValueChange,renderAddButton = _this$props.renderAddButton,anchorElement = _this$props.anchorElement,menuWidth = _this$props.menuWidth,menuAlign = _this$props.menuAlign;return /*#__PURE__*/_react.default.createElement(_Popup.Popup, { "data-tid": _TokenInput.TokenInputDataTids.tokenInputMenu, opened: !!opened, positions: ['bottom left', 'top left'], anchorElement: anchorElement, popupOffset: menuAlign === 'left' ? 0 : 5, margin: menuAlign === 'left' ? 1 : undefined, hasShadow: true, width: menuAlign === 'cursor' ? 'auto' : menuWidth, withoutMobile: true }, /*#__PURE__*/_react.default.createElement(_CustomComboBox.ComboBoxMenu, { items: items, loading: loading, maxMenuHeight: maxMenuHeight, onValueChange: onValueChange, opened: opened, refMenu: this.menuRef, renderTotalCount: renderTotalCount, renderItem: renderItem, renderNotFound: renderNotFound, totalCount: totalCount, renderAddButton: renderAddButton }));};return TokenInputMenu;}(_react.default.Component);exports.TokenInputMenu = TokenInputMenu;TokenInputMenu.__KONTUR_REACT_UI__ = 'TokenInputMenu';

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

@@ -1 +1 @@
-{"version":3,"sources":["TokenInputMenu.tsx"],"names":["TokenInputMenu","theme","menu","getMenuRef","getPopupMargin","paddingY","parseInt","tokenInputPaddingY","outlineWidth","controlOutlineWidth","menuRef","node","render","renderMain","props","loading","maxMenuHeight","renderTotalCount","totalCount","opened","items","renderNotFound","renderItem","onValueChange","renderAddButton","anchorElement","React","Component","__KONTUR_REACT_UI__"],"mappings":"0PAAA;;AAEA;AACA;;;AAGA,8D;;;;;;AAMaA,c;;;AAGHC,IAAAA,K;;AAEAC,IAAAA,I,GAAoB,I;;;;;;;;;;;;;AAarBC,IAAAA,U,GAAa,oBAAkB,MAAKD,IAAvB,E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCZE,IAAAA,c,GAAiB,YAAc;AACrC,UAAMC,QAAQ,GAAGC,QAAQ,CAAC,MAAKL,KAAL,CAAWM,kBAAZ,EAAgC,EAAhC,CAAR,IAA+C,CAAhE;AACA,UAAMC,YAAY,GAAGF,QAAQ,CAAC,MAAKL,KAAL,CAAWQ,mBAAZ,EAAiC,EAAjC,CAAR,IAAgD,CAArE;AACA,aAAOJ,QAAQ,GAAGG,YAAlB;AACD,K;;AAEOE,IAAAA,O,GAAU,UAACC,IAAD,UAAgB,MAAKT,IAAL,GAAYS,IAA5B,E,4DA1DXC,M,GAAP,kBAAgB,mBACd,OACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAAAX,KAAK,EAAI,CACR,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,OAAO,MAAI,CAACY,UAAL,EAAP,CACD,CAJH,CADF,CAQD,C,QAIOA,U,GAAR,sBAAqB,mBAYf,KAAKC,KAZU,CAEjBC,OAFiB,eAEjBA,OAFiB,CAGjBC,aAHiB,eAGjBA,aAHiB,CAIjBC,gBAJiB,eAIjBA,gBAJiB,CAKjBC,UALiB,eAKjBA,UALiB,CAMjBC,MANiB,eAMjBA,MANiB,CAOjBC,KAPiB,eAOjBA,KAPiB,CAQjBC,cARiB,eAQjBA,cARiB,CASjBC,UATiB,eASjBA,UATiB,CAUjBC,aAViB,eAUjBA,aAViB,CAWjBC,eAXiB,eAWjBA,eAXiB,CAcnB,OACE,6BAAC,YAAD,IACE,MAAM,EAAEL,MADV,EAEE,SAAS,EAAE,CAAC,aAAD,CAFb,EAGE,aAAa,EAAE,KAAKL,KAAL,CAAWW,aAH5B,EAIE,MAAM,EAAE,KAAKrB,cAAL,EAJV,EAKE,WAAW,EAAE,CALf,IAOE,6BAAC,4BAAD,IACE,KAAK,EAAEgB,KADT,EAEE,OAAO,EAAEL,OAFX,EAGE,aAAa,EAAEC,aAHjB,EAIE,aAAa,EAAEO,aAJjB,EAKE,MAAM,EAAEJ,MALV,EAME,OAAO,EAAE,KAAKT,OANhB,EAOE,gBAAgB,EAAEO,gBAPpB,EAQE,UAAU,EAAEK,UARd,EASE,cAAc,EAAED,cATlB,EAUE,UAAU,EAAEH,UAVd,EAWE,eAAe,EAAEM,eAXnB,GAPF,CADF,CAuBD,C,yBAzD6CE,eAAMC,S,0CAAzC3B,c,CACG4B,mB,GAAsB,gB","sourcesContent":["import React from 'react';\r\n\r\nimport { Popup } from '../../internal/Popup';\r\nimport { ComboBoxMenu, ComboBoxMenuProps } from '../../internal/CustomComboBox';\r\nimport { Menu } from '../../internal/Menu';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\n\r\nexport interface TokenInputMenuProps<T> extends ComboBoxMenuProps<T> {\r\n  anchorElement: HTMLElement;\r\n}\r\n\r\nexport class TokenInputMenu<T = string> extends React.Component<TokenInputMenuProps<T>> {\r\n  public static __KONTUR_REACT_UI__ = 'TokenInputMenu';\r\n\r\n  private theme!: Theme;\r\n\r\n  private menu: Menu | null = null;\r\n\r\n  public render() {\r\n    return (\r\n      <ThemeContext.Consumer>\r\n        {theme => {\r\n          this.theme = theme;\r\n          return this.renderMain();\r\n        }}\r\n      </ThemeContext.Consumer>\r\n    );\r\n  }\r\n\r\n  public getMenuRef = (): any | null => this.menu;\r\n\r\n  private renderMain() {\r\n    const {\r\n      loading,\r\n      maxMenuHeight,\r\n      renderTotalCount,\r\n      totalCount,\r\n      opened,\r\n      items,\r\n      renderNotFound,\r\n      renderItem,\r\n      onValueChange,\r\n      renderAddButton,\r\n    } = this.props;\r\n\r\n    return (\r\n      <Popup\r\n        opened={opened!}\r\n        positions={['bottom left']}\r\n        anchorElement={this.props.anchorElement}\r\n        margin={this.getPopupMargin()}\r\n        popupOffset={5}\r\n      >\r\n        <ComboBoxMenu\r\n          items={items}\r\n          loading={loading}\r\n          maxMenuHeight={maxMenuHeight}\r\n          onValueChange={onValueChange}\r\n          opened={opened}\r\n          refMenu={this.menuRef}\r\n          renderTotalCount={renderTotalCount}\r\n          renderItem={renderItem}\r\n          renderNotFound={renderNotFound}\r\n          totalCount={totalCount}\r\n          renderAddButton={renderAddButton}\r\n        />\r\n      </Popup>\r\n    );\r\n  }\r\n\r\n  private getPopupMargin = (): number => {\r\n    const paddingY = parseInt(this.theme.tokenInputPaddingY, 10) || 0;\r\n    const outlineWidth = parseInt(this.theme.controlOutlineWidth, 10) || 0;\r\n    return paddingY + outlineWidth;\r\n  };\r\n\r\n  private menuRef = (node: any) => (this.menu = node);\r\n}\r\n"]}
+{"version":3,"sources":["TokenInputMenu.tsx"],"names":["TokenInputMenu","menu","getMenuRef","getPopupMargin","paddingY","parseInt","theme","tokenInputPaddingY","outlineWidth","controlOutlineWidth","marginY","tokenMarginY","menuRef","node","render","ThemeFactory","create","popupMargin","popupBackground","tokenInputMenuPopupBg","renderMain","props","loading","maxMenuHeight","renderTotalCount","totalCount","opened","items","renderNotFound","renderItem","onValueChange","renderAddButton","anchorElement","menuWidth","menuAlign","TokenInputDataTids","tokenInputMenu","undefined","React","Component","__KONTUR_REACT_UI__"],"mappings":"0PAAA;;AAEA;AACA;AACA;;;AAGA;;AAEA,0C;;;;;;;;AAQaA,c;;;;;AAKHC,IAAAA,I,GAAoB,I;;;;;;;;;;;;;;;;;;;;;;;;;AAyBrBC,IAAAA,U,GAAa,oBAAkB,MAAKD,IAAvB,E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDZE,IAAAA,c,GAAiB,YAAc;AACrC,UAAMC,QAAQ,GAAGC,QAAQ,CAAC,MAAKC,KAAL,CAAWC,kBAAZ,EAAgC,EAAhC,CAAR,IAA+C,CAAhE;AACA,UAAMC,YAAY,GAAGH,QAAQ,CAAC,MAAKC,KAAL,CAAWG,mBAAZ,EAAiC,EAAjC,CAAR,IAAgD,CAArE;AACA,UAAMC,OAAO,GAAGL,QAAQ,CAAC,MAAKC,KAAL,CAAWK,YAAZ,EAA0B,EAA1B,CAAR,IAAyC,CAAzD;;AAEA,aAAOP,QAAQ,GAAGI,YAAX,GAA0BE,OAAjC;AACD,K;;AAEOE,IAAAA,O,GAAU,UAACC,IAAD,UAAgB,MAAKZ,IAAL,GAAYY,IAA5B,E,4DA/EXC,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACR,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,oBACE,6BAAC,0BAAD,CAAc,QAAd,IACE,KAAK,EAAES,2BAAaC,MAAb,CACL,EACEC,WAAW,EAAE,MAAI,CAACd,cAAL,KAAwB,IADvC,EAEEe,eAAe,EAAE,MAAI,CAACZ,KAAL,CAAWa,qBAF9B,EADK,EAKLb,KALK,CADT,IASG,MAAI,CAACc,UAAL,EATH,CADF,CAaD,CAhBH,CADF,CAoBD,C,QAIOA,U,GAAR,sBAAqB,CACnB,kBAcI,KAAKC,KAdT,CACEC,OADF,eACEA,OADF,CAEEC,aAFF,eAEEA,aAFF,CAGEC,gBAHF,eAGEA,gBAHF,CAIEC,UAJF,eAIEA,UAJF,CAKEC,MALF,eAKEA,MALF,CAMEC,KANF,eAMEA,KANF,CAOEC,cAPF,eAOEA,cAPF,CAQEC,UARF,eAQEA,UARF,CASEC,aATF,eASEA,aATF,CAUEC,eAVF,eAUEA,eAVF,CAWEC,aAXF,eAWEA,aAXF,CAYEC,SAZF,eAYEA,SAZF,CAaEC,SAbF,eAaEA,SAbF,CAgBA,oBACE,6BAAC,YAAD,IACE,YAAUC,+BAAmBC,cAD/B,EAEE,MAAM,EAAE,CAAC,CAACV,MAFZ,EAGE,SAAS,EAAE,CAAC,aAAD,EAAgB,UAAhB,CAHb,EAIE,aAAa,EAAEM,aAJjB,EAKE,WAAW,EAAEE,SAAS,KAAK,MAAd,GAAuB,CAAvB,GAA2B,CAL1C,EAME,MAAM,EAAEA,SAAS,KAAK,MAAd,GAAuB,CAAvB,GAA2BG,SANrC,EAOE,SAAS,MAPX,EAQE,KAAK,EAAEH,SAAS,KAAK,QAAd,GAAyB,MAAzB,GAAkCD,SAR3C,EASE,aAAa,MATf,iBAWE,6BAAC,4BAAD,IACE,KAAK,EAAEN,KADT,EAEE,OAAO,EAAEL,OAFX,EAGE,aAAa,EAAEC,aAHjB,EAIE,aAAa,EAAEO,aAJjB,EAKE,MAAM,EAAEJ,MALV,EAME,OAAO,EAAE,KAAKd,OANhB,EAOE,gBAAgB,EAAEY,gBAPpB,EAQE,UAAU,EAAEK,UARd,EASE,cAAc,EAAED,cATlB,EAUE,UAAU,EAAEH,UAVd,EAWE,eAAe,EAAEM,eAXnB,GAXF,CADF,CA2BD,C,yBA5E6CO,eAAMC,S,0CAAzCvC,c,CACGwC,mB,GAAsB,gB","sourcesContent":["import React from 'react';\n\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Popup, PopupProps } from '../../internal/Popup';\nimport { ComboBoxMenu, ComboBoxMenuProps } from '../../internal/CustomComboBox';\nimport { Menu } from '../../internal/Menu';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { TokenInputDataTids, TokenInputMenuAlign, TokenInputProps } from './TokenInput';\n\nexport interface TokenInputMenuProps<T> extends ComboBoxMenuProps<T> {\n  anchorElement: PopupProps['anchorElement'];\n  menuWidth: TokenInputProps<string>['menuWidth'];\n  menuAlign: TokenInputMenuAlign;\n}\n\nexport class TokenInputMenu<T = string> extends React.Component<TokenInputMenuProps<T>> {\n  public static __KONTUR_REACT_UI__ = 'TokenInputMenu';\n\n  private theme!: Theme;\n\n  private menu: Menu | null = null;\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupMargin: this.getPopupMargin() + 'px',\n                  popupBackground: this.theme.tokenInputMenuPopupBg,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public getMenuRef = (): any | null => this.menu;\n\n  private renderMain() {\n    const {\n      loading,\n      maxMenuHeight,\n      renderTotalCount,\n      totalCount,\n      opened,\n      items,\n      renderNotFound,\n      renderItem,\n      onValueChange,\n      renderAddButton,\n      anchorElement,\n      menuWidth,\n      menuAlign,\n    } = this.props;\n\n    return (\n      <Popup\n        data-tid={TokenInputDataTids.tokenInputMenu}\n        opened={!!opened}\n        positions={['bottom left', 'top left']}\n        anchorElement={anchorElement}\n        popupOffset={menuAlign === 'left' ? 0 : 5}\n        margin={menuAlign === 'left' ? 1 : undefined}\n        hasShadow\n        width={menuAlign === 'cursor' ? 'auto' : menuWidth}\n        withoutMobile\n      >\n        <ComboBoxMenu\n          items={items}\n          loading={loading}\n          maxMenuHeight={maxMenuHeight}\n          onValueChange={onValueChange}\n          opened={opened}\n          refMenu={this.menuRef}\n          renderTotalCount={renderTotalCount}\n          renderItem={renderItem}\n          renderNotFound={renderNotFound}\n          totalCount={totalCount}\n          renderAddButton={renderAddButton}\n        />\n      </Popup>\n    );\n  }\n\n  private getPopupMargin = (): number => {\n    const paddingY = parseInt(this.theme.tokenInputPaddingY, 10) || 0;\n    const outlineWidth = parseInt(this.theme.controlOutlineWidth, 10) || 0;\n    const marginY = parseInt(this.theme.tokenMarginY, 10) || 0;\n\n    return paddingY + outlineWidth + marginY;\n  };\n\n  private menuRef = (node: any) => (this.menu = node);\n}\n"]}

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

@@ -5,6 +5,7 @@ export interface TokenInputAction {
 }
 export declare const TokenActions: {
     SET_INPUT_VALUE_WIDTH: string;
+    SET_INPUT_VALUE_HEIGHT: string;
     UPDATE_QUERY: string;
     SET_FOCUS_IN: string;
     SET_PREVENT_BLUR: string;
@@ -15,6 +16,10 @@ export declare const TokenActions: {
     SET_LOADING: string;
     CLEAR_INPUT: string;
     RESET: string;
+    SET_EDITING_TOKEN_INDEX: string;
+    REMOVE_EDITING_TOKEN_INDEX: string;
+    SET_TEMPORARY_QUERY: string;
+    REMOVE_TEMPORARY_QUERY: string;
 };
 export declare type TokenInputActionType = keyof typeof TokenActions;
 export declare function tokenInputReducer<T = string>(state: TokenInputState<T>, action: TokenInputAction): Pick<TokenInputState<T>, never>;

package/cjs/components/TokenInput/TokenInputReducer.js

@@ -1,4 +1,4 @@
-"use strict";exports.__esModule = true;exports.tokenInputReducer = tokenInputReducer;exports.TokenActions = void 0;var _TokenInput = require("./TokenInput");
+"use strict";exports.__esModule = true;exports.TokenActions = void 0;exports.tokenInputReducer = tokenInputReducer;var _TokenInput = require("./TokenInput");
 
 
 
@@ -7,6 +7,7 @@
 
 var TokenActions = {
   SET_INPUT_VALUE_WIDTH: 'SET_INPUT_VALUE_WIDTH',
+  SET_INPUT_VALUE_HEIGHT: 'SET_INPUT_VALUE_HEIGHT',
   UPDATE_QUERY: 'UPDATE_QUERY',
   SET_FOCUS_IN: 'SET_FOCUS_IN',
   SET_PREVENT_BLUR: 'SET_PREVENT_BLUR',
@@ -16,7 +17,11 @@ var TokenActions = {
   REMOVE_ALL_ACTIVE_TOKENS: 'REMOVE_ALL_ACTIVE_TOKENS',
   SET_LOADING: 'SET_LOADING',
   CLEAR_INPUT: 'CLEAR_INPUT',
-  RESET: 'RESET' };exports.TokenActions = TokenActions;
+  RESET: 'RESET',
+  SET_EDITING_TOKEN_INDEX: 'SET_EDITING_TOKEN_INDEX',
+  REMOVE_EDITING_TOKEN_INDEX: 'REMOVE_EDITING_TOKEN_INDEX',
+  SET_TEMPORARY_QUERY: 'SET_TEMPORARY_QUERY',
+  REMOVE_TEMPORARY_QUERY: 'REMOVE_TEMPORARY_QUERY' };exports.TokenActions = TokenActions;
 
 
 
@@ -30,6 +35,9 @@ action)
     case TokenActions.SET_INPUT_VALUE_WIDTH:{
         return { inputValueWidth: payload };
       }
+    case TokenActions.SET_INPUT_VALUE_HEIGHT:{
+        return { inputValueHeight: payload };
+      }
     case TokenActions.UPDATE_QUERY:{
         return { inputValue: payload };
       }
@@ -67,7 +75,18 @@ action)
     case TokenActions.RESET:{
         return _TokenInput.DefaultState;
       }
-
+    case TokenActions.SET_EDITING_TOKEN_INDEX:{
+        return { editingTokenIndex: payload };
+      }
+    case TokenActions.REMOVE_EDITING_TOKEN_INDEX:{
+        return { editingTokenIndex: -1 };
+      }
+    case TokenActions.SET_TEMPORARY_QUERY:{
+        return { reservedInputValue: payload };
+      }
+    case TokenActions.REMOVE_TEMPORARY_QUERY:{
+        return { reservedInputValue: undefined };
+      }
     default:
       return state;}
 

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

@@ -1 +1 @@
-{"version":3,"sources":["TokenInputReducer.ts"],"names":["TokenActions","SET_INPUT_VALUE_WIDTH","UPDATE_QUERY","SET_FOCUS_IN","SET_PREVENT_BLUR","BLUR","SET_AUTOCOMPLETE_ITEMS","SET_ACTIVE_TOKENS","REMOVE_ALL_ACTIVE_TOKENS","SET_LOADING","CLEAR_INPUT","RESET","tokenInputReducer","state","action","payload","type","inputValueWidth","inputValue","inFocus","preventBlur","autocompleteItems","activeTokens","undefined","loading","DefaultState"],"mappings":"mHAAA;;;;;;;AAOO,IAAMA,YAAY,GAAG;AAC1BC,EAAAA,qBAAqB,EAAE,uBADG;AAE1BC,EAAAA,YAAY,EAAE,cAFY;AAG1BC,EAAAA,YAAY,EAAE,cAHY;AAI1BC,EAAAA,gBAAgB,EAAE,kBAJQ;AAK1BC,EAAAA,IAAI,EAAE,MALoB;AAM1BC,EAAAA,sBAAsB,EAAE,wBANE;AAO1BC,EAAAA,iBAAiB,EAAE,mBAPO;AAQ1BC,EAAAA,wBAAwB,EAAE,0BARA;AAS1BC,EAAAA,WAAW,EAAE,aATa;AAU1BC,EAAAA,WAAW,EAAE,aAVa;AAW1BC,EAAAA,KAAK,EAAE,OAXmB,EAArB,C;;;;;AAgBA,SAASC,iBAAT;AACLC,KADK;AAELC,MAFK;AAG4B;AACjC,MAAMC,OAAO,GAAGD,MAAM,CAACC,OAAvB;AACA,UAAQD,MAAM,CAACE,IAAf;AACE,SAAKhB,YAAY,CAACC,qBAAlB,CAAyC;AACvC,eAAO,EAAEgB,eAAe,EAAEF,OAAnB,EAAP;AACD;AACD,SAAKf,YAAY,CAACE,YAAlB,CAAgC;AAC9B,eAAO,EAAEgB,UAAU,EAAEH,OAAd,EAAP;AACD;AACD,SAAKf,YAAY,CAACG,YAAlB,CAAgC;AAC9B,eAAO,EAAEgB,OAAO,EAAE,IAAX,EAAP;AACD;AACD,SAAKnB,YAAY,CAACI,gBAAlB,CAAoC;AAClC,eAAO,EAAEgB,WAAW,EAAEL,OAAf,EAAP;AACD;AACD,SAAKf,YAAY,CAACM,sBAAlB,CAA0C;AACxC,eAAO,EAAEe,iBAAiB,EAAEN,OAArB,EAAP;AACD;AACD,SAAKf,YAAY,CAACO,iBAAlB,CAAqC;AACnC,eAAO,EAAEe,YAAY,EAAEP,OAAhB,EAAP;AACD;AACD,SAAKf,YAAY,CAACK,IAAlB,CAAwB;AACtB,eAAO;AACLc,UAAAA,OAAO,EAAE,KADJ;AAELC,UAAAA,WAAW,EAAE,KAFR;AAGLC,UAAAA,iBAAiB,EAAEE,SAHd;AAILD,UAAAA,YAAY,EAAE,EAJT,EAAP;;AAMD;AACD,SAAKtB,YAAY,CAACQ,wBAAlB,CAA4C;AAC1C,eAAO,EAAEc,YAAY,EAAE,EAAhB,EAAP;AACD;AACD,SAAKtB,YAAY,CAACU,WAAlB,CAA+B;AAC7B,eAAO,EAAEQ,UAAU,EAAE,EAAd,EAAkBG,iBAAiB,EAAEE,SAArC,EAAP;AACD;AACD,SAAKvB,YAAY,CAACS,WAAlB,CAA+B;AAC7B,eAAO;AACLe,UAAAA,OAAO,EAAET,OADJ,EAAP;;AAGD;AACD,SAAKf,YAAY,CAACW,KAAlB,CAAyB;AACvB,eAAOc,wBAAP;AACD;;AAED;AACE,aAAOZ,KAAP,CA3CJ;;AA6CD","sourcesContent":["import { TokenInputState, DefaultState } from './TokenInput';\r\n\r\nexport interface TokenInputAction {\r\n  type: TokenInputActionType;\r\n  payload?: any;\r\n}\r\n\r\nexport const TokenActions = {\r\n  SET_INPUT_VALUE_WIDTH: 'SET_INPUT_VALUE_WIDTH',\r\n  UPDATE_QUERY: 'UPDATE_QUERY',\r\n  SET_FOCUS_IN: 'SET_FOCUS_IN',\r\n  SET_PREVENT_BLUR: 'SET_PREVENT_BLUR',\r\n  BLUR: 'BLUR',\r\n  SET_AUTOCOMPLETE_ITEMS: 'SET_AUTOCOMPLETE_ITEMS',\r\n  SET_ACTIVE_TOKENS: 'SET_ACTIVE_TOKENS',\r\n  REMOVE_ALL_ACTIVE_TOKENS: 'REMOVE_ALL_ACTIVE_TOKENS',\r\n  SET_LOADING: 'SET_LOADING',\r\n  CLEAR_INPUT: 'CLEAR_INPUT',\r\n  RESET: 'RESET',\r\n};\r\n\r\nexport type TokenInputActionType = keyof typeof TokenActions;\r\n\r\nexport function tokenInputReducer<T = string>(\r\n  state: TokenInputState<T>,\r\n  action: TokenInputAction,\r\n): Pick<TokenInputState<T>, never> {\r\n  const payload = action.payload;\r\n  switch (action.type) {\r\n    case TokenActions.SET_INPUT_VALUE_WIDTH: {\r\n      return { inputValueWidth: payload };\r\n    }\r\n    case TokenActions.UPDATE_QUERY: {\r\n      return { inputValue: payload };\r\n    }\r\n    case TokenActions.SET_FOCUS_IN: {\r\n      return { inFocus: true };\r\n    }\r\n    case TokenActions.SET_PREVENT_BLUR: {\r\n      return { preventBlur: payload };\r\n    }\r\n    case TokenActions.SET_AUTOCOMPLETE_ITEMS: {\r\n      return { autocompleteItems: payload };\r\n    }\r\n    case TokenActions.SET_ACTIVE_TOKENS: {\r\n      return { activeTokens: payload };\r\n    }\r\n    case TokenActions.BLUR: {\r\n      return {\r\n        inFocus: false,\r\n        preventBlur: false,\r\n        autocompleteItems: undefined,\r\n        activeTokens: [],\r\n      };\r\n    }\r\n    case TokenActions.REMOVE_ALL_ACTIVE_TOKENS: {\r\n      return { activeTokens: [] };\r\n    }\r\n    case TokenActions.CLEAR_INPUT: {\r\n      return { inputValue: '', autocompleteItems: undefined };\r\n    }\r\n    case TokenActions.SET_LOADING: {\r\n      return {\r\n        loading: payload,\r\n      };\r\n    }\r\n    case TokenActions.RESET: {\r\n      return DefaultState;\r\n    }\r\n\r\n    default:\r\n      return state;\r\n  }\r\n}\r\n"]}
+{"version":3,"sources":["TokenInputReducer.ts"],"names":["TokenActions","SET_INPUT_VALUE_WIDTH","SET_INPUT_VALUE_HEIGHT","UPDATE_QUERY","SET_FOCUS_IN","SET_PREVENT_BLUR","BLUR","SET_AUTOCOMPLETE_ITEMS","SET_ACTIVE_TOKENS","REMOVE_ALL_ACTIVE_TOKENS","SET_LOADING","CLEAR_INPUT","RESET","SET_EDITING_TOKEN_INDEX","REMOVE_EDITING_TOKEN_INDEX","SET_TEMPORARY_QUERY","REMOVE_TEMPORARY_QUERY","tokenInputReducer","state","action","payload","type","inputValueWidth","inputValueHeight","inputValue","inFocus","preventBlur","autocompleteItems","activeTokens","undefined","loading","DefaultState","editingTokenIndex","reservedInputValue"],"mappings":"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","sourcesContent":["import { TokenInputState, DefaultState } from './TokenInput';\n\nexport interface TokenInputAction {\n  type: TokenInputActionType;\n  payload?: any;\n}\n\nexport const TokenActions = {\n  SET_INPUT_VALUE_WIDTH: 'SET_INPUT_VALUE_WIDTH',\n  SET_INPUT_VALUE_HEIGHT: 'SET_INPUT_VALUE_HEIGHT',\n  UPDATE_QUERY: 'UPDATE_QUERY',\n  SET_FOCUS_IN: 'SET_FOCUS_IN',\n  SET_PREVENT_BLUR: 'SET_PREVENT_BLUR',\n  BLUR: 'BLUR',\n  SET_AUTOCOMPLETE_ITEMS: 'SET_AUTOCOMPLETE_ITEMS',\n  SET_ACTIVE_TOKENS: 'SET_ACTIVE_TOKENS',\n  REMOVE_ALL_ACTIVE_TOKENS: 'REMOVE_ALL_ACTIVE_TOKENS',\n  SET_LOADING: 'SET_LOADING',\n  CLEAR_INPUT: 'CLEAR_INPUT',\n  RESET: 'RESET',\n  SET_EDITING_TOKEN_INDEX: 'SET_EDITING_TOKEN_INDEX',\n  REMOVE_EDITING_TOKEN_INDEX: 'REMOVE_EDITING_TOKEN_INDEX',\n  SET_TEMPORARY_QUERY: 'SET_TEMPORARY_QUERY',\n  REMOVE_TEMPORARY_QUERY: 'REMOVE_TEMPORARY_QUERY',\n};\n\nexport type TokenInputActionType = keyof typeof TokenActions;\n\nexport function tokenInputReducer<T = string>(\n  state: TokenInputState<T>,\n  action: TokenInputAction,\n): Pick<TokenInputState<T>, never> {\n  const payload = action.payload;\n  switch (action.type) {\n    case TokenActions.SET_INPUT_VALUE_WIDTH: {\n      return { inputValueWidth: payload };\n    }\n    case TokenActions.SET_INPUT_VALUE_HEIGHT: {\n      return { inputValueHeight: payload };\n    }\n    case TokenActions.UPDATE_QUERY: {\n      return { inputValue: payload };\n    }\n    case TokenActions.SET_FOCUS_IN: {\n      return { inFocus: true };\n    }\n    case TokenActions.SET_PREVENT_BLUR: {\n      return { preventBlur: payload };\n    }\n    case TokenActions.SET_AUTOCOMPLETE_ITEMS: {\n      return { autocompleteItems: payload };\n    }\n    case TokenActions.SET_ACTIVE_TOKENS: {\n      return { activeTokens: payload };\n    }\n    case TokenActions.BLUR: {\n      return {\n        inFocus: false,\n        preventBlur: false,\n        autocompleteItems: undefined,\n        activeTokens: [],\n      };\n    }\n    case TokenActions.REMOVE_ALL_ACTIVE_TOKENS: {\n      return { activeTokens: [] };\n    }\n    case TokenActions.CLEAR_INPUT: {\n      return { inputValue: '', autocompleteItems: undefined };\n    }\n    case TokenActions.SET_LOADING: {\n      return {\n        loading: payload,\n      };\n    }\n    case TokenActions.RESET: {\n      return DefaultState;\n    }\n    case TokenActions.SET_EDITING_TOKEN_INDEX: {\n      return { editingTokenIndex: payload };\n    }\n    case TokenActions.REMOVE_EDITING_TOKEN_INDEX: {\n      return { editingTokenIndex: -1 };\n    }\n    case TokenActions.SET_TEMPORARY_QUERY: {\n      return { reservedInputValue: payload };\n    }\n    case TokenActions.REMOVE_TEMPORARY_QUERY: {\n      return { reservedInputValue: undefined };\n    }\n    default:\n      return state;\n  }\n}\n"]}

package/cjs/components/TokenInput/index.js

@@ -1 +1 @@
-"use strict";exports.__esModule = true;var _TokenInput = require("./TokenInput");Object.keys(_TokenInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;exports[key] = _TokenInput[key];});
+"use strict";exports.__esModule = true;var _TokenInput = require("./TokenInput");Object.keys(_TokenInput).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _TokenInput[key]) return;exports[key] = _TokenInput[key];});

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

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './TokenInput';\r\n"]}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './TokenInput';\n"]}

package/cjs/components/TokenInput/locale/index.js

@@ -4,7 +4,7 @@ var _en = require("./locales/en");
 var _ru = require("./locales/ru");
 
 
-var _types = require("./types");Object.keys(_types).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;exports[key] = _types[key];});
+var _types = require("./types");Object.keys(_types).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;if (key in exports && exports[key] === _types[key]) return;exports[key] = _types[key];});
 
 var TokenInputLocaleHelper = new _LocaleHelper.LocaleHelper({
   ru_RU: _ru.componentsLocales,

package/cjs/components/TokenInput/locale/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":["TokenInputLocaleHelper","LocaleHelper","ru_RU","en_GB"],"mappings":"mIAAA;;AAEA;AACA;;;AAGA;;AAEO,IAAMA,sBAAsB,GAAG,IAAIC,0BAAJ,CAAmC;AACvEC,EAAAA,KAAK,EAALA,qBADuE;AAEvEC,EAAAA,KAAK,EAALA,qBAFuE,EAAnC,CAA/B,C","sourcesContent":["import { LocaleHelper } from '../../../lib/locale/LocaleHelper';\r\n\r\nimport  { componentsLocales as en_GB } from './locales/en';\r\nimport  { componentsLocales as ru_RU } from './locales/ru';\r\nimport { TokenInputLocale } from './types';\r\n\r\nexport * from './types';\r\n\r\nexport const TokenInputLocaleHelper = new LocaleHelper<TokenInputLocale>({\r\n  ru_RU,\r\n  en_GB,\r\n});\r\n"]}
+{"version":3,"sources":["index.ts"],"names":["TokenInputLocaleHelper","LocaleHelper","ru_RU","en_GB"],"mappings":"mIAAA;;AAEA;AACA;;;AAGA;;AAEO,IAAMA,sBAAsB,GAAG,IAAIC,0BAAJ,CAAmC;AACvEC,EAAAA,KAAK,EAALA,qBADuE;AAEvEC,EAAAA,KAAK,EAALA,qBAFuE,EAAnC,CAA/B,C","sourcesContent":["import { LocaleHelper } from '../../../lib/locale/LocaleHelper';\n\nimport { componentsLocales as en_GB } from './locales/en';\nimport { componentsLocales as ru_RU } from './locales/ru';\nimport { TokenInputLocale } from './types';\n\nexport * from './types';\n\nexport const TokenInputLocaleHelper = new LocaleHelper<TokenInputLocale>({\n  ru_RU,\n  en_GB,\n});\n"]}

package/cjs/components/TokenInput/locale/locales/en.js

@@ -1,5 +1,5 @@
 "use strict";exports.__esModule = true;exports.componentsLocales = void 0;
 
 var componentsLocales = {
-  addButtonComment: 'Press Enter or type comma',
+  addButtonComment: 'Type comma or space',
   addButtonTitle: 'Add' };exports.componentsLocales = componentsLocales;

package/cjs/components/TokenInput/locale/locales/en.js.map

@@ -1 +1 @@
-{"version":3,"sources":["en.ts"],"names":["componentsLocales","addButtonComment","addButtonTitle"],"mappings":";;AAEO,IAAMA,iBAAmC,GAAG;AACjDC,EAAAA,gBAAgB,EAAE,2BAD+B;AAEjDC,EAAAA,cAAc,EAAE,KAFiC,EAA5C,C","sourcesContent":["import { TokenInputLocale } from '../types';\r\n\r\nexport const componentsLocales: TokenInputLocale = {\r\n  addButtonComment: 'Press Enter or type comma',\r\n  addButtonTitle: 'Add',\r\n};\r\n"]}
+{"version":3,"sources":["en.ts"],"names":["componentsLocales","addButtonComment","addButtonTitle"],"mappings":";;AAEO,IAAMA,iBAAmC,GAAG;AACjDC,EAAAA,gBAAgB,EAAE,qBAD+B;AAEjDC,EAAAA,cAAc,EAAE,KAFiC,EAA5C,C","sourcesContent":["import { TokenInputLocale } from '../types';\n\nexport const componentsLocales: TokenInputLocale = {\n  addButtonComment: 'Type comma or space',\n  addButtonTitle: 'Add',\n};\n"]}

package/cjs/components/TokenInput/locale/locales/ru.js

@@ -1,5 +1,5 @@
 "use strict";exports.__esModule = true;exports.componentsLocales = void 0;
 
 var componentsLocales = {
-  addButtonComment: 'Нажмите Enter или поставьте запятую',
+  addButtonComment: 'Нажмите запятую или пробел',
   addButtonTitle: 'Добавить' };exports.componentsLocales = componentsLocales;

package/cjs/components/TokenInput/locale/locales/ru.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ru.ts"],"names":["componentsLocales","addButtonComment","addButtonTitle"],"mappings":";;AAEO,IAAMA,iBAAmC,GAAG;AACjDC,EAAAA,gBAAgB,EAAE,qCAD+B;AAEjDC,EAAAA,cAAc,EAAE,UAFiC,EAA5C,C","sourcesContent":["import { TokenInputLocale } from '../types';\r\n\r\nexport const componentsLocales: TokenInputLocale = {\r\n  addButtonComment: 'Нажмите Enter или поставьте запятую',\r\n  addButtonTitle: 'Добавить',\r\n};\r\n"]}
+{"version":3,"sources":["ru.ts"],"names":["componentsLocales","addButtonComment","addButtonTitle"],"mappings":";;AAEO,IAAMA,iBAAmC,GAAG;AACjDC,EAAAA,gBAAgB,EAAE,4BAD+B;AAEjDC,EAAAA,cAAc,EAAE,UAFiC,EAA5C,C","sourcesContent":["import { TokenInputLocale } from '../types';\n\nexport const componentsLocales: TokenInputLocale = {\n  addButtonComment: 'Нажмите запятую или пробел',\n  addButtonTitle: 'Добавить',\n};\n"]}

package/cjs/components/TokenInput/locale/types.js

@@ -1 +1 @@
-"use strict";
+"use strict";exports.__esModule = true;