@skbkontur/react-ui 5.6.1-9a162.0 → 6.0.0-alpha.0

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

@@ -1,54 +1,57 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
-import { css, memoizeStyle } from "../../../lib/theming/Emotion";
+import { memoizeGetStyles } from "../../../lib/theming/Emotion";
 import { labelSizeMixin, inputSizeMixin } from "../TokenInput.mixins";
-export var styles = memoizeStyle({
-  label: function label(t) {
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      background-color: ", ";\n      box-shadow: ", ";\n      border: ", " solid ", ";\n      border-top-color: ", ";\n      transition: border-color ", " ", ";\n      box-sizing: border-box;\n      cursor: text;\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.transitionDuration, t.transitionTimingFunction, t.tokenInputBorderRadius);
-  },
-  labelSmall: function labelSmall(t) {
-    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), labelSizeMixin(t.tokenInputPaddingYSmall, t.tokenInputPaddingXSmall));
-  },
-  labelMedium: function labelMedium(t) {
-    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), labelSizeMixin(t.tokenInputPaddingYMedium, t.tokenInputPaddingXMedium));
-  },
-  labelLarge: function labelLarge(t) {
-    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), labelSizeMixin(t.tokenInputPaddingYLarge, t.tokenInputPaddingXLarge));
-  },
-  hovering: function hovering(t) {
-    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      &:hover {\n        border-color: ", ";\n      }\n    "])), t.tokenInputBorderColorHover);
-  },
-  warning: function warning(t) {
-    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])), t.tokenInputBorderWidth, t.tokenInputBorderColorWarning, t.tokenInputOutlineWidth, t.tokenInputBorderColorWarning);
-  },
-  error: function error(t) {
-    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])), t.tokenInputBorderWidth, t.tokenInputBorderColorError, t.tokenInputOutlineWidth, t.tokenInputBorderColorError);
-  },
-  labelFocused: function labelFocused(t) {
-    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])), t.tokenInputBorderWidth, t.tokenInputBorderColorFocus, t.tokenInputOutlineWidth, t.tokenInputBorderColorFocus);
-  },
-  labelDisabled: function labelDisabled(t) {
-    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\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 css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      background: transparent;\n      border: none;\n      box-shadow: none;\n      outline: none;\n      font-family: inherit;\n      overflow: hidden;\n      resize: none;\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      padding: 0;\n      margin: 0;\n      flex: 1 1 100%;\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    "])), t.tokenInputTextColor, t.tokenInputPlaceholderColor, t.tokenInputPlaceholderColor, t.tokenInputPlaceholderColorDisabled, t.tokenInputPlaceholderColorDisabled, t.tokenInputPlaceholderColorLight, t.tokenInputPlaceholderColorLight);
-  },
-  inputSmall: function inputSmall(t) {
-    return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), inputSizeMixin(t.tokenFontSizeSmall, t.tokenInputLineHeightSmall));
-  },
-  inputMedium: function inputMedium(t) {
-    return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), inputSizeMixin(t.tokenFontSizeMedium, t.tokenInputLineHeightMedium));
-  },
-  inputLarge: function inputLarge(t) {
-    return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), inputSizeMixin(t.tokenFontSizeLarge, t.tokenInputLineHeightLarge));
-  },
-  inputDisabled: function inputDisabled(t) {
-    return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      pointer-events: none;\n      /* fix text color in safari */\n      -webkit-text-fill-color: currentcolor;\n      color: ", ";\n    "])), t.tokenInputTextColorDisabled);
-  },
-  inputPlaceholderWrapper: function inputPlaceholderWrapper() {
-    return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n      flex: 1 1 100%;\n    "])));
-  },
-  reservedInput: function reservedInput(t) {
-    return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n      min-width: 2px;\n      color: ", ";\n      word-break: break-all;\n    "])), t.tokenInputTextColorDisabled);
-  }
+export var getStyles = memoizeGetStyles(function (_ref) {
+  var css = _ref.css;
+  return {
+    label: function label(t) {
+      return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      background-color: ", ";\n      box-shadow: ", ";\n      border: ", " solid ", ";\n      border-top-color: ", ";\n      transition: border-color ", " ", ";\n      box-sizing: border-box;\n      cursor: text;\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.transitionDuration, t.transitionTimingFunction, t.tokenInputBorderRadius);
+    },
+    labelSmall: function labelSmall(t) {
+      return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), labelSizeMixin(t.tokenInputPaddingYSmall, t.tokenInputPaddingXSmall));
+    },
+    labelMedium: function labelMedium(t) {
+      return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), labelSizeMixin(t.tokenInputPaddingYMedium, t.tokenInputPaddingXMedium));
+    },
+    labelLarge: function labelLarge(t) {
+      return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), labelSizeMixin(t.tokenInputPaddingYLarge, t.tokenInputPaddingXLarge));
+    },
+    hovering: function hovering(t) {
+      return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      &:hover {\n        border-color: ", ";\n      }\n    "])), t.tokenInputBorderColorHover);
+    },
+    warning: function warning(t) {
+      return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])), t.tokenInputBorderWidth, t.tokenInputBorderColorWarning, t.tokenInputOutlineWidth, t.tokenInputBorderColorWarning);
+    },
+    error: function error(t) {
+      return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])), t.tokenInputBorderWidth, t.tokenInputBorderColorError, t.tokenInputOutlineWidth, t.tokenInputBorderColorError);
+    },
+    labelFocused: function labelFocused(t) {
+      return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])), t.tokenInputBorderWidth, t.tokenInputBorderColorFocus, t.tokenInputOutlineWidth, t.tokenInputBorderColorFocus);
+    },
+    labelDisabled: function labelDisabled(t) {
+      return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\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 css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      background: transparent;\n      border: none;\n      box-shadow: none;\n      outline: none;\n      font-family: inherit;\n      overflow: hidden;\n      resize: none;\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      padding: 0;\n      margin: 0;\n      flex: 1 1 100%;\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    "])), t.tokenInputTextColor, t.tokenInputPlaceholderColor, t.tokenInputPlaceholderColor, t.tokenInputPlaceholderColorDisabled, t.tokenInputPlaceholderColorDisabled, t.tokenInputPlaceholderColorLight, t.tokenInputPlaceholderColorLight);
+    },
+    inputSmall: function inputSmall(t) {
+      return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), inputSizeMixin(t.tokenFontSizeSmall, t.tokenInputLineHeightSmall));
+    },
+    inputMedium: function inputMedium(t) {
+      return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), inputSizeMixin(t.tokenFontSizeMedium, t.tokenInputLineHeightMedium));
+    },
+    inputLarge: function inputLarge(t) {
+      return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), inputSizeMixin(t.tokenFontSizeLarge, t.tokenInputLineHeightLarge));
+    },
+    inputDisabled: function inputDisabled(t) {
+      return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      pointer-events: none;\n      /* fix text color in safari */\n      -webkit-text-fill-color: currentcolor;\n      color: ", ";\n    "])), t.tokenInputTextColorDisabled);
+    },
+    inputPlaceholderWrapper: function inputPlaceholderWrapper() {
+      return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n      flex: 1 1 100%;\n    "])));
+    },
+    reservedInput: function reservedInput(t) {
+      return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n      min-width: 2px;\n      color: ", ";\n      word-break: break-all;\n    "])), t.tokenInputTextColorDisabled);
+    }
+  };
 });

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

