@skbkontur/react-ui 0.0.0-942b5aade9 → 0.0.0-95a1dbe516

package/internal/IgnoreLayerClick/IgnoreLayerClick/IgnoreLayerClick.js.map

@@ -1 +1 @@
-{"version":3,"sources":["IgnoreLayerClick.tsx"],"names":["React","getRootNode","rootNode","CommonWrapper","IgnoreLayerClick","render","child","Children","only","props","children","active","Component","IgnoreLayerClickWrapper","element","handleMouseDown","event","stopPropagation","componentDidMount","Element","addEventListener","componentWillUnmount","removeEventListener","setRootNode","__KONTUR_REACT_UI__"],"mappings":"2JAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,WAAT,EAAsBC,QAAtB,QAAoD,oBAApD;AACA,SAASC,aAAT,QAA8B,kBAA9B;;;;;;;AAOA,WAAaC,gBAAb;AACSC,EAAAA,MADT,GACE,kBAAgB;AACd,QAAMC,KAAK,GAAGN,KAAK,CAACO,QAAN,CAAeC,IAAf,CAAoB,KAAKC,KAAL,CAAWC,QAA/B,CAAd;AACA,WAAO,KAAKD,KAAL,CAAWE,MAAX,gBAAoB,oBAAC,uBAAD,QAA0BL,KAA1B,CAApB,GAAiFA,KAAxF;AACD,GAJH,2BAAsCN,KAAK,CAACY,SAA5C;;;;;;;AAWA;;AAEMC,uB,GADLX,Q;;;AAISY,IAAAA,O,GAA0B,I;;;;;;;;;;;;;;;;;;;;;;;;;;AA0B1BC,IAAAA,e,GAAkB,UAACC,KAAD,EAAkB;AAC1CA,MAAAA,KAAK,CAACC,eAAN;AACD,K,uEAzBMC,iB,GAAP,6BAA2B,CACzB,IAAMJ,OAAO,GAAGb,WAAW,CAAC,IAAD,CAA3B,CACA,IAAIa,OAAO,IAAIA,OAAO,YAAYK,OAAlC,EAA2C,CACzCL,OAAO,CAACM,gBAAR,CAAyB,WAAzB,EAAsC,KAAKL,eAA3C,EACA,KAAKD,OAAL,GAAeA,OAAf,CACD,CACF,C,SAEMO,oB,GAAP,gCAA8B,CAC5B,IAAI,KAAKP,OAAT,EAAkB,CAChB,KAAKA,OAAL,CAAaQ,mBAAb,CAAiC,WAAjC,EAA8C,KAAKP,eAAnD,EACA,KAAKD,OAAL,GAAe,IAAf,CACD,CACF,C,SAEMT,M,GAAP,kBAAgB,CACd,oBACE,oBAAC,aAAD,aAAe,WAAW,EAAE,KAAKkB,WAAjC,IAAkD,KAAKd,KAAvD,GACGT,KAAK,CAACO,QAAN,CAAeC,IAAf,CAAoB,KAAKC,KAAL,CAAWC,QAA/B,CADH,CADF,CAKD,C,kCA3BmCV,KAAK,CAACY,S,WAC5BY,mB,GAAsB,kB","sourcesContent":["import React from 'react';\n\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { CommonWrapper } from '../CommonWrapper';\n\nexport interface IgnoreLayerClickProps {\n  children: React.ReactNode;\n  active: boolean;\n}\n\nexport class IgnoreLayerClick extends React.Component<IgnoreLayerClickProps> {\n  public render() {\n    const child = React.Children.only(this.props.children);\n    return this.props.active ? <IgnoreLayerClickWrapper>{child}</IgnoreLayerClickWrapper> : child;\n  }\n}\n\ninterface WrapperProps {\n  children: React.ReactNode;\n}\n\n// NOTE Используется только в команде Контур.Бухгалтерия\n@rootNode\nclass IgnoreLayerClickWrapper extends React.Component<WrapperProps> {\n  public static __KONTUR_REACT_UI__ = 'IgnoreLayerClick';\n\n  private element: Element | null = null;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    const element = getRootNode(this);\n    if (element && element instanceof Element) {\n      element.addEventListener('mousedown', this.handleMouseDown);\n      this.element = element;\n    }\n  }\n\n  public componentWillUnmount() {\n    if (this.element) {\n      this.element.removeEventListener('mousedown', this.handleMouseDown);\n      this.element = null;\n    }\n  }\n\n  public render() {\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        {React.Children.only(this.props.children)}\n      </CommonWrapper>\n    );\n  }\n\n  private handleMouseDown = (event: Event) => {\n    event.stopPropagation();\n  };\n}\n"]}
+{"version":3,"sources":["IgnoreLayerClick.tsx"],"names":["React","globalObject","getRootNode","rootNode","isInstanceOf","CommonWrapper","IgnoreLayerClick","render","child","Children","only","props","children","active","Component","IgnoreLayerClickWrapper","element","handleMouseDown","event","stopPropagation","componentDidMount","Element","addEventListener","componentWillUnmount","removeEventListener","setRootNode","__KONTUR_REACT_UI__","displayName"],"mappings":"2JAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,YAAT,QAA6B,0BAA7B;;AAEA,SAASC,WAAT,EAAsBC,QAAtB,QAAoD,oBAApD;AACA,SAASC,YAAT,QAA6B,wBAA7B;AACA,SAASC,aAAT,QAA8B,kBAA9B;;;;;;;AAOA,WAAaC,gBAAb;AACSC,EAAAA,MADT,GACE,kBAAgB;AACd,QAAMC,KAAK,GAAGR,KAAK,CAACS,QAAN,CAAeC,IAAf,CAAoB,KAAKC,KAAL,CAAWC,QAA/B,CAAd;AACA,WAAO,KAAKD,KAAL,CAAWE,MAAX,gBAAoB,oBAAC,uBAAD,QAA0BL,KAA1B,CAApB,GAAiFA,KAAxF;AACD,GAJH,2BAAsCR,KAAK,CAACc,SAA5C;;;;;;;AAWA;;AAEMC,uB,GADLZ,Q;;;;AAKSa,IAAAA,O,GAA0B,I;;;;;;;;;;;;;;;;;;;;;;;;;;AA0B1BC,IAAAA,e,GAAkB,UAACC,KAAD,EAAkB;AAC1CA,MAAAA,KAAK,CAACC,eAAN;AACD,K,uEAzBMC,iB,GAAP,6BAA2B,CACzB,IAAMJ,OAAO,GAAGd,WAAW,CAAC,IAAD,CAA3B,CACA,IAAIE,YAAY,CAACY,OAAD,EAAUf,YAAY,CAACoB,OAAvB,CAAhB,EAAiD,CAC/CL,OAAO,CAACM,gBAAR,CAAyB,WAAzB,EAAsC,KAAKL,eAA3C,EACA,KAAKD,OAAL,GAAeA,OAAf,CACD,CACF,C,SAEMO,oB,GAAP,gCAA8B,CAC5B,IAAI,KAAKP,OAAT,EAAkB,CAChB,KAAKA,OAAL,CAAaQ,mBAAb,CAAiC,WAAjC,EAA8C,KAAKP,eAAnD,EACA,KAAKD,OAAL,GAAe,IAAf,CACD,CACF,C,SAEMT,M,GAAP,kBAAgB,CACd,oBACE,oBAAC,aAAD,aAAe,WAAW,EAAE,KAAKkB,WAAjC,IAAkD,KAAKd,KAAvD,GACGX,KAAK,CAACS,QAAN,CAAeC,IAAf,CAAoB,KAAKC,KAAL,CAAWC,QAA/B,CADH,CADF,CAKD,C,kCA5BmCZ,KAAK,CAACc,S,WAC5BY,mB,GAAsB,kB,UACtBC,W,GAAc,kB","sourcesContent":["import React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { isInstanceOf } from '../../lib/isInstanceOf';\nimport { CommonWrapper } from '../CommonWrapper';\n\nexport interface IgnoreLayerClickProps {\n  children: React.ReactNode;\n  active: boolean;\n}\n\nexport class IgnoreLayerClick extends React.Component<IgnoreLayerClickProps> {\n  public render() {\n    const child = React.Children.only(this.props.children);\n    return this.props.active ? <IgnoreLayerClickWrapper>{child}</IgnoreLayerClickWrapper> : child;\n  }\n}\n\ninterface WrapperProps {\n  children: React.ReactNode;\n}\n\n// NOTE Используется только в команде Контур.Бухгалтерия\n@rootNode\nclass IgnoreLayerClickWrapper extends React.Component<WrapperProps> {\n  public static __KONTUR_REACT_UI__ = 'IgnoreLayerClick';\n  public static displayName = 'IgnoreLayerClick';\n\n  private element: Element | null = null;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    const element = getRootNode(this);\n    if (isInstanceOf(element, globalObject.Element)) {\n      element.addEventListener('mousedown', this.handleMouseDown);\n      this.element = element;\n    }\n  }\n\n  public componentWillUnmount() {\n    if (this.element) {\n      this.element.removeEventListener('mousedown', this.handleMouseDown);\n      this.element = null;\n    }\n  }\n\n  public render() {\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        {React.Children.only(this.props.children)}\n      </CommonWrapper>\n    );\n  }\n\n  private handleMouseDown = (event: Event) => {\n    event.stopPropagation();\n  };\n}\n"]}

