@skbkontur/react-ui 0.0.0-4ef0a955cc → 0.0.0-52df310f7c

package/cjs/components/Textarea/Textarea.js

@@ -1,22 +1,31 @@
-"use strict";var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Textarea = 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"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.TextareaDataTids = exports.Textarea = 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 _propTypes = _interopRequireDefault(require("prop-types"));
 var _lodash = _interopRequireDefault(require("lodash.throttle"));
-var _classnames = _interopRequireDefault(require("classnames"));
+var _raf = _interopRequireDefault(require("raf"));
 
 var _identifiers = require("../../lib/events/keyboard/identifiers");
-var _polyfillPlaceholder = require("../../lib/polyfillPlaceholder");
+var _needsPolyfillPlaceholder = require("../../lib/needsPolyfillPlaceholder");
 var LayoutEvents = _interopRequireWildcard(require("../../lib/LayoutEvents"));
 
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _RenderLayer = require("../../internal/RenderLayer");
 var _ResizeDetector = require("../../internal/ResizeDetector");
+var _client = require("../../lib/client");
+var _CommonWrapper = require("../../internal/CommonWrapper");
+var _currentEnvironment = require("../../lib/currentEnvironment");
+var _Emotion = require("../../lib/theming/Emotion");
+var _rootNode = require("../../lib/rootNode");
+var _createPropsGetter = require("../../lib/createPropsGetter");
 
 var _TextareaHelpers = require("./TextareaHelpers");
 var _Textarea = require("./Textarea.styles");
-var _TextareaCounter = require("./TextareaCounter");
+var _TextareaCounter = require("./TextareaCounter");var _excluded = ["width", "error", "warning", "autoResize", "resize", "onCut", "onPaste", "maxRows", "onFocus", "selectAllOnFocus", "placeholder", "onValueChange", "showLengthCounter", "lengthCounter", "counterHelp", "extraRow", "disableAnimations", "disabled"];var _class, _class2, _temp;function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
 
 var DEFAULT_WIDTH = 250;
+var AUTORESIZE_THROTTLE_DEFAULT_WAIT = 100;
 
 
 
@@ -90,14 +99,6 @@ var DEFAULT_WIDTH = 250;
 
 
 
-/**
- * Компонент для ввода многострочного текста.
- *
- * Принимает все атрибуты `React.TextareaHTMLAttributes<HTMLTextAreaElement>`
- *
- * ** `className` и `style`  игнорируются**
- */var
-Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Textarea, _React$Component);function Textarea() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
 
 
 
@@ -113,11 +114,23 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
 
 
 
+var TextareaDataTids = {
+  root: 'Textarea__root',
+  counter: 'TextareaCounter__root',
+  helpIcon: 'TextareaCounter__helpIcon' };exports.TextareaDataTids = TextareaDataTids;
 
 
 
 
+/**
+ * Компонент для ввода многострочного текста.
+ *
+ * Принимает все атрибуты `React.TextareaHTMLAttributes<HTMLTextAreaElement>`
+ *
+ * ** `className` и `style`  игнорируются**
+ */var
 
+Textarea = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Textarea, _React$Component);function Textarea() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
 
 
 
@@ -157,23 +170,8 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
 
 
 
-    state = {
-      polyfillPlaceholder: _polyfillPlaceholder.polyfillPlaceholder,
-      rows: 1,
-      isCounterVisible: false };_this.
 
-    reflowCounter = function () {
-      if (_this.counter) {
-        _this.counter.reflow();
-      }
-    };_this.
 
-    theme = void 0;_this.
-    node = void 0;_this.
-    fakeNode = void 0;_this.
-    counter = void 0;_this.
-    layoutEvents = void 0;_this.
-    textareaObserver = new MutationObserver(_this.reflowCounter);_this.
 
 
 
@@ -196,14 +194,26 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
 
 
 
+    getProps = (0, _createPropsGetter.createPropsGetter)(Textarea.defaultProps);_this.
 
+    state = {
+      needsPolyfillPlaceholder: _needsPolyfillPlaceholder.needsPolyfillPlaceholder,
+      isCounterVisible: false };_this.
 
+    reflowCounter = function () {
+      if (_this.counter) {
+        _this.counter.reflow();
+      }
+    };_this.
 
 
+    selectAllId = null;_this.
 
 
 
 
+    textareaObserver = _client.isBrowser ? new MutationObserver(_this.reflowCounter) : null;_this.
+
 
 
 
@@ -233,26 +243,12 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
 
 
 
-    setSelectionRange = function (start, end) {
-      if (!_this.node) {
-        throw new Error('Cannot call "setSelectionRange" on unmounted Input');
-      }
 
-      if (document.activeElement !== _this.node) {
-        _this.focus();
-      }
 
-      _this.node.setSelectionRange(start, end);
-    };_this.
 
 
 
 
-    selectAll = function () {
-      if (_this.node) {
-        _this.setSelectionRange(0, _this.node.value.length);
-      }
-    };_this.
 
 
 
@@ -300,14 +296,38 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
 
 
 
+    setSelectionRange = function (start, end) {
+      if (!_this.node) {
+        throw new Error('Cannot call "setSelectionRange" on unmounted Input');
+      }
+
+      if (document.activeElement !== _this.node) {
+        _this.focus();
+      }
 
+      _this.node.setSelectionRange(start, end);
+    };_this.
 
 
 
 
+    selectAll = function () {
+      if (_this.node) {
+        _this.setSelectionRange(0, _this.node.value.length);
+      }
+    };_this.
 
+    delaySelectAll = function () {return _this.selectAllId = (0, _raf.default)(_this.selectAll);};_this.
 
+    cancelDelayedSelectAll = function () {
+      if (_this.selectAllId) {
+        _raf.default.cancel(_this.selectAllId);
+        _this.selectAllId = null;
+      }
+    };_this.
 
