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

package/cjs/internal/InputLikeText/InputLikeText.styles.js

@@ -1,39 +1,36 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;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;
 
-var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+var styles = exports.styles = (0, _Emotion.memoizeStyle)({
+  root: function root() {
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-right: 10px;\n    "])));
 
-var getStyles = exports.getStyles = function getStyles(emotion) {return (
-    (0, _Emotion.memoizeStyle)({
-      root: function root() {
-        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n        padding-right: 10px;\n      "])));
 
+  },
 
-      },
+  absolute: function absolute() {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      top: 0;\n    "])));
 
-      absolute: function absolute() {
-        return emotion.css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n        position: absolute;\n        top: 0;\n      "])));
 
 
+  },
 
-      },
+  userSelectContain: function userSelectContain() {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      user-select: text;\n      -ms-user-select: element;\n    "])));
 
-      userSelectContain: function userSelectContain() {
-        return emotion.css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n        user-select: text;\n        -ms-user-select: element;\n      "])));
 
 
+  },
 
-      },
+  userSelectNone: function userSelectNone() {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      user-select: none;\n    "])));
 
-      userSelectNone: function userSelectNone() {
-        return emotion.css(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n        user-select: none;\n      "])));
 
+  },
 
-      },
+  rightSide: function rightSide() {
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-left: 0;\n      visibility: visible;\n    "])));
 
-      rightSide: function rightSide() {
-        return emotion.css(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n        padding-left: 0;\n        visibility: visible;\n      "])));
 
 
-
-      }
-    }));};
+  }
+});

package/cjs/internal/InputLikeText/InputLikeText.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","getStyles","exports","emotion","memoizeStyle","root","css","_taggedTemplateLiteralLoose2","default","absolute","userSelectContain","userSelectNone","rightSide"],"sources":["InputLikeText.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    root() {\n      return emotion.css`\n        padding-right: 10px;\n      `;\n    },\n\n    absolute() {\n      return emotion.css`\n        position: absolute;\n        top: 0;\n      `;\n    },\n\n    userSelectContain() {\n      return emotion.css`\n        user-select: text;\n        -ms-user-select: element;\n      `;\n    },\n\n    userSelectNone() {\n      return emotion.css`\n        user-select: none;\n      `;\n    },\n\n    rightSide() {\n      return emotion.css`\n        padding-left: 0;\n        visibility: visible;\n      `;\n    },\n  });\n"],"mappings":";;AAEA,IAAAA,QAAA,GAAAC,OAAA,8BAAyD,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;AAElD,IAAMC,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,SAAZA,SAASA,CAAIE,OAAgB;IACxC,IAAAC,qBAAY,EAAC;MACXC,IAAI,WAAAA,KAAA,EAAG;QACL,OAAOF,OAAO,CAACG,GAAG,CAAAV,eAAA,KAAAA,eAAA,OAAAW,4BAAA,CAAAC,OAAA;;;MAGpB,CAAC;;MAEDC,QAAQ,WAAAA,SAAA,EAAG;QACT,OAAON,OAAO,CAACG,GAAG,CAAAT,gBAAA,KAAAA,gBAAA,OAAAU,4BAAA,CAAAC,OAAA;;;;MAIpB,CAAC;;MAEDE,iBAAiB,WAAAA,kBAAA,EAAG;QAClB,OAAOP,OAAO,CAACG,GAAG,CAAAR,gBAAA,KAAAA,gBAAA,OAAAS,4BAAA,CAAAC,OAAA;;;;MAIpB,CAAC;;MAEDG,cAAc,WAAAA,eAAA,EAAG;QACf,OAAOR,OAAO,CAACG,GAAG,CAAAP,gBAAA,KAAAA,gBAAA,OAAAQ,4BAAA,CAAAC,OAAA;;;MAGpB,CAAC;;MAEDI,SAAS,WAAAA,UAAA,EAAG;QACV,OAAOT,OAAO,CAACG,GAAG,CAAAN,gBAAA,KAAAA,gBAAA,OAAAO,4BAAA,CAAAC,OAAA;;;;MAIpB;IACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","styles","exports","memoizeStyle","root","css","_taggedTemplateLiteralLoose2","default","absolute","userSelectContain","userSelectNone","rightSide"],"sources":["InputLikeText.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n  root() {\n    return css`\n      padding-right: 10px;\n    `;\n  },\n\n  absolute() {\n    return css`\n      position: absolute;\n      top: 0;\n    `;\n  },\n\n  userSelectContain() {\n    return css`\n      user-select: text;\n      -ms-user-select: element;\n    `;\n  },\n\n  userSelectNone() {\n    return css`\n      user-select: none;\n    `;\n  },\n\n  rightSide() {\n    return css`\n      padding-left: 0;\n      visibility: visible;\n    `;\n  },\n});\n"],"mappings":"oRAAA,IAAAA,QAAA,GAAAC,OAAA,8BAA8D,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;AAEvD,IAAMC,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,IAAAE,qBAAY,EAAC;EACjCC,IAAI,WAAAA,KAAA,EAAG;IACL,WAAOC,YAAG,EAAAT,eAAA,KAAAA,eAAA,OAAAU,4BAAA,CAAAC,OAAA;;;EAGZ,CAAC;;EAEDC,QAAQ,WAAAA,SAAA,EAAG;IACT,WAAOH,YAAG,EAAAR,gBAAA,KAAAA,gBAAA,OAAAS,4BAAA,CAAAC,OAAA;;;;EAIZ,CAAC;;EAEDE,iBAAiB,WAAAA,kBAAA,EAAG;IAClB,WAAOJ,YAAG,EAAAP,gBAAA,KAAAA,gBAAA,OAAAQ,4BAAA,CAAAC,OAAA;;;;EAIZ,CAAC;;EAEDG,cAAc,WAAAA,eAAA,EAAG;IACf,WAAOL,YAAG,EAAAN,gBAAA,KAAAA,gBAAA,OAAAO,4BAAA,CAAAC,OAAA;;;EAGZ,CAAC;;EAEDI,SAAS,WAAAA,UAAA,EAAG;IACV,WAAON,YAAG,EAAAL,gBAAA,KAAAA,gBAAA,OAAAM,4BAAA,CAAAC,OAAA;;;;EAIZ;AACF,CAAC,CAAC","ignoreList":[]}

package/cjs/internal/InternalMaskedInput/InternalMaskedInput.d.ts

@@ -31,8 +31,6 @@ export declare class InternalMaskedInput extends React.PureComponent<InternalMas
     private getProps;
     input: HTMLInputElement | null;
     private theme;
-    private emotion;
-    private styles;
     private reactInputMask;
     constructor(props: InternalMaskedInputProps);
     componentDidMount(): void;

package/cjs/internal/InternalMaskedInput/InternalMaskedInput.js

@@ -1,13 +1,12 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.MaskedInputDataTids = exports.InternalMaskedInput = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _reactInputMask = _interopRequireDefault(require("react-input-mask"));
 
-
 var _utils = require("../../lib/utils");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _MaskCharLowLine = require("../MaskCharLowLine");
 var _Emotion = require("../../lib/theming/Emotion");
 var _createPropsGetter = require("../../lib/createPropsGetter");
-var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _InternalMaskedInput2 = require("./InternalMaskedInput.styles");var _excluded = ["maskChar", "alwaysShowMask", "hasLeftIcon", "hasRightIcon", "maxLength", "onValueChange", "onUnexpectedInput", "defaultValue", "style"];
 