package/internal/InputLikeText/HiddenInput/HiddenInput.js

@@ -1,25 +1,24 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
+import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
-import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
-var _excluded = ["nodeRef"];
 
 var _templateObject;
 
+var _excluded = ["nodeRef"];
 import React from 'react';
-import { css } from "../../../lib/theming/Emotion";
+import { EmotionConsumer } from "../../../lib/theming/Emotion";
 
 var cap = function cap(e) {
   return e.stopPropagation();
 };
-
-var className = css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  position: absolute;\n  width: 1px;\n  height: 0;\n  border: 0;\n  outline: 0;\n  margin: 0;\n  padding: 0;\n  overflow: hidden;\n  opacity: 0;\n"])));
 /**
  * В **IE11** событие `onPaste` вызывается только у редактируемых элементов: `input`, `textarea`, `[contenteditable]`.
  * Для решения этой проблемы, перед "вставкой" фокусируемся на инпуте
  * после этого `onPaste` вызывается у инпута и всплывает.
  */
 
+
 export var HiddenInput = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(HiddenInput, _React$Component);
 
@@ -34,15 +33,18 @@ export var HiddenInput = /*#__PURE__*/function (_React$Component) {
         nodeRef = _this$props.nodeRef,
         props = _objectWithoutPropertiesLoose(_this$props, _excluded);
 
-    return /*#__PURE__*/React.createElement("input", _extends({}, props, {
-      ref: nodeRef,
-      type: "text",
-      tabIndex: -1,
-      onBlur: cap,
-      onFocus: cap,
-      onChange: cap,
-      className: className
-    }));
+    return /*#__PURE__*/React.createElement(EmotionConsumer, null, function (emotion) {
+      var className = emotion.css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n            position: absolute;\n            width: 1px;\n            height: 0;\n            border: 0;\n            outline: 0;\n            margin: 0;\n            padding: 0;\n            overflow: hidden;\n            opacity: 0;\n          "])));
+      return /*#__PURE__*/React.createElement("input", _extends({}, props, {
+        ref: nodeRef,
+        type: "text",
+        tabIndex: -1,
+        onBlur: cap,
+        onFocus: cap,
+        onChange: cap,
+        className: className
+      }));
+    });
   };
 
   return HiddenInput;