@@ -1 +1 @@
-{"version":3,"names":["css","memoizeStyle","labelSizeMixin","inputSizeMixin","styles","label","t","_templateObject","_taggedTemplateLiteralLoose","tokenInputBg","tokenInputShadow","tokenInputBorderWidth","tokenInputBorderColor","tokenInputBorderTopColor","transitionDuration","transitionTimingFunction","tokenInputBorderRadius","labelSmall","_templateObject2","tokenInputPaddingYSmall","tokenInputPaddingXSmall","labelMedium","_templateObject3","tokenInputPaddingYMedium","tokenInputPaddingXMedium","labelLarge","_templateObject4","tokenInputPaddingYLarge","tokenInputPaddingXLarge","hovering","_templateObject5","tokenInputBorderColorHover","warning","_templateObject6","tokenInputBorderColorWarning","tokenInputOutlineWidth","error","_templateObject7","tokenInputBorderColorError","labelFocused","_templateObject8","tokenInputBorderColorFocus","labelDisabled","_templateObject9","tokenInputDisabledBg","inputDisabledBackgroundClip","tokenInputDisabledBorderColor","input","_templateObject10","tokenInputTextColor","tokenInputPlaceholderColor","tokenInputPlaceholderColorDisabled","tokenInputPlaceholderColorLight","inputSmall","_templateObject11","tokenFontSizeSmall","tokenInputLineHeightSmall","inputMedium","_templateObject12","tokenFontSizeMedium","tokenInputLineHeightMedium","inputLarge","_templateObject13","tokenFontSizeLarge","tokenInputLineHeightLarge","inputDisabled","_templateObject14","tokenInputTextColorDisabled","inputPlaceholderWrapper","_templateObject15","reservedInput","_templateObject16"],"sources":["TokenInput.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\n\nimport { labelSizeMixin, inputSizeMixin } from './TokenInput.mixins';\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      transition: border-color ${t.transitionDuration} ${t.transitionTimingFunction};\n      box-sizing: border-box;\n      cursor: text;\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  labelSmall(t: Theme) {\n    return css`\n      ${labelSizeMixin(t.tokenInputPaddingYSmall, t.tokenInputPaddingXSmall)}\n    `;\n  },\n  labelMedium(t: Theme) {\n    return css`\n      ${labelSizeMixin(t.tokenInputPaddingYMedium, t.tokenInputPaddingXMedium)}\n    `;\n  },\n  labelLarge(t: Theme) {\n    return css`\n      ${labelSizeMixin(t.tokenInputPaddingYLarge, t.tokenInputPaddingXLarge)}\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      background: transparent;\n      border: none;\n      box-shadow: none;\n      outline: none;\n      font-family: inherit;\n      overflow: hidden;\n      resize: none;\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      padding: 0;\n      margin: 0;\n      flex: 1 1 100%;\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  inputSmall(t: Theme) {\n    return css`\n      ${inputSizeMixin(t.tokenFontSizeSmall, t.tokenInputLineHeightSmall)};\n    `;\n  },\n  inputMedium(t: Theme) {\n    return css`\n      ${inputSizeMixin(t.tokenFontSizeMedium, t.tokenInputLineHeightMedium)};\n    `;\n  },\n  inputLarge(t: Theme) {\n    return css`\n      ${inputSizeMixin(t.tokenFontSizeLarge, t.tokenInputLineHeightLarge)};\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  inputPlaceholderWrapper() {\n    return css`\n      flex: 1 1 100%;\n    `;\n  },\n\n  reservedInput(t: Theme) {\n    return css`\n      min-width: 2px;\n      color: ${t.tokenInputTextColorDisabled};\n      word-break: break-all;\n    `;\n  },\n});\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["memoizeGetStyles","labelSizeMixin","inputSizeMixin","getStyles","_ref","css","label","t","_templateObject","_taggedTemplateLiteralLoose","tokenInputBg","tokenInputShadow","tokenInputBorderWidth","tokenInputBorderColor","tokenInputBorderTopColor","transitionDuration","transitionTimingFunction","tokenInputBorderRadius","labelSmall","_templateObject2","tokenInputPaddingYSmall","tokenInputPaddingXSmall","labelMedium","_templateObject3","tokenInputPaddingYMedium","tokenInputPaddingXMedium","labelLarge","_templateObject4","tokenInputPaddingYLarge","tokenInputPaddingXLarge","hovering","_templateObject5","tokenInputBorderColorHover","warning","_templateObject6","tokenInputBorderColorWarning","tokenInputOutlineWidth","error","_templateObject7","tokenInputBorderColorError","labelFocused","_templateObject8","tokenInputBorderColorFocus","labelDisabled","_templateObject9","tokenInputDisabledBg","inputDisabledBackgroundClip","tokenInputDisabledBorderColor","input","_templateObject10","tokenInputTextColor","tokenInputPlaceholderColor","tokenInputPlaceholderColorDisabled","tokenInputPlaceholderColorLight","inputSmall","_templateObject11","tokenFontSizeSmall","tokenInputLineHeightSmall","inputMedium","_templateObject12","tokenFontSizeMedium","tokenInputLineHeightMedium","inputLarge","_templateObject13","tokenFontSizeLarge","tokenInputLineHeightLarge","inputDisabled","_templateObject14","tokenInputTextColorDisabled","inputPlaceholderWrapper","_templateObject15","reservedInput","_templateObject16"],"sources":["TokenInput.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/types/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\n\nimport { labelSizeMixin, inputSizeMixin } from './TokenInput.mixins';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\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      transition: border-color ${t.transitionDuration} ${t.transitionTimingFunction};\n      box-sizing: border-box;\n      cursor: text;\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  labelSmall(t: Theme) {\n    return css`\n      ${labelSizeMixin(t.tokenInputPaddingYSmall, t.tokenInputPaddingXSmall)}\n    `;\n  },\n  labelMedium(t: Theme) {\n    return css`\n      ${labelSizeMixin(t.tokenInputPaddingYMedium, t.tokenInputPaddingXMedium)}\n    `;\n  },\n  labelLarge(t: Theme) {\n    return css`\n      ${labelSizeMixin(t.tokenInputPaddingYLarge, t.tokenInputPaddingXLarge)}\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      background: transparent;\n      border: none;\n      box-shadow: none;\n      outline: none;\n      font-family: inherit;\n      overflow: hidden;\n      resize: none;\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      padding: 0;\n      margin: 0;\n      flex: 1 1 100%;\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  inputSmall(t: Theme) {\n    return css`\n      ${inputSizeMixin(t.tokenFontSizeSmall, t.tokenInputLineHeightSmall)};\n    `;\n  },\n  inputMedium(t: Theme) {\n    return css`\n      ${inputSizeMixin(t.tokenFontSizeMedium, t.tokenInputLineHeightMedium)};\n    `;\n  },\n  inputLarge(t: Theme) {\n    return css`\n      ${inputSizeMixin(t.tokenFontSizeLarge, t.tokenInputLineHeightLarge)};\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  inputPlaceholderWrapper() {\n    return css`\n      flex: 1 1 100%;\n    `;\n  },\n\n  reservedInput(t: Theme) {\n    return css`\n      min-width: 2px;\n      color: ${t.tokenInputTextColorDisabled};\n      word-break: break-all;\n    `;\n  },\n}));\n"],"mappings":"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","ignoreList":[]}

