@skbkontur/react-ui 0.0.0-bb4cbfe9c6 → 0.0.0-bc0c053ae7

package/cjs/components/Input/Input.js

@@ -1,10 +1,13 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Input = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _invariant = _interopRequireDefault(require("invariant"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.selectionErrorMessage = exports.selectionAllowedTypes = exports.maskForbiddenTypes = exports.maskErrorMessage = exports.maskAllowedTypes = exports.inputTypes = exports.InputDataTids = exports.Input = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
+
+var _invariant = _interopRequireDefault(require("invariant"));
 var _react = _interopRequireDefault(require("react"));
 var _raf = _interopRequireDefault(require("raf"));
+var _warning = _interopRequireDefault(require("warning"));
 
 var _client = require("../../lib/client");
 var _identifiers = require("../../lib/events/keyboard/identifiers");
-var _polyfillPlaceholder = require("../../lib/polyfillPlaceholder");
+var _needsPolyfillPlaceholder = require("../../lib/needsPolyfillPlaceholder");
 
 var _MaskedInput = require("../../internal/MaskedInput");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
@@ -12,8 +15,45 @@ var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _CommonWrapper = require("../../internal/CommonWrapper");
 var _Emotion = require("../../lib/theming/Emotion");
 var _rootNode = require("../../lib/rootNode");
+var _createPropsGetter = require("../../lib/createPropsGetter");
+var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
+
+
+var _Input = require("./Input.styles");
+var _InputLayout = require("./InputLayout/InputLayout");
+var _PolyfillPlaceholder = require("./InputLayout/PolyfillPlaceholder");var _excluded = ["onMouseEnter", "onMouseLeave", "onMouseOver", "onKeyDown", "onKeyPress", "onValueChange", "width", "error", "role", "warning", "leftIcon", "rightIcon", "borderless", "value", "align", "type", "mask", "maskChar", "alwaysShowMask", "size", "placeholder", "selectAllOnFocus", "disabled", "onUnexpectedInput", "prefix", "suffix", "formatChars", "corners", "aria-describedby", "aria-controls", "aria-label"];var _class, _class2, _temp;
+
+var inputTypes = ['password', 'text', 'number', 'tel', 'search', 'time', 'date', 'url', 'email'];
+
+/**
+ * @deprecated use SizeProp
+ */exports.inputTypes = inputTypes;
+
+
+
+
+
+var selectionAllowedTypes = ['text', 'password', 'tel', 'search', 'url'];exports.selectionAllowedTypes = selectionAllowedTypes;
+var selectionErrorMessage = function selectionErrorMessage(type, allowedTypes) {if (allowedTypes === void 0) {allowedTypes = selectionAllowedTypes;}
+  return "<Input />. Selection is not supported by the type \"" + type + "\". Types that support selection: " + allowedTypes.
+  map(function (i) {return "\"" + i + "\"";}).
+  join(', ') + ". Reason: https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange.";
+};exports.selectionErrorMessage = selectionErrorMessage;
+
+var maskForbiddenTypes = ['number', 'date', 'time'];exports.maskForbiddenTypes = maskForbiddenTypes;
+var maskAllowedTypes = inputTypes.filter(function (type) {
+  return !maskForbiddenTypes.includes(type);
+});exports.maskAllowedTypes = maskAllowedTypes;
+var maskErrorMessage = function maskErrorMessage(type, allowedTypes) {if (allowedTypes === void 0) {allowedTypes = maskAllowedTypes;}
+  return "<Input />. Prop \"mask\" does not support type \"" + type + "\". Supported types: " + allowedTypes.
+  map(function (i) {return "\"" + i + "\"";}).
+  join(', ') + ".";
+};exports.maskErrorMessage = maskErrorMessage;
+
+
+
+
 
-var _Input = require("./Input.styles");var _excluded = ["onMouseEnter", "onMouseLeave", "onMouseOver", "onKeyDown", "onKeyPress", "onValueChange", "width", "error", "warning", "leftIcon", "rightIcon", "borderless", "value", "align", "type", "mask", "maskChar", "alwaysShowMask", "size", "placeholder", "selectAllOnFocus", "disabled", "onUnexpectedInput", "prefix", "suffix", "formatChars"];var _class, _class2, _temp;
 
 
 
@@ -103,12 +143,19 @@ var _Input = require("./Input.styles");var _excluded = ["onMouseEnter", "onMouse
 
 
 
+
+
+
+
+
+var InputDataTids = {
+  root: 'Input__root' };exports.InputDataTids = InputDataTids;
 
 
 
 
 /**
- * Интерфес пропсов наследуется от `React.InputHTMLAttributes<HTMLInputElement>`.
+ * Интерфейс пропсов наследуется от `React.InputHTMLAttributes<HTMLInputElement>`.
  *  Все пропсы кроме перечисленных, `className` и `style` передаются в `<input>`
  */var
 
@@ -120,9 +167,10 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
 
 
 
+    getProps = (0, _createPropsGetter.createPropsGetter)(Input.defaultProps);_this.
 
     state = {
-      polyfillPlaceholder: false,
+      needsPolyfillPlaceholder: _needsPolyfillPlaceholder.needsPolyfillPlaceholder,
       blinking: false,
       focused: false };_this.
 
@@ -214,6 +262,26 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
 
 
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 
 
@@ -293,13 +361,19 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
 
 
 
-      props.onMouseEnter,onMouseLeave = props.onMouseLeave,onMouseOver = props.onMouseOver,onKeyDown = props.onKeyDown,onKeyPress = props.onKeyPress,onValueChange = props.onValueChange,width = props.width,error = props.error,warning = props.warning,leftIcon = props.leftIcon,rightIcon = props.rightIcon,borderless = props.borderless,value = props.value,align = props.align,type = props.type,mask = props.mask,maskChar = props.maskChar,alwaysShowMask = props.alwaysShowMask,size = props.size,placeholder = props.placeholder,selectAllOnFocus = props.selectAllOnFocus,disabled = props.disabled,onUnexpectedInput = props.onUnexpectedInput,prefix = props.prefix,suffix = props.suffix,formatChars = props.formatChars,rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+
+
+
+
+
+      props.onMouseEnter,onMouseLeave = props.onMouseLeave,onMouseOver = props.onMouseOver,onKeyDown = props.onKeyDown,onKeyPress = props.onKeyPress,onValueChange = props.onValueChange,width = props.width,error = props.error,role = props.role,warning = props.warning,leftIcon = props.leftIcon,rightIcon = props.rightIcon,borderless = props.borderless,value = props.value,align = props.align,type = props.type,mask = props.mask,maskChar = props.maskChar,alwaysShowMask = props.alwaysShowMask,size = props.size,placeholder = props.placeholder,selectAllOnFocus = props.selectAllOnFocus,disabled = props.disabled,onUnexpectedInput = props.onUnexpectedInput,prefix = props.prefix,suffix = props.suffix,formatChars = props.formatChars,corners = props.corners,ariaDescribedby = props['aria-describedby'],ariaControls = props['aria-controls'],ariaLabel = props['aria-label'],rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
 
       var _this$state = _this.state,blinking = _this$state.blinking,focused = _this$state.focused;
 
       var labelProps = {
         className: (0, _Emotion.cx)(_Input.styles.root(_this.theme), _this.getSizeClassName(), (_cx = {}, _cx[
-        _Input.styles.focus(_this.theme)] = focused, _cx[
+        _Input.styles.focus(_this.theme)] = focused && !warning && !error, _cx[
+        _Input.styles.hovering(_this.theme)] = !focused && !disabled && !warning && !error && !borderless, _cx[
         _Input.styles.blink(_this.theme)] = blinking, _cx[
         _Input.styles.borderless()] = borderless && !focused, _cx[
         _Input.styles.disabled(_this.theme)] = disabled, _cx[
@@ -309,7 +383,8 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
         _Input.styles.warningFallback(_this.theme)] = warning && (_client.isIE11 || _client.isEdge), _cx[
         _Input.styles.errorFallback(_this.theme)] = error && (_client.isIE11 || _client.isEdge), _cx)),
 
-        style: { width: width },
+        'aria-controls': ariaControls,
+        style: (0, _extends2.default)({ width: width }, corners),
         onMouseEnter: onMouseEnter,
         onMouseLeave: onMouseLeave,
         onMouseOver: onMouseOver };
@@ -322,6 +397,7 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
         _Input.styles.inputDisabled(_this.theme)] = disabled, _cx2)),
 
         value: value,