package/internal/InputLikeText/HiddenInput/HiddenInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["HiddenInput.tsx"],"names":["React","css","cap","e","stopPropagation","className","HiddenInput","render","props","nodeRef","Component"],"mappings":"oXAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,GAAT,QAAoB,2BAApB;;;;;;AAMA,IAAMC,GAA4B,GAAG,SAA/BA,GAA+B,CAACC,CAAD,UAAOA,CAAC,CAACC,eAAF,EAAP,EAArC;;AAEA,IAAMC,SAAS,GAAGJ,GAAH,8NAAf;;;;;;;;;;;;AAYA;AACA;AACA;AACA;AACA;AACA,WAAaK,WAAb;AACSC,EAAAA,MADT,GACE,kBAAgB;AACd,sBAA8B,KAAKC,KAAnC,CAAQC,OAAR,eAAQA,OAAR,CAAoBD,KAApB;AACA;AACE;AACMA,MAAAA,KADN;AAEE,QAAA,GAAG,EAAEC,OAFP;AAGE,QAAA,IAAI,EAAC,MAHP;AAIE,QAAA,QAAQ,EAAE,CAAC,CAJb;AAKE,QAAA,MAAM,EAAEP,GALV;AAME,QAAA,OAAO,EAAEA,GANX;AAOE,QAAA,QAAQ,EAAEA,GAPZ;AAQE,QAAA,SAAS,EAAEG,SARb,IADF;;;AAYD,GAfH,sBAAiCL,KAAK,CAACU,SAAvC","sourcesContent":["import React from 'react';\n\nimport { css } from '../../lib/theming/Emotion';\n\ninterface Props extends React.HTMLAttributes<HTMLInputElement> {\n  nodeRef: (ref: HTMLInputElement | null) => void;\n}\n\nconst cap: React.ReactEventHandler = (e) => e.stopPropagation();\n\nconst className = css`\n  position: absolute;\n  width: 1px;\n  height: 0;\n  border: 0;\n  outline: 0;\n  margin: 0;\n  padding: 0;\n  overflow: hidden;\n  opacity: 0;\n`;\n\n/**\n * В **IE11** событие `onPaste` вызывается только у редактируемых элементов: `input`, `textarea`, `[contenteditable]`.\n * Для решения этой проблемы, перед \"вставкой\" фокусируемся на инпуте\n * после этого `onPaste` вызывается у инпута и всплывает.\n */\nexport class HiddenInput extends React.Component<Props> {\n  public render() {\n    const { nodeRef, ...props } = this.props;\n    return (\n      <input\n        {...props}\n        ref={nodeRef}\n        type=\"text\"\n        tabIndex={-1}\n        onBlur={cap}\n        onFocus={cap}\n        onChange={cap}\n        className={className}\n      />\n    );\n  }\n}\n"]}
+{"version":3,"sources":["HiddenInput.tsx"],"names":["React","EmotionConsumer","cap","e","stopPropagation","HiddenInput","render","props","nodeRef","emotion","className","css","Component"],"mappings":"oXAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,eAAT,QAAgC,2BAAhC;;;;;;AAMA,IAAMC,GAA4B,GAAG,SAA/BA,GAA+B,CAACC,CAAD,UAAOA,CAAC,CAACC,eAAF,EAAP,EAArC;;AAEA;AACA;AACA;AACA;AACA;AACA,WAAaC,WAAb;AACSC,EAAAA,MADT,GACE,kBAAgB;AACd,sBAA8B,KAAKC,KAAnC,CAAQC,OAAR,eAAQA,OAAR,CAAoBD,KAApB;AACA;AACE,0BAAC,eAAD;AACG,gBAACE,OAAD,EAAa;AACZ,YAAMC,SAAS,GAAGD,OAAO,CAACE,GAAX,kUAAf;;;;;;;;;;;AAWA;AACE;AACMJ,UAAAA,KADN;AAEE,YAAA,GAAG,EAAEC,OAFP;AAGE,YAAA,IAAI,EAAC,MAHP;AAIE,YAAA,QAAQ,EAAE,CAAC,CAJb;AAKE,YAAA,MAAM,EAAEN,GALV;AAME,YAAA,OAAO,EAAEA,GANX;AAOE,YAAA,QAAQ,EAAEA,GAPZ;AAQE,YAAA,SAAS,EAAEQ,SARb,IADF;;;AAYD,OAzBH,CADF;;;AA6BD,GAhCH,sBAAiCV,KAAK,CAACY,SAAvC","sourcesContent":["import React from 'react';\n\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\n\ninterface Props extends React.HTMLAttributes<HTMLInputElement> {\n  nodeRef: (ref: HTMLInputElement | null) => void;\n}\n\nconst cap: React.ReactEventHandler = (e) => e.stopPropagation();\n\n/**\n * В **IE11** событие `onPaste` вызывается только у редактируемых элементов: `input`, `textarea`, `[contenteditable]`.\n * Для решения этой проблемы, перед \"вставкой\" фокусируемся на инпуте\n * после этого `onPaste` вызывается у инпута и всплывает.\n */\nexport class HiddenInput extends React.Component<Props> {\n  public render() {\n    const { nodeRef, ...props } = this.props;\n    return (\n      <EmotionConsumer>\n        {(emotion) => {\n          const className = emotion.css`\n            position: absolute;\n            width: 1px;\n            height: 0;\n            border: 0;\n            outline: 0;\n            margin: 0;\n            padding: 0;\n            overflow: hidden;\n            opacity: 0;\n          `;\n          return (\n            <input\n              {...props}\n              ref={nodeRef}\n              type=\"text\"\n              tabIndex={-1}\n              onBlur={cap}\n              onFocus={cap}\n              onChange={cap}\n              className={className}\n            />\n          );\n        }}\n      </EmotionConsumer>\n    );\n  }\n}\n"]}