+    renderMain = function (props) {var _cx, _ref, _textareaProps$maxLen;
+      var _props$width =
 
 
 
@@ -327,29 +347,87 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
 
 
 
+      props.width,width = _props$width === void 0 ? DEFAULT_WIDTH : _props$width,error = props.error,warning = props.warning,autoResize = props.autoResize,resize = props.resize,onCut = props.onCut,onPaste = props.onPaste,maxRows = props.maxRows,onFocus = props.onFocus,selectAllOnFocus = props.selectAllOnFocus,placeholder = props.placeholder,onValueChange = props.onValueChange,showLengthCounter = props.showLengthCounter,lengthCounter = props.lengthCounter,counterHelp = props.counterHelp,extraRow = props.extraRow,disableAnimations = props.disableAnimations,disabled = props.disabled,textareaProps = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
 
+      var isCounterVisible = _this.state.isCounterVisible;
 
+      var rootProps = {
+        style: {
+          width: width } };
 
 
 
+      var textareaClassNames = (0, _Emotion.cx)((_cx = {}, _cx[
+      _Textarea.styles.textarea(_this.theme)] = true, _cx[
+      _Textarea.styles.disabled(_this.theme)] = disabled, _cx[
+      _Textarea.styles.error(_this.theme)] = !!error, _cx[
+      _Textarea.styles.warning(_this.theme)] = !!warning, _cx[
+      _Textarea.styles.disableAnimations()] = _this.isAnimationsDisabled(), _cx));
 
 
+      var textareaStyle = {
+        resize: autoResize ? 'none' : resize };
 
 
+      var placeholderPolyfill = null;
 
+      if (_this.state.needsPolyfillPlaceholder && !textareaProps.value && !textareaProps.defaultValue) {
+        placeholderPolyfill = /*#__PURE__*/_react.default.createElement("span", { className: _Textarea.styles.placeholder() }, placeholder);
+      }
 
+      var fakeTextarea = null;
+      if (autoResize) {
+        var fakeProps = {
+          value: _this.props.value,
+          defaultValue: _this.props.defaultValue,
+          className: (0, _Emotion.cx)(textareaClassNames, _Textarea.styles.fake()),
+          readOnly: true };
 
+        fakeTextarea = /*#__PURE__*/_react.default.createElement("textarea", (0, _extends2.default)({}, fakeProps, { ref: _this.refFake }));
+      }
 
+      var counter = showLengthCounter && isCounterVisible && _this.node && /*#__PURE__*/
+      _react.default.createElement(_TextareaCounter.TextareaCounter, {
+        textarea: _this.node,
+        help: counterHelp,
+        value: textareaProps.value,
+        length: (_ref = (_textareaProps$maxLen = textareaProps.maxLength) != null ? _textareaProps$maxLen : lengthCounter) != null ? _ref : 0,
+        onCloseHelp: _this.handleCloseCounterHelp,
+        ref: _this.refCounter });
 
 
 
+      return /*#__PURE__*/(
+        _react.default.createElement(_RenderLayer.RenderLayer, {
+          onFocusOutside: _this.handleCloseCounterHelp,
+          onClickOutside: _this.handleCloseCounterHelp,
+          active: _this.state.isCounterVisible }, /*#__PURE__*/
 
+        _react.default.createElement("label", (0, _extends2.default)({ "data-tid": TextareaDataTids.root }, rootProps, { className: _Textarea.styles.root(_this.theme) }),
+        placeholderPolyfill, /*#__PURE__*/
+        _react.default.createElement(_ResizeDetector.ResizeDetector, { onResize: _this.reflowCounter }, /*#__PURE__*/
+        _react.default.createElement("textarea", (0, _extends2.default)({},
+        textareaProps, {
+          className: textareaClassNames,
+          style: textareaStyle,
+          placeholder: !placeholderPolyfill ? placeholder : undefined,
+          ref: _this.ref,
+          onChange: _this.handleChange,
+          onCut: _this.handleCut,
+          onPaste: _this.handlePaste,
+          onFocus: _this.handleFocus,
+          onKeyDown: _this.handleKeyDown,
+          disabled: disabled }),
 
+        _this.props.children)),
 
 
+        fakeTextarea,
+        counter)));
 
 
 
+    };_this.
 
     handleCloseCounterHelp = function () {return _this.setState({ isCounterVisible: false });};_this.
 