+        role: role,
         onChange: _this.handleChange,
         onFocus: _this.handleFocus,
         onKeyDown: _this.handleKeyDown,
@@ -329,19 +405,45 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
         onBlur: _this.handleBlur,
         style: { textAlign: align },
         ref: _this.refInput,
-        type: 'text',
-        placeholder: !_this.isMaskVisible && !_polyfillPlaceholder.polyfillPlaceholder ? placeholder : undefined,
-        disabled: disabled });
+        type: type,
+        placeholder: !_this.isMaskVisible && !_needsPolyfillPlaceholder.needsPolyfillPlaceholder ? placeholder : undefined,
+        disabled: disabled,
+        'aria-describedby': ariaDescribedby,
+        'aria-label': ariaLabel });
 
 
-      if (type === 'password') {
-        inputProps.type = type;
-      }
+      var input =
+      mask && !_this.canBeUsedWithMask ?
+      _this.renderMaskedInput(inputProps, mask) : /*#__PURE__*/
+      _react.default.createElement('input', inputProps);
 
-      var input = mask ? _this.renderMaskedInput(inputProps, mask) : /*#__PURE__*/_react.default.createElement('input', inputProps);
+      if ((0, _ThemeHelpers.isTheme2022)(_this.theme)) {
+        return /*#__PURE__*/(
+          _react.default.createElement(_InputLayout.InputLayout, {
+            leftIcon: leftIcon,
+            rightIcon: rightIcon,
+            prefix: prefix,
+            suffix: suffix,
+            labelProps: labelProps,
+            context: { disabled: Boolean(disabled), focused: focused, size: size } },
+
+          input,
+          _this.state.needsPolyfillPlaceholder && /*#__PURE__*/
+          _react.default.createElement(_PolyfillPlaceholder.PolyfillPlaceholder, {
+            isMaskVisible: _this.isMaskVisible,
+            value: value,
+            defaultValue: _this.props.defaultValue,
+            align: align },
+
+          placeholder)));
+
+
+
+
+      }
 
       return /*#__PURE__*/(
-        _react.default.createElement("label", labelProps, /*#__PURE__*/
+        _react.default.createElement("label", (0, _extends2.default)({ "data-tid": InputDataTids.root }, labelProps), /*#__PURE__*/
         _react.default.createElement("span", { className: _Input.styles.sideContainer() },
         _this.renderLeftIcon(),
         _this.renderPrefix()), /*#__PURE__*/
@@ -451,6 +553,13 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
 
 
 
+
+
+
+
+
+
+
 
 
 
@@ -468,10 +577,10 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
     };_this.
 
     handleChange = function (event) {
-      if (_polyfillPlaceholder.polyfillPlaceholder) {
+      if (_needsPolyfillPlaceholder.needsPolyfillPlaceholder) {
         var fieldIsEmpty = event.target.value === '';
-        if (_this.state.polyfillPlaceholder !== fieldIsEmpty) {
-          _this.setState({ polyfillPlaceholder: fieldIsEmpty });
+        if (_this.state.needsPolyfillPlaceholder !== fieldIsEmpty) {
+          _this.setState({ needsPolyfillPlaceholder: fieldIsEmpty });
         }
       }
 
@@ -490,7 +599,6 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
 
 
       if (_this.props.selectAllOnFocus) {
-        // https://github.com/facebook/react/issues/7769
         _this.input && !_client.isIE11 ? _this.selectAll() : _this.delaySelectAll();
       }
 
@@ -565,7 +673,7 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
       return /*#__PURE__*/(
         _react.default.createElement("span", { className: (0, _Emotion.cx)(_Input.styles.suffix(_this.theme), (_cx4 = {}, _cx4[_Input.styles.suffixDisabled(_this.theme)] = disabled, _cx4)) }, suffix));
 
-    };return _this;}var _proto = Input.prototype;_proto.componentDidMount = function componentDidMount() {if (_polyfillPlaceholder.polyfillPlaceholder) {this.setState({ polyfillPlaceholder: true });}};_proto.componentWillUnmount = function componentWillUnmount() {if (this.blinkTimeout) {clearTimeout(this.blinkTimeout);}this.cancelDelayedSelectAll();};Input.getDerivedStateFromProps = function getDerivedStateFromProps(props, state) {if (_polyfillPlaceholder.polyfillPlaceholder && !props.value) {return { polyfillPlaceholder: true };}return state;} /**
+    };return _this;}var _proto = Input.prototype;_proto.outputMaskError = function outputMaskError() {(0, _warning.default)(!(this.props.mask && this.canBeUsedWithMask), maskErrorMessage(this.getProps().type));};_proto.componentDidMount = function componentDidMount() {this.outputMaskError();};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.props.type !== prevProps.type || this.props.mask !== prevProps.mask) {this.outputMaskError();}};_proto.componentWillUnmount = function componentWillUnmount() {if (this.blinkTimeout) {clearTimeout(this.blinkTimeout);}this.cancelDelayedSelectAll();} /**
    * @public
    */;_proto.focus = function focus() {(0, _invariant.default)(this.input, 'Cannot call "focus" because Input is not mounted');this.input.focus();} /**
    * @public
@@ -579,6 +687,10 @@ Input = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
    * @public
    * @param {number} start
    * @param {number} end
-   */;_proto.setSelectionRange = function setSelectionRange(start, end) {if (!this.input) {throw new Error('Cannot call "setSelectionRange" on unmounted Input');}if (document.activeElement !== this.input) {this.focus();}this.input.setSelectionRange(start, end);};_proto.render = function render() {var _this3 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this3.theme = theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this3.setRootNode }, _this3.props), _this3.renderMain);});} /**
-   * @public
-   */;_proto.renderMaskedInput = function renderMaskedInput(inputProps, mask) {return /*#__PURE__*/_react.default.createElement(_MaskedInput.MaskedInput, (0, _extends2.default)({}, inputProps, { mask: mask, maskChar: this.props.maskChar, alwaysShowMask: this.props.alwaysShowMask, formatChars: this.props.formatChars, onChange: this.props.onChange, onValueChange: this.handleMaskedValueChange, onUnexpectedInput: this.handleUnexpectedInput }));};_proto.getIconSizeClassname = function getIconSizeClassname(right) {if (right === void 0) {right = false;}switch (this.props.size) {case 'large':return right ? _Input.styles.rightIconLarge(this.theme) : _Input.styles.leftIconLarge(this.theme);case 'medium':return right ? _Input.styles.rightIconMedium(this.theme) : _Input.styles.leftIconMedium(this.theme);case 'small':default:return right ? _Input.styles.rightIconSmall(this.theme) : _Input.styles.leftIconSmall(this.theme);}};_proto.renderLeftIcon = function renderLeftIcon() {return this.renderIcon(this.props.leftIcon, this.getIconSizeClassname());};_proto.renderRightIcon = function renderRightIcon() {return this.renderIcon(this.props.rightIcon, this.getIconSizeClassname(true));};_proto.renderIcon = function renderIcon(icon, sizeClassName) {var _cx5;if (!icon) {return null;}var disabled = this.props.disabled;var iconNode = icon instanceof Function ? icon() : icon;return /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)(_Input.styles.icon(), sizeClassName, _Input.styles.useDefaultColor(this.theme), (_cx5 = {}, _cx5[_Input.styles.iconDisabled()] = disabled, _cx5)) }, iconNode);};_proto.renderPlaceholder = function renderPlaceholder() {var disabled = this.props.disabled;var focused = this.state.focused;var placeholder = null;if (this.state.polyfillPlaceholder && this.props.placeholder && !this.isMaskVisible && !this.props.value) {var _cx6;placeholder = /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Input.styles.placeholder(this.theme), (_cx6 = {}, _cx6[_Input.styles.placeholderDisabled(this.theme)] = disabled, _cx6[_Input.styles.placeholderFocus(this.theme)] = focused, _cx6)), style: { textAlign: this.props.align || 'inherit' } }, this.props.placeholder);}return placeholder;};_proto.getSizeClassName = function getSizeClassName() {var _cx7, _cx8, _cx9;switch (this.props.size) {case 'large':return (0, _Emotion.cx)((_cx7 = {}, _cx7[_Input.styles.sizeLarge(this.theme)] = true, _cx7[_Input.styles.sizeLargeFallback(this.theme)] = _client.isIE11 || _client.isEdge, _cx7));case 'medium':return (0, _Emotion.cx)((_cx8 = {}, _cx8[_Input.styles.sizeMedium(this.theme)] = true, _cx8[_Input.styles.sizeMediumFallback(this.theme)] = _client.isIE11 || _client.isEdge, _cx8));case 'small':default:return (0, _Emotion.cx)((_cx9 = {}, _cx9[_Input.styles.sizeSmall(this.theme)] = true, _cx9[_Input.styles.sizeSmallFallback(this.theme)] = _client.isIE11 || _client.isEdge, _cx9));}};(0, _createClass2.default)(Input, [{ key: "isMaskVisible", get: function get() {var _this$props3 = this.props,mask = _this$props3.mask,alwaysShowMask = _this$props3.alwaysShowMask;var focused = this.state.focused;return Boolean(mask && (focused || alwaysShowMask));} }]);return Input;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Input', _class2.defaultProps = { size: 'small' }, _temp)) || _class;exports.Input = Input;
+   */;_proto.setSelectionRange = function setSelectionRange(start, end) {var _this$props$value,_this3 = this; // https://github.com/facebook/react/issues/7769
+    // https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange
+    if (!selectionAllowedTypes.includes(this.getProps().type)) {(0, _warning.default)(false, selectionErrorMessage(this.getProps().type));return;}if (!this.input) {throw new Error('Cannot call "setSelectionRange" on unmounted Input');}if (document.activeElement !== this.input) {this.focus();}if (this.props.mask && this.props.value && ((_this$props$value = this.props.value) == null ? void 0 : _this$props$value.length) < this.props.mask.length) {setTimeout(function () {var _this3$input;(_this3$input = _this3.input) == null ? void 0 : _this3$input.setSelectionRange(start, end);}, 150);} else {var _this$input;(_this$input = this.input) == null ? void 0 : _this$input.setSelectionRange(start, end);}};_proto.render = function render() {var _this4 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this4.theme = theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this4.setRootNode }, _this4.props), _this4.renderMain);});};_proto.renderMaskedInput = function renderMaskedInput(inputProps, mask) {return /*#__PURE__*/_react.default.createElement(_MaskedInput.MaskedInput, (0, _extends2.default)({}, inputProps, { mask: mask, maskChar: this.props.maskChar, alwaysShowMask: this.props.alwaysShowMask, formatChars: this.props.formatChars, onChange: this.props.onChange, onValueChange: this.handleMaskedValueChange, onUnexpectedInput: this.handleUnexpectedInput }));};_proto.getIconSizeClassname = function getIconSizeClassname(right) {if (right === void 0) {right = false;}switch (this.getProps().size) {case 'large':return right ? _Input.styles.rightIconLarge(this.theme) : _Input.styles.leftIconLarge(this.theme);case 'medium':return right ? _Input.styles.rightIconMedium(this.theme) : _Input.styles.leftIconMedium(this.theme);case 'small':default:return right ? _Input.styles.rightIconSmall(this.theme) : _Input.styles.leftIconSmall(this.theme);}};_proto.renderLeftIcon = function renderLeftIcon() {return this.renderIcon(this.props.leftIcon, this.getIconSizeClassname());};_proto.renderRightIcon = function renderRightIcon() {return this.renderIcon(this.props.rightIcon, this.getIconSizeClassname(true));};_proto.renderIcon = function renderIcon(icon, sizeClassName) {var _cx5;if (!icon) {return null;}var disabled = this.props.disabled;var iconNode = icon instanceof Function ? icon() : icon;return /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)(_Input.styles.icon(), sizeClassName, _Input.styles.useDefaultColor(this.theme), (_cx5 = {}, _cx5[_Input.styles.iconFocus(this.theme)] = this.state.focused, _cx5[_Input.styles.iconDisabled()] = disabled, _cx5)) }, iconNode);};_proto.renderPlaceholder = function renderPlaceholder() {var disabled = this.props.disabled;var focused = this.state.focused;var placeholder = null;if (this.state.needsPolyfillPlaceholder && this.props.placeholder && !this.isMaskVisible && !this.props.value && !this.props.defaultValue) {var _cx6;placeholder = /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Input.styles.placeholder(this.theme), (_cx6 = {}, _cx6[_Input.styles.placeholderDisabled(this.theme)] = disabled, _cx6[_Input.styles.placeholderFocus(this.theme)] = focused, _cx6)), style: { textAlign: this.props.align || 'inherit' } }, this.props.placeholder);}return placeholder;};_proto.getSizeClassName = function getSizeClassName() {var _cx7, _cx8, _cx9;switch (this.getProps().size) {case 'large':return (0, _Emotion.cx)((_cx7 = {}, _cx7[_Input.styles.sizeLarge(this.theme)] = true, _cx7[_Input.styles.sizeLargeFallback(this.theme)] = _client.isIE11 || _client.isEdge, _cx7));case 'medium':return (0, _Emotion.cx)((_cx8 = {}, _cx8[_Input.styles.sizeMedium(this.theme)] = true, _cx8[_Input.styles.sizeMediumFallback(this.theme)] = _client.isIE11 || _client.isEdge, _cx8));case 'small':default:return (0, _Emotion.cx)((_cx9 = {}, _cx9[_Input.styles.sizeSmall(this.theme)] = true, _cx9[_Input.styles.sizeSmallFallback(this.theme)] = _client.isIE11 || _client.isEdge, _cx9));}};(0, _createClass2.default)(Input, [{ key: "isMaskVisible", get: function get() {var _this$props3 = this.props,mask = _this$props3.mask,alwaysShowMask = _this$props3.alwaysShowMask;var focused = this.state.focused;return Boolean(mask && (focused || alwaysShowMask));} }, { key: "canBeUsedWithMask", get: function get() {return maskForbiddenTypes.includes(this.getProps().type);} /**
+     * Работает с типами `text`, `password`, `tel`, `search`, `url`
+     * [Документация](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange)
+     * @public
+     */ }]);return Input;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Input', _class2.defaultProps = { size: 'small', type: 'text' }, _temp)) || _class;exports.Input = Input;