package/internal/InputLikeText/InputLikeText/InputLikeText.js

@@ -11,24 +11,26 @@ var _class, _class2, _temp; // TODO: Enable this rule in functional components.
 import React from 'react';
 import ReactDOM from 'react-dom';
 import debounce from 'lodash.debounce';
-import { isNonNullable } from "../../../lib/utils";
+import { globalObject } from '@skbkontur/global-object';
+import { isFunction, isNonNullable } from "../../../lib/utils";
 import { isKeyTab, isShortcutPaste } from "../../../lib/events/keyboard/identifiers";
 import { MouseDrag } from "../../../lib/events/MouseDrag";
 import { isEdge, isIE11, isMobile } from "../../../lib/client";
-import { removeAllSelections, selectNodeContents } from "../../../components/DateInput/helpers/SelectionHelpers";
-import { styles as jsInputStyles } from "../../../components/Input/Input.styles";
-import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { removeAllSelections, selectNodeContents } from "../../../lib/dom/selectionHelpers";
+import { getStyles as getJsInputStyles } from "../../../components/Input/Input.styles";
 import { CommonWrapper } from "../../CommonWrapper";
-import { cx } from "../../../lib/theming/Emotion";
+import { EmotionConsumer } from "../../../lib/theming/Emotion";
 import { findRenderContainer } from "../../../lib/listenFocusOutside";
 import { rootNode } from "../../../lib/rootNode";
 import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { isTheme2022 } from "../../../lib/theming/ThemeHelpers";
 import { InputLayoutAside } from "../../../components/Input/InputLayout/InputLayoutAside";
 import { InputLayoutContext, InputLayoutContextDefault } from "../../../components/Input/InputLayout/InputLayoutContext";
-import { renderTarget } from "../../../lib/SSRSafe";
+import { isInstanceOf } from "../../../lib/isInstanceOf";
+import { FocusControlWrapper } from "../../FocusControlWrapper";
+import { ThemeConsumer } from "../../../lib/theming/ThemeContext";
 import { HiddenInput } from "../HiddenInput";