package/components/TokenInput/TokenInput.styles.d.ts

@@ -1,5 +1,5 @@
 import type { Theme } from '../../lib/theming/Theme';
-export declare const styles: {
+export declare const getStyles: import("../../lib/theming/Emotion").StylesGetter<{
     label(t: Theme): string;
     labelSmall(t: Theme): string;
     labelMedium(t: Theme): string;
@@ -16,4 +16,4 @@ export declare const styles: {
     inputDisabled(t: Theme): string;
     inputPlaceholderWrapper(): string;
     reservedInput(t: Theme): string;
-};
+}>;

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

@@ -1 +1 @@
-{"version":3,"names":["React","ThemeFactory","Popup","ComboBoxMenu","ThemeContext","TokenInputDataTids","TokenInputMenu","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","state","menu","getMenuRef","handleMenuPositionChange","_","isFullyVisible","forceMenuLeftAlign","props","menuAlign","setState","getPopupMargin","paddingY","parseInt","theme","tokenInputPaddingYSmall","outlineWidth","controlOutlineWidth","marginY","tokenMarginYSmall","menuRef","node","_inheritsLoose","_proto","prototype","render","_this2","createElement","Consumer","Provider","value","create","popupMargin","popupBackground","tokenInputMenuPopupBg","renderMain","getPopupMarginSize","t","size","tokenInputPopupMarginLarge","tokenInputPopupMarginMedium","tokenInputPopupMarginSmall","_this$props","loading","maxMenuHeight","renderTotalCount","totalCount","opened","items","renderNotFound","renderItem","onValueChange","renderAddButton","anchorElementForCursor","anchorElementRoot","menuWidth","id","popupMenuId","tokenInputMenu","positions","anchorElement","popupOffset","tokenInputPopupOffset","margin","hasShadow","width","withoutMobile","onPositionChange","hasMargin","refMenu","Component","__KONTUR_REACT_UI__","displayName"],"sources":["TokenInputMenu.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { HTMLProps } from '../../typings/html';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport type { PopupPositionsType, PopupProps } from '../../internal/Popup';\nimport { Popup } from '../../internal/Popup';\nimport type { ComboBoxMenuProps } from '../../internal/CustomComboBox';\nimport { ComboBoxMenu } from '../../internal/CustomComboBox';\nimport type { Menu } from '../../internal/Menu';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport type { TokenSize } from '../Token';\n\nimport type { TokenInputMenuAlign, TokenInputProps } from './TokenInput';\nimport { TokenInputDataTids } from './TokenInput';\n\nexport interface TokenInputMenuProps<T> extends ComboBoxMenuProps<T> {\n  /** html-элемент от которого будет позиционировано Menu в случае menuAlign cursor */\n  anchorElementForCursor: PopupProps['anchorElement'];\n  /** html-элемент от которого будет позиционировано Menu в случае menuAlign left */\n  anchorElementRoot: PopupProps['anchorElement'];\n  /** Задает ширину выпадающего меню. */\n  menuWidth: TokenInputProps<string>['menuWidth'];\n  /** Задает выравнивание выпадающего меню. */\n  menuAlign: TokenInputMenuAlign;\n  /** Задает id выпадающему меню.\n   Полезно при реализации a11y. Например, помогает связать aria-controls с выпадающим меню. */\n  popupMenuId?: HTMLProps['id'];\n  /** Задает размер контрола. */\n  size?: TokenSize;\n}\n\ninterface TokenInputMenuState {\n  forceMenuLeftAlign?: boolean;\n}\n\nexport class TokenInputMenu<T = string> extends React.Component<TokenInputMenuProps<T>, TokenInputMenuState> {\n  public static __KONTUR_REACT_UI__ = 'TokenInputMenu';\n  public static displayName = 'TokenInputMenu';\n\n  public state: TokenInputMenuState = {};\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 getPopupMarginSize(t: Theme) {\n    switch (this.props.size) {\n      case 'large':\n        return t.tokenInputPopupMarginLarge;\n      case 'medium':\n        return t.tokenInputPopupMarginMedium;\n      case 'small':\n      default:\n        return t.tokenInputPopupMarginSmall;\n    }\n  }\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      anchorElementForCursor,\n      anchorElementRoot,\n      menuWidth,\n    } = this.props;\n\n    const menuAlign = this.state.forceMenuLeftAlign ? 'left' : this.props.menuAlign;\n\n    return (\n      <Popup\n        id={this.props.popupMenuId}\n        data-tid={TokenInputDataTids.tokenInputMenu}\n        opened={!!opened}\n        positions={\n          menuAlign === 'cursor'\n            ? ['bottom left', 'top left']\n            : ['bottom left', 'top left', 'bottom right', 'top right']\n        }\n        anchorElement={menuAlign === 'cursor' ? anchorElementForCursor : anchorElementRoot}\n        popupOffset={\n          menuAlign === 'left'\n            ? parseInt(this.theme.tokenInputPopupOffset)\n            : 8 + parseInt(this.theme.tokenInputPopupOffset)\n        }\n        margin={menuAlign === 'left' ? 1 : parseInt(this.getPopupMarginSize(this.theme))}\n        hasShadow\n        width={menuAlign === 'cursor' ? 'auto' : menuWidth}\n        withoutMobile\n        onPositionChange={this.handleMenuPositionChange}\n      >\n        <ComboBoxMenu\n          size={this.props.size}\n          items={items}\n          loading={loading}\n          hasMargin={false}\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 handleMenuPositionChange = (_: PopupPositionsType, isFullyVisible: boolean) => {\n    if (!this.state.forceMenuLeftAlign && !isFullyVisible && this.props.menuAlign === 'cursor') {\n      this.setState({ forceMenuLeftAlign: true });\n    }\n  };\n\n  private getPopupMargin = (): number => {\n    const paddingY = parseInt(this.theme.tokenInputPaddingYSmall, 10) || 0;\n    const outlineWidth = parseInt(this.theme.controlOutlineWidth, 10) || 0;\n    const marginY = parseInt(this.theme.tokenMarginYSmall, 10) || 0;\n\n    return paddingY + outlineWidth + marginY;\n  };\n\n  private menuRef = (node: any) => (this.menu = node);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","ThemeFactory","Popup","ComboBoxMenu","ThemeContext","TokenInputDataTids","TokenInputMenu","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","state","menu","getMenuRef","handleMenuPositionChange","_","isFullyVisible","forceMenuLeftAlign","props","menuAlign","setState","getPopupMargin","paddingY","parseInt","theme","tokenInputPaddingYSmall","outlineWidth","controlOutlineWidth","marginY","tokenMarginYSmall","menuRef","node","_inheritsLoose","_proto","prototype","render","_this2","createElement","Consumer","Provider","value","create","popupMargin","popupBackground","tokenInputMenuPopupBg","renderMain","getPopupMarginSize","t","size","tokenInputPopupMarginLarge","tokenInputPopupMarginMedium","tokenInputPopupMarginSmall","_this$props","loading","maxMenuHeight","renderTotalCount","totalCount","opened","items","renderNotFound","renderItem","onValueChange","renderAddButton","anchorElementForCursor","anchorElementRoot","menuWidth","id","popupMenuId","tokenInputMenu","positions","anchorElement","popupOffset","tokenInputPopupOffset","margin","hasShadow","width","withoutMobile","onPositionChange","hasMargin","refMenu","Component","__KONTUR_REACT_UI__","displayName"],"sources":["TokenInputMenu.tsx"],"sourcesContent":["import React from 'react';\n\nimport type { HTMLProps } from '../../typings/html';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport type { PopupPositionsType, PopupProps } from '../../internal/Popup';\nimport { Popup } from '../../internal/Popup';\nimport type { ComboBoxMenuProps } from '../../internal/CustomComboBox';\nimport { ComboBoxMenu } from '../../internal/CustomComboBox';\nimport type { Menu } from '../../internal/Menu';\nimport type { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport type { TokenSize } from '../Token';\n\nimport type { TokenInputMenuAlign, TokenInputProps } from './TokenInput';\nimport { TokenInputDataTids } from './TokenInput';\n\nexport interface TokenInputMenuProps<T> extends ComboBoxMenuProps<T> {\n  /** html-элемент от которого будет позиционировано Menu в случае menuAlign cursor */\n  anchorElementForCursor: PopupProps['anchorElement'];\n  /** html-элемент от которого будет позиционировано Menu в случае menuAlign left */\n  anchorElementRoot: PopupProps['anchorElement'];\n  /** Задает ширину выпадающего меню. */\n  menuWidth: TokenInputProps<string>['menuWidth'];\n  /** Задает выравнивание выпадающего меню. */\n  menuAlign: TokenInputMenuAlign;\n  /** Задает id выпадающему меню.\n   Полезно при реализации a11y. Например, помогает связать aria-controls с выпадающим меню. */\n  popupMenuId?: HTMLProps['id'];\n  /** Задает размер контрола. */\n  size?: TokenSize;\n}\n\ninterface TokenInputMenuState {\n  forceMenuLeftAlign?: boolean;\n}\n\nexport class TokenInputMenu<T = string> extends React.Component<TokenInputMenuProps<T>, TokenInputMenuState> {\n  public static __KONTUR_REACT_UI__ = 'TokenInputMenu';\n  public static displayName = 'TokenInputMenu';\n\n  public state: TokenInputMenuState = {};\n\n  private theme!: Theme;\n\n  private menu: Menu | null = null;\n\n  public render(): React.JSX.Element {\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 getPopupMarginSize(t: Theme) {\n    switch (this.props.size) {\n      case 'large':\n        return t.tokenInputPopupMarginLarge;\n      case 'medium':\n        return t.tokenInputPopupMarginMedium;\n      case 'small':\n      default:\n        return t.tokenInputPopupMarginSmall;\n    }\n  }\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      anchorElementForCursor,\n      anchorElementRoot,\n      menuWidth,\n    } = this.props;\n\n    const menuAlign = this.state.forceMenuLeftAlign ? 'left' : this.props.menuAlign;\n\n    return (\n      <Popup\n        id={this.props.popupMenuId}\n        data-tid={TokenInputDataTids.tokenInputMenu}\n        opened={!!opened}\n        positions={\n          menuAlign === 'cursor'\n            ? ['bottom left', 'top left']\n            : ['bottom left', 'top left', 'bottom right', 'top right']\n        }\n        anchorElement={menuAlign === 'cursor' ? anchorElementForCursor : anchorElementRoot}\n        popupOffset={\n          menuAlign === 'left'\n            ? parseInt(this.theme.tokenInputPopupOffset)\n            : 8 + parseInt(this.theme.tokenInputPopupOffset)\n        }\n        margin={menuAlign === 'left' ? 1 : parseInt(this.getPopupMarginSize(this.theme))}\n        hasShadow\n        width={menuAlign === 'cursor' ? 'auto' : menuWidth}\n        withoutMobile\n        onPositionChange={this.handleMenuPositionChange}\n      >\n        <ComboBoxMenu\n          size={this.props.size}\n          items={items}\n          loading={loading}\n          hasMargin={false}\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 handleMenuPositionChange = (_: PopupPositionsType, isFullyVisible: boolean) => {\n    if (!this.state.forceMenuLeftAlign && !isFullyVisible && this.props.menuAlign === 'cursor') {\n      this.setState({ forceMenuLeftAlign: true });\n    }\n  };\n\n  private getPopupMargin = (): number => {\n    const paddingY = parseInt(this.theme.tokenInputPaddingYSmall, 10) || 0;\n    const outlineWidth = parseInt(this.theme.controlOutlineWidth, 10) || 0;\n    const marginY = parseInt(this.theme.tokenMarginYSmall, 10) || 0;\n\n    return paddingY + outlineWidth + marginY;\n  };\n\n  private menuRef = (node: any) => (this.menu = node);\n}\n"],"mappings":"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","ignoreList":[]}

package/components/Tooltip/Tooltip/Tooltip.js

@@ -3,7 +3,6 @@ import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 var _class, _Tooltip;
 import React from 'react';
 import warning from 'warning';
-import { globalObject } from '@skbkontur/global-object';
 import { isNullable } from "../../../lib/utils";
 import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
 import { Popup } from "../../../internal/Popup";
@@ -16,11 +15,9 @@ import { rootNode } from "../../../lib/rootNode";
 import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { CloseButtonIcon } from "../../../internal/CloseButtonIcon/CloseButtonIcon";
 import { isInstanceOf } from "../../../lib/isInstanceOf";
-import { getFullReactUIFlagsContext, ReactUIFeatureFlagsContext } from "../../../lib/featureFlagsContext";
-import { cx } from "../../../lib/theming/Emotion";
-import { isThemeGTE } from "../../../lib/theming/ThemeHelpers";
 import { withSize } from "../../../lib/size/SizeDecorator";
-import { styles } from "../Tooltip.styles";
+import { withRenderEnvironment } from "../../../lib/renderEnvironment";
+import { getStyles } from "../Tooltip.styles";
 var DEFAULT_DELAY = 100;
 export var TooltipDataTids = {
   root: 'Tooltip__root',
@@ -35,8 +32,7 @@ var DefaultPositions = ['right bottom', 'right middle', 'right top', 'top right'
  * Открывается по клику, фокусом на элемент или по наведению. В отличие от `Hint`, `Tooltip` может содержать
  * изображения, кнопки, ссылки и прочие интерактивные элементы.
  */
-
-export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__*/function (_React$PureComponent) {
+export var Tooltip = withRenderEnvironment(_class = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__*/function (_React$PureComponent) {
   function Tooltip() {
     var _this;
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
@@ -59,7 +55,7 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
       return /*#__PURE__*/(
         React.createElement("div", {
           ref: _this.refContent,
-          className: cx(styles.tooltipContent(_this.theme), _this.sizeVariables.contentStyle),
+          className: _this.cx(_this.styles.tooltipContent(_this.theme), _this.sizeVariables.contentStyle),
           "data-tid": TooltipDataTids.content
         }, content, _this.renderCloseButton())
       );
@@ -92,7 +88,7 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
         return;
       }
       _this.clearHoverTimeout();
-      _this.hoverTimeout = globalObject.setTimeout(_this.open, _this.getProps().delayBeforeShow);
+      _this.hoverTimeout = setTimeout(_this.open, _this.getProps().delayBeforeShow);
     };
     _this.handleMouseLeave = function (event) {
       var trigger = _this.getProps().trigger;
@@ -103,7 +99,7 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
       if (trigger === 'hoverAnchor') {
         _this.close();
       } else {
-        _this.hoverTimeout = globalObject.setTimeout(_this.close, Tooltip.delay);
+        _this.hoverTimeout = setTimeout(_this.close, Tooltip.delay);
       }
     };
     _this.handleClick = function () {
@@ -154,8 +150,8 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
       switch (_this.size) {
         case 'small':
           return {
-            closeButtonStyle: styles.closeButtonSmall(_this.theme),
-            contentStyle: styles.tooltipContentSmall(_this.theme),
+            closeButtonStyle: _this.styles.closeButtonSmall(_this.theme),
+            contentStyle: _this.styles.tooltipContentSmall(_this.theme),
             borderRadius: _this.theme.tooltipBorderRadiusSmall,
             pinSize: _this.theme.tooltipPinSizeSmall,
             pinOffsetX: _this.theme.tooltipPinOffsetXSmall,
@@ -164,8 +160,8 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
           };
         case 'medium':
           return {
-            closeButtonStyle: styles.closeButtonMedium(_this.theme),
-            contentStyle: styles.tooltipContentMedium(_this.theme),
+            closeButtonStyle: _this.styles.closeButtonMedium(_this.theme),
+            contentStyle: _this.styles.tooltipContentMedium(_this.theme),
             borderRadius: _this.theme.tooltipBorderRadiusMedium,
             pinSize: _this.theme.tooltipPinSizeMedium,
             pinOffsetX: _this.theme.tooltipPinOffsetXMedium,
@@ -174,8 +170,8 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
           };
         case 'large':
           return {
-            closeButtonStyle: styles.closeButtonLarge(_this.theme),
-            contentStyle: styles.tooltipContentLarge(_this.theme),
+            closeButtonStyle: _this.styles.closeButtonLarge(_this.theme),
+            contentStyle: _this.styles.tooltipContentLarge(_this.theme),
             borderRadius: _this.theme.tooltipBorderRadiusLarge,
             pinSize: _this.theme.tooltipPinSizeLarge,
             pinOffsetX: _this.theme.tooltipPinOffsetXLarge,
@@ -183,10 +179,10 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
             margin: _this.theme.tooltipMarginLarge
           };
         default:
-          console.error("Can't get size variables: invalid value in size prop '" + _this.size + "'. Returning default");
+          warning(false, "Can't get size variables: invalid value in size prop '" + _this.props.size + "'. Returning default");
           return {
-            closeButtonStyle: styles.closeButtonSmall(_this.theme),
-            contentStyle: styles.tooltipContentSmall(_this.theme),
+            closeButtonStyle: _this.styles.closeButtonSmall(_this.theme),
+            contentStyle: _this.styles.tooltipContentSmall(_this.theme),
             borderRadius: _this.theme.tooltipBorderRadiusSmall,
             pinSize: _this.theme.tooltipPinSizeSmall,
             pinOffsetX: _this.theme.tooltipPinOffsetXSmall,
@@ -221,23 +217,21 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
   };
   _proto.render = function render() {
     var _this2 = this;
-    return /*#__PURE__*/React.createElement(ReactUIFeatureFlagsContext.Consumer, null, function (flags) {
-      _this2.featureFlags = getFullReactUIFlagsContext(flags);
-      return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
-        _this2.theme = theme;
-        _this2.sizeVariables = _this2.getSizeVariables();
-        return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
-          value: ThemeFactory.create({
-            popupBackground: theme.tooltipBg,
-            popupBorder: theme.tooltipBorder,
-            popupBorderRadius: _this2.sizeVariables.borderRadius,
-            popupPinSize: _this2.sizeVariables.pinSize,
-            popupPinOffsetX: _this2.sizeVariables.pinOffsetX,
-            popupPinOffsetY: _this2.sizeVariables.pinOffsetY,
-            popupMargin: _this2.sizeVariables.margin
-          }, theme)
-        }, _this2.renderMain());
-      });
+    this.styles = getStyles(this.emotion);
+    return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
+      _this2.theme = theme;
+      _this2.sizeVariables = _this2.getSizeVariables();
+      return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
+        value: ThemeFactory.create({
+          popupBackground: theme.tooltipBg,
+          popupBorder: theme.tooltipBorder,
+          popupBorderRadius: _this2.sizeVariables.borderRadius,
+          popupPinSize: _this2.sizeVariables.pinSize,
+          popupPinOffsetX: _this2.sizeVariables.pinOffsetX,
+          popupPinOffsetY: _this2.sizeVariables.pinOffsetY,
+          popupMargin: _this2.sizeVariables.margin
+        }, theme)
+      }, _this2.renderMain());
     });
   };
   _proto.renderCloseButton = function renderCloseButton() {
@@ -252,7 +246,7 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
       colorHover: this.theme.tooltipCloseBtnHoverColor
     });
     return /*#__PURE__*/React.createElement("div", {
-      className: cx(styles.closeButton(this.theme), this.sizeVariables.closeButtonStyle),
+      className: this.cx(this.styles.closeButton(this.theme), this.sizeVariables.closeButtonStyle),
       onClick: this.handleCloseButtonClick,
       "data-tid": TooltipDataTids.crossIcon
     }, icon);