@@ -55,8 +54,6 @@ InternalMaskedInput = exports.InternalMaskedInput = /*#__PURE__*/function (_Reac
 
 
 
-
-
   function InternalMaskedInput(_props) {var _this;
     _this = _React$PureComponent.call(this, _props) || this;_this.getProps = (0, _createPropsGetter.createPropsGetter)(InternalMaskedInput.defaultProps);_this.input = null;_this.reactInputMask = null;_this.
 
@@ -135,15 +132,6 @@ InternalMaskedInput = exports.InternalMaskedInput = /*#__PURE__*/function (_Reac
 
 
 
-
-
-
-
-
-
-
-
-
 
 
 
@@ -248,5 +236,5 @@ InternalMaskedInput = exports.InternalMaskedInput = /*#__PURE__*/function (_Reac
         _this.props.onUnexpectedInput(_this.state.value);
       }
     };_this.state = { value: _this.getValue(_props), originValue: _this.getValue(_props), emptyValue: '', focused: false };return _this;}(0, _inheritsLoose2.default)(InternalMaskedInput, _React$PureComponent);var _proto = InternalMaskedInput.prototype;_proto.componentDidMount = function componentDidMount() {if (this.reactInputMask) {// FIXME: принудительно вызываем beforeMaskedValueChange, чтобы получить emptyValue
-      this.reactInputMask.forceUpdate();}};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.props.value !== prevProps.value) {this.setState({ value: this.props.value ? this.props.value.toString() : '' });}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_Emotion.EmotionConsumer, null, function (emotion) {_this2.emotion = emotion;_this2.styles = (0, _InternalMaskedInput2.getStyles)(_this2.emotion);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});});};_proto.renderMain = function renderMain() {var _this$props = this.props,maskChar = _this$props.maskChar,alwaysShowMask = _this$props.alwaysShowMask,hasLeftIcon = _this$props.hasLeftIcon,hasRightIcon = _this$props.hasRightIcon,maxLength = _this$props.maxLength,onValueChange = _this$props.onValueChange,onUnexpectedInput = _this$props.onUnexpectedInput,defaultValue = _this$props.defaultValue,style = _this$props.style,inputProps = (0, _objectWithoutPropertiesLoose2.default)(_this$props, _excluded);var _this$state = this.state,emptyValue = _this$state.emptyValue,value = _this$state.value,originValue = _this$state.originValue;var leftHelper = (style == null ? void 0 : style.textAlign) !== 'right' && /*#__PURE__*/_react.default.createElement("span", { style: { color: 'transparent' } }, emptyValue.slice(0, originValue.length));var styles = this.styles;var leftClass = (style == null ? void 0 : style.textAlign) !== 'right' && styles.inputMaskLeft();var rightHelper = emptyValue.slice(originValue.length).split('').map(function (_char, i) {return _char === '_' ? /*#__PURE__*/_react.default.createElement(_MaskCharLowLine.MaskCharLowLine, { key: i }) : _char;});return /*#__PURE__*/_react.default.createElement("span", { "data-tid": MaskedInputDataTids.root, className: styles.container(), "x-ms-format-detection": "none" }, /*#__PURE__*/_react.default.createElement(_reactInputMask.default, (0, _extends2.default)({}, inputProps, { maskChar: null // @ts-expect-error InternalMaskedInput will be deleted in 5.0
-        , beforeMaskedValueChange: this.preprocess, alwaysShowMask: false, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur, value: value, inputRef: this.refInput, ref: this.refMaskedInput, style: (0, _extends2.default)({}, style) })), this.isMaskVisible() && /*#__PURE__*/_react.default.createElement("span", { className: this.emotion.cx(styles.inputMask(this.theme), leftClass) }, leftHelper, rightHelper));};return InternalMaskedInput;}(_react.default.PureComponent);InternalMaskedInput.__KONTUR_REACT_UI__ = 'InternalMaskedInput';InternalMaskedInput.displayName = 'InternalMaskedInput';InternalMaskedInput.defaultProps = { maskChar: '_' };
+      this.reactInputMask.forceUpdate();}};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.props.value !== prevProps.value) {this.setState({ value: this.props.value ? this.props.value.toString() : '' });}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this$props = this.props,maskChar = _this$props.maskChar,alwaysShowMask = _this$props.alwaysShowMask,hasLeftIcon = _this$props.hasLeftIcon,hasRightIcon = _this$props.hasRightIcon,maxLength = _this$props.maxLength,onValueChange = _this$props.onValueChange,onUnexpectedInput = _this$props.onUnexpectedInput,defaultValue = _this$props.defaultValue,style = _this$props.style,inputProps = (0, _objectWithoutPropertiesLoose2.default)(_this$props, _excluded);var _this$state = this.state,emptyValue = _this$state.emptyValue,value = _this$state.value,originValue = _this$state.originValue;var leftHelper = (style == null ? void 0 : style.textAlign) !== 'right' && /*#__PURE__*/_react.default.createElement("span", { style: { color: 'transparent' } }, emptyValue.slice(0, originValue.length));var leftClass = (style == null ? void 0 : style.textAlign) !== 'right' && _InternalMaskedInput2.styles.inputMaskLeft();var rightHelper = emptyValue.slice(originValue.length).split('').map(function (_char, i) {return _char === '_' ? /*#__PURE__*/_react.default.createElement(_MaskCharLowLine.MaskCharLowLine, { key: i }) : _char;});return /*#__PURE__*/_react.default.createElement("span", { "data-tid": MaskedInputDataTids.root, className: _InternalMaskedInput2.styles.container(), "x-ms-format-detection": "none" }, /*#__PURE__*/_react.default.createElement(_reactInputMask.default, (0, _extends2.default)({}, inputProps, { maskChar: null // @ts-expect-error InternalMaskedInput will be deleted in 5.0
+        , beforeMaskedValueChange: this.preprocess, alwaysShowMask: false, onChange: this.handleChange, onFocus: this.handleFocus, onBlur: this.handleBlur, value: value, inputRef: this.refInput, ref: this.refMaskedInput, style: (0, _extends2.default)({}, style) })), this.isMaskVisible() && /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)(_InternalMaskedInput2.styles.inputMask(this.theme), leftClass), translate: "no" }, leftHelper, rightHelper));};return InternalMaskedInput;}(_react.default.PureComponent);InternalMaskedInput.__KONTUR_REACT_UI__ = 'InternalMaskedInput';InternalMaskedInput.displayName = 'InternalMaskedInput';InternalMaskedInput.defaultProps = { maskChar: '_' };