-import { styles } from "../InputLikeText.styles";
+import { getStyles } from "../InputLikeText.styles";
 export var InputLikeTextDataTids = {
   root: 'InputLikeText__root',
   input: 'InputLikeText__input',
@@ -71,7 +73,7 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
         return;
       }
 
-      if (isIE11 && findRenderContainer(node, renderTarget.body)) {
+      if (isIE11 && globalObject.document && findRenderContainer(node, globalObject.document.body)) {
         // Code below causes Popup to close after triggering the focus event on the body in IE11
         return;
       }
@@ -83,16 +85,16 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
       _this.selectNodeContentsDebounced(node, start, end);
 
       if (_this.focusTimeout) {
-        clearInterval(_this.focusTimeout);
+        globalObject.clearInterval(_this.focusTimeout);
       }
 
-      _this.focusTimeout = window.setTimeout(function () {
+      _this.focusTimeout = globalObject.setTimeout(function () {
         return (isIE11 || isEdge) && _this.node && _this.node.focus();
       }, 0);
     };
 
     _this.renderMain = function (props) {
-      var _cx, _cx2, _cx3;
+      var _this$emotion$cx, _this$emotion$cx2, _this$emotion$cx3;
 
       var innerRef = props.innerRef,
           tabIndex = props.tabIndex,
@@ -129,15 +131,23 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
         text: suffix,
         side: "right"
       }) : _this.renderRightSide();
-      var className = cx(styles.root(), jsInputStyles.root(_this.theme), _this.getSizeClassName(), (_cx = {}, _cx[jsInputStyles.disabled(_this.theme)] = !!disabled, _cx[jsInputStyles.borderless()] = !!borderless, _cx[jsInputStyles.focus(_this.theme)] = focused, _cx[jsInputStyles.hovering(_this.theme)] = !focused && !disabled && !warning && !error && !borderless, _cx[jsInputStyles.blink(_this.theme)] = blinking, _cx[jsInputStyles.warning(_this.theme)] = !!warning, _cx[jsInputStyles.error(_this.theme)] = !!error, _cx[jsInputStyles.focusFallback(_this.theme)] = focused && (isIE11 || isEdge), _cx[jsInputStyles.warningFallback(_this.theme)] = !!warning && (isIE11 || isEdge), _cx[jsInputStyles.errorFallback(_this.theme)] = !!error && (isIE11 || isEdge), _cx[jsInputStyles.hideBlinkingCursor()] = isMobile, _cx));
-      var wrapperClass = cx(jsInputStyles.wrapper(), (_cx2 = {}, _cx2[styles.userSelectContain()] = focused, _cx2));
+      var jsInputStyles = getJsInputStyles(_this.emotion);
+      var styles = getStyles(_this.emotion);
+
+      var className = _this.emotion.cx(styles.root(), jsInputStyles.root(_this.theme), _this.getSizeClassName(), (_this$emotion$cx = {}, _this$emotion$cx[jsInputStyles.disabled(_this.theme)] = !!disabled, _this$emotion$cx[jsInputStyles.borderless()] = !!borderless, _this$emotion$cx[jsInputStyles.focus(_this.theme)] = focused, _this$emotion$cx[jsInputStyles.hovering(_this.theme)] = !focused && !disabled && !warning && !error && !borderless, _this$emotion$cx[jsInputStyles.blink(_this.theme)] = blinking, _this$emotion$cx[jsInputStyles.warning(_this.theme)] = !!warning, _this$emotion$cx[jsInputStyles.error(_this.theme)] = !!error, _this$emotion$cx[jsInputStyles.focusFallback(_this.theme)] = focused && (isIE11 || isEdge), _this$emotion$cx[jsInputStyles.warningFallback(_this.theme)] = !!warning && (isIE11 || isEdge), _this$emotion$cx[jsInputStyles.errorFallback(_this.theme)] = !!error && (isIE11 || isEdge), _this$emotion$cx[jsInputStyles.hideBlinkingCursor()] = isMobile, _this$emotion$cx));
+
+      var wrapperClass = _this.emotion.cx(jsInputStyles.wrapper(), (_this$emotion$cx2 = {}, _this$emotion$cx2[styles.userSelectContain()] = focused, _this$emotion$cx2));
+
       var context = InputLayoutContextDefault;
       Object.assign(context, {
         disabled: disabled,
         focused: focused,
         size: size
       });
-      return /*#__PURE__*/React.createElement("span", _extends({
+      return /*#__PURE__*/React.createElement(FocusControlWrapper, {
+        disabled: disabled,
+        onBlurWhenDisabled: _this.resetFocus
+      }, /*#__PURE__*/React.createElement("span", _extends({
         "data-tid": InputLikeTextDataTids.root
       }, rest, {
         className: className,
@@ -163,10 +173,10 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
         className: wrapperClass
       }, /*#__PURE__*/React.createElement("span", {
         "data-tid": InputLikeTextDataTids.input,
-        className: cx(jsInputStyles.input(_this.theme), (_cx3 = {}, _cx3[styles.absolute()] = !takeContentWidth, _cx3[jsInputStyles.inputFocus(_this.theme)] = focused, _cx3[jsInputStyles.inputDisabled(_this.theme)] = disabled, _cx3))
+        className: _this.emotion.cx(jsInputStyles.input(_this.theme), (_this$emotion$cx3 = {}, _this$emotion$cx3[styles.absolute()] = !takeContentWidth, _this$emotion$cx3[jsInputStyles.inputFocus(_this.theme)] = focused, _this$emotion$cx3[jsInputStyles.inputDisabled(_this.theme)] = disabled, _this$emotion$cx3))
       }, _this.props.children), _this.renderPlaceholder()), rightSide, isIE11 && focused && /*#__PURE__*/React.createElement(HiddenInput, {
         nodeRef: _this.hiddenInputRef
-      })));
+      }))));
     };
 
     _this.renderLeftIcon = function () {
@@ -178,21 +188,22 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
     };
 
     _this.renderIcon = function (icon, className) {
-      var _cx4;
+      var _this$emotion$cx4;
 
       if (!icon) {
         return null;
       }
 
       var disabled = _this.props.disabled;
-      var iconNode = icon instanceof Function ? icon() : icon;
+      var iconNode = isFunction(icon) ? icon() : icon;
+      var jsInputStyles = getJsInputStyles(_this.emotion);
       return /*#__PURE__*/React.createElement("span", {
-        className: cx(jsInputStyles.icon(), className, jsInputStyles.useDefaultColor(_this.theme), (_cx4 = {}, _cx4[jsInputStyles.iconDisabled()] = disabled, _cx4))
+        className: _this.emotion.cx(jsInputStyles.icon(), className, jsInputStyles.useDefaultColor(_this.theme), (_this$emotion$cx4 = {}, _this$emotion$cx4[jsInputStyles.iconDisabled()] = disabled, _this$emotion$cx4))
       }, iconNode);
     };
 
     _this.renderPrefix = function () {
-      var _cx5;
+      var _this$emotion$cx5;
 
       var _this$props = _this.props,
           prefix = _this$props.prefix,
@@ -202,13 +213,14 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
         return null;
       }
 