@@ -267,7 +261,7 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
     }
     var trigger = this.getProps().trigger;
     if (trigger === 'opened' || trigger === 'closed') {
-      warning(true, "Function 'show' is not supported with trigger specified '" + trigger + "'");
+      warning(false, "Function 'show' is not supported with trigger specified '" + trigger + "'");
       return;
     }
     this.open();
@@ -279,7 +273,7 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
   _proto.hide = function hide() {
     var trigger = this.getProps().trigger;
     if (trigger === 'opened' || trigger === 'closed') {
-      warning(true, "Function 'hide' is not supported with trigger specified '" + trigger + "'");
+      warning(false, "Function 'hide' is not supported with trigger specified '" + trigger + "'");
       return;
     }
     this.close();
@@ -313,7 +307,7 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
       maxWidth: "none",
       opened: this.state.opened,
       disableAnimations: disableAnimations,
-      positions: isThemeGTE(this.theme, '5.4') ? this.getPositions() : this.props.allowedPositions,
+      positions: this.getPositions(),
       pos: this.props.pos,
       ignoreHover: trigger === 'hoverAnchor',
       onOpen: this.props.onOpen,
@@ -327,6 +321,13 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
     var props = this.props;
     var useWrapper = !!props.children && this.getProps().useWrapper;
     var trigger = this.getProps().trigger;
+    var defaultPopupAndLayerProps = {
+      popupProps: {
+        onMouseEnter: this.handleMouseEnter,
+        onMouseLeave: this.handleMouseLeave,
+        useWrapper: useWrapper
+      }
+    };
     switch (trigger) {
       case 'opened':
         return {
@@ -346,15 +347,6 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
             useWrapper: useWrapper
           }
         };
-      case 'hoverAnchor':
-      case 'hover':
-        return {
-          popupProps: {
-            onMouseEnter: this.handleMouseEnter,
-            onMouseLeave: this.handleMouseLeave,
-            useWrapper: useWrapper
-          }
-        };
       case 'manual':
         return {
           popupProps: {
@@ -394,18 +386,22 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
             useWrapper: useWrapper
           }
         };
+      case 'hoverAnchor':
+      case 'hover':
+        return defaultPopupAndLayerProps;
       default:
-        throw new Error('Unknown trigger specified: ' + trigger);
+        warning(false, "Unknown trigger specified: " + trigger + ". Returning default value.");
+        return defaultPopupAndLayerProps;
     }
   };
   _proto.clearHoverTimeout = function clearHoverTimeout() {
     if (this.hoverTimeout) {
-      globalObject.clearTimeout(this.hoverTimeout);
+      clearTimeout(this.hoverTimeout);
       this.hoverTimeout = null;
     }
   };
   _proto.isClickOutsideContent = function isClickOutsideContent(event) {
-    if (this.contentElement && isInstanceOf(event.target, globalObject.Element)) {
+    if (this.contentElement && isInstanceOf(event.target, this.globalObject.Element)) {
       return !containsTargetOrRenderContainer(event.target)(this.contentElement);
     }
     return true;
@@ -416,4 +412,4 @@ export var Tooltip = rootNode(_class = withSize(_class = (_Tooltip = /*#__PURE__
   disableAnimations: isTestEnv,
   useWrapper: false,
   delayBeforeShow: DEFAULT_DELAY
-}, _Tooltip.delay = DEFAULT_DELAY, _Tooltip.triggersWithoutCloseButton = ['hover', 'hoverAnchor', 'focus', 'hover&focus'], _Tooltip)) || _class) || _class;
+}, _Tooltip.delay = DEFAULT_DELAY, _Tooltip.triggersWithoutCloseButton = ['hover', 'hoverAnchor', 'focus', 'hover&focus'], _Tooltip)) || _class) || _class) || _class;