package/cjs/internal/InternalMaskedInput/InternalMaskedInput.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactInputMask","_utils","_MaskCharLowLine","_Emotion","_createPropsGetter","_ThemeContext","_InternalMaskedInput2","_excluded","MaskedInputDataTids","exports","root","InternalMaskedInput","_React$PureComponent","props","_this","call","getProps","createPropsGetter","defaultProps","input","reactInputMask","getValue","isNonNullable","value","toString","defaultValue","refInput","refMaskedInput","handleChange","event","target","state","handleUnexpectedInput","setState","originValue","onValueChange","onChange","handleFocus","focused","onFocus","handleBlur","onBlur","preprocess","newState","oldState","userInput","options","visibleMaskChars","Array","mask","length","fill","maskChar","split","forEach","char","index","permanents","includes","emptyValue","join","isMaskVisible","alwaysShowMask","onUnexpectedInput","_inheritsLoose2","default","_proto","prototype","componentDidMount","forceUpdate","componentDidUpdate","prevProps","render","_this2","createElement","EmotionConsumer","emotion","styles","getStyles","ThemeContext","Consumer","theme","renderMain","_this$props","hasLeftIcon","hasRightIcon","maxLength","style","inputProps","_objectWithoutPropertiesLoose2","_this$state","leftHelper","textAlign","color","slice","leftClass","inputMaskLeft","rightHelper","map","_char","i","MaskCharLowLine","key","className","container","_extends2","beforeMaskedValueChange","inputRef","ref","cx","inputMask","React","PureComponent","__KONTUR_REACT_UI__","displayName"],"sources":["InternalMaskedInput.tsx"],"sourcesContent":["import React from 'react';\nimport ReactInputMask, { InputState } from 'react-input-mask';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { isNonNullable } from '../../lib/utils';\nimport { Theme } from '../../lib/theming/Theme';\nimport { MaskCharLowLine } from '../MaskCharLowLine';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { getStyles } from './InternalMaskedInput.styles';\n\nexport interface InternalMaskedInputProps extends React.InputHTMLAttributes<HTMLInputElement> {\n  mask: string;\n  maskChar?: string | null;\n  formatChars?: { [key: string]: string };\n  alwaysShowMask?: boolean;\n  hasLeftIcon?: boolean;\n  hasRightIcon?: boolean;\n  onUnexpectedInput?: (value: string) => void;\n  onValueChange?: (value: string) => void;\n}\n\ninterface MaskedInputState {\n  value: string;\n\n  // Users can unmask value themselves. In these cases we take origin value length\n  originValue: string;\n\n  emptyValue: string;\n  focused: boolean;\n}\n\ntype DefaultProps = Required<Pick<InternalMaskedInputProps, 'maskChar'>>;\n\nexport const MaskedInputDataTids = {\n  root: 'MaskedInput__root',\n} as const;\n\n/** @deprecated Со следующей мажорной версии Input перестанет поддерживать маску.\n * todo: выпилить в 5 версии библиотеки.\n * */\nexport class InternalMaskedInput extends React.PureComponent<InternalMaskedInputProps, MaskedInputState> {\n  public static __KONTUR_REACT_UI__ = 'InternalMaskedInput';\n  public static displayName = 'InternalMaskedInput';\n\n  public static defaultProps: DefaultProps = {\n    maskChar: '_',\n  };\n\n  private getProps = createPropsGetter(InternalMaskedInput.defaultProps);\n\n  public input: HTMLInputElement | null = null;\n  private theme!: Theme;\n  private emotion!: Emotion;\n  private styles!: ReturnType<typeof getStyles>;\n  private reactInputMask: ReactInputMask | null = null;\n\n  public constructor(props: InternalMaskedInputProps) {\n    super(props);\n\n    this.state = {\n      value: this.getValue(props),\n      originValue: this.getValue(props),\n      emptyValue: '',\n      focused: false,\n    };\n  }\n\n  public componentDidMount() {\n    if (this.reactInputMask) {\n      // FIXME: принудительно вызываем beforeMaskedValueChange, чтобы получить emptyValue\n      this.reactInputMask.forceUpdate();\n    }\n  }\n\n  public componentDidUpdate(prevProps: InternalMaskedInputProps) {\n    if (this.props.value !== prevProps.value) {\n      this.setState({\n        value: this.props.value ? this.props.value.toString() : '',\n      });\n    }\n  }\n\n  public render() {\n    return (\n      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\n          this.styles = getStyles(this.emotion);\n          return (\n            <ThemeContext.Consumer>\n              {(theme) => {\n                this.theme = theme;\n                return this.renderMain();\n              }}\n            </ThemeContext.Consumer>\n          );\n        }}\n      </EmotionConsumer>\n    );\n  }\n\n  private renderMain() {\n    const {\n      maskChar,\n      alwaysShowMask,\n      hasLeftIcon,\n      hasRightIcon,\n      maxLength,\n      onValueChange,\n      onUnexpectedInput,\n      defaultValue,\n      style,\n      ...inputProps\n    } = this.props;\n    const { emptyValue, value, originValue } = this.state;\n\n    const leftHelper = style?.textAlign !== 'right' && (\n      <span style={{ color: 'transparent' }}>{emptyValue.slice(0, originValue.length)}</span>\n    );\n    const styles = this.styles;\n    const leftClass = style?.textAlign !== 'right' && styles.inputMaskLeft();\n\n    const rightHelper = emptyValue\n      .slice(originValue.length)\n      .split('')\n      .map((_char, i) => (_char === '_' ? <MaskCharLowLine key={i} /> : _char));\n\n    return (\n      <span data-tid={MaskedInputDataTids.root} className={styles.container()} x-ms-format-detection=\"none\">\n        <ReactInputMask\n          {...inputProps}\n          maskChar={null}\n          // @ts-expect-error InternalMaskedInput will be deleted in 5.0\n          beforeMaskedValueChange={this.preprocess}\n          alwaysShowMask={false}\n          onChange={this.handleChange}\n          onFocus={this.handleFocus}\n          onBlur={this.handleBlur}\n          value={value}\n          inputRef={this.refInput}\n          ref={this.refMaskedInput}\n          style={{ ...style }}\n        />\n        {this.isMaskVisible() && (\n          <span className={this.emotion.cx(styles.inputMask(this.theme), leftClass)}>\n            {leftHelper}\n            {rightHelper}\n          </span>\n        )}\n      </span>\n    );\n  }\n\n  private getValue = (props: InternalMaskedInputProps): string => {\n    if (isNonNullable(props.value)) {\n      return props.value.toString();\n    }\n\n    if (isNonNullable(props.defaultValue)) {\n      return props.defaultValue.toString();\n    }\n\n    return '';\n  };\n\n  private refInput = (input: HTMLInputElement | null) => {\n    this.input = input;\n  };\n\n  private refMaskedInput = (reactInputMask: ReactInputMask) => {\n    this.reactInputMask = reactInputMask;\n  };\n\n  private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    if (event.target.value === this.state.value) {\n      this.handleUnexpectedInput();\n    } else {\n      this.setState({ value: event.target.value, originValue: event.target.value });\n      if (this.props.onValueChange) {\n        this.props.onValueChange(event.target.value);\n      }\n      if (this.props.onChange) {\n        this.props.onChange(event);\n      }\n    }\n  };\n\n  private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    this.setState({ focused: true });\n\n    if (this.props.onFocus) {\n      this.props.onFocus(event);\n    }\n  };\n\n  private handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n    this.setState({ focused: false });\n\n    if (this.props.onBlur) {\n      this.props.onBlur(event);\n    }\n  };\n\n  private preprocess = (\n    newState: InputState,\n    oldState: InputState,\n    userInput: string,\n    options: Pick<InternalMaskedInputProps, 'mask'>,\n  ) => {\n    const visibleMaskChars = new Array(options.mask.length).fill(this.getProps().maskChar);\n\n    if (newState.value !== oldState.value && userInput === null) {\n      this.setState({\n        value: newState.value,\n        originValue: newState.value,\n      });\n    }\n\n    options.mask.split('').forEach((char: string, index: number) => {\n      // @ts-expect-error InternalMaskedInput will be deleted in 5.0\n      if (options.permanents.includes(index)) {\n        visibleMaskChars[index] = char;\n      }\n\n      if (newState.value[index]) {\n        visibleMaskChars[index] = newState.value[index];\n      }\n    });\n\n    const emptyValue = visibleMaskChars.join('');\n\n    if (this.state.emptyValue !== emptyValue) {\n      this.setState({\n        emptyValue,\n      });\n    }\n\n    return newState;\n  };\n\n  private isMaskVisible = () => this.props.alwaysShowMask || this.state.focused;\n\n  private handleUnexpectedInput = () => {\n    if (this.props.onUnexpectedInput) {\n      this.props.onUnexpectedInput(this.state.value);\n    }\n  };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactInputMask","_utils","_ThemeContext","_MaskCharLowLine","_Emotion","_createPropsGetter","_InternalMaskedInput2","_excluded","MaskedInputDataTids","exports","root","InternalMaskedInput","_React$PureComponent","props","_this","call","getProps","createPropsGetter","defaultProps","input","reactInputMask","getValue","isNonNullable","value","toString","defaultValue","refInput","refMaskedInput","handleChange","event","target","state","handleUnexpectedInput","setState","originValue","onValueChange","onChange","handleFocus","focused","onFocus","handleBlur","onBlur","preprocess","newState","oldState","userInput","options","visibleMaskChars","Array","mask","length","fill","maskChar","split","forEach","char","index","permanents","includes","emptyValue","join","isMaskVisible","alwaysShowMask","onUnexpectedInput","_inheritsLoose2","default","_proto","prototype","componentDidMount","forceUpdate","componentDidUpdate","prevProps","render","_this2","createElement","ThemeContext","Consumer","theme","renderMain","_this$props","hasLeftIcon","hasRightIcon","maxLength","style","inputProps","_objectWithoutPropertiesLoose2","_this$state","leftHelper","textAlign","color","slice","leftClass","styles","inputMaskLeft","rightHelper","map","_char","i","MaskCharLowLine","key","className","container","_extends2","beforeMaskedValueChange","inputRef","ref","cx","inputMask","translate","React","PureComponent","__KONTUR_REACT_UI__","displayName"],"sources":["InternalMaskedInput.tsx"],"sourcesContent":["import React from 'react';\nimport ReactInputMask, { InputState } from 'react-input-mask';\n\nimport { isNonNullable } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { MaskCharLowLine } from '../MaskCharLowLine';\nimport { cx } from '../../lib/theming/Emotion';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles } from './InternalMaskedInput.styles';\n\nexport interface InternalMaskedInputProps extends React.InputHTMLAttributes<HTMLInputElement> {\n  mask: string;\n  maskChar?: string | null;\n  formatChars?: { [key: string]: string };\n  alwaysShowMask?: boolean;\n  hasLeftIcon?: boolean;\n  hasRightIcon?: boolean;\n  onUnexpectedInput?: (value: string) => void;\n  onValueChange?: (value: string) => void;\n}\n\ninterface MaskedInputState {\n  value: string;\n\n  // Users can unmask value themselves. In these cases we take origin value length\n  originValue: string;\n\n  emptyValue: string;\n  focused: boolean;\n}\n\ntype DefaultProps = Required<Pick<InternalMaskedInputProps, 'maskChar'>>;\n\nexport const MaskedInputDataTids = {\n  root: 'MaskedInput__root',\n} as const;\n\n/** @deprecated Со следующей мажорной версии Input перестанет поддерживать маску.\n * todo: выпилить в 5 версии библиотеки.\n * */\nexport class InternalMaskedInput extends React.PureComponent<InternalMaskedInputProps, MaskedInputState> {\n  public static __KONTUR_REACT_UI__ = 'InternalMaskedInput';\n  public static displayName = 'InternalMaskedInput';\n\n  public static defaultProps: DefaultProps = {\n    maskChar: '_',\n  };\n\n  private getProps = createPropsGetter(InternalMaskedInput.defaultProps);\n\n  public input: HTMLInputElement | null = null;\n  private theme!: Theme;\n  private reactInputMask: ReactInputMask | null = null;\n\n  public constructor(props: InternalMaskedInputProps) {\n    super(props);\n\n    this.state = {\n      value: this.getValue(props),\n      originValue: this.getValue(props),\n      emptyValue: '',\n      focused: false,\n    };\n  }\n\n  public componentDidMount() {\n    if (this.reactInputMask) {\n      // FIXME: принудительно вызываем beforeMaskedValueChange, чтобы получить emptyValue\n      this.reactInputMask.forceUpdate();\n    }\n  }\n\n  public componentDidUpdate(prevProps: InternalMaskedInputProps) {\n    if (this.props.value !== prevProps.value) {\n      this.setState({\n        value: this.props.value ? this.props.value.toString() : '',\n      });\n    }\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const {\n      maskChar,\n      alwaysShowMask,\n      hasLeftIcon,\n      hasRightIcon,\n      maxLength,\n      onValueChange,\n      onUnexpectedInput,\n      defaultValue,\n      style,\n      ...inputProps\n    } = this.props;\n    const { emptyValue, value, originValue } = this.state;\n\n    const leftHelper = style?.textAlign !== 'right' && (\n      <span style={{ color: 'transparent' }}>{emptyValue.slice(0, originValue.length)}</span>\n    );\n    const leftClass = style?.textAlign !== 'right' && styles.inputMaskLeft();\n\n    const rightHelper = emptyValue\n      .slice(originValue.length)\n      .split('')\n      .map((_char, i) => (_char === '_' ? <MaskCharLowLine key={i} /> : _char));\n\n    return (\n      <span data-tid={MaskedInputDataTids.root} className={styles.container()} x-ms-format-detection=\"none\">\n        <ReactInputMask\n          {...inputProps}\n          maskChar={null}\n          // @ts-expect-error InternalMaskedInput will be deleted in 5.0\n          beforeMaskedValueChange={this.preprocess}\n          alwaysShowMask={false}\n          onChange={this.handleChange}\n          onFocus={this.handleFocus}\n          onBlur={this.handleBlur}\n          value={value}\n          inputRef={this.refInput}\n          ref={this.refMaskedInput}\n          style={{ ...style }}\n        />\n        {this.isMaskVisible() && (\n          <span className={cx(styles.inputMask(this.theme), leftClass)} translate=\"no\">\n            {leftHelper}\n            {rightHelper}\n          </span>\n        )}\n      </span>\n    );\n  }\n\n  private getValue = (props: InternalMaskedInputProps): string => {\n    if (isNonNullable(props.value)) {\n      return props.value.toString();\n    }\n\n    if (isNonNullable(props.defaultValue)) {\n      return props.defaultValue.toString();\n    }\n\n    return '';\n  };\n\n  private refInput = (input: HTMLInputElement | null) => {\n    this.input = input;\n  };\n\n  private refMaskedInput = (reactInputMask: ReactInputMask) => {\n    this.reactInputMask = reactInputMask;\n  };\n\n  private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    if (event.target.value === this.state.value) {\n      this.handleUnexpectedInput();\n    } else {\n      this.setState({ value: event.target.value, originValue: event.target.value });\n      if (this.props.onValueChange) {\n        this.props.onValueChange(event.target.value);\n      }\n      if (this.props.onChange) {\n        this.props.onChange(event);\n      }\n    }\n  };\n\n  private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    this.setState({ focused: true });\n\n    if (this.props.onFocus) {\n      this.props.onFocus(event);\n    }\n  };\n\n  private handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n    this.setState({ focused: false });\n\n    if (this.props.onBlur) {\n      this.props.onBlur(event);\n    }\n  };\n\n  private preprocess = (\n    newState: InputState,\n    oldState: InputState,\n    userInput: string,\n    options: Pick<InternalMaskedInputProps, 'mask'>,\n  ) => {\n    const visibleMaskChars = new Array(options.mask.length).fill(this.getProps().maskChar);\n\n    if (newState.value !== oldState.value && userInput === null) {\n      this.setState({\n        value: newState.value,\n        originValue: newState.value,\n      });\n    }\n\n    options.mask.split('').forEach((char: string, index: number) => {\n      // @ts-expect-error InternalMaskedInput will be deleted in 5.0\n      if (options.permanents.includes(index)) {\n        visibleMaskChars[index] = char;\n      }\n\n      if (newState.value[index]) {\n        visibleMaskChars[index] = newState.value[index];\n      }\n    });\n\n    const emptyValue = visibleMaskChars.join('');\n\n    if (this.state.emptyValue !== emptyValue) {\n      this.setState({\n        emptyValue,\n      });\n    }\n\n    return newState;\n  };\n\n  private isMaskVisible = () => this.props.alwaysShowMask || this.state.focused;\n\n  private handleUnexpectedInput = () => {\n    if (this.props.onUnexpectedInput) {\n      this.props.onUnexpectedInput(this.state.value);\n    }\n  };\n}\n"],"mappings":"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","ignoreList":[]}

package/cjs/internal/InternalMaskedInput/InternalMaskedInput.styles.d.ts

@@ -1,6 +1,5 @@
-import type { Emotion } from '@emotion/css/create-instance';
 import { Theme } from '../../lib/theming/Theme';
-export declare const getStyles: (emotion: Emotion) => {
+export declare const styles: {
     container(): string;
     inputMask(t: Theme): string;
     inputMaskLeft(): string;

package/cjs/internal/InternalMaskedInput/InternalMaskedInput.styles.js

@@ -1,33 +1,30 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;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;
 
-var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3;
 
+var styles = exports.styles = (0, _Emotion.memoizeStyle)({
+  container: function container() {
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-flex;\n      position: relative;\n      font-size: inherit;\n      flex: 100% 1 1;\n    "])));
 
-var getStyles = exports.getStyles = function getStyles(emotion) {return (
-    (0, _Emotion.memoizeStyle)({
-      container: function container() {
-        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n        display: inline-flex;\n        position: relative;\n        font-size: inherit;\n        flex: 100% 1 1;\n      "])));
 
 
 
 
+  },
+  inputMask: function inputMask(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      pointer-events: none;\n      font-size: inherit;\n      z-index: 5;\n      user-select: none;\n    "])),
+    t.placeholderColor);
 
-      },
-      inputMask: function inputMask(t) {
-        return emotion.css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n        color: ", ";\n        pointer-events: none;\n        font-size: inherit;\n        z-index: 5;\n        user-select: none;\n      "])),
-        t.placeholderColor);
 
 
 
 
+  },
+  inputMaskLeft: function inputMaskLeft() {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      top: 0;\n      left: 0;\n      right: 0;\n    "])));
 
-      },
-      inputMaskLeft: function inputMaskLeft() {
-        return emotion.css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n        position: absolute;\n        top: 0;\n        left: 0;\n        right: 0;\n      "])));
 
 
 
 
-
-      }
-    }));};
+  }
+});

package/cjs/internal/InternalMaskedInput/InternalMaskedInput.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","getStyles","exports","emotion","memoizeStyle","container","css","_taggedTemplateLiteralLoose2","default","inputMask","t","placeholderColor","inputMaskLeft"],"sources":["InternalMaskedInput.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    container() {\n      return emotion.css`\n        display: inline-flex;\n        position: relative;\n        font-size: inherit;\n        flex: 100% 1 1;\n      `;\n    },\n    inputMask(t: Theme) {\n      return emotion.css`\n        color: ${t.placeholderColor};\n        pointer-events: none;\n        font-size: inherit;\n        z-index: 5;\n        user-select: none;\n      `;\n    },\n    inputMaskLeft() {\n      return emotion.css`\n        position: absolute;\n        top: 0;\n        left: 0;\n        right: 0;\n      `;\n    },\n  });\n"],"mappings":";;AAEA,IAAAA,QAAA,GAAAC,OAAA,8BAAyD,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA;;;AAGlD,IAAMC,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,SAAZA,SAASA,CAAIE,OAAgB;IACxC,IAAAC,qBAAY,EAAC;MACXC,SAAS,WAAAA,UAAA,EAAG;QACV,OAAOF,OAAO,CAACG,GAAG,CAAAR,eAAA,KAAAA,eAAA,OAAAS,4BAAA,CAAAC,OAAA;;;;;;MAMpB,CAAC;MACDC,SAAS,WAAAA,UAACC,CAAQ,EAAE;QAClB,OAAOP,OAAO,CAACG,GAAG,CAAAP,gBAAA,KAAAA,gBAAA,OAAAQ,4BAAA,CAAAC,OAAA;QACPE,CAAC,CAACC,gBAAgB;;;;;;MAM/B,CAAC;MACDC,aAAa,WAAAA,cAAA,EAAG;QACd,OAAOT,OAAO,CAACG,GAAG,CAAAN,gBAAA,KAAAA,gBAAA,OAAAO,4BAAA,CAAAC,OAAA;;;;;;MAMpB;IACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","styles","exports","memoizeStyle","container","css","_taggedTemplateLiteralLoose2","default","inputMask","t","placeholderColor","inputMaskLeft"],"sources":["InternalMaskedInput.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  container() {\n    return css`\n      display: inline-flex;\n      position: relative;\n      font-size: inherit;\n      flex: 100% 1 1;\n    `;\n  },\n  inputMask(t: Theme) {\n    return css`\n      color: ${t.placeholderColor};\n      pointer-events: none;\n      font-size: inherit;\n      z-index: 5;\n      user-select: none;\n    `;\n  },\n  inputMaskLeft() {\n    return css`\n      position: absolute;\n      top: 0;\n      left: 0;\n      right: 0;\n    `;\n  },\n});\n"],"mappings":"oRAAA,IAAAA,QAAA,GAAAC,OAAA,8BAA8D,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA;;;AAGvD,IAAMC,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,IAAAE,qBAAY,EAAC;EACjCC,SAAS,WAAAA,UAAA,EAAG;IACV,WAAOC,YAAG,EAAAP,eAAA,KAAAA,eAAA,OAAAQ,4BAAA,CAAAC,OAAA;;;;;;EAMZ,CAAC;EACDC,SAAS,WAAAA,UAACC,CAAQ,EAAE;IAClB,WAAOJ,YAAG,EAAAN,gBAAA,KAAAA,gBAAA,OAAAO,4BAAA,CAAAC,OAAA;IACCE,CAAC,CAACC,gBAAgB;;;;;;EAM/B,CAAC;EACDC,aAAa,WAAAA,cAAA,EAAG;IACd,WAAON,YAAG,EAAAL,gBAAA,KAAAA,gBAAA,OAAAM,4BAAA,CAAAC,OAAA;;;;;;EAMZ;AACF,CAAC,CAAC","ignoreList":[]}

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.js

