@skbkontur/react-ui 0.0.0-0fe669bb2d → 0.0.0-0ffbe8b468

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

@@ -1,6 +1,7 @@
 import { Theme } from '../../lib/theming/Theme';
 export declare const styles: {
     label(t: Theme): string;
+    hovering(t: Theme): string;
     warning(t: Theme): string;
     error(t: Theme): string;
     labelFocused(t: Theme): string;

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

@@ -1,4 +1,4 @@
-"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;
+"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 mixins = {
@@ -20,11 +20,12 @@ var mixins = {
 
 var styles = (0, _Emotion.memoizeStyle)({
   label: function label(t) {
-    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    "])),
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\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      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.transitionDuration, t.transitionTimingFunction,
 
 
     t.tokenInputPaddingY, t.tokenInputPaddingX,
@@ -37,30 +38,39 @@ var styles = (0, _Emotion.memoizeStyle)({
 
   },
 
+  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)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])),
+    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)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])),
+    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)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", " solid ", ";\n      box-shadow: 0 0 0 ", " ", ";\n    "])),
+    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)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      border-color: ", ";\n      box-shadow: none;\n      cursor: default;\n    "])),
+    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);
 
 
@@ -68,7 +78,7 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   input: function input(t) {
-    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (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    "])),
+    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    "])),
 
 
 
@@ -117,7 +127,7 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   helperContainer: function helperContainer(t) {
-    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: flex;\n      position: absolute;\n      top: 0;\n      left: 0;\n      right: 0;\n      padding: ", " ", ";\n      visibility: hidden;\n    "])),
+    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    "])),
 
 
 
@@ -129,7 +139,7 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   helperText: function helperText(t) {
-    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (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    "])),
+    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    "])),
 
 
 
@@ -142,7 +152,7 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   helperTextEditing: function helperTextEditing(t) {
-    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n\n      font-size: ", ";\n      padding-bottom: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n\n      font-size: ", ";\n      padding-bottom: ", ";\n    "])),
     mixins.inputAndHelperCommonEditingStyles(t),
 
     t.tokenFontSize,
@@ -151,7 +161,7 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   inputDisabled: function inputDisabled(t) {
-    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      pointer-events: none;\n      /* fix text color in safari */\n      -webkit-text-fill-color: currentcolor;\n      color: ", ";\n    "])),
+    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    "])),
 
 
 
@@ -160,13 +170,13 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   inputEditing: function inputEditing(t) {
-    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n    "])),
     mixins.inputAndHelperCommonEditingStyles(t));
 
   },
 
   reservedInput: function reservedInput(t) {
-    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (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    "])),
+    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,

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

@@ -1 +1 @@
-{"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","warning","tokenInputBorderColorWarning","tokenInputOutlineWidth","error","tokenInputBorderColorError","labelFocused","tokenInputBorderColorFocus","labelDisabled","tokenInputDisabledBg","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  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      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"]}
+{"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","transitionDuration","transitionTimingFunction","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      transition: border-color ${t.transitionDuration} ${t.transitionTimingFunction};\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,4 +1,5 @@
 import React from 'react';
+import { HTMLProps } from '../../typings/html';
 import { PopupProps } from '../../internal/Popup';
 import { ComboBoxMenuProps } from '../../internal/CustomComboBox';
 import { TokenInputMenuAlign, TokenInputProps } from './TokenInput';
@@ -6,6 +7,12 @@ export interface TokenInputMenuProps<T> extends ComboBoxMenuProps<T> {
     anchorElement: PopupProps['anchorElement'];
     menuWidth: TokenInputProps<string>['menuWidth'];
     menuAlign: TokenInputMenuAlign;
+    /**
+     * Позволяет задать `id` выпадающему меню.
+     *
+     * Это может пригодиться при реализации a11y. Например, для того, чтобы связать `aria-controls` с выпадающим меню.
+     */
+    popupMenuId?: HTMLProps['id'];
 }
 export declare class TokenInputMenu<T = string> extends React.Component<TokenInputMenuProps<T>> {
     static __KONTUR_REACT_UI__: string;

package/cjs/components/TokenInput/TokenInputMenu.js

@@ -1,5 +1,6 @@
 "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");
@@ -15,6 +16,12 @@ var _TokenInput = require("./TokenInput");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.
 
 
@@ -42,6 +49,7 @@ TokenInputMenu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.d
 
 
 
+
 
 
     getMenuRef = function () {return _this.menu;};_this.
@@ -90,13 +98,15 @@ 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;
       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 /*#__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' }, 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';
+    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, { id: this.props.popupMenuId, "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","menu","getMenuRef","getPopupMargin","paddingY","parseInt","theme","tokenInputPaddingY","outlineWidth","controlOutlineWidth","marginY","tokenMarginY","menuRef","node","render","ThemeFactory","create","popupMargin","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;;;;;;;;;;;;;;;;;;;;;;;;AAwBrBC,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;AACA,aAAOP,QAAQ,GAAGI,YAAX,GAA0BE,OAAjC;AACD,K;;AAEOE,IAAAA,O,GAAU,UAACC,IAAD,UAAgB,MAAKZ,IAAL,GAAYY,IAA5B,E,4DA7EXC,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,EADK,EAILG,KAJK,CADT,IAQG,MAAI,CAACY,UAAL,EARH,CADF,CAYD,CAfH,CADF,CAmBD,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,KAAKZ,OANhB,EAOE,gBAAgB,EAAEU,gBAPpB,EAQE,UAAU,EAAEK,UARd,EASE,cAAc,EAAED,cATlB,EAUE,UAAU,EAAEH,UAVd,EAWE,eAAe,EAAEM,eAXnB,GAXF,CADF,CA2BD,C,yBA3E6CO,eAAMC,S,0CAAzCrC,c,CACGsC,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                },\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    return paddingY + outlineWidth + marginY;\n  };\n\n  private menuRef = (node: any) => (this.menu = node);\n}\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","popupMenuId","TokenInputDataTids","tokenInputMenu","undefined","React","Component","__KONTUR_REACT_UI__"],"mappings":"0PAAA;;;AAGA;AACA;AACA;;;AAGA;;AAEA,0C;;;;;;;;;;;;;;AAcaA,c;;;;;AAKHC,IAAAA,I,GAAoB,I;;;;;;;;;;;;;;;;;;;;;;;;;AAyBrBC,IAAAA,U,GAAa,oBAAkB,MAAKD,IAAvB,E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDZE,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,4DAhFXC,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,EAAE,EAAE,KAAKb,KAAL,CAAWc,WADjB,EAEE,YAAUC,+BAAmBC,cAF/B,EAGE,MAAM,EAAE,CAAC,CAACX,MAHZ,EAIE,SAAS,EAAE,CAAC,aAAD,EAAgB,UAAhB,CAJb,EAKE,aAAa,EAAEM,aALjB,EAME,WAAW,EAAEE,SAAS,KAAK,MAAd,GAAuB,CAAvB,GAA2B,CAN1C,EAOE,MAAM,EAAEA,SAAS,KAAK,MAAd,GAAuB,CAAvB,GAA2BI,SAPrC,EAQE,SAAS,MARX,EASE,KAAK,EAAEJ,SAAS,KAAK,QAAd,GAAyB,MAAzB,GAAkCD,SAT3C,EAUE,aAAa,MAVf,iBAYE,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,GAZF,CADF,CA4BD,C,yBA7E6CQ,eAAMC,S,0CAAzCxC,c,CACGyC,mB,GAAsB,gB","sourcesContent":["import React from 'react';\n\nimport { HTMLProps } from '../../typings/html';\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   * Позволяет задать `id` выпадающему меню.\n   *\n   * Это может пригодиться при реализации a11y. Например, для того, чтобы связать `aria-controls` с выпадающим меню.\n   */\n  popupMenuId?: HTMLProps['id'];\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        id={this.props.popupMenuId}\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/Tooltip/Tooltip.d.ts

@@ -105,11 +105,11 @@ export interface TooltipState {
 export declare const TooltipDataTids: {
     readonly root: "Tooltip__root";
     readonly content: "Tooltip__content";
+    readonly crossIcon: "Tooltip__crossIcon";
 };
 declare type DefaultProps = Required<Pick<TooltipProps, 'pos' | 'trigger' | 'allowedPositions' | 'disableAnimations' | 'useWrapper'>>;
 export declare class Tooltip extends React.PureComponent<TooltipProps, TooltipState> implements InstanceWithAnchorElement {
     static __KONTUR_REACT_UI__: string;
-    private isMobileLayout;
     static propTypes: {
         children(props: TooltipProps, propName: keyof TooltipProps, componentName: string): void;
     };
@@ -145,7 +145,6 @@ export declare class Tooltip extends React.PureComponent<TooltipProps, TooltipSt
     hide(): void;
     private renderMain;
     private renderPopup;
-    private mobileCloseHandler;
     private refContent;
     private getPositions;
     private getPopupAndLayerProps;

package/cjs/components/Tooltip/Tooltip.js

@@ -14,10 +14,11 @@ var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _currentEnvironment = require("../../lib/currentEnvironment");
 var _CommonWrapper = require("../../internal/CommonWrapper");
-var _decorator = require("../ResponsiveLayout/decorator");
 var _rootNode = require("../../lib/rootNode");
 
 var _createPropsGetter = require("../../lib/createPropsGetter");
+var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
+var _CloseButtonIcon = require("../../internal/CloseButtonIcon/CloseButtonIcon");
 
 var _Tooltip = require("./Tooltip.styles");var _class, _class2, _temp;
 
@@ -138,7 +139,8 @@ var _Tooltip = require("./Tooltip.styles");var _class, _class2, _temp;
 
 var TooltipDataTids = {
   root: 'Tooltip__root',
-  content: 'Tooltip__content' };exports.TooltipDataTids = TooltipDataTids;
+  content: 'Tooltip__content',
+  crossIcon: 'Tooltip__crossIcon' };exports.TooltipDataTids = TooltipDataTids;
 
 
 var Positions = [
@@ -161,10 +163,7 @@ var Positions = [
 
 
 
-
-Tooltip = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsLoose2.default)(Tooltip, _React$PureComponent);function Tooltip() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this;_this.
-
-
+Tooltip = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$PureComponent) {(0, _inheritsLoose2.default)(Tooltip, _React$PureComponent);function Tooltip() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this;_this.
 
 
 
@@ -246,6 +245,7 @@ Tooltip = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_cla
 
 
 
+
 
 
     renderContent = function () {
@@ -279,9 +279,6 @@ Tooltip = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_cla
 
 
 
-    getAnchorElement = function () {var _this$popupRef$curren;
-      return (_this$popupRef$curren = _this.popupRef.current) == null ? void 0 : _this$popupRef$curren.anchorElement;
-    };_this.
 
 
 
@@ -297,6 +294,18 @@ Tooltip = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_cla
 
 
 
+    getAnchorElement = function () {var _this$popupRef$curren;
+      return (_this$popupRef$curren = _this.popupRef.current) == null ? void 0 : _this$popupRef$curren.anchorElement;
+    };_this.
+
+
+
+
+
+
+
+
+
 
 
 
@@ -363,14 +372,7 @@ Tooltip = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_cla
 
 
 
-    mobileCloseHandler = function () {
-      var trigger = _this.getProps().trigger;
-      if (trigger === 'manual' || trigger === 'closed' || trigger === 'opened') {
-        return;
-      }
 
-      _this.close();
-    };_this.
 
     refContent = function (node) {
       _this.contentElement = node;
@@ -498,9 +500,6 @@ Tooltip = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_cla
     };_this.
 
     handleMouseLeave = function (event) {
-      if (_this.isMobileLayout) {
-        return;
-      }
       var trigger = _this.getProps().trigger;
       if (
       trigger === 'hover&focus' && _this.state.focused ||
@@ -575,7 +574,7 @@ Tooltip = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_cla
       }
 
       _this.close();
-    };return _this;}var _proto = Tooltip.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$getProps = this.getProps(),trigger = _this$getProps.trigger,allowedPositions = _this$getProps.allowedPositions,pos = _this$getProps.pos;if (trigger === 'closed' && this.state.opened) {this.close();}var posChanged = prevProps.pos !== pos;var allowedChanged = !(0, _lodash.default)(prevProps.allowedPositions, allowedPositions);if (posChanged || allowedChanged) {this.positions = null;}};_proto.componentWillUnmount = function componentWillUnmount() {this.clearHoverTimeout();};_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({ popupPinOffset: theme.tooltipPinOffset, popupMargin: theme.tooltipMargin, popupBorder: theme.tooltipBorder, popupBorderRadius: theme.tooltipBorderRadius, popupPinSize: theme.tooltipPinSize, popupPinOffsetX: theme.tooltipPinOffsetX, popupPinOffsetY: theme.tooltipPinOffsetY }, theme) }, _this2.renderMain());});};_proto.renderCloseButton = function renderCloseButton() {var hasCross = this.props.closeButton === undefined ? !Tooltip.triggersWithoutCloseButton.includes(this.getProps().trigger) : this.props.closeButton;if (!hasCross || this.isMobileLayout) {return null;}return /*#__PURE__*/_react.default.createElement("div", { className: _Tooltip.styles.cross(this.theme), onClick: this.handleCloseButtonClick }, /*#__PURE__*/_react.default.createElement(_CrossIcon.CrossIcon, null));}; /**
+    };return _this;}var _proto = Tooltip.prototype;_proto.componentDidUpdate = function componentDidUpdate(prevProps) {var _this$getProps = this.getProps(),trigger = _this$getProps.trigger,allowedPositions = _this$getProps.allowedPositions,pos = _this$getProps.pos;if (trigger === 'closed' && this.state.opened) {this.close();}var posChanged = prevProps.pos !== pos;var allowedChanged = !(0, _lodash.default)(prevProps.allowedPositions, allowedPositions);if (posChanged || allowedChanged) {this.positions = null;}};_proto.componentWillUnmount = function componentWillUnmount() {this.clearHoverTimeout();};_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({ popupPinOffset: theme.tooltipPinOffset, popupMargin: theme.tooltipMargin, popupBorder: theme.tooltipBorder, popupBorderRadius: theme.tooltipBorderRadius, popupPinSize: theme.tooltipPinSize, popupPinOffsetX: theme.tooltipPinOffsetX, popupPinOffsetY: theme.tooltipPinOffsetY, popupBackground: theme.tooltipBg }, theme) }, _this2.renderMain());});};_proto.renderCloseButton = function renderCloseButton() {var hasCross = this.props.closeButton === undefined ? !Tooltip.triggersWithoutCloseButton.includes(this.getProps().trigger) : this.props.closeButton;if (!hasCross) {return null;}var icon = (0, _ThemeHelpers.isTheme2022)(this.theme) ? /*#__PURE__*/_react.default.createElement(_CloseButtonIcon.CloseButtonIcon, { tabbable: false, side: parseInt(this.theme.tooltipCloseBtnSide), color: this.theme.tooltipCloseBtnColor, colorHover: this.theme.tooltipCloseBtnHoverColor }) : /*#__PURE__*/_react.default.createElement(_CrossIcon.CrossIcon, null);return /*#__PURE__*/_react.default.createElement("div", { className: _Tooltip.styles.cross(this.theme), onClick: this.handleCloseButtonClick, "data-tid": TooltipDataTids.crossIcon }, icon);}; /**
    * Программно открывает тултип.
    * <p>Не действует если проп *trigger* `'opened'` или `'closed'`.</p>
    * @public
@@ -583,4 +582,4 @@ Tooltip = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_cla
    * Программно закрывает тултип.
    * <p>Не действует если проп *trigger* `'opened'` или `'closed'`.</p>
    * @public
-   */;_proto.hide = function hide() {var trigger = this.getProps().trigger;if (trigger === 'opened' || trigger === 'closed') {(0, _warning.default)(true, "Function 'hide' is not supported with trigger specified '" + trigger + "'");return;}this.close();};_proto.renderMain = function renderMain() {var props = this.props;var content = this.renderContent();var _this$getPopupAndLaye = this.getPopupAndLayerProps(),popupProps = _this$getPopupAndLaye.popupProps,_this$getPopupAndLaye2 = _this$getPopupAndLaye.layerProps,layerProps = _this$getPopupAndLaye2 === void 0 ? { active: false } : _this$getPopupAndLaye2;var anchorElement = props.children || props.anchorElement;var popup = this.renderPopup(anchorElement, popupProps, content);if (this.isMobileLayout) {return popup;}return /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, (0, _extends2.default)({}, layerProps, { getAnchorElement: this.getAnchorElement }), popup);};_proto.renderPopup = function renderPopup(anchorElement, popupProps, content) {var _this$getProps2 = this.getProps(),disableAnimations = _this$getProps2.disableAnimations,trigger = _this$getProps2.trigger;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_Popup.Popup, (0, _extends2.default)({ "data-tid": TooltipDataTids.root, anchorElement: anchorElement, hasPin: true, hasShadow: true, maxWidth: "none", opened: this.state.opened, disableAnimations: disableAnimations, positions: this.getPositions(), ignoreHover: trigger === 'hoverAnchor', onOpen: this.props.onOpen, onClose: this.props.onClose, mobileOnCloseRequest: this.mobileCloseHandler, tryPreserveFirstRenderedPosition: true, ref: this.popupRef }, popupProps), content));};_proto.getPositions = function getPositions() {if (!this.positions) {var _this$getProps3 = this.getProps(),allowedPositions = _this$getProps3.allowedPositions,pos = _this$getProps3.pos;var index = allowedPositions.indexOf(pos);if (index === -1) {throw new Error('Unexpected position passed to Tooltip. Expected one of: ' + allowedPositions.join(', '));}this.positions = [].concat(allowedPositions.slice(index), allowedPositions.slice(0, index));}return this.positions;};_proto.getPopupAndLayerProps = function getPopupAndLayerProps() {var props = this.props;var useWrapper = !!props.children && this.getProps().useWrapper;var trigger = this.getProps().trigger;switch (trigger) {case 'opened':return { layerProps: { active: true, onClickOutside: this.handleClickOutsideAnchor }, popupProps: { opened: true, useWrapper: useWrapper } };case 'closed':return { popupProps: { opened: false, useWrapper: useWrapper } };case 'hoverAnchor':case 'hover':return { popupProps: { onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, useWrapper: useWrapper } };case 'manual':return { popupProps: { useWrapper: useWrapper } };case 'click':return { layerProps: { active: this.state.opened, onClickOutside: this.handleClickOutsideAnchor }, popupProps: { onClick: this.handleClick, useWrapper: useWrapper } };case 'focus':return { popupProps: { onFocus: this.handleFocus, onBlur: this.handleBlur, useWrapper: useWrapper } };case 'hover&focus':return { layerProps: { active: this.state.opened, onClickOutside: this.handleClickOutsideAnchor }, popupProps: { onFocus: this.handleFocus, onBlur: this.handleBlur, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, useWrapper: useWrapper } };default:throw new Error('Unknown trigger specified: ' + trigger);}};_proto.clearHoverTimeout = function clearHoverTimeout() {if (this.hoverTimeout) {clearTimeout(this.hoverTimeout);this.hoverTimeout = null;}};_proto.isClickOutsideContent = function isClickOutsideContent(event) {if (this.contentElement && event.target instanceof Element) {return !(0, _listenFocusOutside.containsTargetOrRenderContainer)(event.target)(this.contentElement);}return true;};return Tooltip;}(_react.default.PureComponent), _class2.__KONTUR_REACT_UI__ = 'Tooltip', _class2.propTypes = { children: function children(props, propName, componentName) {var children = props[propName];(0, _warning.default)(children || props.anchorElement, "[" + componentName + "]: you must provide either 'children' or 'anchorElement' prop for " + componentName + " to work properly");(0, _warning.default)(!(Array.isArray(children) && props.useWrapper === false), "[" + componentName + "]: you provided multiple children, but useWrapper={false} - forcing wrapper <span/> for positioning to work correctly");} }, _class2.defaultProps = { pos: _Popup.DefaultPosition, trigger: 'hover', allowedPositions: Positions, disableAnimations: _currentEnvironment.isTestEnv, useWrapper: false }, _class2.delay = 100, _class2.triggersWithoutCloseButton = ['hover', 'hoverAnchor', 'focus', 'hover&focus'], _temp)) || _class) || _class;exports.Tooltip = Tooltip;
+   */;_proto.hide = function hide() {var trigger = this.getProps().trigger;if (trigger === 'opened' || trigger === 'closed') {(0, _warning.default)(true, "Function 'hide' is not supported with trigger specified '" + trigger + "'");return;}this.close();};_proto.renderMain = function renderMain() {var props = this.props;var content = this.renderContent();var _this$getPopupAndLaye = this.getPopupAndLayerProps(),popupProps = _this$getPopupAndLaye.popupProps,_this$getPopupAndLaye2 = _this$getPopupAndLaye.layerProps,layerProps = _this$getPopupAndLaye2 === void 0 ? { active: false } : _this$getPopupAndLaye2;var anchorElement = props.children || props.anchorElement;var popup = this.renderPopup(anchorElement, popupProps, content);return /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, (0, _extends2.default)({}, layerProps, { getAnchorElement: this.getAnchorElement }), popup);};_proto.renderPopup = function renderPopup(anchorElement, popupProps, content) {var _this$getProps2 = this.getProps(),disableAnimations = _this$getProps2.disableAnimations,trigger = _this$getProps2.trigger;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_Popup.Popup, (0, _extends2.default)({ "data-tid": TooltipDataTids.root, anchorElement: anchorElement, hasPin: true, hasShadow: true, maxWidth: "none", opened: this.state.opened, disableAnimations: disableAnimations, positions: this.getPositions(), ignoreHover: trigger === 'hoverAnchor', onOpen: this.props.onOpen, onClose: this.props.onClose, tryPreserveFirstRenderedPosition: true, ref: this.popupRef, withoutMobile: true }, popupProps), content));};_proto.getPositions = function getPositions() {if (!this.positions) {var _this$getProps3 = this.getProps(),allowedPositions = _this$getProps3.allowedPositions,pos = _this$getProps3.pos;var index = allowedPositions.indexOf(pos);if (index === -1) {throw new Error('Unexpected position passed to Tooltip. Expected one of: ' + allowedPositions.join(', '));}this.positions = [].concat(allowedPositions.slice(index), allowedPositions.slice(0, index));}return this.positions;};_proto.getPopupAndLayerProps = function getPopupAndLayerProps() {var props = this.props;var useWrapper = !!props.children && this.getProps().useWrapper;var trigger = this.getProps().trigger;switch (trigger) {case 'opened':return { layerProps: { active: true, onClickOutside: this.handleClickOutsideAnchor }, popupProps: { opened: true, useWrapper: useWrapper } };case 'closed':return { popupProps: { opened: false, useWrapper: useWrapper } };case 'hoverAnchor':case 'hover':return { popupProps: { onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, useWrapper: useWrapper } };case 'manual':return { popupProps: { useWrapper: useWrapper } };case 'click':return { layerProps: { active: this.state.opened, onClickOutside: this.handleClickOutsideAnchor }, popupProps: { onClick: this.handleClick, useWrapper: useWrapper } };case 'focus':return { popupProps: { onFocus: this.handleFocus, onBlur: this.handleBlur, useWrapper: useWrapper } };case 'hover&focus':return { layerProps: { active: this.state.opened, onClickOutside: this.handleClickOutsideAnchor }, popupProps: { onFocus: this.handleFocus, onBlur: this.handleBlur, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, useWrapper: useWrapper } };default:throw new Error('Unknown trigger specified: ' + trigger);}};_proto.clearHoverTimeout = function clearHoverTimeout() {if (this.hoverTimeout) {clearTimeout(this.hoverTimeout);this.hoverTimeout = null;}};_proto.isClickOutsideContent = function isClickOutsideContent(event) {if (this.contentElement && event.target instanceof Element) {return !(0, _listenFocusOutside.containsTargetOrRenderContainer)(event.target)(this.contentElement);}return true;};return Tooltip;}(_react.default.PureComponent), _class2.__KONTUR_REACT_UI__ = 'Tooltip', _class2.propTypes = { children: function children(props, propName, componentName) {var children = props[propName];(0, _warning.default)(children || props.anchorElement, "[" + componentName + "]: you must provide either 'children' or 'anchorElement' prop for " + componentName + " to work properly");(0, _warning.default)(!(Array.isArray(children) && props.useWrapper === false), "[" + componentName + "]: you provided multiple children, but useWrapper={false} - forcing wrapper <span/> for positioning to work correctly");} }, _class2.defaultProps = { pos: _Popup.DefaultPosition, trigger: 'hover', allowedPositions: Positions, disableAnimations: _currentEnvironment.isTestEnv, useWrapper: false }, _class2.delay = 100, _class2.triggersWithoutCloseButton = ['hover', 'hoverAnchor', 'focus', 'hover&focus'], _temp)) || _class;exports.Tooltip = Tooltip;

