@alfalab/core-components 44.5.1-beta.4 → 44.6.0

package/textarea/Component.js

@@ -8,7 +8,7 @@ var cn = require('classnames');
 var coreComponentsFormControl = require('../form-control');
 var coreComponentsShared = require('../shared');
 var hooks = require('@alfalab/hooks');
-var components_PseudoTextArea = require('./PseudoTextArea-6bfaa8bd.js');
+var components_PseudoTextArea = require('./PseudoTextArea-6b0dce10.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -32,16 +32,16 @@ var getDefaultCounterText = function (textLength, maxLength) {
     return "".concat(textLength, "/").concat(maxLength, " \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432");
 };
 var Textarea = React.forwardRef(function (_a, ref) {
-    var _b, _c, _d, _e;
-    var _f = _a.autoComplete, autoComplete = _f === void 0 ? 'on' : _f, _g = _a.autosize, autosize = _g === void 0 ? true : _g, _h = _a.size, size = _h === void 0 ? 's' : _h, _j = _a.colors, colors = _j === void 0 ? 'default' : _j, _k = _a.block, block = _k === void 0 ? false : _k, bottomAddons = _a.bottomAddons, fieldClassName = _a.fieldClassName, className = _a.className, dataTestId = _a.dataTestId, disabled = _a.disabled, error = _a.error, hint = _a.hint, textareaClassName = _a.textareaClassName, label = _a.label, _l = _a.labelView, labelView = _l === void 0 ? 'inner' : _l, leftAddons = _a.leftAddons, onFocus = _a.onFocus, onBlur = _a.onBlur, onChange = _a.onChange, onHeightChange = _a.onHeightChange, rightAddons = _a.rightAddons, maxRows = _a.maxRows, minRows = _a.minRows, maxHeight = _a.maxHeight, _m = _a.resize, resize = _m === void 0 ? 'none' : _m, value = _a.value, defaultValue = _a.defaultValue, _o = _a.rows, rows = _o === void 0 ? autosize ? 1 : 3 : _o, _p = _a.showCounter, showCounter = _p === void 0 ? false : _p, _q = _a.getCounterText, getCounterText = _q === void 0 ? getDefaultCounterText : _q, maxLength = _a.maxLength, _r = _a.allowOverflow, allowOverflow = _r === void 0 ? true : _r, nativeScrollbarProp = _a.nativeScrollbar, breakpoint = _a.breakpoint, restProps = tslib.__rest(_a, ["autoComplete", "autosize", "size", "colors", "block", "bottomAddons", "fieldClassName", "className", "dataTestId", "disabled", "error", "hint", "textareaClassName", "label", "labelView", "leftAddons", "onFocus", "onBlur", "onChange", "onHeightChange", "rightAddons", "maxRows", "minRows", "maxHeight", "resize", "value", "defaultValue", "rows", "showCounter", "getCounterText", "maxLength", "allowOverflow", "nativeScrollbar", "breakpoint"]);
+    var _b, _c, _d;
+    var _e = _a.autoComplete, autoComplete = _e === void 0 ? 'on' : _e, _f = _a.autosize, autosize = _f === void 0 ? true : _f, _g = _a.size, size = _g === void 0 ? 's' : _g, _h = _a.colors, colors = _h === void 0 ? 'default' : _h, _j = _a.block, block = _j === void 0 ? false : _j, bottomAddons = _a.bottomAddons, fieldClassName = _a.fieldClassName, className = _a.className, dataTestId = _a.dataTestId, disabled = _a.disabled, error = _a.error, hint = _a.hint, textareaClassName = _a.textareaClassName, label = _a.label, _k = _a.labelView, labelView = _k === void 0 ? 'inner' : _k, leftAddons = _a.leftAddons, onFocus = _a.onFocus, onBlur = _a.onBlur, onChange = _a.onChange, onHeightChange = _a.onHeightChange, rightAddons = _a.rightAddons, maxRows = _a.maxRows, minRows = _a.minRows, maxHeight = _a.maxHeight, _l = _a.resize, resize = _l === void 0 ? 'none' : _l, value = _a.value, defaultValue = _a.defaultValue, _m = _a.rows, rows = _m === void 0 ? autosize ? 1 : 3 : _m, _o = _a.showCounter, showCounter = _o === void 0 ? false : _o, _p = _a.getCounterText, getCounterText = _p === void 0 ? getDefaultCounterText : _p, maxLength = _a.maxLength, _q = _a.allowOverflow, allowOverflow = _q === void 0 ? true : _q, nativeScrollbarProp = _a.nativeScrollbar, breakpoint = _a.breakpoint, restProps = tslib.__rest(_a, ["autoComplete", "autosize", "size", "colors", "block", "bottomAddons", "fieldClassName", "className", "dataTestId", "disabled", "error", "hint", "textareaClassName", "label", "labelView", "leftAddons", "onFocus", "onBlur", "onChange", "onHeightChange", "rightAddons", "maxRows", "minRows", "maxHeight", "resize", "value", "defaultValue", "rows", "showCounter", "getCounterText", "maxLength", "allowOverflow", "nativeScrollbar", "breakpoint"]);
     var uncontrolled = value === undefined;
     var nativeScrollbar = hooks.useMedia([[true, '(max-width: 1023px)']], false)[0];
     nativeScrollbar = Boolean(nativeScrollbarProp !== null && nativeScrollbarProp !== void 0 ? nativeScrollbarProp : nativeScrollbar);
     var textareaRef = React.useRef(null);
     var pseudoTextareaRef = React.useRef(null);
-    var _s = React.useState(false), focused = _s[0], setFocused = _s[1];
-    var _t = React.useState(defaultValue || ''), stateValue = _t[0], setStateValue = _t[1];
-    var _u = React.useState(0), scrollPosition = _u[0], setScrollPosition = _u[1];
+    var _r = React.useState(false), focused = _r[0], setFocused = _r[1];
+    var _s = React.useState(defaultValue || ''), stateValue = _s[0], setStateValue = _s[1];
+    var _t = React.useState(0), scrollPosition = _t[0], setScrollPosition = _t[1];
     var focusVisible = hooks.useFocus(
     /*
      * При первом рендере textareaRef.current === null, то нужно пересоздать реф для корректной работы хука
@@ -57,7 +57,7 @@ var Textarea = React.forwardRef(function (_a, ref) {
         if (pseudoNode) {
             pseudoNode.scrollTop = scrollPosition;
         }
-    }, [scrollPosition, stateValue]);
+    }, [scrollPosition, stateValue, hasOverflow]);
     // Хак, так как react-textarea-autosize перестал поддерживать maxHeight
     React.useEffect(function () {
         if (autosize && maxHeight && textareaRef.current && textareaRef.current.style) {
@@ -122,9 +122,7 @@ var Textarea = React.forwardRef(function (_a, ref) {
             _d[components_PseudoTextArea.styles.resizeVertical] = resize === 'vertical',
             _d)), size: size, colors: colors, block: block, disabled: disabled, filled: filled || focused, focused: focused, error: error, label: label, labelView: labelView, hint: hint, leftAddons: leftAddons, rightAddons: rightAddons, bottomAddons: getBottomAddons(), breakpoint: breakpoint, dataTestId: coreComponentsShared.getDataTestId(dataTestId, 'form-control') },
         React__default.default.createElement(React__default.default.Fragment, null,
-            hasOverflow && (React__default.default.createElement(components_PseudoTextArea.PseudoTextArea, { value: value !== null && value !== void 0 ? value : stateValue, size: size, maxLength: maxLength, pseudoTextareaClassName: cn__default.default(textareaClassNameCalc, (_e = {},
-                    _e[components_PseudoTextArea.styles.nativeScrollbar] = nativeScrollbar,
-                    _e)), ref: pseudoTextareaRef })),
+            hasOverflow && (React__default.default.createElement(components_PseudoTextArea.PseudoTextArea, { value: value !== null && value !== void 0 ? value : stateValue, size: size, maxLength: maxLength, pseudoTextareaClassName: textareaClassNameCalc, ref: pseudoTextareaRef })),
             autosize ? (React__default.default.createElement(TextareaAutosize__default.default, tslib.__assign({}, textareaProps, { maxRows: maxRows, minRows: minRows, onHeightChange: onHeightChange }))) : (React__default.default.createElement("textarea", tslib.__assign({}, textareaProps, { style: { maxHeight: maxHeight } }))))));
 });
 

package/textarea/{PseudoTextArea-6bfaa8bd.js → PseudoTextArea-6b0dce10.js}

@@ -6,7 +6,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"textarea":"textarea__textarea_1092z","overflowHidden":"textarea__overflowHidden_1092z","customScrollbar":"textarea__customScrollbar_1092z","hasInnerLabel":"textarea__hasInnerLabel_1092z","pseudoTextarea":"textarea__pseudoTextarea_1092z","overflow":"textarea__overflow_1092z","nativeScrollbar":"textarea__nativeScrollbar_1092z","sub":"textarea__sub_1092z","focusVisible":"textarea__focusVisible_1092z","filled":"textarea__filled_1092z","s":"textarea__s_1092z","m":"textarea__m_1092z","l":"textarea__l_1092z","xl":"textarea__xl_1092z","wrapper":"textarea__wrapper_1092z","resizeVertical":"textarea__resizeVertical_1092z"};
+var styles = {"textarea":"textarea__textarea_1092z","overflowHidden":"textarea__overflowHidden_1092z","customScrollbar":"textarea__customScrollbar_1092z","hasInnerLabel":"textarea__hasInnerLabel_1092z","pseudoTextarea":"textarea__pseudoTextarea_1092z","overflow":"textarea__overflow_1092z","sub":"textarea__sub_1092z","focusVisible":"textarea__focusVisible_1092z","filled":"textarea__filled_1092z","s":"textarea__s_1092z","m":"textarea__m_1092z","l":"textarea__l_1092z","xl":"textarea__xl_1092z","wrapper":"textarea__wrapper_1092z","resizeVertical":"textarea__resizeVertical_1092z"};
 require('./index.css');
 
 var PseudoTextArea = React.forwardRef(function (_a, ref) {

package/textarea/components/PseudoTextArea.js

@@ -2,7 +2,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 require('react');
 require('classnames');
-var components_PseudoTextArea = require('../PseudoTextArea-6bfaa8bd.js');
+var components_PseudoTextArea = require('../PseudoTextArea-6b0dce10.js');
 
 
 

package/textarea/components/index.d.ts

@@ -1 +1 @@
-export * from "../PseudoTextArea-6bfaa8bd";
+export * from "../PseudoTextArea-6b0dce10";

package/textarea/components/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_PseudoTextArea = require('../PseudoTextArea-6bfaa8bd.js');
+var components_PseudoTextArea = require('../PseudoTextArea-6b0dce10.js');
 
 
 

package/textarea/cssm/Component.js

@@ -32,16 +32,16 @@ var getDefaultCounterText = function (textLength, maxLength) {
     return "".concat(textLength, "/").concat(maxLength, " \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432");
 };
 var Textarea = React.forwardRef(function (_a, ref) {
-    var _b, _c, _d, _e;
-    var _f = _a.autoComplete, autoComplete = _f === void 0 ? 'on' : _f, _g = _a.autosize, autosize = _g === void 0 ? true : _g, _h = _a.size, size = _h === void 0 ? 's' : _h, _j = _a.colors, colors = _j === void 0 ? 'default' : _j, _k = _a.block, block = _k === void 0 ? false : _k, bottomAddons = _a.bottomAddons, fieldClassName = _a.fieldClassName, className = _a.className, dataTestId = _a.dataTestId, disabled = _a.disabled, error = _a.error, hint = _a.hint, textareaClassName = _a.textareaClassName, label = _a.label, _l = _a.labelView, labelView = _l === void 0 ? 'inner' : _l, leftAddons = _a.leftAddons, onFocus = _a.onFocus, onBlur = _a.onBlur, onChange = _a.onChange, onHeightChange = _a.onHeightChange, rightAddons = _a.rightAddons, maxRows = _a.maxRows, minRows = _a.minRows, maxHeight = _a.maxHeight, _m = _a.resize, resize = _m === void 0 ? 'none' : _m, value = _a.value, defaultValue = _a.defaultValue, _o = _a.rows, rows = _o === void 0 ? autosize ? 1 : 3 : _o, _p = _a.showCounter, showCounter = _p === void 0 ? false : _p, _q = _a.getCounterText, getCounterText = _q === void 0 ? getDefaultCounterText : _q, maxLength = _a.maxLength, _r = _a.allowOverflow, allowOverflow = _r === void 0 ? true : _r, nativeScrollbarProp = _a.nativeScrollbar, breakpoint = _a.breakpoint, restProps = tslib.__rest(_a, ["autoComplete", "autosize", "size", "colors", "block", "bottomAddons", "fieldClassName", "className", "dataTestId", "disabled", "error", "hint", "textareaClassName", "label", "labelView", "leftAddons", "onFocus", "onBlur", "onChange", "onHeightChange", "rightAddons", "maxRows", "minRows", "maxHeight", "resize", "value", "defaultValue", "rows", "showCounter", "getCounterText", "maxLength", "allowOverflow", "nativeScrollbar", "breakpoint"]);
+    var _b, _c, _d;
+    var _e = _a.autoComplete, autoComplete = _e === void 0 ? 'on' : _e, _f = _a.autosize, autosize = _f === void 0 ? true : _f, _g = _a.size, size = _g === void 0 ? 's' : _g, _h = _a.colors, colors = _h === void 0 ? 'default' : _h, _j = _a.block, block = _j === void 0 ? false : _j, bottomAddons = _a.bottomAddons, fieldClassName = _a.fieldClassName, className = _a.className, dataTestId = _a.dataTestId, disabled = _a.disabled, error = _a.error, hint = _a.hint, textareaClassName = _a.textareaClassName, label = _a.label, _k = _a.labelView, labelView = _k === void 0 ? 'inner' : _k, leftAddons = _a.leftAddons, onFocus = _a.onFocus, onBlur = _a.onBlur, onChange = _a.onChange, onHeightChange = _a.onHeightChange, rightAddons = _a.rightAddons, maxRows = _a.maxRows, minRows = _a.minRows, maxHeight = _a.maxHeight, _l = _a.resize, resize = _l === void 0 ? 'none' : _l, value = _a.value, defaultValue = _a.defaultValue, _m = _a.rows, rows = _m === void 0 ? autosize ? 1 : 3 : _m, _o = _a.showCounter, showCounter = _o === void 0 ? false : _o, _p = _a.getCounterText, getCounterText = _p === void 0 ? getDefaultCounterText : _p, maxLength = _a.maxLength, _q = _a.allowOverflow, allowOverflow = _q === void 0 ? true : _q, nativeScrollbarProp = _a.nativeScrollbar, breakpoint = _a.breakpoint, restProps = tslib.__rest(_a, ["autoComplete", "autosize", "size", "colors", "block", "bottomAddons", "fieldClassName", "className", "dataTestId", "disabled", "error", "hint", "textareaClassName", "label", "labelView", "leftAddons", "onFocus", "onBlur", "onChange", "onHeightChange", "rightAddons", "maxRows", "minRows", "maxHeight", "resize", "value", "defaultValue", "rows", "showCounter", "getCounterText", "maxLength", "allowOverflow", "nativeScrollbar", "breakpoint"]);
     var uncontrolled = value === undefined;
     var nativeScrollbar = hooks.useMedia([[true, '(max-width: 1023px)']], false)[0];
     nativeScrollbar = Boolean(nativeScrollbarProp !== null && nativeScrollbarProp !== void 0 ? nativeScrollbarProp : nativeScrollbar);
     var textareaRef = React.useRef(null);
     var pseudoTextareaRef = React.useRef(null);
-    var _s = React.useState(false), focused = _s[0], setFocused = _s[1];
-    var _t = React.useState(defaultValue || ''), stateValue = _t[0], setStateValue = _t[1];
-    var _u = React.useState(0), scrollPosition = _u[0], setScrollPosition = _u[1];
+    var _r = React.useState(false), focused = _r[0], setFocused = _r[1];
+    var _s = React.useState(defaultValue || ''), stateValue = _s[0], setStateValue = _s[1];
+    var _t = React.useState(0), scrollPosition = _t[0], setScrollPosition = _t[1];
     var focusVisible = hooks.useFocus(
     /*
      * При первом рендере textareaRef.current === null, то нужно пересоздать реф для корректной работы хука
@@ -57,7 +57,7 @@ var Textarea = React.forwardRef(function (_a, ref) {
         if (pseudoNode) {
             pseudoNode.scrollTop = scrollPosition;
         }
-    }, [scrollPosition, stateValue]);
+    }, [scrollPosition, stateValue, hasOverflow]);
     // Хак, так как react-textarea-autosize перестал поддерживать maxHeight
     React.useEffect(function () {
         if (autosize && maxHeight && textareaRef.current && textareaRef.current.style) {
@@ -122,9 +122,7 @@ var Textarea = React.forwardRef(function (_a, ref) {
             _d[styles__default.default.resizeVertical] = resize === 'vertical',
             _d)), size: size, colors: colors, block: block, disabled: disabled, filled: filled || focused, focused: focused, error: error, label: label, labelView: labelView, hint: hint, leftAddons: leftAddons, rightAddons: rightAddons, bottomAddons: getBottomAddons(), breakpoint: breakpoint, dataTestId: coreComponentsShared.getDataTestId(dataTestId, 'form-control') },
         React__default.default.createElement(React__default.default.Fragment, null,
-            hasOverflow && (React__default.default.createElement(components_PseudoTextArea.PseudoTextArea, { value: value !== null && value !== void 0 ? value : stateValue, size: size, maxLength: maxLength, pseudoTextareaClassName: cn__default.default(textareaClassNameCalc, (_e = {},
-                    _e[styles__default.default.nativeScrollbar] = nativeScrollbar,
-                    _e)), ref: pseudoTextareaRef })),
+            hasOverflow && (React__default.default.createElement(components_PseudoTextArea.PseudoTextArea, { value: value !== null && value !== void 0 ? value : stateValue, size: size, maxLength: maxLength, pseudoTextareaClassName: textareaClassNameCalc, ref: pseudoTextareaRef })),
             autosize ? (React__default.default.createElement(TextareaAutosize__default.default, tslib.__assign({}, textareaProps, { maxRows: maxRows, minRows: minRows, onHeightChange: onHeightChange }))) : (React__default.default.createElement("textarea", tslib.__assign({}, textareaProps, { style: { maxHeight: maxHeight } }))))));
 });
 

package/textarea/cssm/index.module.css

@@ -166,14 +166,14 @@
     word-wrap: break-word;
     white-space: pre-wrap;
     z-index: -1;
-    overflow: hidden;
+    overflow: auto;
     max-height: 100%
 } .pseudoTextarea span {
         color: transparent;
     } .pseudoTextarea .overflow {
         background-color: var(--color-light-graphic-negative-alpha-40);
-    } .pseudoTextarea.nativeScrollbar {
-        overflow: auto;
+    } .pseudoTextarea::-webkit-scrollbar-thumb {
+        background-color: transparent;
     } .sub {
     font-size: 14px;
     line-height: 18px;

package/textarea/cssm/shared/index.d.ts

@@ -0,0 +1 @@
+export { getTextareaTestIds } from "../utils";

package/textarea/cssm/shared/index.js

@@ -0,0 +1,7 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var utils = require('../utils.js');
+
+
+
+exports.getTextareaTestIds = utils.getTextareaTestIds;

package/textarea/cssm/utils.d.ts

@@ -0,0 +1,10 @@
+declare function getTextareaTestIds(dataTestId: string): {
+    textarea: string;
+    inputWrapper: string;
+    inputWrapperInner: string;
+    leftAddons: string;
+    rightAddons: string;
+    error: string;
+    hint: string;
+};
+export { getTextareaTestIds };

package/textarea/cssm/utils.js

@@ -0,0 +1,17 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var coreComponentsShared = require('../../shared/cssm');
+
+function getTextareaTestIds(dataTestId) {
+    return {
+        textarea: dataTestId,
+        inputWrapper: coreComponentsShared.getDataTestId(dataTestId, 'form-control'),
+        inputWrapperInner: coreComponentsShared.getDataTestId(dataTestId, 'form-control-inner'),
+        leftAddons: coreComponentsShared.getDataTestId(dataTestId, 'form-control-left-addons'),
+        rightAddons: coreComponentsShared.getDataTestId(dataTestId, 'form-control-right-addons'),
+        error: coreComponentsShared.getDataTestId(dataTestId, 'form-control-error-message'),
+        hint: coreComponentsShared.getDataTestId(dataTestId, 'form-control-hint'),
+    };
+}
+
+exports.getTextareaTestIds = getTextareaTestIds;

package/textarea/esm/Component.js

@@ -6,7 +6,7 @@ import cn from 'classnames';
 import { FormControl } from '../../form-control/esm';
 import { getDataTestId } from '../../shared/esm';
 import { useMedia, useFocus } from '@alfalab/hooks';
-import { s as styles, P as PseudoTextArea } from './PseudoTextArea-2b230af0.js';
+import { s as styles, P as PseudoTextArea } from './PseudoTextArea-6bbe205a.js';
 
 var defaultColors = {"input":"textarea__input_1mbtw","hasInnerLabel":"textarea__hasInnerLabel_1mbtw","disableUserInput":"textarea__disableUserInput_1mbtw","error":"textarea__error_1mbtw","textarea":"textarea__textarea_1mbtw","hint":"textarea__hint_1mbtw"};
 require('./default.css');
@@ -23,16 +23,16 @@ var getDefaultCounterText = function (textLength, maxLength) {
     return "".concat(textLength, "/").concat(maxLength, " \u0441\u0438\u043C\u0432\u043E\u043B\u043E\u0432");
 };
 var Textarea = forwardRef(function (_a, ref) {
-    var _b, _c, _d, _e;
-    var _f = _a.autoComplete, autoComplete = _f === void 0 ? 'on' : _f, _g = _a.autosize, autosize = _g === void 0 ? true : _g, _h = _a.size, size = _h === void 0 ? 's' : _h, _j = _a.colors, colors = _j === void 0 ? 'default' : _j, _k = _a.block, block = _k === void 0 ? false : _k, bottomAddons = _a.bottomAddons, fieldClassName = _a.fieldClassName, className = _a.className, dataTestId = _a.dataTestId, disabled = _a.disabled, error = _a.error, hint = _a.hint, textareaClassName = _a.textareaClassName, label = _a.label, _l = _a.labelView, labelView = _l === void 0 ? 'inner' : _l, leftAddons = _a.leftAddons, onFocus = _a.onFocus, onBlur = _a.onBlur, onChange = _a.onChange, onHeightChange = _a.onHeightChange, rightAddons = _a.rightAddons, maxRows = _a.maxRows, minRows = _a.minRows, maxHeight = _a.maxHeight, _m = _a.resize, resize = _m === void 0 ? 'none' : _m, value = _a.value, defaultValue = _a.defaultValue, _o = _a.rows, rows = _o === void 0 ? autosize ? 1 : 3 : _o, _p = _a.showCounter, showCounter = _p === void 0 ? false : _p, _q = _a.getCounterText, getCounterText = _q === void 0 ? getDefaultCounterText : _q, maxLength = _a.maxLength, _r = _a.allowOverflow, allowOverflow = _r === void 0 ? true : _r, nativeScrollbarProp = _a.nativeScrollbar, breakpoint = _a.breakpoint, restProps = __rest(_a, ["autoComplete", "autosize", "size", "colors", "block", "bottomAddons", "fieldClassName", "className", "dataTestId", "disabled", "error", "hint", "textareaClassName", "label", "labelView", "leftAddons", "onFocus", "onBlur", "onChange", "onHeightChange", "rightAddons", "maxRows", "minRows", "maxHeight", "resize", "value", "defaultValue", "rows", "showCounter", "getCounterText", "maxLength", "allowOverflow", "nativeScrollbar", "breakpoint"]);
+    var _b, _c, _d;
+    var _e = _a.autoComplete, autoComplete = _e === void 0 ? 'on' : _e, _f = _a.autosize, autosize = _f === void 0 ? true : _f, _g = _a.size, size = _g === void 0 ? 's' : _g, _h = _a.colors, colors = _h === void 0 ? 'default' : _h, _j = _a.block, block = _j === void 0 ? false : _j, bottomAddons = _a.bottomAddons, fieldClassName = _a.fieldClassName, className = _a.className, dataTestId = _a.dataTestId, disabled = _a.disabled, error = _a.error, hint = _a.hint, textareaClassName = _a.textareaClassName, label = _a.label, _k = _a.labelView, labelView = _k === void 0 ? 'inner' : _k, leftAddons = _a.leftAddons, onFocus = _a.onFocus, onBlur = _a.onBlur, onChange = _a.onChange, onHeightChange = _a.onHeightChange, rightAddons = _a.rightAddons, maxRows = _a.maxRows, minRows = _a.minRows, maxHeight = _a.maxHeight, _l = _a.resize, resize = _l === void 0 ? 'none' : _l, value = _a.value, defaultValue = _a.defaultValue, _m = _a.rows, rows = _m === void 0 ? autosize ? 1 : 3 : _m, _o = _a.showCounter, showCounter = _o === void 0 ? false : _o, _p = _a.getCounterText, getCounterText = _p === void 0 ? getDefaultCounterText : _p, maxLength = _a.maxLength, _q = _a.allowOverflow, allowOverflow = _q === void 0 ? true : _q, nativeScrollbarProp = _a.nativeScrollbar, breakpoint = _a.breakpoint, restProps = __rest(_a, ["autoComplete", "autosize", "size", "colors", "block", "bottomAddons", "fieldClassName", "className", "dataTestId", "disabled", "error", "hint", "textareaClassName", "label", "labelView", "leftAddons", "onFocus", "onBlur", "onChange", "onHeightChange", "rightAddons", "maxRows", "minRows", "maxHeight", "resize", "value", "defaultValue", "rows", "showCounter", "getCounterText", "maxLength", "allowOverflow", "nativeScrollbar", "breakpoint"]);
     var uncontrolled = value === undefined;
     var nativeScrollbar = useMedia([[true, '(max-width: 1023px)']], false)[0];
     nativeScrollbar = Boolean(nativeScrollbarProp !== null && nativeScrollbarProp !== void 0 ? nativeScrollbarProp : nativeScrollbar);
     var textareaRef = useRef(null);
     var pseudoTextareaRef = useRef(null);
-    var _s = useState(false), focused = _s[0], setFocused = _s[1];
-    var _t = useState(defaultValue || ''), stateValue = _t[0], setStateValue = _t[1];
-    var _u = useState(0), scrollPosition = _u[0], setScrollPosition = _u[1];
+    var _r = useState(false), focused = _r[0], setFocused = _r[1];
+    var _s = useState(defaultValue || ''), stateValue = _s[0], setStateValue = _s[1];
+    var _t = useState(0), scrollPosition = _t[0], setScrollPosition = _t[1];
     var focusVisible = useFocus(
     /*
      * При первом рендере textareaRef.current === null, то нужно пересоздать реф для корректной работы хука
@@ -48,7 +48,7 @@ var Textarea = forwardRef(function (_a, ref) {
         if (pseudoNode) {
             pseudoNode.scrollTop = scrollPosition;
         }
-    }, [scrollPosition, stateValue]);
+    }, [scrollPosition, stateValue, hasOverflow]);
     // Хак, так как react-textarea-autosize перестал поддерживать maxHeight
     useEffect(function () {
         if (autosize && maxHeight && textareaRef.current && textareaRef.current.style) {
@@ -113,9 +113,7 @@ var Textarea = forwardRef(function (_a, ref) {
             _d[styles.resizeVertical] = resize === 'vertical',
             _d)), size: size, colors: colors, block: block, disabled: disabled, filled: filled || focused, focused: focused, error: error, label: label, labelView: labelView, hint: hint, leftAddons: leftAddons, rightAddons: rightAddons, bottomAddons: getBottomAddons(), breakpoint: breakpoint, dataTestId: getDataTestId(dataTestId, 'form-control') },
         React.createElement(React.Fragment, null,
-            hasOverflow && (React.createElement(PseudoTextArea, { value: value !== null && value !== void 0 ? value : stateValue, size: size, maxLength: maxLength, pseudoTextareaClassName: cn(textareaClassNameCalc, (_e = {},
-                    _e[styles.nativeScrollbar] = nativeScrollbar,
-                    _e)), ref: pseudoTextareaRef })),
+            hasOverflow && (React.createElement(PseudoTextArea, { value: value !== null && value !== void 0 ? value : stateValue, size: size, maxLength: maxLength, pseudoTextareaClassName: textareaClassNameCalc, ref: pseudoTextareaRef })),
             autosize ? (React.createElement(TextareaAutosize, __assign({}, textareaProps, { maxRows: maxRows, minRows: minRows, onHeightChange: onHeightChange }))) : (React.createElement("textarea", __assign({}, textareaProps, { style: { maxHeight: maxHeight } }))))));
 });
 

package/textarea/esm/{PseudoTextArea-2b230af0.js → PseudoTextArea-6bbe205a.js}

@@ -1,7 +1,7 @@
 import React, { forwardRef } from 'react';
 import cn from 'classnames';
 
-var styles = {"textarea":"textarea__textarea_1092z","overflowHidden":"textarea__overflowHidden_1092z","customScrollbar":"textarea__customScrollbar_1092z","hasInnerLabel":"textarea__hasInnerLabel_1092z","pseudoTextarea":"textarea__pseudoTextarea_1092z","overflow":"textarea__overflow_1092z","nativeScrollbar":"textarea__nativeScrollbar_1092z","sub":"textarea__sub_1092z","focusVisible":"textarea__focusVisible_1092z","filled":"textarea__filled_1092z","s":"textarea__s_1092z","m":"textarea__m_1092z","l":"textarea__l_1092z","xl":"textarea__xl_1092z","wrapper":"textarea__wrapper_1092z","resizeVertical":"textarea__resizeVertical_1092z"};
+var styles = {"textarea":"textarea__textarea_1092z","overflowHidden":"textarea__overflowHidden_1092z","customScrollbar":"textarea__customScrollbar_1092z","hasInnerLabel":"textarea__hasInnerLabel_1092z","pseudoTextarea":"textarea__pseudoTextarea_1092z","overflow":"textarea__overflow_1092z","sub":"textarea__sub_1092z","focusVisible":"textarea__focusVisible_1092z","filled":"textarea__filled_1092z","s":"textarea__s_1092z","m":"textarea__m_1092z","l":"textarea__l_1092z","xl":"textarea__xl_1092z","wrapper":"textarea__wrapper_1092z","resizeVertical":"textarea__resizeVertical_1092z"};
 require('./index.css');
 
 var PseudoTextArea = forwardRef(function (_a, ref) {

package/textarea/esm/components/PseudoTextArea.js

@@ -1,3 +1,3 @@
 import 'react';
 import 'classnames';
-export { P as PseudoTextArea } from '../PseudoTextArea-2b230af0.js';
+export { P as PseudoTextArea } from '../PseudoTextArea-6bbe205a.js';

package/textarea/esm/components/index.d.ts

@@ -1 +1 @@
-export * from "../PseudoTextArea-2b230af0";
+export * from "../PseudoTextArea-6bbe205a";

package/textarea/esm/components/index.js

@@ -1,3 +1,3 @@
-export { P as PseudoTextArea } from '../PseudoTextArea-2b230af0.js';
+export { P as PseudoTextArea } from '../PseudoTextArea-6bbe205a.js';
 import 'react';
 import 'classnames';

package/textarea/esm/index.css

@@ -167,14 +167,14 @@
     word-wrap: break-word;
     white-space: pre-wrap;
     z-index: -1;
-    overflow: hidden;
+    overflow: auto;
     max-height: 100%
 } .textarea__pseudoTextarea_1092z span {
         color: transparent;
     } .textarea__pseudoTextarea_1092z .textarea__overflow_1092z {
         background-color: var(--color-light-graphic-negative-alpha-40);
-    } .textarea__pseudoTextarea_1092z.textarea__nativeScrollbar_1092z {
-        overflow: auto;
+    } .textarea__pseudoTextarea_1092z::-webkit-scrollbar-thumb {
+        background-color: transparent;
     } .textarea__sub_1092z {
     font-size: 14px;
     line-height: 18px;

package/textarea/esm/index.js

@@ -7,4 +7,4 @@ import 'classnames';
 import '../../form-control/esm';
 import '../../shared/esm';
 import '@alfalab/hooks';
-import './PseudoTextArea-2b230af0.js';
+import './PseudoTextArea-6bbe205a.js';

package/textarea/esm/shared/index.d.ts

@@ -0,0 +1 @@
+export { getTextareaTestIds } from "../utils";

package/textarea/esm/shared/index.js

@@ -0,0 +1,2 @@
+export { getTextareaTestIds } from '../utils.js';
+import '../../../shared/esm';

package/textarea/esm/utils.d.ts

@@ -0,0 +1,10 @@
+declare function getTextareaTestIds(dataTestId: string): {
+    textarea: string;
+    inputWrapper: string;
+    inputWrapperInner: string;
+    leftAddons: string;
+    rightAddons: string;
+    error: string;
+    hint: string;
+};
+export { getTextareaTestIds };

package/textarea/esm/utils.js

@@ -0,0 +1,15 @@
+import { getDataTestId } from '../../shared/esm';
+
+function getTextareaTestIds(dataTestId) {
+    return {
+        textarea: dataTestId,
+        inputWrapper: getDataTestId(dataTestId, 'form-control'),
+        inputWrapperInner: getDataTestId(dataTestId, 'form-control-inner'),
+        leftAddons: getDataTestId(dataTestId, 'form-control-left-addons'),
+        rightAddons: getDataTestId(dataTestId, 'form-control-right-addons'),
+        error: getDataTestId(dataTestId, 'form-control-error-message'),
+        hint: getDataTestId(dataTestId, 'form-control-hint'),
+    };
+}
+
+export { getTextareaTestIds };

package/textarea/index.css

@@ -167,14 +167,14 @@
     word-wrap: break-word;
     white-space: pre-wrap;
     z-index: -1;
-    overflow: hidden;
+    overflow: auto;
     max-height: 100%
 } .textarea__pseudoTextarea_1092z span {
         color: transparent;
     } .textarea__pseudoTextarea_1092z .textarea__overflow_1092z {
         background-color: var(--color-light-graphic-negative-alpha-40);
-    } .textarea__pseudoTextarea_1092z.textarea__nativeScrollbar_1092z {
-        overflow: auto;
+    } .textarea__pseudoTextarea_1092z::-webkit-scrollbar-thumb {
+        background-color: transparent;
     } .textarea__sub_1092z {
     font-size: 14px;
     line-height: 18px;

package/textarea/modern/Component.js

@@ -5,7 +5,7 @@ import cn from 'classnames';
 import { FormControl } from '../../form-control/modern';
 import { getDataTestId } from '../../shared/modern';
 import { useMedia, useFocus } from '@alfalab/hooks';
-import { s as styles, P as PseudoTextArea } from './PseudoTextArea-0b89b4a4.js';
+import { s as styles, P as PseudoTextArea } from './PseudoTextArea-6bd729a2.js';
 
 const defaultColors = {"input":"textarea__input_1mbtw","hasInnerLabel":"textarea__hasInnerLabel_1mbtw","disableUserInput":"textarea__disableUserInput_1mbtw","error":"textarea__error_1mbtw","textarea":"textarea__textarea_1mbtw","hint":"textarea__hint_1mbtw"};
 require('./default.css');
@@ -42,7 +42,7 @@ const Textarea = forwardRef(({ autoComplete = 'on', autosize = true, size = 's',
         if (pseudoNode) {
             pseudoNode.scrollTop = scrollPosition;
         }
-    }, [scrollPosition, stateValue]);
+    }, [scrollPosition, stateValue, hasOverflow]);
     // Хак, так как react-textarea-autosize перестал поддерживать maxHeight
     useEffect(() => {
         if (autosize && maxHeight && textareaRef.current && textareaRef.current.style) {
@@ -120,9 +120,7 @@ const Textarea = forwardRef(({ autoComplete = 'on', autosize = true, size = 's',
             [styles.resizeVertical]: resize === 'vertical',
         }), size: size, colors: colors, block: block, disabled: disabled, filled: filled || focused, focused: focused, error: error, label: label, labelView: labelView, hint: hint, leftAddons: leftAddons, rightAddons: rightAddons, bottomAddons: getBottomAddons(), breakpoint: breakpoint, dataTestId: getDataTestId(dataTestId, 'form-control') },
         React.createElement(React.Fragment, null,
-            hasOverflow && (React.createElement(PseudoTextArea, { value: value ?? stateValue, size: size, maxLength: maxLength, pseudoTextareaClassName: cn(textareaClassNameCalc, {
-                    [styles.nativeScrollbar]: nativeScrollbar,
-                }), ref: pseudoTextareaRef })),
+            hasOverflow && (React.createElement(PseudoTextArea, { value: value ?? stateValue, size: size, maxLength: maxLength, pseudoTextareaClassName: textareaClassNameCalc, ref: pseudoTextareaRef })),
             autosize ? (React.createElement(TextareaAutosize, { ...textareaProps, maxRows: maxRows, minRows: minRows, onHeightChange: onHeightChange })) : (React.createElement("textarea", { ...textareaProps, style: { maxHeight } })))));
 });
 

package/textarea/modern/{PseudoTextArea-0b89b4a4.js → PseudoTextArea-6bd729a2.js}

@@ -1,7 +1,7 @@
 import React, { forwardRef } from 'react';
 import cn from 'classnames';
 
-const styles = {"textarea":"textarea__textarea_1092z","overflowHidden":"textarea__overflowHidden_1092z","customScrollbar":"textarea__customScrollbar_1092z","hasInnerLabel":"textarea__hasInnerLabel_1092z","pseudoTextarea":"textarea__pseudoTextarea_1092z","overflow":"textarea__overflow_1092z","nativeScrollbar":"textarea__nativeScrollbar_1092z","sub":"textarea__sub_1092z","focusVisible":"textarea__focusVisible_1092z","filled":"textarea__filled_1092z","s":"textarea__s_1092z","m":"textarea__m_1092z","l":"textarea__l_1092z","xl":"textarea__xl_1092z","wrapper":"textarea__wrapper_1092z","resizeVertical":"textarea__resizeVertical_1092z"};
+const styles = {"textarea":"textarea__textarea_1092z","overflowHidden":"textarea__overflowHidden_1092z","customScrollbar":"textarea__customScrollbar_1092z","hasInnerLabel":"textarea__hasInnerLabel_1092z","pseudoTextarea":"textarea__pseudoTextarea_1092z","overflow":"textarea__overflow_1092z","sub":"textarea__sub_1092z","focusVisible":"textarea__focusVisible_1092z","filled":"textarea__filled_1092z","s":"textarea__s_1092z","m":"textarea__m_1092z","l":"textarea__l_1092z","xl":"textarea__xl_1092z","wrapper":"textarea__wrapper_1092z","resizeVertical":"textarea__resizeVertical_1092z"};
 require('./index.css');
 
 const PseudoTextArea = forwardRef(({ size = 's', pseudoTextareaClassName, maxLength, value }, ref) => (React.createElement("div", { className: cn(styles.pseudoTextarea, styles[size], pseudoTextareaClassName), ref: ref, hidden: true },

package/textarea/modern/components/PseudoTextArea.js

@@ -1,3 +1,3 @@
 import 'react';
 import 'classnames';
-export { P as PseudoTextArea } from '../PseudoTextArea-0b89b4a4.js';
+export { P as PseudoTextArea } from '../PseudoTextArea-6bd729a2.js';

package/textarea/modern/components/index.d.ts

@@ -1 +1 @@
-export * from "../PseudoTextArea-0b89b4a4";
+export * from "../PseudoTextArea-6bd729a2";

package/textarea/modern/components/index.js

@@ -1,3 +1,3 @@
-export { P as PseudoTextArea } from '../PseudoTextArea-0b89b4a4.js';
+export { P as PseudoTextArea } from '../PseudoTextArea-6bd729a2.js';
 import 'react';
 import 'classnames';

package/textarea/modern/index.css

@@ -167,14 +167,14 @@
     word-wrap: break-word;
     white-space: pre-wrap;
     z-index: -1;
-    overflow: hidden;
+    overflow: auto;
     max-height: 100%
 } .textarea__pseudoTextarea_1092z span {
         color: transparent;
     } .textarea__pseudoTextarea_1092z .textarea__overflow_1092z {
         background-color: var(--color-light-graphic-negative-alpha-40);
-    } .textarea__pseudoTextarea_1092z.textarea__nativeScrollbar_1092z {
-        overflow: auto;
+    } .textarea__pseudoTextarea_1092z::-webkit-scrollbar-thumb {
+        background-color: transparent;
     } .textarea__sub_1092z {
     font-size: 14px;
     line-height: 18px;

package/textarea/modern/index.js

@@ -6,4 +6,4 @@ import 'classnames';
 import '../../form-control/modern';
 import '../../shared/modern';
 import '@alfalab/hooks';
-import './PseudoTextArea-0b89b4a4.js';
+import './PseudoTextArea-6bd729a2.js';

package/textarea/modern/shared/index.d.ts

@@ -0,0 +1 @@
+export { getTextareaTestIds } from "../utils";

package/textarea/modern/shared/index.js

@@ -0,0 +1,2 @@
+export { getTextareaTestIds } from '../utils.js';
+import '../../../shared/modern';

package/textarea/modern/utils.d.ts

@@ -0,0 +1,10 @@
+declare function getTextareaTestIds(dataTestId: string): {
+    textarea: string;
+    inputWrapper: string;
+    inputWrapperInner: string;
+    leftAddons: string;
+    rightAddons: string;
+    error: string;
+    hint: string;
+};
+export { getTextareaTestIds };

package/textarea/modern/utils.js

@@ -0,0 +1,15 @@
+import { getDataTestId } from '../../shared/modern';
+
+function getTextareaTestIds(dataTestId) {
+    return {
+        textarea: dataTestId,
+        inputWrapper: getDataTestId(dataTestId, 'form-control'),
+        inputWrapperInner: getDataTestId(dataTestId, 'form-control-inner'),
+        leftAddons: getDataTestId(dataTestId, 'form-control-left-addons'),
+        rightAddons: getDataTestId(dataTestId, 'form-control-right-addons'),
+        error: getDataTestId(dataTestId, 'form-control-error-message'),
+        hint: getDataTestId(dataTestId, 'form-control-hint'),
+    };
+}
+
+export { getTextareaTestIds };

package/textarea/shared/index.d.ts

@@ -0,0 +1 @@
+export { getTextareaTestIds } from "../utils";

package/textarea/shared/index.js

@@ -0,0 +1,7 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var utils = require('../utils.js');
+
+
+
+exports.getTextareaTestIds = utils.getTextareaTestIds;

package/textarea/shared/package.json

@@ -0,0 +1,3 @@
+{
+    "module": "../esm/shared/index.js"
+}

package/textarea/utils.d.ts

@@ -0,0 +1,10 @@
+declare function getTextareaTestIds(dataTestId: string): {
+    textarea: string;
+    inputWrapper: string;
+    inputWrapperInner: string;
+    leftAddons: string;
+    rightAddons: string;
+    error: string;
+    hint: string;
+};
+export { getTextareaTestIds };

package/textarea/utils.js

@@ -0,0 +1,17 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var coreComponentsShared = require('../shared');
+
+function getTextareaTestIds(dataTestId) {
+    return {
+        textarea: dataTestId,
+        inputWrapper: coreComponentsShared.getDataTestId(dataTestId, 'form-control'),
+        inputWrapperInner: coreComponentsShared.getDataTestId(dataTestId, 'form-control-inner'),
+        leftAddons: coreComponentsShared.getDataTestId(dataTestId, 'form-control-left-addons'),
+        rightAddons: coreComponentsShared.getDataTestId(dataTestId, 'form-control-right-addons'),
+        error: coreComponentsShared.getDataTestId(dataTestId, 'form-control-error-message'),
+        hint: coreComponentsShared.getDataTestId(dataTestId, 'form-control-hint'),
+    };
+}
+
+exports.getTextareaTestIds = getTextareaTestIds;