@@ -1,6 +1,4 @@
-"use strict";var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.MaskCharLowLine = exports.MASK_CHAR_EXEMPLAR = void 0;var _react = _interopRequireWildcard(require("react"));
-
-var _Emotion = require("../../lib/theming/Emotion");
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.MaskCharLowLine = exports.MASK_CHAR_EXEMPLAR = void 0;var _react = _interopRequireDefault(require("react"));
 
 var _MaskCharLowLine = require("./MaskCharLowLine.styles");
 
@@ -13,8 +11,4 @@ var _MaskCharLowLine = require("./MaskCharLowLine.styles");
  */
 var MASK_CHAR_EXEMPLAR = exports.MASK_CHAR_EXEMPLAR = String.fromCharCode(0x2007);
 
-var MaskCharLowLine = exports.MaskCharLowLine = function MaskCharLowLine() {
-  var emotion = (0, _react.useContext)(_Emotion.EmotionContext);
-  var styles = (0, _MaskCharLowLine.getStyles)(emotion);
-  return /*#__PURE__*/_react.default.createElement("span", { className: styles.root() }, MASK_CHAR_EXEMPLAR);
-};
+var MaskCharLowLine = exports.MaskCharLowLine = function MaskCharLowLine() {return /*#__PURE__*/_react.default.createElement("span", { className: _MaskCharLowLine.styles.root() }, MASK_CHAR_EXEMPLAR);};

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_Emotion","_MaskCharLowLine","MASK_CHAR_EXEMPLAR","exports","String","fromCharCode","MaskCharLowLine","emotion","useContext","EmotionContext","styles","getStyles","default","createElement","className","root"],"sources":["MaskCharLowLine.tsx"],"sourcesContent":["import React, { useContext } from 'react';\n\nimport { EmotionContext } from '../../lib/theming/Emotion';\n\nimport { getStyles } from './MaskCharLowLine.styles';\n\n/**\n * FIGURE SPACE\n *\n * space equal to tabular width of a font this is equivalent to the digit width of fonts with fixed-width digits\n *\n * @see http://www.fileformat.info/info/unicode/char/2007/index.htm\n */\nexport const MASK_CHAR_EXEMPLAR = String.fromCharCode(0x2007);\n\nexport const MaskCharLowLine = () => {\n  const emotion = useContext(EmotionContext);\n  const styles = getStyles(emotion);\n  return <span className={styles.root()}>{MASK_CHAR_EXEMPLAR}</span>;\n};\n"],"mappings":"oMAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;;AAEA,IAAAC,QAAA,GAAAD,OAAA;;AAEA,IAAAE,gBAAA,GAAAF,OAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAMG,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAGE,MAAM,CAACC,YAAY,CAAC,MAAM,CAAC;;AAEtD,IAAMC,eAAe,GAAAH,OAAA,CAAAG,eAAA,GAAG,SAAlBA,eAAeA,CAAA,EAAS;EACnC,IAAMC,OAAO,GAAG,IAAAC,iBAAU,EAACC,uBAAc,CAAC;EAC1C,IAAMC,MAAM,GAAG,IAAAC,0BAAS,EAACJ,OAAO,CAAC;EACjC,oBAAOV,MAAA,CAAAe,OAAA,CAAAC,aAAA,WAAMC,SAAS,EAAEJ,MAAM,CAACK,IAAI,CAAC,CAAE,IAAEb,kBAAyB,CAAC;AACpE,CAAC","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_MaskCharLowLine","MASK_CHAR_EXEMPLAR","exports","String","fromCharCode","MaskCharLowLine","default","createElement","className","styles","root"],"sources":["MaskCharLowLine.tsx"],"sourcesContent":["import React from 'react';\n\nimport { styles } from './MaskCharLowLine.styles';\n\n/**\n * FIGURE SPACE\n *\n * space equal to tabular width of a font this is equivalent to the digit width of fonts with fixed-width digits\n *\n * @see http://www.fileformat.info/info/unicode/char/2007/index.htm\n */\nexport const MASK_CHAR_EXEMPLAR = String.fromCharCode(0x2007);\n\nexport const MaskCharLowLine = () => <span className={styles.root()}>{MASK_CHAR_EXEMPLAR}</span>;\n"],"mappings":"kMAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;;AAEA,IAAAC,gBAAA,GAAAD,OAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAME,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAGE,MAAM,CAACC,YAAY,CAAC,MAAM,CAAC;;AAEtD,IAAMC,eAAe,GAAAH,OAAA,CAAAG,eAAA,GAAG,SAAlBA,eAAeA,CAAA,uBAASR,MAAA,CAAAS,OAAA,CAAAC,aAAA,WAAMC,SAAS,EAAEC,uBAAM,CAACC,IAAI,CAAC,CAAE,IAAET,kBAAyB,CAAC","ignoreList":[]}

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.styles.d.ts