@@ -369,11 +447,11 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
     };_this.
 
     handleChange = function (e) {
-      if (_polyfillPlaceholder.polyfillPlaceholder) {
+      if (_needsPolyfillPlaceholder.needsPolyfillPlaceholder) {
         var fieldIsEmpty = e.target.value === '';
 
-        if (_this.state.polyfillPlaceholder !== fieldIsEmpty) {
-          _this.setState({ polyfillPlaceholder: fieldIsEmpty });
+        if (_this.state.needsPolyfillPlaceholder !== fieldIsEmpty) {
+          _this.setState({ needsPolyfillPlaceholder: fieldIsEmpty });
         }
       }
 
@@ -404,7 +482,7 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
       _this.counter = ref;
     };_this.
 
-    autoResize = (0, _lodash.default)(function () {
+    autoResizeHandler = function () {
       var fakeNode = _this.fakeNode;
       if (!fakeNode) {
         return;
@@ -415,21 +493,24 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
       }
       if (_this.props.value === undefined) {
         fakeNode.value = node.value;
-      }var _this$props =
+      }
 
-      _this.props,rows = _this$props.rows,maxRows = _this$props.maxRows;
+      var _this$getProps = _this.getProps(),rows = _this$getProps.rows,maxRows = _this$getProps.maxRows;
       if (rows === undefined || maxRows === undefined) {
         return;
-      }var _getTextAreaHeight =
-      (0, _TextareaHelpers.getTextAreaHeight)(
-      fakeNode,
-      typeof rows === 'number' ? rows : parseInt(rows, 10),
-      typeof maxRows === 'number' ? maxRows : parseInt(maxRows, 10)),height = _getTextAreaHeight.height,exceededMaxHeight = _getTextAreaHeight.exceededMaxHeight;
+      }
+      var _getTextAreaHeight = (0, _TextareaHelpers.getTextAreaHeight)({
+        node: fakeNode,
+        minRows: typeof rows === 'number' ? rows : parseInt(rows, 10),
+        maxRows: typeof maxRows === 'number' ? maxRows : parseInt(maxRows, 10),
+        extraRow: _this.getProps().extraRow }),height = _getTextAreaHeight.height,exceededMaxHeight = _getTextAreaHeight.exceededMaxHeight;
 
       node.style.height = height + 'px';
       node.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';
       fakeNode.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';
-    }, 100);_this.
+    };_this.
+
+    autoResize = (0, _lodash.default)(_this.autoResizeHandler, _this.getAutoResizeThrottleWait());_this.
 
     handleCut = function (event) {
       if (_this.props.autoResize) {
@@ -459,16 +540,21 @@ Textarea = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
       _this.setState({ isCounterVisible: true });
 
       if (_this.props.selectAllOnFocus) {
-        _this.selectAll();
+        // https://github.com/facebook/react/issues/7769
+        _this.node && !_client.isIE11 ? _this.selectAll() : _this.delaySelectAll();
       }
 
       if (_this.props.onFocus) {
         _this.props.onFocus(event);
       }
-    };return _this;}var _proto = Textarea.prototype;_proto.componentDidMount = function componentDidMount() {if (this.props.autoResize) {this.autoResize();this.layoutEvents = LayoutEvents.addListener(this.autoResize);}if (this.node && this.props.showLengthCounter) {this.textareaObserver.observe(this.node, { attributes: true });}};_proto.componentWillUnmount = function componentWillUnmount() {if (this.layoutEvents) {this.layoutEvents.remove();}if (this.props.showLengthCounter) {this.textareaObserver.disconnect();}};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.props.autoResize && this.props.rows > this.state.rows || this.props.value !== prevProps.value) {this.autoResize();}};_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.focus = function focus() {if (this.node) {this.node.focus();}} /**
-   * @public
-   */;_proto.blur = function blur() {if (this.node) {this.node.blur();}} /**
-   * @public
-   */;_proto.renderMain = function renderMain() {var _cn, _ref, _textareaProps$maxLen;var _this$props2 = this.props,_this$props2$width = _this$props2.width,width = _this$props2$width === void 0 ? DEFAULT_WIDTH : _this$props2$width,error = _this$props2.error,warning = _this$props2.warning,autoResize = _this$props2.autoResize,resize = _this$props2.resize,onCut = _this$props2.onCut,onPaste = _this$props2.onPaste,maxRows = _this$props2.maxRows,onFocus = _this$props2.onFocus,selectAllOnFocus = _this$props2.selectAllOnFocus,className = _this$props2.className,style = _this$props2.style,placeholder = _this$props2.placeholder,onValueChange = _this$props2.onValueChange,showLengthCounter = _this$props2.showLengthCounter,lengthCounter = _this$props2.lengthCounter,counterHelp = _this$props2.counterHelp,textareaProps = (0, _objectWithoutPropertiesLoose2.default)(_this$props2, ["width", "error", "warning", "autoResize", "resize", "onCut", "onPaste", "maxRows", "onFocus", "selectAllOnFocus", "className", "style", "placeholder", "onValueChange", "showLengthCounter", "lengthCounter", "counterHelp"]);var isCounterVisible = this.state.isCounterVisible;var rootProps = { style: { width: width } };var textareaClassNames = (0, _classnames.default)((_cn = {}, _cn[_Textarea.jsStyles.textarea(this.theme)] = true, _cn[_Textarea.jsStyles.error(this.theme)] = !!error, _cn[_Textarea.jsStyles.warning(this.theme)] = !!warning, _cn));var textareaStyle = { resize: autoResize ? 'none' : resize };var placeholderPolyfill = null;if (this.state.polyfillPlaceholder && !textareaProps.value) {placeholderPolyfill = /*#__PURE__*/_react.default.createElement("span", { className: _Textarea.jsStyles.placeholder() }, placeholder);}var fakeTextarea = null;if (autoResize) {var fakeProps = { value: this.props.value, defaultValue: this.props.defaultValue, className: (0, _classnames.default)(textareaClassNames, _Textarea.jsStyles.fake()), readOnly: true };fakeTextarea = /*#__PURE__*/_react.default.createElement("textarea", (0, _extends2.default)({}, fakeProps, { ref: this.refFake }));}var counter = showLengthCounter && isCounterVisible && this.node && /*#__PURE__*/_react.default.createElement(_TextareaCounter.TextareaCounter, { textarea: this.node, help: counterHelp, value: textareaProps.value, length: (_ref = (_textareaProps$maxLen = textareaProps.maxLength) != null ? _textareaProps$maxLen : lengthCounter) != null ? _ref : 0, onCloseHelp: this.handleCloseCounterHelp, ref: this.refCounter });return /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, { onFocusOutside: this.handleCloseCounterHelp, onClickOutside: this.handleCloseCounterHelp, active: isCounterVisible }, /*#__PURE__*/_react.default.createElement("label", (0, _extends2.default)({}, rootProps, { className: _Textarea.jsStyles.root(this.theme) }), placeholderPolyfill, /*#__PURE__*/_react.default.createElement(_ResizeDetector.ResizeDetector, { onResize: this.reflowCounter }, /*#__PURE__*/_react.default.createElement("textarea", (0, _extends2.default)({}, textareaProps, { className: textareaClassNames, style: textareaStyle, placeholder: !placeholderPolyfill ? placeholder : undefined, ref: this.ref, onChange: this.handleChange, onCut: this.handleCut, onPaste: this.handlePaste, onFocus: this.handleFocus, onKeyDown: this.handleKeyDown }))), fakeTextarea, counter));};return Textarea;}(_react.default.Component);exports.Textarea = Textarea;Textarea.__KONTUR_REACT_UI__ = 'Textarea';Textarea.propTypes = { error: _propTypes.default.bool, warning: _propTypes.default.bool, disabled: _propTypes.default.bool, autoResize: _propTypes.default.bool, maxRows: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), resize: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), width: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), id: _propTypes.default.string, name: _propTypes.default.string, title: _propTypes.default.string, spellCheck: _propTypes.default.bool, role: _propTypes.default.string, maxLength: _propTypes.default.number, tabIndex: _propTypes.default.number, rows: _propTypes.default.number, placeholder: _propTypes.default.string, value: _propTypes.default.string, defaultValue: _propTypes.default.string, onValueChange: _propTypes.default.func, onMouseEnter: _propTypes.default.func, onMouseLeave: _propTypes.default.func, onMouseOver: _propTypes.default.func, onMouseMove: _propTypes.default.func, onMouseOut: _propTypes.default.func, onMouseUp: _propTypes.default.func, onMouseDown: _propTypes.default.func, onClick: _propTypes.default.func, onDoubleClick: _propTypes.default.func, onKeyDown: _propTypes.default.func, onKeyPress: _propTypes.default.func, onKeyUp: _propTypes.default.func, onInput: _propTypes.default.func, onFocus: _propTypes.default.func, onBlur: _propTypes.default.func, onScroll: _propTypes.default.func, onWheel: _propTypes.default.func, onCut: _propTypes.default.func, onPaste: _propTypes.default.func, onCopy: _propTypes.default.func };Textarea.defaultProps = { rows: 3, maxRows: 15 };
+    };return _this;}var _proto = Textarea.prototype;_proto.getAutoResizeThrottleWait = function getAutoResizeThrottleWait(props) {if (props === void 0) {props = this.props;} // NOTE: При отключении анимации остается эффект дергания при авто-ресайзе из-за троттлинга расчета высоты
+    // Поэтому выставляем таймаут троттла в ноль. Подробности - https://github.com/skbkontur/retail-ui/issues/2120
+    return this.isAnimationsDisabled(props) ? 0 : AUTORESIZE_THROTTLE_DEFAULT_WAIT;};_proto.isAnimationsDisabled = function isAnimationsDisabled(_temp2) {var _ref2 = _temp2 === void 0 ? this.props : _temp2,disableAnimations = _ref2.disableAnimations,extraRow = _ref2.extraRow;return disableAnimations || !extraRow;};_proto.componentDidMount = function componentDidMount() {if (this.props.autoResize) {this.autoResize();this.layoutEvents = LayoutEvents.addListener(this.autoResize);}if (this.node && this.props.showLengthCounter && this.textareaObserver) {this.textareaObserver.observe(this.node, { attributes: true });}};_proto.componentWillUnmount = function componentWillUnmount() {if (this.layoutEvents) {this.layoutEvents.remove();}if (this.props.showLengthCounter && this.textareaObserver) {this.textareaObserver.disconnect();}this.cancelDelayedSelectAll();};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (this.getAutoResizeThrottleWait() !== this.getAutoResizeThrottleWait(prevProps)) {this.autoResize.cancel();this.autoResize = (0, _lodash.default)(this.autoResizeHandler, this.getAutoResizeThrottleWait());}var _this$getProps2 = this.getProps(),rows = _this$getProps2.rows,maxRows = _this$getProps2.maxRows;if (this.props.autoResize && (rows !== prevProps.rows || maxRows !== prevProps.maxRows || this.props.value !== prevProps.value)) {this.autoResize();}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this2.setRootNode }, _this2.props), _this2.renderMain);});} /**
+   * @public
+   */;_proto.focus = function focus() {if (this.node) {this.node.focus();}} /**
+   * @public
+   */;_proto.blur = function blur() {if (this.node) {this.node.blur();}} /**
+   * @public
+   * @param {number} start
+   * @param {number} end
+   */;return Textarea;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Textarea', _class2.propTypes = { error: _propTypes.default.bool, warning: _propTypes.default.bool, disabled: _propTypes.default.bool, autoResize: _propTypes.default.bool, extraRow: _propTypes.default.bool, disableAnimations: _propTypes.default.bool, maxRows: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), resize: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), width: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]), id: _propTypes.default.string, name: _propTypes.default.string, title: _propTypes.default.string, spellCheck: _propTypes.default.bool, role: _propTypes.default.string, maxLength: _propTypes.default.number, tabIndex: _propTypes.default.number, rows: _propTypes.default.number, placeholder: _propTypes.default.string, value: _propTypes.default.string, defaultValue: _propTypes.default.string, onValueChange: _propTypes.default.func, onMouseEnter: _propTypes.default.func, onMouseLeave: _propTypes.default.func, onMouseOver: _propTypes.default.func, onMouseMove: _propTypes.default.func, onMouseOut: _propTypes.default.func, onMouseUp: _propTypes.default.func, onMouseDown: _propTypes.default.func, onClick: _propTypes.default.func, onDoubleClick: _propTypes.default.func, onKeyDown: _propTypes.default.func, onKeyPress: _propTypes.default.func, onKeyUp: _propTypes.default.func, onInput: _propTypes.default.func, onFocus: _propTypes.default.func, onBlur: _propTypes.default.func, onScroll: _propTypes.default.func, onWheel: _propTypes.default.func, onCut: _propTypes.default.func, onPaste: _propTypes.default.func, onCopy: _propTypes.default.func }, _class2.defaultProps = { rows: 3, maxRows: 15, extraRow: true, disableAnimations: _currentEnvironment.isTestEnv }, _temp)) || _class;exports.Textarea = Textarea;