package/cjs/components/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Tooltip.tsx"],"names":["TooltipDataTids","root","content","Positions","Tooltip","rootNode","responsiveLayout","getProps","defaultProps","state","opened","focused","hoverTimeout","contentElement","positions","clickedOutside","popupRef","React","createRef","renderContent","props","render","refContent","styles","tooltipContent","theme","renderCloseButton","getAnchorElement","current","anchorElement","mobileCloseHandler","trigger","close","node","open","setState","handleMouseEnter","event","isHoverAnchor","target","clearHoverTimeout","window","setTimeout","delay","handleMouseLeave","isMobileLayout","relatedTarget","handleClick","handleClickOutsideAnchor","isClickOutsideContent","onCloseRequest","handleFocus","handleBlur","handleCloseButtonClick","stopPropagation","onCloseClick","defaultPrevented","componentDidUpdate","prevProps","allowedPositions","pos","posChanged","allowedChanged","componentWillUnmount","ThemeFactory","create","popupPinOffset","tooltipPinOffset","popupMargin","tooltipMargin","popupBorder","tooltipBorder","popupBorderRadius","tooltipBorderRadius","popupPinSize","tooltipPinSize","popupPinOffsetX","tooltipPinOffsetX","popupPinOffsetY","tooltipPinOffsetY","renderMain","hasCross","closeButton","undefined","triggersWithoutCloseButton","includes","cross","show","hide","getPopupAndLayerProps","popupProps","layerProps","active","children","popup","renderPopup","disableAnimations","setRootNode","getPositions","onOpen","onClose","index","indexOf","Error","join","slice","useWrapper","onClickOutside","onMouseEnter","onMouseLeave","onClick","onFocus","onBlur","clearTimeout","Element","PureComponent","__KONTUR_REACT_UI__","propTypes","propName","componentName","Array","isArray","DefaultPosition","isTestEnv"],"mappings":"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","sourcesContent":["import React from 'react';\nimport warning from 'warning';\nimport isEqual from 'lodash.isequal';\n\nimport { isNullable } from '../../lib/utils';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { DefaultPosition, Popup, PopupProps, PopupPositionsType } from '../../internal/Popup';\nimport { RenderLayer, RenderLayerProps } from '../../internal/RenderLayer';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { Nullable } from '../../typings/utility-types';\nimport { MouseEventType } from '../../typings/event-types';\nimport { containsTargetOrRenderContainer } from '../../lib/listenFocusOutside';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { InstanceWithAnchorElement } from '../../lib/InstanceWithAnchorElement';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles } from './Tooltip.styles';\n\nexport type TooltipTrigger =\n  /** Наведение на children и на тултип */\n  | 'hover'\n  /** Клик на children */\n  | 'click'\n  /** Фокус на children */\n  | 'focus'\n  /** Наведение на children и на тултип и фокус на children */\n  | 'hover&focus'\n  /** Просто открыт */\n  | 'opened'\n  /** Просто закрыт */\n  | 'closed'\n  /** Наведение ТОЛЬКО на children, а не на тултип */\n  | 'hoverAnchor'\n  /** Управление через публичные функции show и hide */\n  | 'manual';\n\nexport interface TooltipProps extends CommonProps {\n  /**\n   * Относительно какого элемента позиционировать тултип\n   */\n  anchorElement?: HTMLElement;\n\n  /**\n   * Если не указан `anchorElement` то тултип будет позиционироваться\n   * относительно дочерних элементов\n   */\n  children?: React.ReactNode;\n\n  className?: string;\n\n  /**\n   * Показывать крестик для закрытия тултипа. По-умолчанию крестик\n   * показывается если проп *trigger* не `hover` и не `focus`.\n   */\n  closeButton?: boolean;\n\n  /**\n   * Функция, которая возвращает содержимое тултипа.\n   *\n   * Если эта функция вернула `null`, то тултип не показывается.\n   */\n  render?: Nullable<() => React.ReactNode>;\n\n  /**\n   * Значение по умолчанию: `\"top left\"`.\n   */\n  pos?: PopupPositionsType;\n\n  /**\n   * Триггер открытия тултипа\n   * ```ts\n   * type TooltipTrigger =\n   * | 'hover'\n   * | 'click'\n   * | 'focus'\n   * | 'hover&focus'\n   * | 'opened'\n   * | 'closed'\n   * | 'hoverAnchor'\n   * | 'manual';\n   * ```\n   */\n  trigger?: TooltipTrigger;\n\n  /**\n   * Хэндлер, вызываемый при клике по крестику\n   */\n  onCloseClick?: React.MouseEventHandler<HTMLElement>;\n\n  /**\n   * Хэндлер, вызываемый при клике по крестику или\n   * снаружи тултипа\n   */\n  onCloseRequest?: (event?: Event | React.MouseEvent) => void;\n\n  /**\n   * Хэндлер, вызываемый при закрытии тултипа\n   */\n  onClose?: () => void;\n\n  /**\n   * Хэндлер, вызываемый при открытии тултипа\n   */\n  onOpen?: () => void;\n\n  /**\n   * Список позиций, которые тултип будет занимать.\n   * Если положение тултипа в определенной позиции\n   * будет выходить за край экрана, то будет выбрана\n   * следующая позиция. Обязательно должен включать\n   * позицию указанную в `pos`\n   */\n  allowedPositions?: PopupPositionsType[];\n\n  /**\n   * Флаг отключения анимации.\n   * @default false\n   */\n  disableAnimations?: boolean;\n\n  /**\n   * Явно указывает, что вложенные элементы должны быть обёрнуты в `<span/>`. <br/> Используется для корректного позиционирования тултипа при двух и более вложенных элементах.\n   *\n   * _Примечание_: при **двух и более** вложенных элементах обёртка будет добавлена автоматически.\n   */\n  useWrapper?: boolean;\n}\n\nexport interface TooltipState {\n  opened: boolean;\n  focused: boolean;\n}\n\nexport const TooltipDataTids = {\n  root: 'Tooltip__root',\n  content: 'Tooltip__content',\n} as const;\n\nconst Positions: PopupPositionsType[] = [\n  'right bottom',\n  'right middle',\n  'right top',\n  'top right',\n  'top center',\n  'top left',\n  'left top',\n  'left middle',\n  'left bottom',\n  'bottom left',\n  'bottom center',\n  'bottom right',\n];\n\ntype DefaultProps = Required<\n  Pick<TooltipProps, 'pos' | 'trigger' | 'allowedPositions' | 'disableAnimations' | 'useWrapper'>\n>;\n\n@rootNode\n@responsiveLayout\nexport class Tooltip extends React.PureComponent<TooltipProps, TooltipState> implements InstanceWithAnchorElement {\n  public static __KONTUR_REACT_UI__ = 'Tooltip';\n\n  private isMobileLayout!: boolean;\n\n  public static propTypes = {\n    children(props: TooltipProps, propName: keyof TooltipProps, componentName: string) {\n      const children = props[propName];\n      warning(\n        children || props.anchorElement,\n        `[${componentName}]: you must provide either 'children' or 'anchorElement' prop for ${componentName} to work properly`,\n      );\n      warning(\n        !(Array.isArray(children) && props.useWrapper === false),\n        `[${componentName}]: you provided multiple children, but useWrapper={false} - forcing wrapper <span/> for positioning to work correctly`,\n      );\n    },\n  };\n\n  public static defaultProps: DefaultProps = {\n    pos: DefaultPosition,\n    trigger: 'hover',\n    allowedPositions: Positions,\n    disableAnimations: isTestEnv,\n    useWrapper: false,\n  };\n\n  private getProps = createPropsGetter(Tooltip.defaultProps);\n\n  public static delay = 100;\n  private static triggersWithoutCloseButton: TooltipTrigger[] = ['hover', 'hoverAnchor', 'focus', 'hover&focus'];\n\n  public state: TooltipState = { opened: false, focused: false };\n  private theme!: Theme;\n  private hoverTimeout: Nullable<number> = null;\n  private contentElement: Nullable<HTMLElement> = null;\n  private positions: Nullable<PopupPositionsType[]> = null;\n  private clickedOutside = true;\n  private setRootNode!: TSetRootNode;\n\n  private popupRef = React.createRef<Popup>();\n  public componentDidUpdate(prevProps: TooltipProps) {\n    const { trigger, allowedPositions, pos } = this.getProps();\n    if (trigger === 'closed' && this.state.opened) {\n      this.close();\n    }\n    const posChanged = prevProps.pos !== pos;\n    const allowedChanged = !isEqual(prevProps.allowedPositions, allowedPositions);\n\n    if (posChanged || allowedChanged) {\n      this.positions = null;\n    }\n  }\n\n  public componentWillUnmount() {\n    this.clearHoverTimeout();\n  }\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                  popupPinOffset: theme.tooltipPinOffset,\n                  popupMargin: theme.tooltipMargin,\n                  popupBorder: theme.tooltipBorder,\n                  popupBorderRadius: theme.tooltipBorderRadius,\n                  popupPinSize: theme.tooltipPinSize,\n                  popupPinOffsetX: theme.tooltipPinOffsetX,\n                  popupPinOffsetY: theme.tooltipPinOffsetY,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderContent = () => {\n    const content = this.props.render ? this.props.render() : null;\n    if (isNullable(content)) {\n      return null;\n    }\n\n    return (\n      <div ref={this.refContent} className={styles.tooltipContent(this.theme)} data-tid={TooltipDataTids.content}>\n        {content}\n        {this.renderCloseButton()}\n      </div>\n    );\n  };\n\n  public renderCloseButton() {\n    const hasCross =\n      this.props.closeButton === undefined\n        ? !Tooltip.triggersWithoutCloseButton.includes(this.getProps().trigger)\n        : this.props.closeButton;\n\n    if (!hasCross || this.isMobileLayout) {\n      return null;\n    }\n\n    return (\n      <div className={styles.cross(this.theme)} onClick={this.handleCloseButtonClick}>\n        <CrossIcon />\n      </div>\n    );\n  }\n\n  public getAnchorElement = (): Nullable<Element> => {\n    return this.popupRef.current?.anchorElement;\n  };\n\n  /**\n   * Программно открывает тултип.\n   * <p>Не действует если проп *trigger* `'opened'` или `'closed'`.</p>\n   * @public\n   */\n  public show() {\n    if (this.state.opened) {\n      return;\n    }\n    const trigger = this.getProps().trigger;\n    if (trigger === 'opened' || trigger === 'closed') {\n      warning(true, `Function 'show' is not supported with trigger specified '${trigger}'`);\n      return;\n    }\n    this.open();\n  }\n\n  /**\n   * Программно закрывает тултип.\n   * <p>Не действует если проп *trigger* `'opened'` или `'closed'`.</p>\n   * @public\n   */\n  public hide() {\n    const trigger = this.getProps().trigger;\n    if (trigger === 'opened' || trigger === 'closed') {\n      warning(true, `Function 'hide' is not supported with trigger specified '${trigger}'`);\n      return;\n    }\n    this.close();\n  }\n\n  private renderMain() {\n    const props = this.props;\n    const content = this.renderContent();\n    const { popupProps, layerProps = { active: false } } = this.getPopupAndLayerProps();\n    const anchorElement = props.children || props.anchorElement;\n    const popup = this.renderPopup(anchorElement, popupProps, content);\n\n    if (this.isMobileLayout) {\n      return popup;\n    }\n\n    return (\n      <RenderLayer {...layerProps} getAnchorElement={this.getAnchorElement}>\n        {popup}\n      </RenderLayer>\n    );\n  }\n\n  private renderPopup(\n    anchorElement: React.ReactNode | HTMLElement,\n    popupProps: Partial<PopupProps>,\n    content: JSX.Element | null,\n  ) {\n    const { disableAnimations, trigger } = this.getProps();\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <Popup\n          data-tid={TooltipDataTids.root}\n          anchorElement={anchorElement}\n          hasPin\n          hasShadow\n          maxWidth=\"none\"\n          opened={this.state.opened}\n          disableAnimations={disableAnimations}\n          positions={this.getPositions()}\n          ignoreHover={trigger === 'hoverAnchor'}\n          onOpen={this.props.onOpen}\n          onClose={this.props.onClose}\n          mobileOnCloseRequest={this.mobileCloseHandler}\n          tryPreserveFirstRenderedPosition\n          ref={this.popupRef}\n          {...popupProps}\n        >\n          {content}\n        </Popup>\n      </CommonWrapper>\n    );\n  }\n\n  private mobileCloseHandler = () => {\n    const trigger = this.getProps().trigger;\n    if (trigger === 'manual' || trigger === 'closed' || trigger === 'opened') {\n      return;\n    }\n\n    this.close();\n  };\n\n  private refContent = (node: HTMLElement | null) => {\n    this.contentElement = node;\n  };\n\n  private getPositions() {\n    if (!this.positions) {\n      const { allowedPositions, pos } = this.getProps();\n      const index = allowedPositions.indexOf(pos);\n      if (index === -1) {\n        throw new Error('Unexpected position passed to Tooltip. Expected one of: ' + allowedPositions.join(', '));\n      }\n\n      this.positions = [...allowedPositions.slice(index), ...allowedPositions.slice(0, index)];\n    }\n\n    return this.positions;\n  }\n\n  private getPopupAndLayerProps(): {\n    layerProps?: Partial<RenderLayerProps>;\n    popupProps: Partial<PopupProps>;\n  } {\n    const props = this.props;\n    const useWrapper = !!props.children && this.getProps().useWrapper;\n    const trigger = this.getProps().trigger;\n\n    switch (trigger) {\n      case 'opened':\n        return {\n          layerProps: {\n            active: true,\n            onClickOutside: this.handleClickOutsideAnchor,\n          },\n          popupProps: {\n            opened: true,\n            useWrapper,\n          },\n        };\n\n      case 'closed':\n        return {\n          popupProps: {\n            opened: false,\n            useWrapper,\n          },\n        };\n\n      case 'hoverAnchor':\n      case 'hover':\n        return {\n          popupProps: {\n            onMouseEnter: this.handleMouseEnter,\n            onMouseLeave: this.handleMouseLeave,\n            useWrapper,\n          },\n        };\n      case 'manual':\n        return {\n          popupProps: {\n            useWrapper,\n          },\n        };\n      case 'click':\n        return {\n          layerProps: {\n            active: this.state.opened,\n            onClickOutside: this.handleClickOutsideAnchor,\n          },\n          popupProps: {\n            onClick: this.handleClick,\n            useWrapper,\n          },\n        };\n\n      case 'focus':\n        return {\n          popupProps: {\n            onFocus: this.handleFocus,\n            onBlur: this.handleBlur,\n            useWrapper,\n          },\n        };\n\n      case 'hover&focus':\n        return {\n          layerProps: {\n            active: this.state.opened,\n            onClickOutside: this.handleClickOutsideAnchor,\n          },\n          popupProps: {\n            onFocus: this.handleFocus,\n            onBlur: this.handleBlur,\n            onMouseEnter: this.handleMouseEnter,\n            onMouseLeave: this.handleMouseLeave,\n            useWrapper,\n          },\n        };\n\n      default:\n        throw new Error('Unknown trigger specified: ' + trigger);\n    }\n  }\n\n  private open = () => this.setState({ opened: true });\n\n  private close = () => this.setState({ opened: false });\n\n  private clearHoverTimeout() {\n    if (this.hoverTimeout) {\n      clearTimeout(this.hoverTimeout);\n      this.hoverTimeout = null;\n    }\n  }\n\n  private handleMouseEnter = (event: MouseEventType) => {\n    const isHoverAnchor = this.getProps().trigger === 'hoverAnchor';\n    if (isHoverAnchor && event.target === this.contentElement) {\n      return;\n    }\n\n    this.clearHoverTimeout();\n\n    this.hoverTimeout = window.setTimeout(this.open, Tooltip.delay);\n  };\n\n  private handleMouseLeave = (event: MouseEventType) => {\n    if (this.isMobileLayout) {\n      return;\n    }\n    const trigger = this.getProps().trigger;\n    if (\n      (trigger === 'hover&focus' && this.state.focused) ||\n      (trigger === 'hover' && event.relatedTarget === this.contentElement)\n    ) {\n      return;\n    }\n\n    this.clearHoverTimeout();\n\n    if (trigger === 'hoverAnchor') {\n      this.close();\n    } else {\n      this.hoverTimeout = window.setTimeout(this.close, Tooltip.delay);\n    }\n  };\n\n  private handleClick = () => {\n    this.open();\n  };\n\n  private handleClickOutsideAnchor = (event: Event) => {\n    this.clickedOutside = this.isClickOutsideContent(event);\n    if (this.clickedOutside) {\n      if (this.props.onCloseRequest) {\n        this.props.onCloseRequest(event);\n      }\n      this.close();\n    }\n  };\n\n  private isClickOutsideContent(event: Event) {\n    if (this.contentElement && event.target instanceof Element) {\n      return !containsTargetOrRenderContainer(event.target)(this.contentElement);\n    }\n\n    return true;\n  }\n\n  private handleFocus = () => {\n    this.setState({ focused: true });\n    this.open();\n  };\n\n  private handleBlur = () => {\n    const trigger = this.getProps().trigger;\n    if (trigger === 'hover&focus' && this.clickedOutside) {\n      this.close();\n    }\n\n    if (trigger === 'focus') {\n      this.close();\n    }\n\n    this.clickedOutside = true;\n    this.setState({ focused: false });\n  };\n\n  private handleCloseButtonClick = (event: React.MouseEvent<HTMLElement>) => {\n    event.stopPropagation();\n\n    if (this.props.onCloseClick) {\n      this.props.onCloseClick(event);\n    }\n\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    if (this.props.onCloseRequest) {\n      this.props.onCloseRequest(event);\n    }\n\n    this.close();\n  };\n}\n"]}
+{"version":3,"sources":["Tooltip.tsx"],"names":["TooltipDataTids","root","content","crossIcon","Positions","Tooltip","rootNode","getProps","defaultProps","state","opened","focused","hoverTimeout","contentElement","positions","clickedOutside","popupRef","React","createRef","renderContent","props","render","refContent","styles","tooltipContent","theme","renderCloseButton","getAnchorElement","current","anchorElement","node","open","setState","close","handleMouseEnter","event","isHoverAnchor","trigger","target","clearHoverTimeout","window","setTimeout","delay","handleMouseLeave","relatedTarget","handleClick","handleClickOutsideAnchor","isClickOutsideContent","onCloseRequest","handleFocus","handleBlur","handleCloseButtonClick","stopPropagation","onCloseClick","defaultPrevented","componentDidUpdate","prevProps","allowedPositions","pos","posChanged","allowedChanged","componentWillUnmount","ThemeFactory","create","popupPinOffset","tooltipPinOffset","popupMargin","tooltipMargin","popupBorder","tooltipBorder","popupBorderRadius","tooltipBorderRadius","popupPinSize","tooltipPinSize","popupPinOffsetX","tooltipPinOffsetX","popupPinOffsetY","tooltipPinOffsetY","popupBackground","tooltipBg","renderMain","hasCross","closeButton","undefined","triggersWithoutCloseButton","includes","icon","parseInt","tooltipCloseBtnSide","tooltipCloseBtnColor","tooltipCloseBtnHoverColor","cross","show","hide","getPopupAndLayerProps","popupProps","layerProps","active","children","popup","renderPopup","disableAnimations","setRootNode","getPositions","onOpen","onClose","index","indexOf","Error","join","slice","useWrapper","onClickOutside","onMouseEnter","onMouseLeave","onClick","onFocus","onBlur","clearTimeout","Element","PureComponent","__KONTUR_REACT_UI__","propTypes","propName","componentName","Array","isArray","DefaultPosition","isTestEnv"],"mappings":"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","sourcesContent":["import React from 'react';\nimport warning from 'warning';\nimport isEqual from 'lodash.isequal';\n\nimport { isNullable } from '../../lib/utils';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { DefaultPosition, Popup, PopupProps, PopupPositionsType } from '../../internal/Popup';\nimport { RenderLayer, RenderLayerProps } from '../../internal/RenderLayer';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { Nullable } from '../../typings/utility-types';\nimport { MouseEventType } from '../../typings/event-types';\nimport { containsTargetOrRenderContainer } from '../../lib/listenFocusOutside';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { InstanceWithAnchorElement } from '../../lib/InstanceWithAnchorElement';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { CloseButtonIcon } from '../../internal/CloseButtonIcon/CloseButtonIcon';\n\nimport { styles } from './Tooltip.styles';\n\nexport type TooltipTrigger =\n  /** Наведение на children и на тултип */\n  | 'hover'\n  /** Клик на children */\n  | 'click'\n  /** Фокус на children */\n  | 'focus'\n  /** Наведение на children и на тултип и фокус на children */\n  | 'hover&focus'\n  /** Просто открыт */\n  | 'opened'\n  /** Просто закрыт */\n  | 'closed'\n  /** Наведение ТОЛЬКО на children, а не на тултип */\n  | 'hoverAnchor'\n  /** Управление через публичные функции show и hide */\n  | 'manual';\n\nexport interface TooltipProps extends CommonProps {\n  /**\n   * Относительно какого элемента позиционировать тултип\n   */\n  anchorElement?: HTMLElement;\n\n  /**\n   * Если не указан `anchorElement` то тултип будет позиционироваться\n   * относительно дочерних элементов\n   */\n  children?: React.ReactNode;\n\n  className?: string;\n\n  /**\n   * Показывать крестик для закрытия тултипа. По-умолчанию крестик\n   * показывается если проп *trigger* не `hover` и не `focus`.\n   */\n  closeButton?: boolean;\n\n  /**\n   * Функция, которая возвращает содержимое тултипа.\n   *\n   * Если эта функция вернула `null`, то тултип не показывается.\n   */\n  render?: Nullable<() => React.ReactNode>;\n\n  /**\n   * Значение по умолчанию: `\"top left\"`.\n   */\n  pos?: PopupPositionsType;\n\n  /**\n   * Триггер открытия тултипа\n   * ```ts\n   * type TooltipTrigger =\n   * | 'hover'\n   * | 'click'\n   * | 'focus'\n   * | 'hover&focus'\n   * | 'opened'\n   * | 'closed'\n   * | 'hoverAnchor'\n   * | 'manual';\n   * ```\n   */\n  trigger?: TooltipTrigger;\n\n  /**\n   * Хэндлер, вызываемый при клике по крестику\n   */\n  onCloseClick?: React.MouseEventHandler<HTMLElement>;\n\n  /**\n   * Хэндлер, вызываемый при клике по крестику или\n   * снаружи тултипа\n   */\n  onCloseRequest?: (event?: Event | React.MouseEvent) => void;\n\n  /**\n   * Хэндлер, вызываемый при закрытии тултипа\n   */\n  onClose?: () => void;\n\n  /**\n   * Хэндлер, вызываемый при открытии тултипа\n   */\n  onOpen?: () => void;\n\n  /**\n   * Список позиций, которые тултип будет занимать.\n   * Если положение тултипа в определенной позиции\n   * будет выходить за край экрана, то будет выбрана\n   * следующая позиция. Обязательно должен включать\n   * позицию указанную в `pos`\n   */\n  allowedPositions?: PopupPositionsType[];\n\n  /**\n   * Флаг отключения анимации.\n   * @default false\n   */\n  disableAnimations?: boolean;\n\n  /**\n   * Явно указывает, что вложенные элементы должны быть обёрнуты в `<span/>`. <br/> Используется для корректного позиционирования тултипа при двух и более вложенных элементах.\n   *\n   * _Примечание_: при **двух и более** вложенных элементах обёртка будет добавлена автоматически.\n   */\n  useWrapper?: boolean;\n}\n\nexport interface TooltipState {\n  opened: boolean;\n  focused: boolean;\n}\n\nexport const TooltipDataTids = {\n  root: 'Tooltip__root',\n  content: 'Tooltip__content',\n  crossIcon: 'Tooltip__crossIcon',\n} as const;\n\nconst Positions: PopupPositionsType[] = [\n  'right bottom',\n  'right middle',\n  'right top',\n  'top right',\n  'top center',\n  'top left',\n  'left top',\n  'left middle',\n  'left bottom',\n  'bottom left',\n  'bottom center',\n  'bottom right',\n];\n\ntype DefaultProps = Required<\n  Pick<TooltipProps, 'pos' | 'trigger' | 'allowedPositions' | 'disableAnimations' | 'useWrapper'>\n>;\n\n@rootNode\nexport class Tooltip extends React.PureComponent<TooltipProps, TooltipState> implements InstanceWithAnchorElement {\n  public static __KONTUR_REACT_UI__ = 'Tooltip';\n\n  public static propTypes = {\n    children(props: TooltipProps, propName: keyof TooltipProps, componentName: string) {\n      const children = props[propName];\n      warning(\n        children || props.anchorElement,\n        `[${componentName}]: you must provide either 'children' or 'anchorElement' prop for ${componentName} to work properly`,\n      );\n      warning(\n        !(Array.isArray(children) && props.useWrapper === false),\n        `[${componentName}]: you provided multiple children, but useWrapper={false} - forcing wrapper <span/> for positioning to work correctly`,\n      );\n    },\n  };\n\n  public static defaultProps: DefaultProps = {\n    pos: DefaultPosition,\n    trigger: 'hover',\n    allowedPositions: Positions,\n    disableAnimations: isTestEnv,\n    useWrapper: false,\n  };\n\n  private getProps = createPropsGetter(Tooltip.defaultProps);\n\n  public static delay = 100;\n  private static triggersWithoutCloseButton: TooltipTrigger[] = ['hover', 'hoverAnchor', 'focus', 'hover&focus'];\n\n  public state: TooltipState = { opened: false, focused: false };\n  private theme!: Theme;\n  private hoverTimeout: Nullable<number> = null;\n  private contentElement: Nullable<HTMLElement> = null;\n  private positions: Nullable<PopupPositionsType[]> = null;\n  private clickedOutside = true;\n  private setRootNode!: TSetRootNode;\n\n  private popupRef = React.createRef<Popup>();\n  public componentDidUpdate(prevProps: TooltipProps) {\n    const { trigger, allowedPositions, pos } = this.getProps();\n    if (trigger === 'closed' && this.state.opened) {\n      this.close();\n    }\n    const posChanged = prevProps.pos !== pos;\n    const allowedChanged = !isEqual(prevProps.allowedPositions, allowedPositions);\n\n    if (posChanged || allowedChanged) {\n      this.positions = null;\n    }\n  }\n\n  public componentWillUnmount() {\n    this.clearHoverTimeout();\n  }\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                  popupPinOffset: theme.tooltipPinOffset,\n                  popupMargin: theme.tooltipMargin,\n                  popupBorder: theme.tooltipBorder,\n                  popupBorderRadius: theme.tooltipBorderRadius,\n                  popupPinSize: theme.tooltipPinSize,\n                  popupPinOffsetX: theme.tooltipPinOffsetX,\n                  popupPinOffsetY: theme.tooltipPinOffsetY,\n                  popupBackground: theme.tooltipBg,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderContent = () => {\n    const content = this.props.render ? this.props.render() : null;\n    if (isNullable(content)) {\n      return null;\n    }\n\n    return (\n      <div ref={this.refContent} className={styles.tooltipContent(this.theme)} data-tid={TooltipDataTids.content}>\n        {content}\n        {this.renderCloseButton()}\n      </div>\n    );\n  };\n\n  public renderCloseButton() {\n    const hasCross =\n      this.props.closeButton === undefined\n        ? !Tooltip.triggersWithoutCloseButton.includes(this.getProps().trigger)\n        : this.props.closeButton;\n\n    if (!hasCross) {\n      return null;\n    }\n\n    const icon = isTheme2022(this.theme) ? (\n      <CloseButtonIcon\n        tabbable={false}\n        side={parseInt(this.theme.tooltipCloseBtnSide)}\n        color={this.theme.tooltipCloseBtnColor}\n        colorHover={this.theme.tooltipCloseBtnHoverColor}\n      />\n    ) : (\n      <CrossIcon />\n    );\n\n    return (\n      <div\n        className={styles.cross(this.theme)}\n        onClick={this.handleCloseButtonClick}\n        data-tid={TooltipDataTids.crossIcon}\n      >\n        {icon}\n      </div>\n    );\n  }\n\n  public getAnchorElement = (): Nullable<Element> => {\n    return this.popupRef.current?.anchorElement;\n  };\n\n  /**\n   * Программно открывает тултип.\n   * <p>Не действует если проп *trigger* `'opened'` или `'closed'`.</p>\n   * @public\n   */\n  public show() {\n    if (this.state.opened) {\n      return;\n    }\n    const trigger = this.getProps().trigger;\n    if (trigger === 'opened' || trigger === 'closed') {\n      warning(true, `Function 'show' is not supported with trigger specified '${trigger}'`);\n      return;\n    }\n    this.open();\n  }\n\n  /**\n   * Программно закрывает тултип.\n   * <p>Не действует если проп *trigger* `'opened'` или `'closed'`.</p>\n   * @public\n   */\n  public hide() {\n    const trigger = this.getProps().trigger;\n    if (trigger === 'opened' || trigger === 'closed') {\n      warning(true, `Function 'hide' is not supported with trigger specified '${trigger}'`);\n      return;\n    }\n    this.close();\n  }\n\n  private renderMain() {\n    const props = this.props;\n    const content = this.renderContent();\n    const { popupProps, layerProps = { active: false } } = this.getPopupAndLayerProps();\n    const anchorElement = props.children || props.anchorElement;\n    const popup = this.renderPopup(anchorElement, popupProps, content);\n\n    return (\n      <RenderLayer {...layerProps} getAnchorElement={this.getAnchorElement}>\n        {popup}\n      </RenderLayer>\n    );\n  }\n\n  private renderPopup(\n    anchorElement: React.ReactNode | HTMLElement,\n    popupProps: Partial<PopupProps>,\n    content: JSX.Element | null,\n  ) {\n    const { disableAnimations, trigger } = this.getProps();\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <Popup\n          data-tid={TooltipDataTids.root}\n          anchorElement={anchorElement}\n          hasPin\n          hasShadow\n          maxWidth=\"none\"\n          opened={this.state.opened}\n          disableAnimations={disableAnimations}\n          positions={this.getPositions()}\n          ignoreHover={trigger === 'hoverAnchor'}\n          onOpen={this.props.onOpen}\n          onClose={this.props.onClose}\n          tryPreserveFirstRenderedPosition\n          ref={this.popupRef}\n          withoutMobile\n          {...popupProps}\n        >\n          {content}\n        </Popup>\n      </CommonWrapper>\n    );\n  }\n\n  private refContent = (node: HTMLElement | null) => {\n    this.contentElement = node;\n  };\n\n  private getPositions() {\n    if (!this.positions) {\n      const { allowedPositions, pos } = this.getProps();\n      const index = allowedPositions.indexOf(pos);\n      if (index === -1) {\n        throw new Error('Unexpected position passed to Tooltip. Expected one of: ' + allowedPositions.join(', '));\n      }\n\n      this.positions = [...allowedPositions.slice(index), ...allowedPositions.slice(0, index)];\n    }\n\n    return this.positions;\n  }\n\n  private getPopupAndLayerProps(): {\n    layerProps?: Partial<RenderLayerProps>;\n    popupProps: Partial<PopupProps>;\n  } {\n    const props = this.props;\n    const useWrapper = !!props.children && this.getProps().useWrapper;\n    const trigger = this.getProps().trigger;\n\n    switch (trigger) {\n      case 'opened':\n        return {\n          layerProps: {\n            active: true,\n            onClickOutside: this.handleClickOutsideAnchor,\n          },\n          popupProps: {\n            opened: true,\n            useWrapper,\n          },\n        };\n\n      case 'closed':\n        return {\n          popupProps: {\n            opened: false,\n            useWrapper,\n          },\n        };\n\n      case 'hoverAnchor':\n      case 'hover':\n        return {\n          popupProps: {\n            onMouseEnter: this.handleMouseEnter,\n            onMouseLeave: this.handleMouseLeave,\n            useWrapper,\n          },\n        };\n      case 'manual':\n        return {\n          popupProps: {\n            useWrapper,\n          },\n        };\n      case 'click':\n        return {\n          layerProps: {\n            active: this.state.opened,\n            onClickOutside: this.handleClickOutsideAnchor,\n          },\n          popupProps: {\n            onClick: this.handleClick,\n            useWrapper,\n          },\n        };\n\n      case 'focus':\n        return {\n          popupProps: {\n            onFocus: this.handleFocus,\n            onBlur: this.handleBlur,\n            useWrapper,\n          },\n        };\n\n      case 'hover&focus':\n        return {\n          layerProps: {\n            active: this.state.opened,\n            onClickOutside: this.handleClickOutsideAnchor,\n          },\n          popupProps: {\n            onFocus: this.handleFocus,\n            onBlur: this.handleBlur,\n            onMouseEnter: this.handleMouseEnter,\n            onMouseLeave: this.handleMouseLeave,\n            useWrapper,\n          },\n        };\n\n      default:\n        throw new Error('Unknown trigger specified: ' + trigger);\n    }\n  }\n\n  private open = () => this.setState({ opened: true });\n\n  private close = () => this.setState({ opened: false });\n\n  private clearHoverTimeout() {\n    if (this.hoverTimeout) {\n      clearTimeout(this.hoverTimeout);\n      this.hoverTimeout = null;\n    }\n  }\n\n  private handleMouseEnter = (event: MouseEventType) => {\n    const isHoverAnchor = this.getProps().trigger === 'hoverAnchor';\n    if (isHoverAnchor && event.target === this.contentElement) {\n      return;\n    }\n\n    this.clearHoverTimeout();\n\n    this.hoverTimeout = window.setTimeout(this.open, Tooltip.delay);\n  };\n\n  private handleMouseLeave = (event: MouseEventType) => {\n    const trigger = this.getProps().trigger;\n    if (\n      (trigger === 'hover&focus' && this.state.focused) ||\n      (trigger === 'hover' && event.relatedTarget === this.contentElement)\n    ) {\n      return;\n    }\n\n    this.clearHoverTimeout();\n\n    if (trigger === 'hoverAnchor') {\n      this.close();\n    } else {\n      this.hoverTimeout = window.setTimeout(this.close, Tooltip.delay);\n    }\n  };\n\n  private handleClick = () => {\n    this.open();\n  };\n\n  private handleClickOutsideAnchor = (event: Event) => {\n    this.clickedOutside = this.isClickOutsideContent(event);\n    if (this.clickedOutside) {\n      if (this.props.onCloseRequest) {\n        this.props.onCloseRequest(event);\n      }\n      this.close();\n    }\n  };\n\n  private isClickOutsideContent(event: Event) {\n    if (this.contentElement && event.target instanceof Element) {\n      return !containsTargetOrRenderContainer(event.target)(this.contentElement);\n    }\n\n    return true;\n  }\n\n  private handleFocus = () => {\n    this.setState({ focused: true });\n    this.open();\n  };\n\n  private handleBlur = () => {\n    const trigger = this.getProps().trigger;\n    if (trigger === 'hover&focus' && this.clickedOutside) {\n      this.close();\n    }\n\n    if (trigger === 'focus') {\n      this.close();\n    }\n\n    this.clickedOutside = true;\n    this.setState({ focused: false });\n  };\n\n  private handleCloseButtonClick = (event: React.MouseEvent<HTMLElement>) => {\n    event.stopPropagation();\n\n    if (this.props.onCloseClick) {\n      this.props.onCloseClick(event);\n    }\n\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    if (this.props.onCloseRequest) {\n      this.props.onCloseRequest(event);\n    }\n\n    this.close();\n  };\n}\n"]}