@@ -1,4 +1,3 @@
-import type { Emotion } from '@emotion/css/create-instance';
-export declare const getStyles: (emotion: Emotion) => {
+export declare const styles: {
     root(): string;
 };

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.styles.js

@@ -1,11 +1,9 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject;
 
-var _Emotion = require("../../lib/theming/Emotion");var _templateObject;
+var styles = exports.styles = (0, _Emotion.memoizeStyle)({
+  root: function root() {
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n\n      &:after {\n        content: '';\n        position: absolute;\n        width: calc(100% - 0.1em);\n        height: 1px;\n        left: 0.05em;\n        bottom: 0.11em;\n        border-bottom: solid 0.05em;\n      }\n    "])));
 
-var getStyles = exports.getStyles = function getStyles(emotion) {return (
-    (0, _Emotion.memoizeStyle)({
-      root: function root() {
-        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n        position: relative;\n\n        &:after {\n          content: '';\n          position: absolute;\n          width: calc(100% - 0.1em);\n          height: 1px;\n          left: 0.05em;\n          bottom: 0.11em;\n          border-bottom: solid 0.05em;\n        }\n      "])));
 
 
 
@@ -17,6 +15,5 @@ var getStyles = exports.getStyles = function getStyles(emotion) {return (
 
 
 
-
-      }
-    }));};
+  }
+});

package/cjs/internal/MaskCharLowLine/MaskCharLowLine.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Emotion","require","_templateObject","getStyles","exports","emotion","memoizeStyle","root","css","_taggedTemplateLiteralLoose2","default"],"sources":["MaskCharLowLine.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    root() {\n      return emotion.css`\n        position: relative;\n\n        &:after {\n          content: '';\n          position: absolute;\n          width: calc(100% - 0.1em);\n          height: 1px;\n          left: 0.05em;\n          bottom: 0.11em;\n          border-bottom: solid 0.05em;\n        }\n      `;\n    },\n  });\n"],"mappings":";;AAEA,IAAAA,QAAA,GAAAC,OAAA,8BAAyD,IAAAC,eAAA;;AAElD,IAAMC,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,SAAZA,SAASA,CAAIE,OAAgB;IACxC,IAAAC,qBAAY,EAAC;MACXC,IAAI,WAAAA,KAAA,EAAG;QACL,OAAOF,OAAO,CAACG,GAAG,CAAAN,eAAA,KAAAA,eAAA,OAAAO,4BAAA,CAAAC,OAAA;;;;;;;;;;;;;MAapB;IACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_Emotion","require","_templateObject","styles","exports","memoizeStyle","root","css","_taggedTemplateLiteralLoose2","default"],"sources":["MaskCharLowLine.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n  root() {\n    return css`\n      position: relative;\n\n      &:after {\n        content: '';\n        position: absolute;\n        width: calc(100% - 0.1em);\n        height: 1px;\n        left: 0.05em;\n        bottom: 0.11em;\n        border-bottom: solid 0.05em;\n      }\n    `;\n  },\n});\n"],"mappings":"oRAAA,IAAAA,QAAA,GAAAC,OAAA,8BAA8D,IAAAC,eAAA;;AAEvD,IAAMC,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,IAAAE,qBAAY,EAAC;EACjCC,IAAI,WAAAA,KAAA,EAAG;IACL,WAAOC,YAAG,EAAAL,eAAA,KAAAA,eAAA,OAAAM,4BAAA,CAAAC,OAAA;;;;;;;;;;;;;EAaZ;AACF,CAAC,CAAC","ignoreList":[]}