package/cjs/components/Input/Input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Input.tsx"],"names":["Input","rootNode","state","polyfillPlaceholder","blinking","focused","selectAllId","blinkTimeout","input","selectAll","setSelectionRange","value","length","delaySelectAll","cancelDelayedSelectAll","raf","cancel","cancelBlink","callback","clearTimeout","setState","renderMain","props","onMouseEnter","onMouseLeave","onMouseOver","onKeyDown","onKeyPress","onValueChange","width","error","warning","leftIcon","rightIcon","borderless","align","type","mask","maskChar","alwaysShowMask","size","placeholder","selectAllOnFocus","disabled","onUnexpectedInput","prefix","suffix","formatChars","rest","labelProps","className","styles","root","theme","getSizeClassName","focus","blink","focusFallback","isIE11","isEdge","warningFallback","errorFallback","style","inputProps","inputFocus","inputDisabled","onChange","handleChange","onFocus","handleFocus","handleKeyDown","handleKeyPress","onBlur","handleBlur","textAlign","ref","refInput","isMaskVisible","undefined","renderMaskedInput","React","createElement","sideContainer","renderLeftIcon","renderPrefix","wrapper","renderPlaceholder","rightContainer","renderSuffix","renderRightIcon","element","MaskedInput","event","fieldIsEmpty","target","e","isDeleteKey","isKeyBackspace","isKeyDelete","currentTarget","repeat","handleUnexpectedInput","maxLength","handleMaskedValueChange","prefixDisabled","suffixDisabled","componentDidMount","componentWillUnmount","getDerivedStateFromProps","blur","getNode","offsetWidth","window","setTimeout","start","end","Error","document","activeElement","render","setRootNode","getIconSizeClassname","right","rightIconLarge","leftIconLarge","rightIconMedium","leftIconMedium","rightIconSmall","leftIconSmall","renderIcon","icon","sizeClassName","iconNode","Function","useDefaultColor","iconDisabled","placeholderDisabled","placeholderFocus","sizeLarge","sizeLargeFallback","sizeMedium","sizeMediumFallback","sizeSmall","sizeSmallFallback","Boolean","Component","__KONTUR_REACT_UI__","defaultProps"],"mappings":"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","sourcesContent":["import invariant from 'invariant';\nimport React from 'react';\nimport raf from 'raf';\n\nimport { isIE11, isEdge } from '../../lib/client';\nimport { isKeyBackspace, isKeyDelete, someKeys } from '../../lib/events/keyboard/identifiers';\nimport { polyfillPlaceholder } from '../../lib/polyfillPlaceholder';\nimport { Nullable, Override } from '../../typings/utility-types';\nimport { MaskedInput } from '../../internal/MaskedInput';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonWrapper, CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Input.styles';\n\nexport type InputSize = 'small' | 'medium' | 'large';\nexport type InputAlign = 'left' | 'center' | 'right';\nexport type InputType = 'password' | 'text';\nexport type InputIconType = React.ReactNode | (() => React.ReactNode);\n\nexport interface InputProps\n  extends CommonProps,\n    Override<\n      React.InputHTMLAttributes<HTMLInputElement>,\n      {\n        /**\n         * Иконка слева\n         * Если `ReactNode` применяются дефолтные стили для иконки\n         * Если `() => ReactNode` применяются только стили для позиционирование\n         */\n        leftIcon?: InputIconType;\n        /**\n         * Иконка справа\n         * Если `ReactNode` применяются дефолтные стили для иконки\n         * Если `() => ReactNode` применяются только стили для позиционирование\n         */\n        rightIcon?: InputIconType;\n        /**\n         * Cостояние валидации при ошибке.\n         */\n        error?: boolean;\n        /**\n         * Cостояние валидации при предупреждении.\n         */\n        warning?: boolean;\n        /** Режим прозрачной рамки */\n        borderless?: boolean;\n        /** Выравнивание текста */\n        align?: InputAlign;\n        /** Паттерн маски */\n        mask?: Nullable<string>;\n        /** Символ маски */\n        maskChar?: Nullable<string>;\n        /**\n         * Словарь символов-регулярок для задания маски\n         * @default { '9': '[0-9]', 'a': '[A-Za-z]', '*': '[A-Za-z0-9]' }\n         */\n        formatChars?: Record<string, string>;\n        /** Показывать символы маски */\n        alwaysShowMask?: boolean;\n        /** Размер */\n        size?: InputSize;\n        /** onValueChange */\n        onValueChange?: (value: string) => void;\n        /** Вызывается на label */\n        onMouseEnter?: React.MouseEventHandler<HTMLLabelElement>;\n        /** Вызывается на label */\n        onMouseLeave?: React.MouseEventHandler<HTMLLabelElement>;\n        /** Вызывается на label */\n        onMouseOver?: React.MouseEventHandler<HTMLLabelElement>;\n        /** Тип */\n        type?: InputType;\n        /** Значение */\n        value?: string;\n        capture?: boolean;\n\n        /**\n         * Префикс\n         * `ReactNode` перед значением, но после иконки\n         */\n        prefix?: React.ReactNode;\n        /**\n         * Суффикс\n         * `ReactNode` после значения, но перед правой иконкой\n         */\n        suffix?: React.ReactNode;\n        /** Выделять введенное значение при фокусе */\n        selectAllOnFocus?: boolean;\n        /**\n         * Обработчик неправильного ввода.\n         * По-умолчанию, инпут вспыхивает синим.\n         * Если передан - вызывается переданный обработчик,\n         * в таком случае вспыхивание можно вызвать\n         * публичным методом инстанса `blink()`.\n         *\n         * @param value значение инпута.\n         */\n        onUnexpectedInput?: (value: string) => void;\n      }\n    > {}\n\nexport interface InputState {\n  blinking: boolean;\n  focused: boolean;\n  polyfillPlaceholder: boolean;\n}\n\n/**\n * Интерфес пропсов наследуется от `React.InputHTMLAttributes<HTMLInputElement>`.\n *  Все пропсы кроме перечисленных, `className` и `style` передаются в `<input>`\n */\n@rootNode\nexport class Input extends React.Component<InputProps, InputState> {\n  public static __KONTUR_REACT_UI__ = 'Input';\n\n  public static defaultProps: {\n    size: InputSize;\n  } = {\n    size: 'small',\n  };\n\n  public state: InputState = {\n    polyfillPlaceholder: false,\n    blinking: false,\n    focused: false,\n  };\n\n  private selectAllId: number | null = null;\n  private theme!: Theme;\n  private blinkTimeout = 0;\n  private input: HTMLInputElement | null = null;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    if (polyfillPlaceholder) {\n      this.setState({ polyfillPlaceholder: true });\n    }\n  }\n\n  public componentWillUnmount() {\n    if (this.blinkTimeout) {\n      clearTimeout(this.blinkTimeout);\n    }\n    this.cancelDelayedSelectAll();\n  }\n\n  public static getDerivedStateFromProps(props: InputProps, state: InputState) {\n    if (polyfillPlaceholder && !props.value) {\n      return { polyfillPlaceholder: true };\n    }\n    return state;\n  }\n\n  /**\n   * @public\n   */\n  public focus() {\n    invariant(this.input, 'Cannot call \"focus\" because Input is not mounted');\n    this.input!.focus();\n  }\n\n  /**\n   * @public\n   */\n  public blur() {\n    invariant(this.input, 'Cannot call \"blur\" because Input is not mounted');\n    this.input!.blur();\n  }\n\n  /**\n   * @public\n   */\n  public getNode() {\n    return this.input;\n  }\n\n  /**\n   * @public\n   */\n  public blink() {\n    if (this.blinkTimeout) {\n      this.cancelBlink(() => {\n        // trigger reflow to restart animation\n        // @see https://css-tricks.com/restart-css-animation/#article-header-id-0\n        void (this.input && this.input.offsetWidth);\n        this.blink();\n      });\n      return;\n    }\n    this.setState({ blinking: true }, () => {\n      this.blinkTimeout = window.setTimeout(this.cancelBlink, 150);\n    });\n  }\n\n  /**\n   * @public\n   * @param {number} start\n   * @param {number} end\n   */\n  public setSelectionRange(start: number, end: number) {\n    if (!this.input) {\n      throw new Error('Cannot call \"setSelectionRange\" on unmounted Input');\n    }\n\n    if (document.activeElement !== this.input) {\n      this.focus();\n    }\n\n    this.input.setSelectionRange(start, end);\n  }\n\n  public get isMaskVisible(): boolean {\n    const { mask, alwaysShowMask } = this.props;\n    const { focused } = this.state;\n    return Boolean(mask && (focused || alwaysShowMask));\n  }\n\n  public render(): JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n              {this.renderMain}\n            </CommonWrapper>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  /**\n   * @public\n   */\n  public selectAll = (): void => {\n    if (this.input) {\n      this.setSelectionRange(0, this.input.value.length);\n    }\n  };\n\n  private delaySelectAll = (): number => (this.selectAllId = raf(this.selectAll));\n\n  private cancelDelayedSelectAll = (): void => {\n    if (this.selectAllId) {\n      raf.cancel(this.selectAllId);\n      this.selectAllId = null;\n    }\n  };\n\n  private cancelBlink = (callback?: () => void): void => {\n    if (this.blinkTimeout) {\n      clearTimeout(this.blinkTimeout);\n      this.blinkTimeout = 0;\n      if (this.state.blinking) {\n        this.setState({ blinking: false }, callback);\n        return;\n      }\n    }\n    if (callback) {\n      callback();\n    }\n  };\n\n  private renderMain = (props: CommonWrapperRestProps<InputProps>) => {\n    const {\n      onMouseEnter,\n      onMouseLeave,\n      onMouseOver,\n      onKeyDown,\n      onKeyPress,\n      onValueChange,\n      width,\n      error,\n      warning,\n      leftIcon,\n      rightIcon,\n      borderless,\n      value,\n      align,\n      type,\n      mask,\n      maskChar,\n      alwaysShowMask,\n      size,\n      placeholder,\n      selectAllOnFocus,\n      disabled,\n      onUnexpectedInput,\n      prefix,\n      suffix,\n      formatChars,\n      ...rest\n    } = props;\n\n    const { blinking, focused } = this.state;\n\n    const labelProps = {\n      className: cx(styles.root(this.theme), this.getSizeClassName(), {\n        [styles.focus(this.theme)]: focused,\n        [styles.blink(this.theme)]: blinking,\n        [styles.borderless()]: borderless && !focused,\n        [styles.disabled(this.theme)]: disabled,\n        [styles.warning(this.theme)]: warning,\n        [styles.error(this.theme)]: error,\n        [styles.focusFallback(this.theme)]: focused && (isIE11 || isEdge),\n        [styles.warningFallback(this.theme)]: warning && (isIE11 || isEdge),\n        [styles.errorFallback(this.theme)]: error && (isIE11 || isEdge),\n      }),\n      style: { width },\n      onMouseEnter,\n      onMouseLeave,\n      onMouseOver,\n    };\n\n    const inputProps = {\n      ...rest,\n      className: cx(styles.input(this.theme), {\n        [styles.inputFocus(this.theme)]: focused,\n        [styles.inputDisabled(this.theme)]: disabled,\n      }),\n      value,\n      onChange: this.handleChange,\n      onFocus: this.handleFocus,\n      onKeyDown: this.handleKeyDown,\n      onKeyPress: this.handleKeyPress,\n      onBlur: this.handleBlur,\n      style: { textAlign: align },\n      ref: this.refInput,\n      type: 'text',\n      placeholder: !this.isMaskVisible && !polyfillPlaceholder ? placeholder : undefined,\n      disabled,\n    };\n\n    if (type === 'password') {\n      inputProps.type = type;\n    }\n\n    const input = mask ? this.renderMaskedInput(inputProps, mask) : React.createElement('input', inputProps);\n\n    return (\n      <label {...labelProps}>\n        <span className={styles.sideContainer()}>\n          {this.renderLeftIcon()}\n          {this.renderPrefix()}\n        </span>\n        <span className={styles.wrapper()}>\n          {input}\n          {this.renderPlaceholder()}\n        </span>\n        <span className={cx(styles.sideContainer(), styles.rightContainer())}>\n          {this.renderSuffix()}\n          {this.renderRightIcon()}\n        </span>\n      </label>\n    );\n  };\n\n  private renderMaskedInput(\n    inputProps: React.InputHTMLAttributes<HTMLInputElement> & {\n      capture?: boolean;\n    },\n    mask: string,\n  ) {\n    return (\n      <MaskedInput\n        {...inputProps}\n        mask={mask}\n        maskChar={this.props.maskChar}\n        alwaysShowMask={this.props.alwaysShowMask}\n        formatChars={this.props.formatChars}\n        onChange={this.props.onChange}\n        onValueChange={this.handleMaskedValueChange}\n        onUnexpectedInput={this.handleUnexpectedInput}\n      />\n    );\n  }\n\n  private getIconSizeClassname(right = false) {\n    switch (this.props.size) {\n      case 'large':\n        return right ? styles.rightIconLarge(this.theme) : styles.leftIconLarge(this.theme);\n      case 'medium':\n        return right ? styles.rightIconMedium(this.theme) : styles.leftIconMedium(this.theme);\n      case 'small':\n      default:\n        return right ? styles.rightIconSmall(this.theme) : styles.leftIconSmall(this.theme);\n    }\n  }\n\n  private renderLeftIcon() {\n    return this.renderIcon(this.props.leftIcon, this.getIconSizeClassname());\n  }\n\n  private renderRightIcon() {\n    return this.renderIcon(this.props.rightIcon, this.getIconSizeClassname(true));\n  }\n\n  private renderIcon(icon: InputIconType, sizeClassName: string) {\n    if (!icon) {\n      return null;\n    }\n    const { disabled } = this.props;\n    const iconNode = icon instanceof Function ? icon() : icon;\n\n    return (\n      <span\n        className={cx(styles.icon(), sizeClassName, styles.useDefaultColor(this.theme), {\n          [styles.iconDisabled()]: disabled,\n        })}\n      >\n        {iconNode}\n      </span>\n    );\n  }\n\n  private renderPlaceholder() {\n    const { disabled } = this.props;\n    const { focused } = this.state;\n    let placeholder = null;\n\n    if (this.state.polyfillPlaceholder && this.props.placeholder && !this.isMaskVisible && !this.props.value) {\n      placeholder = (\n        <div\n          className={cx(styles.placeholder(this.theme), {\n            [styles.placeholderDisabled(this.theme)]: disabled,\n            [styles.placeholderFocus(this.theme)]: focused,\n          })}\n          style={{ textAlign: this.props.align || 'inherit' }}\n        >\n          {this.props.placeholder}\n        </div>\n      );\n    }\n\n    return placeholder;\n  }\n\n  private getSizeClassName() {\n    switch (this.props.size) {\n      case 'large':\n        return cx({\n          [styles.sizeLarge(this.theme)]: true,\n          [styles.sizeLargeFallback(this.theme)]: isIE11 || isEdge,\n        });\n      case 'medium':\n        return cx({\n          [styles.sizeMedium(this.theme)]: true,\n          [styles.sizeMediumFallback(this.theme)]: isIE11 || isEdge,\n        });\n      case 'small':\n      default:\n        return cx({\n          [styles.sizeSmall(this.theme)]: true,\n          [styles.sizeSmallFallback(this.theme)]: isIE11 || isEdge,\n        });\n    }\n  }\n\n  private refInput = (element: HTMLInputElement | MaskedInput | null) => {\n    if (element instanceof MaskedInput) {\n      this.input = element.input;\n    } else {\n      this.input = element;\n    }\n  };\n\n  private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    if (polyfillPlaceholder) {\n      const fieldIsEmpty = event.target.value === '';\n      if (this.state.polyfillPlaceholder !== fieldIsEmpty) {\n        this.setState({ polyfillPlaceholder: fieldIsEmpty });\n      }\n    }\n\n    if (this.props.onValueChange) {\n      this.props.onValueChange(event.target.value);\n    }\n\n    if (this.props.onChange) {\n      this.props.onChange(event);\n    }\n  };\n\n  private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    this.setState({\n      focused: true,\n    });\n\n    if (this.props.selectAllOnFocus) {\n      // https://github.com/facebook/react/issues/7769\n      this.input && !isIE11 ? this.selectAll() : this.delaySelectAll();\n    }\n\n    if (this.props.onFocus) {\n      this.props.onFocus(event);\n    }\n  };\n\n  private handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (this.props.onKeyDown) {\n      this.props.onKeyDown(e);\n    }\n\n    const isDeleteKey = someKeys(isKeyBackspace, isKeyDelete)(e);\n\n    if (!e.currentTarget.value && isDeleteKey && !e.repeat) {\n      this.handleUnexpectedInput();\n    }\n  };\n\n  private handleKeyPress = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (this.props.onKeyPress) {\n      this.props.onKeyPress(event);\n    }\n\n    if (this.props.maxLength === event.currentTarget.value.length) {\n      this.handleUnexpectedInput(event.currentTarget.value);\n    }\n  };\n\n  private handleMaskedValueChange = (value: string) => {\n    if (this.props.onValueChange) {\n      this.props.onValueChange(value);\n    }\n  };\n\n  private handleUnexpectedInput = (value: string = this.props.value || '') => {\n    if (this.props.onUnexpectedInput) {\n      this.props.onUnexpectedInput(value);\n    } else {\n      this.blink();\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 renderPrefix = () => {\n    const { prefix, disabled } = this.props;\n\n    if (!prefix) {\n      return null;\n    }\n\n    return (\n      <span className={cx(styles.prefix(this.theme), { [styles.prefixDisabled(this.theme)]: disabled })}>{prefix}</span>\n    );\n  };\n\n  private renderSuffix = () => {\n    const { suffix, disabled } = this.props;\n\n    if (!suffix) {\n      return null;\n    }\n\n    return (\n      <span className={cx(styles.suffix(this.theme), { [styles.suffixDisabled(this.theme)]: disabled })}>{suffix}</span>\n    );\n  };\n}\n"]}
+{"version":3,"sources":["Input.tsx"],"names":["inputTypes","selectionAllowedTypes","selectionErrorMessage","type","allowedTypes","map","i","join","maskForbiddenTypes","maskAllowedTypes","filter","includes","maskErrorMessage","InputDataTids","root","Input","rootNode","getProps","defaultProps","state","needsPolyfillPlaceholder","blinking","focused","selectAllId","blinkTimeout","input","selectAll","setSelectionRange","value","length","delaySelectAll","cancelDelayedSelectAll","raf","cancel","cancelBlink","callback","clearTimeout","setState","renderMain","props","onMouseEnter","onMouseLeave","onMouseOver","onKeyDown","onKeyPress","onValueChange","width","error","role","warning","leftIcon","rightIcon","borderless","align","mask","maskChar","alwaysShowMask","size","placeholder","selectAllOnFocus","disabled","onUnexpectedInput","prefix","suffix","formatChars","corners","ariaDescribedby","ariaControls","ariaLabel","rest","labelProps","className","styles","theme","getSizeClassName","focus","hovering","blink","focusFallback","isIE11","isEdge","warningFallback","errorFallback","style","inputProps","inputFocus","inputDisabled","onChange","handleChange","onFocus","handleFocus","handleKeyDown","handleKeyPress","onBlur","handleBlur","textAlign","ref","refInput","isMaskVisible","undefined","canBeUsedWithMask","renderMaskedInput","React","createElement","Boolean","defaultValue","sideContainer","renderLeftIcon","renderPrefix","wrapper","renderPlaceholder","rightContainer","renderSuffix","renderRightIcon","element","MaskedInput","event","fieldIsEmpty","target","e","isDeleteKey","isKeyBackspace","isKeyDelete","currentTarget","repeat","handleUnexpectedInput","maxLength","handleMaskedValueChange","prefixDisabled","suffixDisabled","outputMaskError","componentDidMount","componentDidUpdate","prevProps","componentWillUnmount","blur","getNode","offsetWidth","window","setTimeout","start","end","Error","document","activeElement","render","setRootNode","getIconSizeClassname","right","rightIconLarge","leftIconLarge","rightIconMedium","leftIconMedium","rightIconSmall","leftIconSmall","renderIcon","icon","sizeClassName","iconNode","Function","useDefaultColor","iconFocus","iconDisabled","placeholderDisabled","placeholderFocus","sizeLarge","sizeLargeFallback","sizeMedium","sizeMediumFallback","sizeSmall","sizeSmallFallback","Component","__KONTUR_REACT_UI__"],"mappings":"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","sourcesContent":["// TODO: Enable this rule in functional components.\n/* eslint-disable @typescript-eslint/no-unused-vars */\nimport invariant from 'invariant';\nimport React, { AriaAttributes, HTMLAttributes } from 'react';\nimport raf from 'raf';\nimport warning from 'warning';\n\nimport { isEdge, isIE11 } from '../../lib/client';\nimport { isKeyBackspace, isKeyDelete, someKeys } from '../../lib/events/keyboard/identifiers';\nimport { needsPolyfillPlaceholder } from '../../lib/needsPolyfillPlaceholder';\nimport { Nullable, Override } from '../../typings/utility-types';\nimport { MaskedInput } from '../../internal/MaskedInput';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { SizeProp } from '../../lib/types/props';\n\nimport { styles } from './Input.styles';\nimport { InputLayout } from './InputLayout/InputLayout';\nimport { PolyfillPlaceholder } from './InputLayout/PolyfillPlaceholder';\n\nexport const inputTypes = ['password', 'text', 'number', 'tel', 'search', 'time', 'date', 'url', 'email'] as const;\n\n/**\n * @deprecated use SizeProp\n */\nexport type InputSize = SizeProp;\nexport type InputAlign = 'left' | 'center' | 'right';\nexport type InputType = typeof inputTypes[number];\nexport type InputIconType = React.ReactNode | (() => React.ReactNode);\n\nexport const selectionAllowedTypes: InputType[] = ['text', 'password', 'tel', 'search', 'url'];\nexport const selectionErrorMessage = (type: InputType, allowedTypes: InputType[] = selectionAllowedTypes) => {\n  return `<Input />. Selection is not supported by the type \"${type}\". Types that support selection: ${allowedTypes\n    .map((i) => `\"${i}\"`)\n    .join(', ')}. Reason: https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange.`;\n};\n\nexport const maskForbiddenTypes: InputType[] = ['number', 'date', 'time'];\nexport const maskAllowedTypes: InputType[] = inputTypes.filter((type) => {\n  return !maskForbiddenTypes.includes(type);\n});\nexport const maskErrorMessage = (type: InputType, allowedTypes: InputType[] = maskAllowedTypes) => {\n  return `<Input />. Prop \"mask\" does not support type \"${type}\". Supported types: ${allowedTypes\n    .map((i) => `\"${i}\"`)\n    .join(', ')}.`;\n};\n\nexport interface InputProps\n  extends CommonProps,\n    Pick<HTMLAttributes<unknown>, 'role'>,\n    Pick<AriaAttributes, 'aria-describedby' | 'aria-controls' | 'aria-label'>,\n    Override<\n      React.InputHTMLAttributes<HTMLInputElement>,\n      {\n        /**\n         * Иконка слева\n         * Если `ReactNode` применяются дефолтные стили для иконки\n         * Если `() => ReactNode` применяются только стили для позиционирование\n         */\n        leftIcon?: InputIconType;\n        /**\n         * Иконка справа\n         * Если `ReactNode` применяются дефолтные стили для иконки\n         * Если `() => ReactNode` применяются только стили для позиционирование\n         */\n        rightIcon?: InputIconType;\n        /**\n         * Состояние валидации при ошибке.\n         */\n        error?: boolean;\n        /**\n         * Состояние валидации при предупреждении.\n         */\n        warning?: boolean;\n        /** Режим прозрачной рамки */\n        borderless?: boolean;\n        /** Выравнивание текста */\n        align?: InputAlign;\n        /** Паттерн маски. Доступен для типов `text`, `password`, `email`, `tel`, `search`, `url` */\n        mask?: Nullable<string>;\n        /** Символ маски */\n        maskChar?: Nullable<string>;\n        /**\n         * Словарь символов-регулярок для задания маски\n         * @default { '9': '[0-9]', 'a': '[A-Za-z]', '*': '[A-Za-z0-9]' }\n         */\n        formatChars?: Record<string, string>;\n        /** Показывать символы маски */\n        alwaysShowMask?: boolean;\n        /** Размер */\n        size?: SizeProp;\n        /** onValueChange */\n        onValueChange?: (value: string) => void;\n        /** Вызывается на label */\n        onMouseEnter?: React.MouseEventHandler<HTMLLabelElement>;\n        /** Вызывается на label */\n        onMouseLeave?: React.MouseEventHandler<HTMLLabelElement>;\n        /** Вызывается на label */\n        onMouseOver?: React.MouseEventHandler<HTMLLabelElement>;\n        /**\n         * Тип. Возможные значения: 'password' | 'text' | 'number' | 'tel' | 'search' | 'time' | 'date' | 'url' | 'email'\n         * */\n        type?: InputType;\n        /** Значение */\n        value?: string;\n        capture?: boolean;\n\n        /**\n         * Префикс\n         * `ReactNode` перед значением, но после иконки\n         */\n        prefix?: React.ReactNode;\n        /**\n         * Суффикс\n         * `ReactNode` после значения, но перед правой иконкой\n         */\n        suffix?: React.ReactNode;\n        /** Выделять введенное значение при фокусе. Работает с типами `text`, `password`, `tel`, `search`, `url`. [Документация](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange) */\n        selectAllOnFocus?: boolean;\n        /**\n         * Обработчик неправильного ввода.\n         * По-умолчанию, инпут вспыхивает синим.\n         * Если передан - вызывается переданный обработчик,\n         * в таком случае вспыхивание можно вызвать\n         * публичным методом инстанса `blink()`.\n         *\n         * @param value значение инпута.\n         */\n        onUnexpectedInput?: (value: string) => void;\n        /** @ignore */\n        corners?: Partial<\n          Pick<\n            React.CSSProperties,\n            'borderTopRightRadius' | 'borderBottomRightRadius' | 'borderBottomLeftRadius' | 'borderTopLeftRadius'\n          >\n        >;\n      }\n    > {}\n\nexport interface InputState {\n  blinking: boolean;\n  focused: boolean;\n  needsPolyfillPlaceholder: boolean;\n}\n\nexport const InputDataTids = {\n  root: 'Input__root',\n} as const;\n\ntype DefaultProps = Required<Pick<InputProps, 'size' | 'type'>>;\n\n/**\n * Интерфейс пропсов наследуется от `React.InputHTMLAttributes<HTMLInputElement>`.\n *  Все пропсы кроме перечисленных, `className` и `style` передаются в `<input>`\n */\n@rootNode\nexport class Input extends React.Component<InputProps, InputState> {\n  public static __KONTUR_REACT_UI__ = 'Input';\n\n  public static defaultProps: DefaultProps = {\n    size: 'small',\n    type: 'text',\n  };\n\n  private getProps = createPropsGetter(Input.defaultProps);\n\n  public state: InputState = {\n    needsPolyfillPlaceholder,\n    blinking: false,\n    focused: false,\n  };\n\n  private selectAllId: number | null = null;\n  private theme!: Theme;\n  private blinkTimeout = 0;\n  private input: HTMLInputElement | null = null;\n  private setRootNode!: TSetRootNode;\n\n  private outputMaskError() {\n    warning(!(this.props.mask && this.canBeUsedWithMask), maskErrorMessage(this.getProps().type));\n  }\n\n  public componentDidMount() {\n    this.outputMaskError();\n  }\n\n  public componentDidUpdate(prevProps: Readonly<InputProps>) {\n    if (this.props.type !== prevProps.type || this.props.mask !== prevProps.mask) {\n      this.outputMaskError();\n    }\n  }\n\n  public componentWillUnmount() {\n    if (this.blinkTimeout) {\n      clearTimeout(this.blinkTimeout);\n    }\n    this.cancelDelayedSelectAll();\n  }\n\n  /**\n   * @public\n   */\n  public focus() {\n    invariant(this.input, 'Cannot call \"focus\" because Input is not mounted');\n    this.input.focus();\n  }\n\n  /**\n   * @public\n   */\n  public blur() {\n    invariant(this.input, 'Cannot call \"blur\" because Input is not mounted');\n    this.input.blur();\n  }\n\n  /**\n   * @public\n   */\n  public getNode() {\n    return this.input;\n  }\n\n  /**\n   * @public\n   */\n  public blink() {\n    if (this.blinkTimeout) {\n      this.cancelBlink(() => {\n        // trigger reflow to restart animation\n        // @see https://css-tricks.com/restart-css-animation/#article-header-id-0\n        void (this.input && this.input.offsetWidth);\n        this.blink();\n      });\n      return;\n    }\n    this.setState({ blinking: true }, () => {\n      this.blinkTimeout = window.setTimeout(this.cancelBlink, 150);\n    });\n  }\n\n  /**\n   * @public\n   * @param {number} start\n   * @param {number} end\n   */\n  public setSelectionRange(start: number, end: number) {\n    // https://github.com/facebook/react/issues/7769\n    // https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange\n    if (!selectionAllowedTypes.includes(this.getProps().type)) {\n      warning(false, selectionErrorMessage(this.getProps().type));\n\n      return;\n    }\n\n    if (!this.input) {\n      throw new Error('Cannot call \"setSelectionRange\" on unmounted Input');\n    }\n\n    if (document.activeElement !== this.input) {\n      this.focus();\n    }\n    if (this.props.mask && this.props.value && this.props.value?.length < this.props.mask.length) {\n      setTimeout(() => {\n        this.input?.setSelectionRange(start, end);\n      }, 150);\n    } else {\n      this.input?.setSelectionRange(start, end);\n    }\n  }\n\n  public get isMaskVisible(): boolean {\n    const { mask, alwaysShowMask } = this.props;\n    const { focused } = this.state;\n    return Boolean(mask && (focused || alwaysShowMask));\n  }\n\n  public render(): JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n              {this.renderMain}\n            </CommonWrapper>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private get canBeUsedWithMask() {\n    return maskForbiddenTypes.includes(this.getProps().type);\n  }\n\n  /**\n   * Работает с типами `text`, `password`, `tel`, `search`, `url`\n   * [Документация](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange)\n   * @public\n   */\n  public selectAll = (): void => {\n    if (this.input) {\n      this.setSelectionRange(0, this.input.value.length);\n    }\n  };\n\n  private delaySelectAll = (): number => (this.selectAllId = raf(this.selectAll));\n\n  private cancelDelayedSelectAll = (): void => {\n    if (this.selectAllId) {\n      raf.cancel(this.selectAllId);\n      this.selectAllId = null;\n    }\n  };\n\n  private cancelBlink = (callback?: () => void): void => {\n    if (this.blinkTimeout) {\n      clearTimeout(this.blinkTimeout);\n      this.blinkTimeout = 0;\n      if (this.state.blinking) {\n        this.setState({ blinking: false }, callback);\n        return;\n      }\n    }\n    if (callback) {\n      callback();\n    }\n  };\n\n  private renderMain = (props: CommonWrapperRestProps<InputProps>) => {\n    const {\n      onMouseEnter,\n      onMouseLeave,\n      onMouseOver,\n      onKeyDown,\n      onKeyPress,\n      onValueChange,\n      width,\n      error,\n      role,\n      warning,\n      leftIcon,\n      rightIcon,\n      borderless,\n      value,\n      align,\n      type,\n      mask,\n      maskChar,\n      alwaysShowMask,\n      size,\n      placeholder,\n      selectAllOnFocus,\n      disabled,\n      onUnexpectedInput,\n      prefix,\n      suffix,\n      formatChars,\n      corners,\n      'aria-describedby': ariaDescribedby,\n      'aria-controls': ariaControls,\n      'aria-label': ariaLabel,\n      ...rest\n    } = props;\n\n    const { blinking, focused } = this.state;\n\n    const labelProps = {\n      className: cx(styles.root(this.theme), this.getSizeClassName(), {\n        [styles.focus(this.theme)]: focused && !warning && !error,\n        [styles.hovering(this.theme)]: !focused && !disabled && !warning && !error && !borderless,\n        [styles.blink(this.theme)]: blinking,\n        [styles.borderless()]: borderless && !focused,\n        [styles.disabled(this.theme)]: disabled,\n        [styles.warning(this.theme)]: warning,\n        [styles.error(this.theme)]: error,\n        [styles.focusFallback(this.theme)]: focused && (isIE11 || isEdge),\n        [styles.warningFallback(this.theme)]: warning && (isIE11 || isEdge),\n        [styles.errorFallback(this.theme)]: error && (isIE11 || isEdge),\n      }),\n      'aria-controls': ariaControls,\n      style: { width, ...corners },\n      onMouseEnter,\n      onMouseLeave,\n      onMouseOver,\n    };\n\n    const inputProps = {\n      ...rest,\n      className: cx(styles.input(this.theme), {\n        [styles.inputFocus(this.theme)]: focused,\n        [styles.inputDisabled(this.theme)]: disabled,\n      }),\n      value,\n      role,\n      onChange: this.handleChange,\n      onFocus: this.handleFocus,\n      onKeyDown: this.handleKeyDown,\n      onKeyPress: this.handleKeyPress,\n      onBlur: this.handleBlur,\n      style: { textAlign: align },\n      ref: this.refInput,\n      type,\n      placeholder: !this.isMaskVisible && !needsPolyfillPlaceholder ? placeholder : undefined,\n      disabled,\n      'aria-describedby': ariaDescribedby,\n      'aria-label': ariaLabel,\n    };\n\n    const input =\n      mask && !this.canBeUsedWithMask\n        ? this.renderMaskedInput(inputProps, mask)\n        : React.createElement('input', inputProps);\n\n    if (isTheme2022(this.theme)) {\n      return (\n        <InputLayout\n          leftIcon={leftIcon}\n          rightIcon={rightIcon}\n          prefix={prefix}\n          suffix={suffix}\n          labelProps={labelProps}\n          context={{ disabled: Boolean(disabled), focused, size }}\n        >\n          {input}\n          {this.state.needsPolyfillPlaceholder && (\n            <PolyfillPlaceholder\n              isMaskVisible={this.isMaskVisible}\n              value={value}\n              defaultValue={this.props.defaultValue}\n              align={align}\n            >\n              {placeholder}\n            </PolyfillPlaceholder>\n          )}\n        </InputLayout>\n      );\n    }\n\n    return (\n      <label data-tid={InputDataTids.root} {...labelProps}>\n        <span className={styles.sideContainer()}>\n          {this.renderLeftIcon()}\n          {this.renderPrefix()}\n        </span>\n        <span className={styles.wrapper()}>\n          {input}\n          {this.renderPlaceholder()}\n        </span>\n        <span className={cx(styles.sideContainer(), styles.rightContainer())}>\n          {this.renderSuffix()}\n          {this.renderRightIcon()}\n        </span>\n      </label>\n    );\n  };\n\n  private renderMaskedInput(\n    inputProps: React.InputHTMLAttributes<HTMLInputElement> & {\n      capture?: boolean;\n    },\n    mask: string,\n  ) {\n    return (\n      <MaskedInput\n        {...inputProps}\n        mask={mask}\n        maskChar={this.props.maskChar}\n        alwaysShowMask={this.props.alwaysShowMask}\n        formatChars={this.props.formatChars}\n        onChange={this.props.onChange}\n        onValueChange={this.handleMaskedValueChange}\n        onUnexpectedInput={this.handleUnexpectedInput}\n      />\n    );\n  }\n\n  private getIconSizeClassname(right = false) {\n    switch (this.getProps().size) {\n      case 'large':\n        return right ? styles.rightIconLarge(this.theme) : styles.leftIconLarge(this.theme);\n      case 'medium':\n        return right ? styles.rightIconMedium(this.theme) : styles.leftIconMedium(this.theme);\n      case 'small':\n      default:\n        return right ? styles.rightIconSmall(this.theme) : styles.leftIconSmall(this.theme);\n    }\n  }\n\n  private renderLeftIcon() {\n    return this.renderIcon(this.props.leftIcon, this.getIconSizeClassname());\n  }\n\n  private renderRightIcon() {\n    return this.renderIcon(this.props.rightIcon, this.getIconSizeClassname(true));\n  }\n\n  private renderIcon(icon: InputIconType, sizeClassName: string) {\n    if (!icon) {\n      return null;\n    }\n    const { disabled } = this.props;\n    const iconNode = icon instanceof Function ? icon() : icon;\n\n    return (\n      <span\n        className={cx(styles.icon(), sizeClassName, styles.useDefaultColor(this.theme), {\n          [styles.iconFocus(this.theme)]: this.state.focused,\n          [styles.iconDisabled()]: disabled,\n        })}\n      >\n        {iconNode}\n      </span>\n    );\n  }\n\n  private renderPlaceholder() {\n    const { disabled } = this.props;\n    const { focused } = this.state;\n    let placeholder = null;\n\n    if (\n      this.state.needsPolyfillPlaceholder &&\n      this.props.placeholder &&\n      !this.isMaskVisible &&\n      !this.props.value &&\n      !this.props.defaultValue\n    ) {\n      placeholder = (\n        <div\n          className={cx(styles.placeholder(this.theme), {\n            [styles.placeholderDisabled(this.theme)]: disabled,\n            [styles.placeholderFocus(this.theme)]: focused,\n          })}\n          style={{ textAlign: this.props.align || 'inherit' }}\n        >\n          {this.props.placeholder}\n        </div>\n      );\n    }\n\n    return placeholder;\n  }\n\n  private getSizeClassName() {\n    switch (this.getProps().size) {\n      case 'large':\n        return cx({\n          [styles.sizeLarge(this.theme)]: true,\n          [styles.sizeLargeFallback(this.theme)]: isIE11 || isEdge,\n        });\n      case 'medium':\n        return cx({\n          [styles.sizeMedium(this.theme)]: true,\n          [styles.sizeMediumFallback(this.theme)]: isIE11 || isEdge,\n        });\n      case 'small':\n      default:\n        return cx({\n          [styles.sizeSmall(this.theme)]: true,\n          [styles.sizeSmallFallback(this.theme)]: isIE11 || isEdge,\n        });\n    }\n  }\n\n  private refInput = (element: HTMLInputElement | MaskedInput | null) => {\n    if (element instanceof MaskedInput) {\n      this.input = element.input;\n    } else {\n      this.input = element;\n    }\n  };\n\n  private handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    if (needsPolyfillPlaceholder) {\n      const fieldIsEmpty = event.target.value === '';\n      if (this.state.needsPolyfillPlaceholder !== fieldIsEmpty) {\n        this.setState({ needsPolyfillPlaceholder: fieldIsEmpty });\n      }\n    }\n\n    if (this.props.onValueChange) {\n      this.props.onValueChange(event.target.value);\n    }\n\n    if (this.props.onChange) {\n      this.props.onChange(event);\n    }\n  };\n\n  private handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    this.setState({\n      focused: true,\n    });\n\n    if (this.props.selectAllOnFocus) {\n      this.input && !isIE11 ? this.selectAll() : this.delaySelectAll();\n    }\n\n    if (this.props.onFocus) {\n      this.props.onFocus(event);\n    }\n  };\n\n  private handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (this.props.onKeyDown) {\n      this.props.onKeyDown(e);\n    }\n\n    const isDeleteKey = someKeys(isKeyBackspace, isKeyDelete)(e);\n\n    if (!e.currentTarget.value && isDeleteKey && !e.repeat) {\n      this.handleUnexpectedInput();\n    }\n  };\n\n  private handleKeyPress = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (this.props.onKeyPress) {\n      this.props.onKeyPress(event);\n    }\n\n    if (this.props.maxLength === event.currentTarget.value.length) {\n      this.handleUnexpectedInput(event.currentTarget.value);\n    }\n  };\n\n  private handleMaskedValueChange = (value: string) => {\n    if (this.props.onValueChange) {\n      this.props.onValueChange(value);\n    }\n  };\n\n  private handleUnexpectedInput = (value: string = this.props.value || '') => {\n    if (this.props.onUnexpectedInput) {\n      this.props.onUnexpectedInput(value);\n    } else {\n      this.blink();\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 renderPrefix = () => {\n    const { prefix, disabled } = this.props;\n\n    if (!prefix) {\n      return null;\n    }\n\n    return (\n      <span className={cx(styles.prefix(this.theme), { [styles.prefixDisabled(this.theme)]: disabled })}>{prefix}</span>\n    );\n  };\n\n  private renderSuffix = () => {\n    const { suffix, disabled } = this.props;\n\n    if (!suffix) {\n      return null;\n    }\n\n    return (\n      <span className={cx(styles.suffix(this.theme), { [styles.suffixDisabled(this.theme)]: disabled })}>{suffix}</span>\n    );\n  };\n}\n"]}