package/cjs/components/Textarea/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Textarea.tsx"],"names":["DEFAULT_WIDTH","Textarea","state","polyfillPlaceholder","rows","isCounterVisible","reflowCounter","counter","reflow","theme","node","fakeNode","layoutEvents","textareaObserver","MutationObserver","setSelectionRange","start","end","Error","document","activeElement","focus","selectAll","value","length","handleCloseCounterHelp","setState","handleKeyDown","e","props","undefined","toString","isBlockEnter","maxLength","preventDefault","onKeyDown","handleChange","fieldIsEmpty","target","onValueChange","autoResize","onChange","ref","element","refFake","refCounter","maxRows","parseInt","height","exceededMaxHeight","style","overflowY","handleCut","event","onCut","handlePaste","onPaste","handleFocus","selectAllOnFocus","onFocus","componentDidMount","LayoutEvents","addListener","showLengthCounter","observe","attributes","componentWillUnmount","remove","disconnect","componentDidUpdate","prevProps","render","renderMain","blur","width","error","warning","resize","className","placeholder","lengthCounter","counterHelp","textareaProps","rootProps","textareaClassNames","jsStyles","textarea","textareaStyle","placeholderPolyfill","fakeTextarea","fakeProps","defaultValue","fake","readOnly","root","React","Component","__KONTUR_REACT_UI__","propTypes","PropTypes","bool","disabled","oneOfType","string","number","id","name","title","spellCheck","role","tabIndex","func","onMouseEnter","onMouseLeave","onMouseOver","onMouseMove","onMouseOut","onMouseUp","onMouseDown","onClick","onDoubleClick","onKeyPress","onKeyUp","onInput","onBlur","onScroll","onWheel","onCopy","defaultProps"],"mappings":"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","sourcesContent":["import React, { ReactNode } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport throttle from 'lodash.throttle';\r\nimport cn from 'classnames';\r\n\r\nimport { isKeyEnter } from '../../lib/events/keyboard/identifiers';\r\nimport { polyfillPlaceholder } from '../../lib/polyfillPlaceholder';\r\nimport * as LayoutEvents from '../../lib/LayoutEvents';\r\nimport { Nullable, Override } from '../../typings/utility-types';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { RenderLayer } from '../../internal/RenderLayer';\r\nimport { ResizeDetector } from '../../internal/ResizeDetector';\r\n\r\nimport { getTextAreaHeight } from './TextareaHelpers';\r\nimport { jsStyles } from './Textarea.styles';\r\nimport { TextareaCounter, TextareaCounterRef } from './TextareaCounter';\r\n\r\nconst DEFAULT_WIDTH = 250;\r\n\r\nexport type TextareaProps = Override<\r\n  React.TextareaHTMLAttributes<HTMLTextAreaElement>,\r\n  {\r\n    /** Ошибка */\r\n    error?: boolean;\r\n    /** Предупреждение */\r\n    warning?: boolean;\r\n    /** Не активное состояние */\r\n    disabled?: boolean;\r\n\r\n    /**\r\n     * Атоматический ресайз\r\n     * в зависимости от содержимого\r\n     */\r\n    autoResize?: boolean;\r\n    /**\r\n     * Число строк\r\n     */\r\n    rows: number;\r\n    /**\r\n     * Максимальное число строк при\r\n     * автоматическом ресайзе\r\n     */\r\n    maxRows: string | number;\r\n\r\n    /**\r\n     * Стандартный ресайз\r\n     * Попадает в `style`\r\n     */\r\n    resize?: React.CSSProperties['resize'];\r\n\r\n    /**\r\n     * Ширина\r\n     */\r\n    width?: React.CSSProperties['width'];\r\n\r\n    /**\r\n     * Вызывается при изменении `value`\r\n     */\r\n    onValueChange?: (value: string) => void;\r\n\r\n    /** Выделение значения при фокусе */\r\n    selectAllOnFocus?: boolean;\r\n\r\n    /** Показывать счетчик символов */\r\n    showLengthCounter?: boolean;\r\n\r\n    /** Допустимое количество символов в поле. Отображается в счетчике.\r\n     * Если не указано, равно `maxLength`\r\n     */\r\n    lengthCounter?: number;\r\n\r\n    /** Подсказка к счетчику символов.\r\n     *\r\n     * По умолчанию - тултип с содежимым из пропа, если передан`ReactNode`.\r\n     *\r\n     * Передав функцию, можно переопределить подсказку целиком, вместе с иконкой. Например,\r\n     *\r\n     * ```\r\n     * counterHelp={() => <Tooltip render={...}><HelpIcon /></Tooltip>}\r\n     * ```\r\n     * */\r\n    counterHelp?: ReactNode | (() => ReactNode);\r\n  }\r\n>;\r\n\r\nexport interface TextareaState {\r\n  polyfillPlaceholder: boolean;\r\n  rows: number | string;\r\n  isCounterVisible: boolean;\r\n}\r\n\r\n/**\r\n * Компонент для ввода многострочного текста.\r\n *\r\n * Принимает все атрибуты `React.TextareaHTMLAttributes<HTMLTextAreaElement>`\r\n *\r\n * ** `className` и `style`  игнорируются**\r\n */\r\nexport class Textarea extends React.Component<TextareaProps, TextareaState> {\r\n  public static __KONTUR_REACT_UI__ = 'Textarea';\r\n\r\n  public static propTypes = {\r\n    error: PropTypes.bool,\r\n    warning: PropTypes.bool,\r\n    disabled: PropTypes.bool,\r\n\r\n    autoResize: PropTypes.bool,\r\n    maxRows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n\r\n    resize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n    width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n\r\n    id: PropTypes.string,\r\n    name: PropTypes.string,\r\n    title: PropTypes.string,\r\n    spellCheck: PropTypes.bool,\r\n    role: PropTypes.string,\r\n    maxLength: PropTypes.number,\r\n    tabIndex: PropTypes.number,\r\n    rows: PropTypes.number,\r\n    placeholder: PropTypes.string,\r\n\r\n    value: PropTypes.string,\r\n    defaultValue: PropTypes.string,\r\n    onValueChange: PropTypes.func,\r\n\r\n    onMouseEnter: PropTypes.func,\r\n    onMouseLeave: PropTypes.func,\r\n    onMouseOver: PropTypes.func,\r\n    onMouseMove: PropTypes.func,\r\n    onMouseOut: PropTypes.func,\r\n\r\n    onMouseUp: PropTypes.func,\r\n    onMouseDown: PropTypes.func,\r\n    onClick: PropTypes.func,\r\n    onDoubleClick: PropTypes.func,\r\n\r\n    onKeyDown: PropTypes.func,\r\n    onKeyPress: PropTypes.func,\r\n    onKeyUp: PropTypes.func,\r\n    onInput: PropTypes.func,\r\n\r\n    onFocus: PropTypes.func,\r\n    onBlur: PropTypes.func,\r\n\r\n    onScroll: PropTypes.func,\r\n    onWheel: PropTypes.func,\r\n\r\n    onCut: PropTypes.func,\r\n    onPaste: PropTypes.func,\r\n    onCopy: PropTypes.func,\r\n  };\r\n\r\n  public static defaultProps = {\r\n    rows: 3,\r\n    maxRows: 15,\r\n  };\r\n\r\n  public state = {\r\n    polyfillPlaceholder,\r\n    rows: 1,\r\n    isCounterVisible: false,\r\n  };\r\n  private reflowCounter = () => {\r\n    if (this.counter) {\r\n      this.counter.reflow();\r\n    }\r\n  };\r\n\r\n  private theme!: Theme;\r\n  private node: Nullable<HTMLTextAreaElement>;\r\n  private fakeNode: Nullable<HTMLTextAreaElement>;\r\n  private counter: Nullable<TextareaCounterRef>;\r\n  private layoutEvents: Nullable<{ remove: () => void }>;\r\n  private textareaObserver = new MutationObserver(this.reflowCounter);\r\n\r\n  public componentDidMount() {\r\n    if (this.props.autoResize) {\r\n      this.autoResize();\r\n      this.layoutEvents = LayoutEvents.addListener(this.autoResize);\r\n    }\r\n\r\n    if (this.node && this.props.showLengthCounter) {\r\n      this.textareaObserver.observe(this.node, { attributes: true });\r\n    }\r\n  }\r\n\r\n  public componentWillUnmount() {\r\n    if (this.layoutEvents) {\r\n      this.layoutEvents.remove();\r\n    }\r\n    if (this.props.showLengthCounter) {\r\n      this.textareaObserver.disconnect();\r\n    }\r\n  }\r\n\r\n  public componentDidUpdate(prevProps: TextareaProps) {\r\n    if ((this.props.autoResize && this.props.rows > this.state.rows) || this.props.value !== prevProps.value) {\r\n      this.autoResize();\r\n    }\r\n  }\r\n\r\n  public render() {\r\n    return (\r\n      <ThemeContext.Consumer>\r\n        {theme => {\r\n          this.theme = theme;\r\n          return this.renderMain();\r\n        }}\r\n      </ThemeContext.Consumer>\r\n    );\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public focus() {\r\n    if (this.node) {\r\n      this.node.focus();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public blur() {\r\n    if (this.node) {\r\n      this.node.blur();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public setSelectionRange = (start: number, end: number) => {\r\n    if (!this.node) {\r\n      throw new Error('Cannot call \"setSelectionRange\" on unmounted Input');\r\n    }\r\n\r\n    if (document.activeElement !== this.node) {\r\n      this.focus();\r\n    }\r\n\r\n    this.node.setSelectionRange(start, end);\r\n  };\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public selectAll = () => {\r\n    if (this.node) {\r\n      this.setSelectionRange(0, this.node.value.length);\r\n    }\r\n  };\r\n\r\n  private renderMain() {\r\n    const {\r\n      width = DEFAULT_WIDTH,\r\n      error,\r\n      warning,\r\n      autoResize,\r\n      resize,\r\n      onCut,\r\n      onPaste,\r\n      maxRows,\r\n      onFocus,\r\n      selectAllOnFocus,\r\n      className,\r\n      style,\r\n      placeholder,\r\n      onValueChange,\r\n      showLengthCounter,\r\n      lengthCounter,\r\n      counterHelp,\r\n      ...textareaProps\r\n    } = this.props;\r\n\r\n    const { isCounterVisible } = this.state;\r\n\r\n    const rootProps = {\r\n      style: {\r\n        width,\r\n      },\r\n    };\r\n\r\n    const textareaClassNames = cn({\r\n      [jsStyles.textarea(this.theme)]: true,\r\n      [jsStyles.error(this.theme)]: !!error,\r\n      [jsStyles.warning(this.theme)]: !!warning,\r\n    });\r\n\r\n    const textareaStyle = {\r\n      resize: autoResize ? 'none' : resize,\r\n    };\r\n\r\n    let placeholderPolyfill = null;\r\n\r\n    if (this.state.polyfillPlaceholder && !textareaProps.value) {\r\n      placeholderPolyfill = <span className={jsStyles.placeholder()}>{placeholder}</span>;\r\n    }\r\n\r\n    let fakeTextarea = null;\r\n    if (autoResize) {\r\n      const fakeProps = {\r\n        value: this.props.value,\r\n        defaultValue: this.props.defaultValue,\r\n        className: cn(textareaClassNames, jsStyles.fake()),\r\n        readOnly: true,\r\n      };\r\n      fakeTextarea = <textarea {...fakeProps} ref={this.refFake} />;\r\n    }\r\n\r\n    const counter = showLengthCounter && isCounterVisible && this.node && (\r\n      <TextareaCounter\r\n        textarea={this.node}\r\n        help={counterHelp}\r\n        value={textareaProps.value}\r\n        length={textareaProps.maxLength ?? lengthCounter ?? 0}\r\n        onCloseHelp={this.handleCloseCounterHelp}\r\n        ref={this.refCounter}\r\n      />\r\n    );\r\n\r\n    return (\r\n      <RenderLayer\r\n        onFocusOutside={this.handleCloseCounterHelp}\r\n        onClickOutside={this.handleCloseCounterHelp}\r\n        active={isCounterVisible}\r\n      >\r\n        <label {...rootProps} className={jsStyles.root(this.theme)}>\r\n          {placeholderPolyfill}\r\n          <ResizeDetector onResize={this.reflowCounter}>\r\n            <textarea\r\n              {...textareaProps}\r\n              className={textareaClassNames}\r\n              style={textareaStyle}\r\n              placeholder={!placeholderPolyfill ? placeholder : undefined}\r\n              ref={this.ref}\r\n              onChange={this.handleChange}\r\n              onCut={this.handleCut}\r\n              onPaste={this.handlePaste}\r\n              onFocus={this.handleFocus}\r\n              onKeyDown={this.handleKeyDown}\r\n            />\r\n          </ResizeDetector>\r\n          {fakeTextarea}\r\n          {counter}\r\n        </label>\r\n      </RenderLayer>\r\n    );\r\n  }\r\n\r\n  private handleCloseCounterHelp = () => this.setState({ isCounterVisible: false });\r\n\r\n  private handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\r\n    // Edge bug: textarea maxlength doesn't work after new line\r\n    // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/18833616/\r\n    const value = this.props.value !== undefined ? this.props.value.toString() : null;\r\n    const isBlockEnter = isKeyEnter(e) && value !== null && value.length === this.props.maxLength;\r\n\r\n    if (isBlockEnter) {\r\n      e.preventDefault();\r\n    }\r\n\r\n    if (this.props.onKeyDown) {\r\n      this.props.onKeyDown(e);\r\n    }\r\n  };\r\n\r\n  private handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\r\n    if (polyfillPlaceholder) {\r\n      const fieldIsEmpty = e.target.value === '';\r\n\r\n      if (this.state.polyfillPlaceholder !== fieldIsEmpty) {\r\n        this.setState({ polyfillPlaceholder: fieldIsEmpty });\r\n      }\r\n    }\r\n\r\n    if (this.props.onValueChange) {\r\n      this.props.onValueChange(e.target.value);\r\n    }\r\n\r\n    if (this.props.autoResize) {\r\n      this.autoResize();\r\n    }\r\n\r\n    if (this.props.onChange) {\r\n      this.props.onChange(e);\r\n    }\r\n\r\n    this.reflowCounter();\r\n  };\r\n\r\n  private ref = (element: HTMLTextAreaElement) => {\r\n    this.node = element;\r\n  };\r\n\r\n  private refFake = (element: HTMLTextAreaElement) => {\r\n    this.fakeNode = element;\r\n  };\r\n\r\n  private refCounter = (ref: TextareaCounterRef | null) => {\r\n    this.counter = ref;\r\n  };\r\n\r\n  private autoResize = throttle(() => {\r\n    const fakeNode = this.fakeNode;\r\n    if (!fakeNode) {\r\n      return;\r\n    }\r\n    const node = this.node;\r\n    if (!node) {\r\n      return;\r\n    }\r\n    if (this.props.value === undefined) {\r\n      fakeNode.value = node.value;\r\n    }\r\n\r\n    const { rows, maxRows } = this.props;\r\n    if (rows === undefined || maxRows === undefined) {\r\n      return;\r\n    }\r\n    const { height, exceededMaxHeight } = getTextAreaHeight(\r\n      fakeNode,\r\n      typeof rows === 'number' ? rows : parseInt(rows, 10),\r\n      typeof maxRows === 'number' ? maxRows : parseInt(maxRows, 10),\r\n    );\r\n    node.style.height = height + 'px';\r\n    node.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\r\n    fakeNode.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\r\n  }, 100);\r\n\r\n  private handleCut = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\r\n    if (this.props.autoResize) {\r\n      this.autoResize();\r\n    }\r\n\r\n    if (this.props.onCut) {\r\n      this.props.onCut(event);\r\n    }\r\n\r\n    this.reflowCounter();\r\n  };\r\n\r\n  private handlePaste = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\r\n    if (this.props.autoResize) {\r\n      this.autoResize();\r\n    }\r\n\r\n    if (this.props.onPaste) {\r\n      this.props.onPaste(event);\r\n    }\r\n\r\n    this.reflowCounter();\r\n  };\r\n\r\n  private handleFocus = (event: React.FocusEvent<HTMLTextAreaElement>) => {\r\n    this.setState({ isCounterVisible: true });\r\n\r\n    if (this.props.selectAllOnFocus) {\r\n      this.selectAll();\r\n    }\r\n\r\n    if (this.props.onFocus) {\r\n      this.props.onFocus(event);\r\n    }\r\n  };\r\n}\r\n"]}
+{"version":3,"sources":["Textarea.tsx"],"names":["DEFAULT_WIDTH","AUTORESIZE_THROTTLE_DEFAULT_WAIT","TextareaDataTids","root","counter","helpIcon","Textarea","rootNode","getProps","defaultProps","state","needsPolyfillPlaceholder","isCounterVisible","reflowCounter","reflow","selectAllId","textareaObserver","isBrowser","MutationObserver","setSelectionRange","start","end","node","Error","document","activeElement","focus","selectAll","value","length","delaySelectAll","cancelDelayedSelectAll","raf","cancel","renderMain","props","width","error","warning","autoResize","resize","onCut","onPaste","maxRows","onFocus","selectAllOnFocus","placeholder","onValueChange","showLengthCounter","lengthCounter","counterHelp","extraRow","disableAnimations","disabled","textareaProps","rootProps","style","textareaClassNames","styles","textarea","theme","isAnimationsDisabled","textareaStyle","placeholderPolyfill","defaultValue","fakeTextarea","fakeProps","className","fake","readOnly","refFake","maxLength","handleCloseCounterHelp","refCounter","undefined","ref","handleChange","handleCut","handlePaste","handleFocus","handleKeyDown","children","setState","e","toString","isBlockEnter","preventDefault","onKeyDown","fieldIsEmpty","target","onChange","element","fakeNode","autoResizeHandler","rows","minRows","parseInt","height","exceededMaxHeight","overflowY","getAutoResizeThrottleWait","event","isIE11","componentDidMount","layoutEvents","LayoutEvents","addListener","observe","attributes","componentWillUnmount","remove","disconnect","componentDidUpdate","prevProps","render","setRootNode","blur","React","Component","__KONTUR_REACT_UI__","propTypes","PropTypes","bool","oneOfType","string","number","id","name","title","spellCheck","role","tabIndex","func","onMouseEnter","onMouseLeave","onMouseOver","onMouseMove","onMouseOut","onMouseUp","onMouseDown","onClick","onDoubleClick","onKeyPress","onKeyUp","onInput","onBlur","onScroll","onWheel","onCopy","isTestEnv"],"mappings":"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","sourcesContent":["// TODO: Enable this rule in functional components.\n/* eslint-disable @typescript-eslint/no-unused-vars */\nimport React, { ReactNode } from 'react';\nimport PropTypes from 'prop-types';\nimport throttle from 'lodash.throttle';\nimport raf from 'raf';\n\nimport { isKeyEnter } from '../../lib/events/keyboard/identifiers';\nimport { needsPolyfillPlaceholder } from '../../lib/needsPolyfillPlaceholder';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable, Override } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { RenderLayer } from '../../internal/RenderLayer';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { isBrowser, isIE11 } from '../../lib/client';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { getTextAreaHeight } from './TextareaHelpers';\nimport { styles } from './Textarea.styles';\nimport { TextareaCounter, TextareaCounterRef } from './TextareaCounter';\n\nconst DEFAULT_WIDTH = 250;\nconst AUTORESIZE_THROTTLE_DEFAULT_WAIT = 100;\n\nexport interface TextareaProps\n  extends CommonProps,\n    Override<\n      React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n      {\n        /**\n         * Состояние валидации при ошибке.\n         */\n        error?: boolean;\n        /**\n         * Состояние валидации при предупреждении.\n         */\n        warning?: boolean;\n        /** Не активное состояние */\n        disabled?: boolean;\n\n        /**\n         * Автоматический ресайз\n         * в зависимости от содержимого\n         */\n        autoResize?: boolean;\n        /**\n         * Число строк\n         */\n        rows?: number;\n        /**\n         * Максимальное число строк при\n         * автоматическом ресайзе\n         */\n        maxRows?: string | number;\n\n        /**\n         * Стандартный ресайз\n         * Попадает в `style`\n         */\n        resize?: React.CSSProperties['resize'];\n\n        /**\n         * Ширина\n         */\n        width?: React.CSSProperties['width'];\n\n        /**\n         * Вызывается при изменении `value`\n         */\n        onValueChange?: (value: string) => void;\n\n        /** Выделение значения при фокусе */\n        selectAllOnFocus?: boolean;\n\n        /** Показывать счетчик символов */\n        showLengthCounter?: boolean;\n\n        /** Допустимое количество символов в поле. Отображается в счетчике.\n         * Если не указано, равно `maxLength`\n         */\n        lengthCounter?: number;\n\n        /** Подсказка к счетчику символов.\n         *\n         * По умолчанию - тултип с содержимым из пропа, если передан`ReactNode`.\n         *\n         * Передав функцию, можно переопределить подсказку целиком, вместе с иконкой. Например,\n         *\n         * ```\n         * counterHelp={() => <Tooltip render={...}><HelpIcon /></Tooltip>}\n         * ```\n         * */\n        counterHelp?: ReactNode | (() => ReactNode);\n\n        /** Добавлять дополнительную свободную строку при авто-ресайзе.\n         * @see https://guides.kontur.ru/components/textarea/#04\n         * */\n        extraRow?: boolean;\n\n        /** Отключать анимацию при авто-ресайзе.\n         * Автоматически отключается когда в `extraRow` передан `false`.\n         */\n        disableAnimations?: boolean;\n      }\n    > {}\n\nexport interface TextareaState {\n  needsPolyfillPlaceholder: boolean;\n  isCounterVisible: boolean;\n}\n\nexport const TextareaDataTids = {\n  root: 'Textarea__root',\n  counter: 'TextareaCounter__root',\n  helpIcon: 'TextareaCounter__helpIcon',\n} as const;\n\ntype DefaultProps = Required<Pick<TextareaProps, 'rows' | 'maxRows' | 'extraRow' | 'disableAnimations'>>;\n\n/**\n * Компонент для ввода многострочного текста.\n *\n * Принимает все атрибуты `React.TextareaHTMLAttributes<HTMLTextAreaElement>`\n *\n * ** `className` и `style`  игнорируются**\n */\n@rootNode\nexport class Textarea extends React.Component<TextareaProps, TextareaState> {\n  public static __KONTUR_REACT_UI__ = 'Textarea';\n\n  public static propTypes = {\n    error: PropTypes.bool,\n    warning: PropTypes.bool,\n    disabled: PropTypes.bool,\n\n    autoResize: PropTypes.bool,\n    extraRow: PropTypes.bool,\n    disableAnimations: PropTypes.bool,\n    maxRows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n    resize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n    width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n    id: PropTypes.string,\n    name: PropTypes.string,\n    title: PropTypes.string,\n    spellCheck: PropTypes.bool,\n    role: PropTypes.string,\n    maxLength: PropTypes.number,\n    tabIndex: PropTypes.number,\n    rows: PropTypes.number,\n    placeholder: PropTypes.string,\n\n    value: PropTypes.string,\n    defaultValue: PropTypes.string,\n    onValueChange: PropTypes.func,\n\n    onMouseEnter: PropTypes.func,\n    onMouseLeave: PropTypes.func,\n    onMouseOver: PropTypes.func,\n    onMouseMove: PropTypes.func,\n    onMouseOut: PropTypes.func,\n\n    onMouseUp: PropTypes.func,\n    onMouseDown: PropTypes.func,\n    onClick: PropTypes.func,\n    onDoubleClick: PropTypes.func,\n\n    onKeyDown: PropTypes.func,\n    onKeyPress: PropTypes.func,\n    onKeyUp: PropTypes.func,\n    onInput: PropTypes.func,\n\n    onFocus: PropTypes.func,\n    onBlur: PropTypes.func,\n\n    onScroll: PropTypes.func,\n    onWheel: PropTypes.func,\n\n    onCut: PropTypes.func,\n    onPaste: PropTypes.func,\n    onCopy: PropTypes.func,\n  };\n\n  public static defaultProps: DefaultProps = {\n    rows: 3,\n    maxRows: 15,\n    extraRow: true,\n    disableAnimations: isTestEnv,\n  };\n\n  private getProps = createPropsGetter(Textarea.defaultProps);\n\n  public state = {\n    needsPolyfillPlaceholder,\n    isCounterVisible: false,\n  };\n  private reflowCounter = () => {\n    if (this.counter) {\n      this.counter.reflow();\n    }\n  };\n\n  private theme!: Theme;\n  private selectAllId: number | null = null;\n  private node: Nullable<HTMLTextAreaElement>;\n  private fakeNode: Nullable<HTMLTextAreaElement>;\n  private counter: Nullable<TextareaCounterRef>;\n  private layoutEvents: Nullable<{ remove: () => void }>;\n  private textareaObserver = isBrowser ? new MutationObserver(this.reflowCounter) : null;\n  private setRootNode!: TSetRootNode;\n  private getAutoResizeThrottleWait(props: TextareaProps = this.props): number {\n    // NOTE: При отключении анимации остается эффект дергания при авто-ресайзе из-за троттлинга расчета высоты\n    // Поэтому выставляем таймаут троттла в ноль. Подробности - https://github.com/skbkontur/retail-ui/issues/2120\n    return this.isAnimationsDisabled(props) ? 0 : AUTORESIZE_THROTTLE_DEFAULT_WAIT;\n  }\n  private isAnimationsDisabled({ disableAnimations, extraRow }: TextareaProps = this.props): boolean {\n    return disableAnimations || !extraRow;\n  }\n\n  public componentDidMount() {\n    if (this.props.autoResize) {\n      this.autoResize();\n      this.layoutEvents = LayoutEvents.addListener(this.autoResize);\n    }\n\n    if (this.node && this.props.showLengthCounter && this.textareaObserver) {\n      this.textareaObserver.observe(this.node, { attributes: true });\n    }\n  }\n\n  public componentWillUnmount() {\n    if (this.layoutEvents) {\n      this.layoutEvents.remove();\n    }\n    if (this.props.showLengthCounter && this.textareaObserver) {\n      this.textareaObserver.disconnect();\n    }\n    this.cancelDelayedSelectAll();\n  }\n\n  public componentDidUpdate(prevProps: TextareaProps) {\n    if (this.getAutoResizeThrottleWait() !== this.getAutoResizeThrottleWait(prevProps)) {\n      this.autoResize.cancel();\n      this.autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());\n    }\n    const { rows, maxRows } = this.getProps();\n    if (\n      this.props.autoResize &&\n      (rows !== prevProps.rows || maxRows !== prevProps.maxRows || this.props.value !== prevProps.value)\n    ) {\n      this.autoResize();\n    }\n  }\n\n  public render() {\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 focus() {\n    if (this.node) {\n      this.node.focus();\n    }\n  }\n\n  /**\n   * @public\n   */\n  public blur() {\n    if (this.node) {\n      this.node.blur();\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.node) {\n      throw new Error('Cannot call \"setSelectionRange\" on unmounted Input');\n    }\n\n    if (document.activeElement !== this.node) {\n      this.focus();\n    }\n\n    this.node.setSelectionRange(start, end);\n  };\n\n  /**\n   * @public\n   */\n  public selectAll = () => {\n    if (this.node) {\n      this.setSelectionRange(0, this.node.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 renderMain = (props: CommonWrapperRestProps<TextareaProps>) => {\n    const {\n      width = DEFAULT_WIDTH,\n      error,\n      warning,\n      autoResize,\n      resize,\n      onCut,\n      onPaste,\n      maxRows,\n      onFocus,\n      selectAllOnFocus,\n      placeholder,\n      onValueChange,\n      showLengthCounter,\n      lengthCounter,\n      counterHelp,\n      extraRow,\n      disableAnimations,\n      disabled,\n      ...textareaProps\n    } = props;\n\n    const { isCounterVisible } = this.state;\n\n    const rootProps = {\n      style: {\n        width,\n      },\n    };\n\n    const textareaClassNames = cx({\n      [styles.textarea(this.theme)]: true,\n      [styles.disabled(this.theme)]: disabled,\n      [styles.error(this.theme)]: !!error,\n      [styles.warning(this.theme)]: !!warning,\n      [styles.disableAnimations()]: this.isAnimationsDisabled(),\n    });\n\n    const textareaStyle = {\n      resize: autoResize ? 'none' : resize,\n    };\n\n    let placeholderPolyfill = null;\n\n    if (this.state.needsPolyfillPlaceholder && !textareaProps.value && !textareaProps.defaultValue) {\n      placeholderPolyfill = <span className={styles.placeholder()}>{placeholder}</span>;\n    }\n\n    let fakeTextarea = null;\n    if (autoResize) {\n      const fakeProps = {\n        value: this.props.value,\n        defaultValue: this.props.defaultValue,\n        className: cx(textareaClassNames, styles.fake()),\n        readOnly: true,\n      };\n      fakeTextarea = <textarea {...fakeProps} ref={this.refFake} />;\n    }\n\n    const counter = showLengthCounter && isCounterVisible && this.node && (\n      <TextareaCounter\n        textarea={this.node}\n        help={counterHelp}\n        value={textareaProps.value}\n        length={textareaProps.maxLength ?? lengthCounter ?? 0}\n        onCloseHelp={this.handleCloseCounterHelp}\n        ref={this.refCounter}\n      />\n    );\n\n    return (\n      <RenderLayer\n        onFocusOutside={this.handleCloseCounterHelp}\n        onClickOutside={this.handleCloseCounterHelp}\n        active={this.state.isCounterVisible}\n      >\n        <label data-tid={TextareaDataTids.root} {...rootProps} className={styles.root(this.theme)}>\n          {placeholderPolyfill}\n          <ResizeDetector onResize={this.reflowCounter}>\n            <textarea\n              {...textareaProps}\n              className={textareaClassNames}\n              style={textareaStyle}\n              placeholder={!placeholderPolyfill ? placeholder : undefined}\n              ref={this.ref}\n              onChange={this.handleChange}\n              onCut={this.handleCut}\n              onPaste={this.handlePaste}\n              onFocus={this.handleFocus}\n              onKeyDown={this.handleKeyDown}\n              disabled={disabled}\n            >\n              {this.props.children}\n            </textarea>\n          </ResizeDetector>\n          {fakeTextarea}\n          {counter}\n        </label>\n      </RenderLayer>\n    );\n  };\n\n  private handleCloseCounterHelp = () => this.setState({ isCounterVisible: false });\n\n  private handleKeyDown = (e: React.KeyboardEvent<HTMLTextAreaElement>) => {\n    // Edge bug: textarea maxlength doesn't work after new line\n    // https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/18833616/\n    const value = this.props.value !== undefined ? this.props.value.toString() : null;\n    const isBlockEnter = isKeyEnter(e) && value !== null && value.length === this.props.maxLength;\n\n    if (isBlockEnter) {\n      e.preventDefault();\n    }\n\n    if (this.props.onKeyDown) {\n      this.props.onKeyDown(e);\n    }\n  };\n\n  private handleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    if (needsPolyfillPlaceholder) {\n      const fieldIsEmpty = e.target.value === '';\n\n      if (this.state.needsPolyfillPlaceholder !== fieldIsEmpty) {\n        this.setState({ needsPolyfillPlaceholder: fieldIsEmpty });\n      }\n    }\n\n    if (this.props.onValueChange) {\n      this.props.onValueChange(e.target.value);\n    }\n\n    if (this.props.autoResize) {\n      this.autoResize();\n    }\n\n    if (this.props.onChange) {\n      this.props.onChange(e);\n    }\n\n    this.reflowCounter();\n  };\n\n  private ref = (element: HTMLTextAreaElement) => {\n    this.node = element;\n  };\n\n  private refFake = (element: HTMLTextAreaElement) => {\n    this.fakeNode = element;\n  };\n\n  private refCounter = (ref: TextareaCounterRef | null) => {\n    this.counter = ref;\n  };\n\n  private autoResizeHandler = () => {\n    const fakeNode = this.fakeNode;\n    if (!fakeNode) {\n      return;\n    }\n    const node = this.node;\n    if (!node) {\n      return;\n    }\n    if (this.props.value === undefined) {\n      fakeNode.value = node.value;\n    }\n\n    const { rows, maxRows } = this.getProps();\n    if (rows === undefined || maxRows === undefined) {\n      return;\n    }\n    const { height, exceededMaxHeight } = getTextAreaHeight({\n      node: fakeNode,\n      minRows: typeof rows === 'number' ? rows : parseInt(rows, 10),\n      maxRows: typeof maxRows === 'number' ? maxRows : parseInt(maxRows, 10),\n      extraRow: this.getProps().extraRow,\n    });\n    node.style.height = height + 'px';\n    node.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\n    fakeNode.style.overflowY = exceededMaxHeight ? 'scroll' : 'hidden';\n  };\n\n  private autoResize = throttle(this.autoResizeHandler, this.getAutoResizeThrottleWait());\n\n  private handleCut = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\n    if (this.props.autoResize) {\n      this.autoResize();\n    }\n\n    if (this.props.onCut) {\n      this.props.onCut(event);\n    }\n\n    this.reflowCounter();\n  };\n\n  private handlePaste = (event: React.ClipboardEvent<HTMLTextAreaElement>) => {\n    if (this.props.autoResize) {\n      this.autoResize();\n    }\n\n    if (this.props.onPaste) {\n      this.props.onPaste(event);\n    }\n\n    this.reflowCounter();\n  };\n\n  private handleFocus = (event: React.FocusEvent<HTMLTextAreaElement>) => {\n    this.setState({ isCounterVisible: true });\n\n    if (this.props.selectAllOnFocus) {\n      // https://github.com/facebook/react/issues/7769\n      this.node && !isIE11 ? this.selectAll() : this.delaySelectAll();\n    }\n\n    if (this.props.onFocus) {\n      this.props.onFocus(event);\n    }\n  };\n}\n"]}

package/cjs/components/Textarea/Textarea.md

@@ -1,25 +1,44 @@
-```jsx harmony
-let initialState = { value: '' };
-<Textarea
-  value={state.value}
-  onValueChange={value => setState({ value })}
-  autoResize
-  placeholder="Through faith we can reign in every area of life"
-/>;
-```
-
-Счетчик введенных символов
-
-```jsx harmony
-const initialState = { value: '' };
-const handleValueChange = value => setState({ value });
-
-<Textarea
-  value={state.value}
-  onValueChange={handleValueChange}
-  placeholder="Счетчик появляется при фокусе"
-  lengthCounter={10}
-  showLengthCounter
-  counterHelp="Hello 👋"
-/>;
-```
+```jsx harmony
+const [value, setValue] = React.useState('');
+
+<Textarea
+  value={value}
+  onValueChange={setValue}
+  autoResize
+  placeholder="Through faith we can reign in every area of life"
+/>;
+```
+
+Очистить значение в `Textarea` можно только с помощью пустой строки
+
+```jsx harmony
+import { Group, Button } from '@skbkontur/react-ui';
+
+const [value, setValue] = React.useState('Значение');
+
+<Group>
+  <Textarea
+    value={value}
+    onValueChange={setValue}
+    autoResize
+    rows={1}
+    placeholder="Плейсхолдер"
+  />
+  <Button style={{ height: '52px' }} onClick={() => setValue('')}>Очистить значение</Button>
+</Group>
+```
+
+Счетчик введенных символов
+
+```jsx harmony
+const [value, setValue] = React.useState('');
+
+<Textarea
+  value={value}
+  onValueChange={setValue}
+  placeholder="Счетчик появляется при фокусе"
+  lengthCounter={10}
+  showLengthCounter
+  counterHelp="Hello 👋"
+/>;
+```

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

@@ -1,12 +1,15 @@
-export declare const jsStyles: {
-    root(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    textarea(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    error(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    warning(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    root(t: Theme): string;
+    textarea(t: Theme): string;
+    error(t: Theme): string;
+    warning(t: Theme): string;
+    disabled(t: Theme): string;
     fake(): string;
     placeholder(): string;
-    counterContainer(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    counter(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    counterError(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
+    counterContainer(t: Theme): string;
+    counter(t: Theme): string;
+    counterError(t: Theme): string;
     counterHelp(): string;
+    disableAnimations(): string;
 };