+      var jsInputStyles = getJsInputStyles(_this.emotion);
       return /*#__PURE__*/React.createElement("span", {
-        className: cx(jsInputStyles.prefix(_this.theme), (_cx5 = {}, _cx5[jsInputStyles.prefixDisabled(_this.theme)] = disabled, _cx5))
+        className: _this.emotion.cx(jsInputStyles.prefix(_this.theme), (_this$emotion$cx5 = {}, _this$emotion$cx5[jsInputStyles.prefixDisabled(_this.theme)] = disabled, _this$emotion$cx5))
       }, prefix);
     };
 
     _this.renderSuffix = function () {
-      var _cx6;
+      var _this$emotion$cx6;
 
       var _this$props2 = _this.props,
           suffix = _this$props2.suffix,
@@ -218,8 +230,9 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
         return null;
       }
 
+      var jsInputStyles = getJsInputStyles(_this.emotion);
       return /*#__PURE__*/React.createElement("span", {
-        className: cx(jsInputStyles.suffix(_this.theme), (_cx6 = {}, _cx6[jsInputStyles.suffixDisabled(_this.theme)] = disabled, _cx6))
+        className: _this.emotion.cx(jsInputStyles.suffix(_this.theme), (_this$emotion$cx6 = {}, _this$emotion$cx6[jsInputStyles.suffixDisabled(_this.theme)] = disabled, _this$emotion$cx6))
       }, suffix);
     };
 
@@ -232,6 +245,7 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
         return null;
       }
 
+      var jsInputStyles = getJsInputStyles(_this.emotion);
       return /*#__PURE__*/React.createElement("span", {
         className: jsInputStyles.sideContainer()
       }, leftIcon, prefix);
@@ -246,8 +260,9 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
         return null;
       }
 
+      var jsInputStyles = getJsInputStyles(_this.emotion);
       return /*#__PURE__*/React.createElement("span", {
-        className: cx(jsInputStyles.sideContainer(), jsInputStyles.rightContainer())
+        className: _this.emotion.cx(jsInputStyles.sideContainer(), jsInputStyles.rightContainer())
       }, rightIcon, suffix);
     };
 