package/cjs/components/Input/Input.md

@@ -4,10 +4,75 @@ import SearchIcon from '@skbkontur/react-icons/Search';
 <Input leftIcon={<SearchIcon />} />;
 ```
 
+Очистить значение в `Input`'е можно только с помощью пустой строки
+
+```jsx harmony
+import { Button, Group } from '@skbkontur/react-ui';
+
+const [value, setValue] = React.useState('Значение');
+
+<Group>
+  <Input value={value} onValueChange={setValue} />
+  <Button onClick={() => setValue('')}>Очистить</Button>
+</Group>
+```
+
 Пример с префиксом:
 
 ```jsx harmony
 import SearchIcon from '@skbkontur/react-icons/Search';
 
-<Input width={400} prefix="https://kontur.ru/search?query=" rightIcon={<SearchIcon />} />;
+<Input
+  width={400}
+  prefix="https://kontur.ru/search?query="
+  rightIcon={<SearchIcon />}
+/>;
+```
+
+Примеры разных значений `type`:
+
+```jsx harmony
+import { Gapped, Input, Tooltip } from '@skbkontur/react-ui';
+
+<Gapped vertical gap={20}>
+  <Gapped gap={20}>
+    <Input type="password" />
+    <span>type = "password"</span>
+  </Gapped>
+
+  <Gapped gap={20}>
+    <Input type="number" />
+    <span>type = "number"</span>
+  </Gapped>
+
+  <Gapped gap={20}>
+    <Input type="tel" />
+    <span>type = "tel"</span>
+  </Gapped>
+
+  <Gapped gap={20}>
+    <Input type="search" />
+    <span>type = "search"</span>
+  </Gapped>
+
+  <Gapped gap={20}>
+    <Input type="time" />
+    <span>type = "time"</span>
+  </Gapped>
+
+  <Gapped gap={20}>
+    <Input type="date" />
+    <span>type = "date"</span>
+  </Gapped>
+
+  <Gapped gap={20}>
+    <Input type="url" />
+    <span>type = "url"</span>
+  </Gapped>
+
+  <Gapped gap={20}>
+    <Input type="email" />
+    <span>type = "email"</span>
+  </Gapped>
+</Gapped>
 ```

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

@@ -2,6 +2,7 @@ import { Theme } from '../../lib/theming/Theme';
 export declare const styles: {
     wrapper(): string;
     root(t: Theme): string;
+    hovering(t: Theme): string;
     borderless(): string;
     useDefaultColor(t: Theme): string;
     focus(t: Theme): string;
@@ -31,6 +32,7 @@ export declare const styles: {
     sideContainer(): string;
     rightContainer(): string;
     icon(): string;
+    iconFocus(t: Theme): string;
     iconDisabled(): string;
     leftIconSmall(t: Theme): string;
     rightIconSmall(t: Theme): string;