package/cjs/internal/Menu/Menu.d.ts

@@ -1,6 +1,7 @@
 import React, { HTMLAttributes } from 'react';
 import { ScrollContainerScrollState } from '../../components/ScrollContainer';
-export interface MenuProps extends Pick<HTMLAttributes<HTMLDivElement>, 'id'> {
+import { CommonProps } from '../CommonWrapper';
+export interface MenuProps extends CommonProps, Pick<HTMLAttributes<HTMLDivElement>, 'id'> {
     children: React.ReactNode;
     hasMargin?: boolean;
     /**
@@ -48,8 +49,6 @@ export declare class Menu extends React.PureComponent<MenuProps, MenuState> {
     private getProps;
     state: MenuState;
     private theme;
-    private emotion;
-    private styles;
     private scrollContainer;
     private isMobileLayout;
     private unmounted;

package/cjs/internal/Menu/Menu.js

@@ -1,7 +1,6 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.MenuDataTids = exports.Menu = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.MenuDataTids = exports.Menu = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _globalObject = require("@skbkontur/global-object");
 
-
 var _identifiers = require("../../lib/events/keyboard/identifiers");
 var _MenuSeparator = require("../../components/MenuSeparator");
 var _ThemeFactory = require("../../lib/theming/ThemeFactory");
@@ -11,13 +10,14 @@ var _utils = require("../../lib/utils");
 var _ScrollContainer = require("../../components/ScrollContainer");
 var _MenuItem = require("../../components/MenuItem");
 
+var _ThemeContext = require("../../lib/theming/ThemeContext");
 
+var _Emotion = require("../../lib/theming/Emotion");
 var _rootNode2 = require("../../lib/rootNode");
 var _client = require("../../lib/client");
 var _createPropsGetter = require("../../lib/createPropsGetter");
 var _isInstanceOf = require("../../lib/isInstanceOf");
-var _ThemeContext = require("../../lib/theming/ThemeContext");
-var _Emotion = require("../../lib/theming/Emotion");
+var _CommonWrapper = require("../CommonWrapper");
 
 var _Menu2 = require("./Menu.styles");
 var _MenuNavigation = require("./MenuNavigation");
@@ -108,8 +108,6 @@ Menu = exports.Menu = (0, _decorator.responsiveLayout)(_class = (0, _rootNode2.r
 
 
 
-
-
     unmounted = false;_this.
 
 
@@ -263,46 +261,36 @@ Menu = exports.Menu = (0, _decorator.responsiveLayout)(_class = (0, _rootNode2.r
 
 
 
-
-
-
-
-
-
-
-
-    renderHeader = function () {var _this$emotion$cx;
-      var styles = _this.styles;
+    renderHeader = function () {var _cx;
       return /*#__PURE__*/(
         _react.default.createElement("div", {
-          className: _this.emotion.cx((_this$emotion$cx = {}, _this$emotion$cx[
-          styles.wrapper()] = true, _this$emotion$cx[
-          styles.headerWrapper()] = true, _this$emotion$cx)
+          className: (0, _Emotion.cx)((_cx = {}, _cx[
+          _Menu2.styles.wrapper()] = true, _cx[
+          _Menu2.styles.headerWrapper()] = true, _cx)
           ),
           ref: function ref(el) {return _this.header = el;} }, /*#__PURE__*/
 
-        _react.default.createElement("div", { className: styles.contentWrapper() }, _this.props.header), /*#__PURE__*/
-        _react.default.createElement("div", { className: styles.menuSeparatorWrapper(_this.theme) },
+        _react.default.createElement("div", { className: _Menu2.styles.contentWrapper() }, _this.props.header), /*#__PURE__*/
+        _react.default.createElement("div", { className: _Menu2.styles.menuSeparatorWrapper(_this.theme) },
         _this.state.scrollState !== 'top' && _this.renderMenuSeparatorWithNoMargin()
         )
         ));
 
     };_this.
 
-    renderFooter = function () {var _this$emotion$cx2;
-      var styles = _this.styles;
+    renderFooter = function () {var _cx2;
       return /*#__PURE__*/(
         _react.default.createElement("div", {
-          className: _this.emotion.cx((_this$emotion$cx2 = {}, _this$emotion$cx2[
-          styles.wrapper()] = true, _this$emotion$cx2[
-          styles.footerWrapper()] = true, _this$emotion$cx2)
+          className: (0, _Emotion.cx)((_cx2 = {}, _cx2[
+          _Menu2.styles.wrapper()] = true, _cx2[
+          _Menu2.styles.footerWrapper()] = true, _cx2)
           ),
           ref: function ref(el) {return _this.footer = el;} }, /*#__PURE__*/
 
-        _react.default.createElement("div", { className: styles.menuSeparatorWrapper(_this.theme) },
+        _react.default.createElement("div", { className: _Menu2.styles.menuSeparatorWrapper(_this.theme) },
         _this.state.scrollState !== 'bottom' && _this.renderMenuSeparatorWithNoMargin()
         ), /*#__PURE__*/
-        _react.default.createElement("div", { className: styles.contentWrapper() }, _this.props.footer)
+        _react.default.createElement("div", { className: _Menu2.styles.contentWrapper() }, _this.props.footer)
         ));
 
     };_this.
@@ -459,7 +447,7 @@ Menu = exports.Menu = (0, _decorator.responsiveLayout)(_class = (0, _rootNode2.r
 
     setEnableIconPadding = function (isIconPaddingEnabled) {
       !_this.getProps().preventIconsOffset && _this.setState({ enableIconPadding: isIconPaddingEnabled });
-    };return _this;}(0, _inheritsLoose2.default)(Menu, _React$PureComponent);var _proto = Menu.prototype;_proto.componentWillUnmount = function componentWillUnmount() {this.unmounted = true;};_proto.componentDidMount = function componentDidMount() {this.setInitialSelection();this.calculateMaxHeight();this.unmounted = false;};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.shouldRecalculateMaxHeight(prevProps)) {this.calculateMaxHeight();}if (prevProps.maxHeight !== this.getProps().maxHeight) {this.setState({ maxHeight: this.props.maxHeight || 'none' });}};_proto.focus = function focus() {this.focusOnRootElement();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_Emotion.EmotionConsumer, null, function (emotion) {_this2.emotion = emotion;_this2.styles = (0, _Menu2.getStyles)(_this2.emotion);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});});} /**
+    };return _this;}(0, _inheritsLoose2.default)(Menu, _React$PureComponent);var _proto = Menu.prototype;_proto.componentWillUnmount = function componentWillUnmount() {this.unmounted = true;};_proto.componentDidMount = function componentDidMount() {this.setInitialSelection();this.calculateMaxHeight();this.unmounted = false;};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.shouldRecalculateMaxHeight(prevProps)) {this.calculateMaxHeight();}if (prevProps.maxHeight !== this.getProps().maxHeight) {this.setState({ maxHeight: this.props.maxHeight || 'none' });}};_proto.focus = function focus() {this.focusOnRootElement();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});} /**
    * @public
    */;_proto.up = function up() {this.move(-1);} /**
    * @public
@@ -469,18 +457,16 @@ Menu = exports.Menu = (0, _decorator.responsiveLayout)(_class = (0, _rootNode2.r
    * @public
    */;_proto.reset = function reset() {this.menuNavigation.reset();} /**
    * @public
-   */;_proto.hasHighlightedItem = function hasHighlightedItem() {return !!this.menuNavigation.highlightedItem;};_proto.highlightItem = function highlightItem(index) {this.menuNavigation.highlightByIndex(index);};_proto.renderMain = function renderMain() {var _this$emotion$cx3, _this$emotion$cx4;if (this.isEmpty()) {return null;}var _this$getProps = this.getProps(),hasMargin = _this$getProps.hasMargin,maxHeight = _this$getProps.maxHeight,preventWindowScroll = _this$getProps.preventWindowScroll;var offsetY = { top: "" + this.theme.scrollContainerScrollBarOffsetY, right: 0, bottom: "" + this.theme.scrollContainerScrollBarOffsetY };var isMobile = this.isMobileLayout;var styles = this.styles;return /*#__PURE__*/_react.default.createElement("div", { "data-tid": MenuDataTids.root, className: this.emotion.cx(getAlignRightClass(this.emotion)(this.props), (_this$emotion$cx3 = {}, _this$emotion$cx3[styles.root(this.theme)] = true, _this$emotion$cx3[styles.hasMargin(this.theme)] = hasMargin, _this$emotion$cx3[styles.mobileRoot(this.theme)] = isMobile, _this$emotion$cx3[styles.shadow(this.theme)] = !isMobile, _this$emotion$cx3)), style: this.getStyle(this.props), id: this.props.id, onKeyDown: this.handleKeyDown, ref: this.setRootNode, tabIndex: 0 }, this.props.header && this.renderHeader(), /*#__PURE__*/_react.default.createElement(_ScrollContainer.ScrollContainer, { ref: this.refScrollContainer, maxHeight: maxHeight, preventWindowScroll: preventWindowScroll, onScrollStateChange: this.handleScrollStateChange, disabled: this.props.disableScrollContainer, offsetY: offsetY }, /*#__PURE__*/_react.default.createElement("div", { className: this.emotion.cx((_this$emotion$cx4 = {}, _this$emotion$cx4[styles.scrollContainer(this.theme)] = true, _this$emotion$cx4[styles.scrollContainerMobile(this.theme)] = isMobile, _this$emotion$cx4)), ref: this.contentRef }, /*#__PURE__*/_react.default.createElement(_MenuContext.MenuContext.Provider, { value: { navigation: this.menuNavigation, onItemClick: this.props.onItemClick, enableIconPadding: this.state.enableIconPadding, setEnableIconPadding: this.setEnableIconPadding } }, this.props.children))), this.props.footer && this.renderFooter());};_proto.move = function move(step) {if (this.unmounted) {// NOTE workaround, because `ComboBox` call `process.nextTick` in reducer
+   */;_proto.hasHighlightedItem = function hasHighlightedItem() {return !!this.menuNavigation.highlightedItem;};_proto.highlightItem = function highlightItem(index) {this.menuNavigation.highlightByIndex(index);};_proto.renderMain = function renderMain() {var _cx3, _cx4;if (this.isEmpty()) {return null;}var _this$getProps = this.getProps(),hasMargin = _this$getProps.hasMargin,maxHeight = _this$getProps.maxHeight,preventWindowScroll = _this$getProps.preventWindowScroll;var offsetY = { top: "" + this.theme.scrollContainerScrollBarOffsetY, right: 0, bottom: "" + this.theme.scrollContainerScrollBarOffsetY };var isMobile = this.isMobileLayout;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("div", { "data-tid": MenuDataTids.root, className: (0, _Emotion.cx)(getAlignRightClass(this.props), (_cx3 = {}, _cx3[_Menu2.styles.root(this.theme)] = true, _cx3[_Menu2.styles.hasMargin(this.theme)] = hasMargin, _cx3[_Menu2.styles.mobileRoot(this.theme)] = isMobile, _cx3[_Menu2.styles.shadow(this.theme)] = !isMobile, _cx3)), style: this.getStyle(this.props), id: this.props.id, onKeyDown: this.handleKeyDown, tabIndex: 0 }, this.props.header && this.renderHeader(), /*#__PURE__*/_react.default.createElement(_ScrollContainer.ScrollContainer, { ref: this.refScrollContainer, maxHeight: maxHeight, preventWindowScroll: preventWindowScroll, onScrollStateChange: this.handleScrollStateChange, disabled: this.props.disableScrollContainer, offsetY: offsetY }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx4 = {}, _cx4[_Menu2.styles.scrollContainer(this.theme)] = true, _cx4[_Menu2.styles.scrollContainerMobile(this.theme)] = isMobile, _cx4)), ref: this.contentRef }, /*#__PURE__*/_react.default.createElement(_MenuContext.MenuContext.Provider, { value: { navigation: this.menuNavigation, onItemClick: this.props.onItemClick, enableIconPadding: this.state.enableIconPadding, setEnableIconPadding: this.setEnableIconPadding } }, this.props.children))), this.props.footer && this.renderFooter()));};_proto.move = function move(step) {if (this.unmounted) {// NOTE workaround, because `ComboBox` call `process.nextTick` in reducer
       return;}var nextIndex = this.menuNavigation.move(step, this.getProps().cyclicSelection);this.scroll(nextIndex);};_proto.isEmpty = function isEmpty() {var children = this.props.children;return !children || !childrenToArray(children).filter(_utils.isNonNullable).length;};return Menu;}(_react.default.PureComponent), _Menu.__KONTUR_REACT_UI__ = 'Menu', _Menu.displayName = 'Menu', _Menu.defaultProps = { align: 'left', width: 'auto', maxHeight: 300, hasMargin: true, preventWindowScroll: true, cyclicSelection: true, initialSelectedItemIndex: -1 }, _Menu)) || _class) || _class;function childrenToArray(children) {var ret = []; // Use forEach instead of map to avoid cloning for key unifying.
-  _react.default.Children.forEach(children, function (child) {ret.push(child);});return ret;}var getAlignRightClass = function getAlignRightClass(emotion) {return function (props) {
-    var styles = (0, _Menu2.getStyles)(emotion);
-
-    if (props.align === 'right') {var _emotion$cx;
-      return emotion.cx((_emotion$cx = {}, _emotion$cx[
-      styles.alignRight()] = !_client.isIE11, _emotion$cx[
-      styles.alignRightIE11()] = _client.isIE11, _emotion$cx[
-      styles.alignRightIE11FixAutoWidth()] = _client.isIE11 && props.width === 'auto', _emotion$cx)
-      );
-    }
-
-    return null;
-  };};
+  _react.default.Children.forEach(children, function (child) {ret.push(child);});return ret;}var getAlignRightClass = function getAlignRightClass(props) {
+  if (props.align === 'right') {var _cx5;
+    return (0, _Emotion.cx)((_cx5 = {}, _cx5[
+    _Menu2.styles.alignRight()] = !_client.isIE11, _cx5[
+    _Menu2.styles.alignRightIE11()] = _client.isIE11, _cx5[
+    _Menu2.styles.alignRightIE11FixAutoWidth()] = _client.isIE11 && props.width === 'auto', _cx5)
+    );
+  }
+
+  return null;
+};