@@ -260,10 +275,11 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
       var hasValue = isNonNullable(children) && children !== '';
 
       if (!hasValue && placeholder) {
-        var _cx7;
+        var _this$emotion$cx7;
 
+        var jsInputStyles = getJsInputStyles(_this.emotion);
         return /*#__PURE__*/React.createElement("span", {
-          className: cx(jsInputStyles.placeholder(_this.theme), (_cx7 = {}, _cx7[jsInputStyles.placeholderDisabled(_this.theme)] = disabled, _cx7[jsInputStyles.placeholderFocus(_this.theme)] = focused, _cx7))
+          className: _this.emotion.cx(jsInputStyles.placeholder(_this.theme), (_this$emotion$cx7 = {}, _this$emotion$cx7[jsInputStyles.placeholderDisabled(_this.theme)] = disabled, _this$emotion$cx7[jsInputStyles.placeholderFocus(_this.theme)] = focused, _this$emotion$cx7))
         }, placeholder);
       }
 
@@ -271,7 +287,7 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
     };
 
     _this.handleDocumentMouseDown = function (e) {
-      if (_this.state.focused && _this.node && e.target instanceof Node && !_this.node.contains(e.target)) {
+      if (_this.state.focused && _this.node && isInstanceOf(e.target, globalObject.Node) && !_this.node.contains(e.target)) {
         _this.defrost();
       }
     };
@@ -293,7 +309,7 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
 
       if (isIE11 && isShortcutPaste(e) && _this.hiddenInput) {
         _this.frozen = true;
-        setTimeout(function () {
+        globalObject.setTimeout(function () {
           if (_this.lastSelectedInnerNode) {
             var _this2;
 
@@ -314,8 +330,11 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
     };
 
     _this.handleMouseDragStart = function (e) {
+      var _globalObject$documen;
+
       _this.dragging = true;
-      renderTarget.documentElement.classList.add(styles.userSelectNone());
+      var styles = getStyles(_this.emotion);
+      (_globalObject$documen = globalObject.document) == null ? void 0 : _globalObject$documen.documentElement.classList.add(styles.userSelectNone());
 
       if (_this.props.onMouseDragStart) {
         _this.props.onMouseDragStart(e);
@@ -323,25 +342,30 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
     };
 
     _this.handleMouseDragEnd = function (e) {
-      // Дожидаемся onMouseUp
-      setTimeout(function () {
+      var _globalObject$documen2; // Дожидаемся onMouseUp
+
+
+      globalObject.setTimeout(function () {
         _this.dragging = false;
 
         if (_this.props.onMouseDragEnd) {
           _this.props.onMouseDragEnd(e);
         }
       }, 0);
-      renderTarget.documentElement.classList.remove(styles.userSelectNone());
+      var styles = getStyles(_this.emotion);
+      (_globalObject$documen2 = globalObject.document) == null ? void 0 : _globalObject$documen2.documentElement.classList.remove(styles.userSelectNone());
     };
 
     _this.handleFocus = function (e) {
       if (isMobile) {
-        e.target.setAttribute('contenteditable', 'true');
+        var _this$node;
+
+        (_this$node = _this.node) == null ? void 0 : _this$node.setAttribute('contenteditable', 'true');
       }
 
       if (_this.props.disabled) {
-        if (isIE11) {
-          selectNodeContents(renderTarget.body, 0, 0);
+        if (isIE11 && globalObject.document) {
+          selectNodeContents(globalObject.document.body, 0, 0);
         }
 
         return;
@@ -374,11 +398,33 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
       }
     };
 
+    _this.resetFocus = function () {
+      _this.selectNodeContentsDebounced.cancel();
+
+      if (isMobile) {
+        var _this$node2;
+
+        (_this$node2 = _this.node) == null ? void 0 : _this$node2.removeAttribute('contenteditable');
+      }
+
+      if ((isIE11 || isEdge) && _this.frozenBlur) {
+        _this.frozenBlur = false;
+      }
+
+      removeAllSelections();
+
+      _this.setState({
+        focused: false
+      });
+    };
+
     _this.handleBlur = function (e) {
       _this.selectNodeContentsDebounced.cancel();
 
       if (isMobile) {
-        e.target.removeAttribute('contenteditable');
+        var _this$node3;
+
+        (_this$node3 = _this.node) == null ? void 0 : _this$node3.removeAttribute('contenteditable');
       }
 
       if (_this.props.disabled) {
@@ -401,9 +447,7 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
         focused: false
       });
 
-      if (_this.props.onBlur) {
-        _this.props.onBlur(e);
-      }
+      _this.props.onBlur == null ? void 0 : _this.props.onBlur(e);
     };
 
     _this.hiddenInputRef = function (el) {
@@ -424,18 +468,20 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
     };
 
     _this.getSizeClassName = function () {
-      var _cx8, _cx9, _cx10;
+      var _this$emotion$cx8, _this$emotion$cx9, _this$emotion$cx10;
+
+      var jsInputStyles = getJsInputStyles(_this.emotion);
 
       switch (_this.getProps().size) {
         case 'large':
-          return cx((_cx8 = {}, _cx8[jsInputStyles.sizeLarge(_this.theme)] = true, _cx8[jsInputStyles.sizeLargeFallback(_this.theme)] = isIE11 || isEdge, _cx8));
+          return _this.emotion.cx((_this$emotion$cx8 = {}, _this$emotion$cx8[jsInputStyles.sizeLarge(_this.theme)] = true, _this$emotion$cx8[jsInputStyles.sizeLargeFallback(_this.theme)] = isIE11 || isEdge, _this$emotion$cx8));
 
         case 'medium':
-          return cx((_cx9 = {}, _cx9[jsInputStyles.sizeMedium(_this.theme)] = true, _cx9[jsInputStyles.sizeMediumFallback(_this.theme)] = isIE11 || isEdge, _cx9));
+          return _this.emotion.cx((_this$emotion$cx9 = {}, _this$emotion$cx9[jsInputStyles.sizeMedium(_this.theme)] = true, _this$emotion$cx9[jsInputStyles.sizeMediumFallback(_this.theme)] = isIE11 || isEdge, _this$emotion$cx9));
 
         case 'small':
         default:
-          return cx((_cx10 = {}, _cx10[jsInputStyles.sizeSmall(_this.theme)] = true, _cx10[jsInputStyles.sizeSmallFallback(_this.theme)] = isIE11 || isEdge, _cx10));
+          return _this.emotion.cx((_this$emotion$cx10 = {}, _this$emotion$cx10[jsInputStyles.sizeSmall(_this.theme)] = true, _this$emotion$cx10[jsInputStyles.sizeSmallFallback(_this.theme)] = isIE11 || isEdge, _this$emotion$cx10));
       }
     };
 
@@ -477,7 +523,7 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
     this.setState({
       blinking: true
     }, function () {
-      _this3.blinkTimeout = window.setTimeout(function () {
+      _this3.blinkTimeout = globalObject.setTimeout(function () {
         return _this3.setState({
           blinking: false
         });
@@ -491,32 +537,39 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
   ;
 
   _proto.componentDidMount = function componentDidMount() {
+    var _globalObject$documen3, _globalObject$documen4;
+
     if (this.node) {
       MouseDrag.listen(this.node).onMouseDragStart(this.handleMouseDragStart).onMouseDragEnd(this.handleMouseDragEnd);
     }
 
-    renderTarget.addEventListener('mousedown', this.handleDocumentMouseDown);
-    renderTarget.addEventListener('keydown', this.handleDocumentKeyDown);
+    (_globalObject$documen3 = globalObject.document) == null ? void 0 : _globalObject$documen3.addEventListener('mousedown', this.handleDocumentMouseDown);
+    (_globalObject$documen4 = globalObject.document) == null ? void 0 : _globalObject$documen4.addEventListener('keydown', this.handleDocumentKeyDown);
   };
 
   _proto.componentWillUnmount = function componentWillUnmount() {
+    var _globalObject$documen5, _globalObject$documen6;
+
     if (this.blinkTimeout) {
-      clearTimeout(this.blinkTimeout);
+      globalObject.clearTimeout(this.blinkTimeout);
     }
 
     MouseDrag.stop(this.node);
-    renderTarget.removeEventListener('mousedown', this.handleDocumentMouseDown);
-    renderTarget.removeEventListener('keydown', this.handleDocumentKeyDown);
+    (_globalObject$documen5 = globalObject.document) == null ? void 0 : _globalObject$documen5.removeEventListener('mousedown', this.handleDocumentMouseDown);
+    (_globalObject$documen6 = globalObject.document) == null ? void 0 : _globalObject$documen6.removeEventListener('keydown', this.handleDocumentKeyDown);
   };
 
   _proto.render = function render() {
     var _this4 = this;
 
-    return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
-      _this4.theme = theme;
-      return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
-        rootNodeRef: _this4.setRootNode
-      }, _this4.props), _this4.renderMain);
+    return /*#__PURE__*/React.createElement(EmotionConsumer, null, function (emotion) {
+      _this4.emotion = emotion;
+      return /*#__PURE__*/React.createElement(ThemeConsumer, null, function (theme) {
+        _this4.theme = theme;
+        return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+          rootNodeRef: _this4.setRootNode
+        }, _this4.props), _this4.renderMain);
+      });
     });
   };
 
@@ -525,6 +578,8 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
       right = false;
     }
 
+    var jsInputStyles = getJsInputStyles(this.emotion);
+
     switch (this.getProps().size) {
       case 'large':
         return right ? jsInputStyles.rightIconLarge(this.theme) : jsInputStyles.leftIconLarge(this.theme);
@@ -539,6 +594,6 @@ export var InputLikeText = rootNode(_class = (_temp = _class2 = /*#__PURE__*/fun
   };
 
   return InputLikeText;
-}(React.Component), _class2.__KONTUR_REACT_UI__ = 'InputLikeText', _class2.defaultProps = {
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'InputLikeText', _class2.displayName = 'InputLikeText', _class2.defaultProps = {
   size: 'small'
 }, _temp)) || _class;