@alfalab/core-components 40.2.0-beta.0 → 41.0.0

package/tag/modern/default.css

@@ -1,4 +1,4 @@
-/* hash: 174ov */
+/* hash: 1epfk */
 :root {
 } /* deprecated */ :root {
     --color-light-bg-primary-inverted: #121212;
@@ -74,41 +74,41 @@
     /* background-color checked */
 
     /* text color */
-} .tag__component_1w7nq.tag__outlined_1w7nq {
+} .tag__component_jb6tn.tag__outlined_jb6tn {
         color: var(--tag-text-color);
         border-color: var(--tag-border-color);
         background-color: var(--tag-outlined-background-color)
-    } .tag__component_1w7nq.tag__outlined_1w7nq:disabled {
+    } .tag__component_jb6tn.tag__outlined_jb6tn:disabled {
             border-color: var(--tag-border-color-disabled);
             color: var(--tag-text-color-disabled);
             background-color: var(--tag-outlined-background-color-disabled);
-        } .tag__component_1w7nq.tag__outlined_1w7nq:hover:not(:disabled) {
+        } .tag__component_jb6tn.tag__outlined_jb6tn:hover:not(:disabled) {
             border-color: var(--tag-border-color-hover);
             background-color: var(--tag-outlined-background-color-hover);
-        } .tag__component_1w7nq.tag__outlined_1w7nq:active:not(:disabled) {
+        } .tag__component_jb6tn.tag__outlined_jb6tn:active:not(:disabled) {
             border-color: var(--tag-border-color-active);
             background-color: var(--tag-outlined-background-color-active);
-        } .tag__component_1w7nq.tag__filled_1w7nq {
+        } .tag__component_jb6tn.tag__filled_jb6tn {
         color: var(--tag-text-color);
         border-color: var(--tag-filled-border-color);
         background-color: var(--tag-filled-background-color)
-    } .tag__component_1w7nq.tag__filled_1w7nq:disabled {
+    } .tag__component_jb6tn.tag__filled_jb6tn:disabled {
             color: var(--tag-text-color-disabled);
             background-color: var(--tag-filled-background-color-disabled);
-        } .tag__component_1w7nq.tag__filled_1w7nq:hover:not(:disabled) {
+        } .tag__component_jb6tn.tag__filled_jb6tn:hover:not(:disabled) {
             background-color: var(--tag-filled-background-color-hover);
-        } .tag__component_1w7nq.tag__filled_1w7nq:active:not(:disabled) {
+        } .tag__component_jb6tn.tag__filled_jb6tn:active:not(:disabled) {
             background-color: var(--tag-filled-background-color-active);
-        } .tag__component_1w7nq.tag__checked_1w7nq {
+        } .tag__component_jb6tn.tag__checked_jb6tn {
         border-color: var(--tag-border-color-checked);
         background-color: var(--tag-background-color-checked);
         color: var(--tag-text-color-checked)
-    } .tag__component_1w7nq.tag__checked_1w7nq:disabled {
+    } .tag__component_jb6tn.tag__checked_jb6tn:disabled {
             background-color: var(--tag-background-color-checked-disabled);
             border-color: var(--tag-border-color-checked-disabled);
             color: var(--tag-text-color-checked-disabled);
-        } .tag__component_1w7nq.tag__checked_1w7nq:hover:not(:disabled) {
+        } .tag__component_jb6tn.tag__checked_jb6tn:hover:not(:disabled) {
             background-color: var(--tag-background-color-checked-hover);
-        } .tag__component_1w7nq.tag__checked_1w7nq:active:not(:disabled) {
+        } .tag__component_jb6tn.tag__checked_jb6tn:active:not(:disabled) {
             background-color: var(--tag-background-color-checked-active);
         }

package/tag/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: xrxpk */
+/* hash: 389lo */
 :root {
 } /* deprecated */ :root {
     --color-light-border-link: #0072ef; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -66,7 +66,7 @@
     /* background-color checked */
 
     /* text color */
-} .tag__component_sev6m {
+} .tag__component_c373b {
     display: inline-flex;
     justify-content: center;
     align-content: center;
@@ -84,143 +84,143 @@
     cursor: pointer;
     outline: none;
     white-space: nowrap
-} .tag__component_sev6m:disabled {
+} .tag__component_c373b:disabled {
         cursor: var(--disabled-cursor);
-    } .tag__focused_sev6m {
+    } .tag__focused_c373b {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
-} .tag__addons_sev6m {
+} .tag__addons_c373b {
     display: flex;
     flex-shrink: 0;
     align-items: center
-} .tag__addons_sev6m:first-child {
+} .tag__addons_c373b:first-child {
         margin-right: var(--gap-2xs);
-    } .tag__addons_sev6m:last-child {
+    } .tag__addons_c373b:last-child {
         margin-left: var(--gap-2xs);
-    } .tag__addons_sev6m:only-child {
+    } .tag__addons_c373b:only-child {
         margin: 0;
-    } .tag__s_sev6m .tag__addons_sev6m:first-child, .tag__m_sev6m .tag__addons_sev6m:first-child {
+    } .tag__s_c373b .tag__addons_c373b:first-child, .tag__m_c373b .tag__addons_c373b:first-child {
         margin-right: var(--gap-xs);
-    } .tag__s_sev6m .tag__addons_sev6m:last-child, .tag__m_sev6m .tag__addons_sev6m:last-child {
+    } .tag__s_c373b .tag__addons_c373b:last-child, .tag__m_c373b .tag__addons_c373b:last-child {
         margin-left: var(--gap-xs);
-    } .tag__l_sev6m .tag__addons_sev6m:first-child, .tag__xl_sev6m .tag__addons_sev6m:first-child {
+    } .tag__l_c373b .tag__addons_c373b:first-child, .tag__xl_c373b .tag__addons_c373b:first-child {
         margin-right: var(--gap-s);
-    } .tag__l_sev6m .tag__addons_sev6m:last-child, .tag__xl_sev6m .tag__addons_sev6m:last-child {
+    } .tag__l_c373b .tag__addons_c373b:last-child, .tag__xl_c373b .tag__addons_c373b:last-child {
         margin-left: var(--gap-s);
-    } .tag__xxs_sev6m {
+    } .tag__xxs_c373b {
     min-width: 60px;
     min-height: var(--size-xxs-height);
     padding: 0 var(--gap-m);
     font-size: 14px;
     line-height: 20px;
     font-weight: normal
-} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__xxs_sev6m {
+} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__xxs_c373b {
         /* Хак для ие, в котором не работает центрирование по высоте с использованием флексов, если указан min-height
         Возможно другое решение - если в будущем у компонента появится обертка, установить ей display: flex / inline-flex */
         height: 32px
 }
-    } .tag__xs_sev6m {
+    } .tag__xs_c373b {
     min-width: 72px;
     min-height: var(--size-xs-height);
     padding: 0 var(--gap-l);
     font-size: 14px;
     line-height: 20px;
     font-weight: normal
-} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__xs_sev6m {
+} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__xs_c373b {
         /* Хак для ие, в котором не работает центрирование по высоте с использованием флексов, если указан min-height
         Возможно другое решение - если в будущем у компонента появится обертка, установить ей display: flex / inline-flex */
         height: 40px
 }
-    } .tag__s_sev6m {
+    } .tag__s_c373b {
     min-width: 80px;
     min-height: var(--size-s-height);
     padding: 0 var(--gap-xl);
     font-size: 16px;
     line-height: 20px;
     font-weight: normal
-} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__s_sev6m {
+} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__s_c373b {
         /* Хак для ие, в котором не работает центрирование по высоте с использованием флексов, если указан min-height
         Возможно другое решение - если в будущем у компонента появится обертка, установить ей display: flex / inline-flex */
         height: 48px
 }
-    } .tag__m_sev6m {
+    } .tag__m_c373b {
     font-size: 16px;
     line-height: 20px;
     font-weight: 500;
     min-width: 96px;
     min-height: var(--size-m-height);
     padding: 0 28px
-} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__m_sev6m {
+} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__m_c373b {
         /* Хак для ие, в котором не работает центрирование по высоте с использованием флексов, если указан min-height
         Возможно другое решение - если в будущем у компонента появится обертка, установить ей display: flex / inline-flex */
         height: 56px
 }
-    } .tag__l_sev6m {
+    } .tag__l_c373b {
     font-size: 18px;
     line-height: 24px;
     font-weight: 500;
     min-width: 120px;
     min-height: var(--size-l-height);
     padding: 0 var(--gap-2xl)
-} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__l_sev6m {
+} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__l_c373b {
         /* Хак для ие, в котором не работает центрирование по высоте с использованием флексов, если указан min-height
         Возможно другое решение - если в будущем у компонента появится обертка, установить ей display: flex / inline-flex */
         height: 64px
 }
-    } .tag__xl_sev6m {
+    } .tag__xl_c373b {
     font-size: 18px;
     line-height: 24px;
     font-weight: 500;
     min-width: 120px;
     min-height: var(--size-xl-height);
     padding: 0 36px
-} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__xl_sev6m {
+} @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .tag__xl_c373b {
         /* Хак для ие, в котором не работает центрирование по высоте с использованием флексов, если указан min-height
         Возможно другое решение - если в будущем у компонента появится обертка, установить ей display: flex / inline-flex */
         height: 72px
 }
-    } .tag__withRightAddons_sev6m.tag__xxs_sev6m {
+    } .tag__withRightAddons_c373b.tag__xxs_c373b {
         padding-right: var(--gap-s);
-    } .tag__withRightAddons_sev6m.tag__xs_sev6m {
+    } .tag__withRightAddons_c373b.tag__xs_c373b {
         padding-right: var(--gap-m);
-    } .tag__withRightAddons_sev6m.tag__s_sev6m {
+    } .tag__withRightAddons_c373b.tag__s_c373b {
         padding-right: var(--gap-l);
-    } .tag__withRightAddons_sev6m.tag__m_sev6m {
+    } .tag__withRightAddons_c373b.tag__m_c373b {
         padding-right: var(--gap-xl);
-    } .tag__withRightAddons_sev6m.tag__l_sev6m {
+    } .tag__withRightAddons_c373b.tag__l_c373b {
         padding-right: 28px;
-    } .tag__withRightAddons_sev6m.tag__xl_sev6m {
+    } .tag__withRightAddons_c373b.tag__xl_c373b {
         padding-right: var(--gap-2xl);
-    } .tag__withLeftAddons_sev6m.tag__xxs_sev6m {
+    } .tag__withLeftAddons_c373b.tag__xxs_c373b {
         padding-left: var(--gap-s);
-    } .tag__withLeftAddons_sev6m.tag__xs_sev6m {
+    } .tag__withLeftAddons_c373b.tag__xs_c373b {
         padding-left: var(--gap-m);
-    } .tag__withLeftAddons_sev6m.tag__s_sev6m {
+    } .tag__withLeftAddons_c373b.tag__s_c373b {
         padding-left: var(--gap-l);
-    } .tag__withLeftAddons_sev6m.tag__m_sev6m {
+    } .tag__withLeftAddons_c373b.tag__m_c373b {
         padding-left: var(--gap-xl);
-    } .tag__withLeftAddons_sev6m.tag__l_sev6m {
+    } .tag__withLeftAddons_c373b.tag__l_c373b {
         padding-left: 28px;
-    } .tag__withLeftAddons_sev6m.tag__xl_sev6m {
+    } .tag__withLeftAddons_c373b.tag__xl_c373b {
         padding-left: var(--gap-2xl);
-    } .tag__rounded_sev6m.tag__xxs_sev6m {
+    } .tag__rounded_c373b.tag__xxs_c373b {
         border-radius: var(--tag-rounded-xxs-border-radius);
-    } .tag__rounded_sev6m.tag__xs_sev6m {
+    } .tag__rounded_c373b.tag__xs_c373b {
         border-radius: var(--tag-rounded-xs-border-radius);
-    } .tag__rounded_sev6m.tag__s_sev6m {
+    } .tag__rounded_c373b.tag__s_c373b {
         border-radius: var(--tag-rounded-s-border-radius);
-    } .tag__rounded_sev6m.tag__m_sev6m,
-    .tag__rounded_sev6m.tag__l_sev6m,
-    .tag__rounded_sev6m.tag__xl_sev6m {
+    } .tag__rounded_c373b.tag__m_c373b,
+    .tag__rounded_c373b.tag__l_c373b,
+    .tag__rounded_c373b.tag__xl_c373b {
         border-radius: var(--tag-border-radius);
-    } .tag__rectangular_sev6m.tag__xxs_sev6m {
+    } .tag__rectangular_c373b.tag__xxs_c373b {
         border-radius: var(--tag-rectangular-xxs-border-radius);
-    } .tag__rectangular_sev6m.tag__xs_sev6m {
+    } .tag__rectangular_c373b.tag__xs_c373b {
         border-radius: var(--tag-rectangular-xs-border-radius);
-    } .tag__rectangular_sev6m.tag__s_sev6m {
+    } .tag__rectangular_c373b.tag__s_c373b {
         border-radius: var(--tag-rectangular-s-border-radius);
-    } .tag__rectangular_sev6m.tag__m_sev6m,
-    .tag__rectangular_sev6m.tag__l_sev6m,
-    .tag__rectangular_sev6m.tag__xl_sev6m {
+    } .tag__rectangular_c373b.tag__m_c373b,
+    .tag__rectangular_c373b.tag__l_c373b,
+    .tag__rectangular_c373b.tag__xl_c373b {
         border-radius: var(--tag-alt-border-radius);
     }

package/tag/modern/inverted.css

@@ -1,4 +1,4 @@
-/* hash: 1imea */
+/* hash: x3l47 */
 :root {
 } /* deprecated */ :root {
     --color-dark-bg-primary-inverted: #fff;
@@ -79,41 +79,41 @@
     --tag-inverted-text-color-checked: var(--color-dark-text-primary-inverted);
     --tag-inverted-text-color-disabled: var(--color-dark-text-tertiary);
     --tag-inverted-text-color-checked-disabled: var(--color-dark-text-primary-inverted);
-} .tag__component_aoozy.tag__outlined_aoozy {
+} .tag__component_6dv0a.tag__outlined_6dv0a {
         color: var(--tag-inverted-text-color);
         border-color: var(--tag-inverted-border-color);
         background-color: var(--tag-inverted-outlined-background-color)
-    } .tag__component_aoozy.tag__outlined_aoozy:disabled {
+    } .tag__component_6dv0a.tag__outlined_6dv0a:disabled {
             border-color: var(--tag-inverted-border-color-disabled);
             color: var(--tag-inverted-text-color-disabled);
             background-color: var(--tag-inverted-outlined-background-color-disabled);
-        } .tag__component_aoozy.tag__outlined_aoozy:hover:not(:disabled) {
+        } .tag__component_6dv0a.tag__outlined_6dv0a:hover:not(:disabled) {
             border-color: var(--tag-inverted-border-color-hover);
             background-color: var(--tag-inverted-outlined-background-color-hover);
-        } .tag__component_aoozy.tag__outlined_aoozy:active:not(:disabled) {
+        } .tag__component_6dv0a.tag__outlined_6dv0a:active:not(:disabled) {
             border-color: var(--tag-inverted-border-color-active);
             background-color: var(--tag-inverted-outlined-background-color-active);
-        } .tag__component_aoozy.tag__filled_aoozy {
+        } .tag__component_6dv0a.tag__filled_6dv0a {
         color: var(--tag-inverted-text-color);
         border-color: var(--tag-inverted-filled-border-color);
         background-color: var(--tag-inverted-filled-background-color)
-    } .tag__component_aoozy.tag__filled_aoozy:disabled {
+    } .tag__component_6dv0a.tag__filled_6dv0a:disabled {
             color: var(--tag-inverted-text-color-disabled);
             background-color: var(--tag-inverted-filled-background-color-disabled);
-        } .tag__component_aoozy.tag__filled_aoozy:hover:not(:disabled) {
+        } .tag__component_6dv0a.tag__filled_6dv0a:hover:not(:disabled) {
             background-color: var(--tag-inverted-filled-background-color-hover);
-        } .tag__component_aoozy.tag__filled_aoozy:active:not(:disabled) {
+        } .tag__component_6dv0a.tag__filled_6dv0a:active:not(:disabled) {
             background-color: var(--tag-inverted-filled-background-color-active);
-        } .tag__component_aoozy.tag__checked_aoozy {
+        } .tag__component_6dv0a.tag__checked_6dv0a {
         border-color: var(--tag-inverted-border-color-checked);
         background-color: var(--tag-inverted-background-color-checked);
         color: var(--tag-inverted-text-color-checked)
-    } .tag__component_aoozy.tag__checked_aoozy:disabled {
+    } .tag__component_6dv0a.tag__checked_6dv0a:disabled {
             background-color: var(--tag-inverted-background-color-checked-disabled);
             border-color: var(--tag-inverted-border-color-checked-disabled);
             color: var(--tag-inverted-text-color-checked-disabled);
-        } .tag__component_aoozy.tag__checked_aoozy:hover:not(:disabled) {
+        } .tag__component_6dv0a.tag__checked_6dv0a:hover:not(:disabled) {
             background-color: var(--tag-inverted-background-color-checked-hover);
-        } .tag__component_aoozy.tag__checked_aoozy:active:not(:disabled) {
+        } .tag__component_6dv0a.tag__checked_6dv0a:active:not(:disabled) {
             background-color: var(--tag-inverted-background-color-checked-active);
         }

package/textarea/Component.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
 declare const getDefaultCounterText: (textLength: number, maxLength?: number) => string;
-declare const Textarea: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "size" | "style" | "value" | "defaultValue" | "onChange"> & import("./typings").TextareaIncomeProps & React.RefAttributes<HTMLTextAreaElement>>;
+declare const Textarea: React.ForwardRefExoticComponent<Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, "size" | "defaultValue" | "style" | "onChange" | "value"> & import("./typings").TextareaIncomeProps & React.RefAttributes<HTMLTextAreaElement>>;
 export { getDefaultCounterText, Textarea };

package/textarea/Component.js

@@ -6,9 +6,8 @@ var mergeRefs = require('react-merge-refs');
 var TextareaAutosize = require('react-textarea-autosize');
 var cn = require('classnames');
 var coreComponentsFormControl = require('../form-control');
-var coreComponentsScrollbar = require('../scrollbar');
 var hooks = require('@alfalab/hooks');
-var components_PseudoTextArea = require('./PseudoTextArea-713b4a35.js');
+var components_PseudoTextArea = require('./PseudoTextArea-ca7de9d2.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -17,10 +16,10 @@ var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var TextareaAutosize__default = /*#__PURE__*/_interopDefaultCompat(TextareaAutosize);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var defaultColors = {"input":"textarea__input_l2n1q","hasInnerLabel":"textarea__hasInnerLabel_l2n1q","clearIcon":"textarea__clearIcon_l2n1q","error":"textarea__error_l2n1q","textarea":"textarea__textarea_l2n1q","hint":"textarea__hint_l2n1q"};
+var defaultColors = {"input":"textarea__input_q4kui","hasInnerLabel":"textarea__hasInnerLabel_q4kui","clearIcon":"textarea__clearIcon_q4kui","error":"textarea__error_q4kui","textarea":"textarea__textarea_q4kui","hint":"textarea__hint_q4kui"};
 require('./default.css');
 
-var invertedColors = {"input":"textarea__input_bgss2","hasInnerLabel":"textarea__hasInnerLabel_bgss2","clearIcon":"textarea__clearIcon_bgss2","error":"textarea__error_bgss2","textarea":"textarea__textarea_bgss2","hint":"textarea__hint_bgss2"};
+var invertedColors = {"input":"textarea__input_1kui6","hasInnerLabel":"textarea__hasInnerLabel_1kui6","clearIcon":"textarea__clearIcon_1kui6","error":"textarea__error_1kui6","textarea":"textarea__textarea_1kui6","hint":"textarea__hint_1kui6"};
 require('./inverted.css');
 
 var colorStyles = {
@@ -32,21 +31,20 @@ 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;
-    var _d = _a.autoComplete, autoComplete = _d === void 0 ? 'on' : _d, _e = _a.autosize, autosize = _e === void 0 ? true : _e, _f = _a.size, size = _f === void 0 ? 's' : _f, _g = _a.colors, colors = _g === void 0 ? 'default' : _g, _h = _a.block, block = _h === void 0 ? false : _h, 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, _j = _a.labelView, labelView = _j === void 0 ? 'inner' : _j, 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, _k = _a.resize, resize = _k === void 0 ? 'none' : _k, value = _a.value, defaultValue = _a.defaultValue, _l = _a.rows, rows = _l === void 0 ? autosize ? 1 : 3 : _l, _m = _a.showCounter, showCounter = _m === void 0 ? false : _m, _o = _a.getCounterText, getCounterText = _o === void 0 ? getDefaultCounterText : _o, maxLength = _a.maxLength, nativeScrollbarProp = _a.nativeScrollbar, 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", "nativeScrollbar"]);
+    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, 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"]);
     var uncontrolled = value === undefined;
     var nativeScrollbar = hooks.useMedia([[true, '(max-width: 1023px)']], false)[0];
-    nativeScrollbar = resize !== 'none' || Boolean(nativeScrollbarProp !== null && nativeScrollbarProp !== void 0 ? nativeScrollbarProp : nativeScrollbar);
+    nativeScrollbar = Boolean(nativeScrollbarProp !== null && nativeScrollbarProp !== void 0 ? nativeScrollbarProp : nativeScrollbar);
     var textareaRef = React.useRef(null);
     var pseudoTextareaRef = React.useRef(null);
-    var _p = React.useState(false), focused = _p[0], setFocused = _p[1];
-    var _q = React.useState(defaultValue || ''), stateValue = _q[0], setStateValue = _q[1];
-    var _r = React.useState(), scrollableHeight = _r[0], setScrollableHeight = _r[1];
-    var _s = React.useState(0), scrollPosition = _s[0], setScrollPosition = _s[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, 'keyboard')[0];
     var filled = Boolean(uncontrolled ? stateValue : value);
     var hasInnerLabel = label && labelView === 'inner';
-    var hasOverflow = Boolean((maxLength && (value === null || value === void 0 ? void 0 : value.slice(maxLength))) || (maxLength && stateValue.slice(maxLength)));
+    var hasOverflow = Boolean(maxLength && allowOverflow && ((value === null || value === void 0 ? void 0 : value.slice(maxLength)) || stateValue.slice(maxLength)));
     React.useEffect(function () {
         var pseudoNode = pseudoTextareaRef.current;
         if (pseudoNode) {
@@ -55,19 +53,10 @@ var Textarea = React.forwardRef(function (_a, ref) {
     }, [scrollPosition, stateValue]);
     // Хак, так как react-textarea-autosize перестал поддерживать maxHeight
     React.useEffect(function () {
-        if (autosize) {
-            if (nativeScrollbar &&
-                maxHeight &&
-                textareaRef.current &&
-                textareaRef.current.style) {
-                textareaRef.current.style.maxHeight = "".concat(maxHeight, "px");
-            }
+        if (autosize && maxHeight && textareaRef.current && textareaRef.current.style) {
+            textareaRef.current.style.maxHeight = "".concat(maxHeight, "px");
         }
-        else if (!nativeScrollbar && textareaRef.current) {
-            var textareaHeight = textareaRef.current.scrollHeight;
-            setScrollableHeight(textareaHeight);
-        }
-    }, [autosize, maxHeight, nativeScrollbar]);
+    }, [autosize, maxHeight]);
     var handleTextareaFocus = function (event) {
         setFocused(true);
         if (onFocus) {
@@ -102,33 +91,13 @@ var Textarea = React.forwardRef(function (_a, ref) {
         return value.length;
     };
     var textareaClassNameCalc = cn__default.default(components_PseudoTextArea.styles.textarea, colorStyles[colors].textarea, components_PseudoTextArea.styles[size], (_b = {},
-        _b[components_PseudoTextArea.styles.hasInnerLabel] = nativeScrollbar && hasInnerLabel,
+        _b[components_PseudoTextArea.styles.customScrollbar] = !nativeScrollbar,
+        _b[components_PseudoTextArea.styles.hasInnerLabel] = hasInnerLabel,
         _b[colorStyles[colors].hasInnerLabel] = hasInnerLabel,
-        _b[components_PseudoTextArea.styles.filled] = nativeScrollbar && filled,
+        _b[components_PseudoTextArea.styles.filled] = filled,
         _b[components_PseudoTextArea.styles.resizeVertical] = resize === 'vertical',
         _b), textareaClassName);
-    var textareaProps = tslib.__assign(tslib.__assign({}, restProps), { className: textareaClassNameCalc, autoComplete: autoComplete, disabled: disabled, onBlur: handleTextareaBlur, onFocus: handleTextareaFocus, onChange: handleTextareaChange, value: uncontrolled ? stateValue : value, rows: rows, ref: mergeRefs__default.default([ref, textareaRef]), 'data-test-id': dataTestId, onScroll: handleTeaxtareaScroll });
-    var renderWithNativeScrollbar = function () {
-        return 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 } })));
-    };
-    var renderWithCustomScrollbar = function () {
-        var _a;
-        var minRowsValue = autosize ? minRows : rows;
-        return (React__default.default.createElement(coreComponentsScrollbar.Scrollbar, { style: { maxHeight: maxHeight, height: scrollableHeight, padding: 0 }, className: cn__default.default(components_PseudoTextArea.styles.scrollable, components_PseudoTextArea.styles[size], (_a = {},
-                _a[components_PseudoTextArea.styles.scrollableWithLabel] = label,
-                _a[components_PseudoTextArea.styles.filled] = filled,
-                _a)), horizontalAutoStretch: !block, widthPropName: 'width', contentNodeProps: { className: components_PseudoTextArea.styles.scrollableWrapper } },
-            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, components_PseudoTextArea.styles.customScrollbar), ref: pseudoTextareaRef })),
-            React__default.default.createElement(TextareaAutosize__default.default, tslib.__assign({}, textareaProps, { minRows: minRowsValue, style: { overflow: 'hidden' } })),
-            React__default.default.createElement(TextareaAutosize__default.default, { className: cn__default.default(textareaProps.className, components_PseudoTextArea.styles.textareaHidden), rows: textareaProps.rows, maxRows: maxRows, minRows: minRowsValue, value: textareaProps.value, role: 'none', onHeightChange: function (height) {
-                    if (autosize) {
-                        setScrollableHeight(height);
-                        if (onHeightChange) {
-                            onHeightChange(height);
-                        }
-                    }
-                } })));
-    };
+    var textareaProps = tslib.__assign(tslib.__assign({}, restProps), { className: textareaClassNameCalc, autoComplete: autoComplete, disabled: disabled, maxLength: allowOverflow ? undefined : maxLength, onBlur: handleTextareaBlur, onFocus: handleTextareaFocus, onChange: handleTextareaChange, value: uncontrolled ? stateValue : value, rows: rows, ref: mergeRefs__default.default([ref, textareaRef]), 'data-test-id': dataTestId, onScroll: handleTeaxtareaScroll });
     var getBottomAddons = function () {
         var _a;
         var counterIsVisible = Boolean(maxLength && showCounter);
@@ -141,9 +110,12 @@ var Textarea = React.forwardRef(function (_a, ref) {
     };
     return (React__default.default.createElement(coreComponentsFormControl.FormControl, { className: cn__default.default(className), fieldClassName: cn__default.default(fieldClassName, (_c = {},
             _c[components_PseudoTextArea.styles.focusVisible] = focusVisible,
-            _c)), 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() }, nativeScrollbar ? (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, components_PseudoTextArea.styles.nativeScrollbar), ref: pseudoTextareaRef })),
-        renderWithNativeScrollbar())) : (renderWithCustomScrollbar())));
+            _c)), 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() },
+        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, (_d = {},
+                    _d[components_PseudoTextArea.styles.nativeScrollbar] = nativeScrollbar,
+                    _d)), 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 } }))))));
 });
 
 exports.Textarea = Textarea;

package/textarea/{PseudoTextArea-713b4a35.js → PseudoTextArea-ca7de9d2.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 = {"scrollable":"textarea__scrollable_1emmb","scrollableWrapper":"textarea__scrollableWrapper_1emmb","textarea":"textarea__textarea_1emmb","s":"textarea__s_1emmb","m":"textarea__m_1emmb","l":"textarea__l_1emmb","xl":"textarea__xl_1emmb","textareaHidden":"textarea__textareaHidden_1emmb","hasInnerLabel":"textarea__hasInnerLabel_1emmb","resizeVertical":"textarea__resizeVertical_1emmb","pseudoTextarea":"textarea__pseudoTextarea_1emmb","overflow":"textarea__overflow_1emmb","nativeScrollbar":"textarea__nativeScrollbar_1emmb","customScrollbar":"textarea__customScrollbar_1emmb","sub":"textarea__sub_1emmb","scrollableWithLabel":"textarea__scrollableWithLabel_1emmb","focusVisible":"textarea__focusVisible_1emmb","filled":"textarea__filled_1emmb"};
+var styles = {"textarea":"textarea__textarea_12s4k","s":"textarea__s_12s4k","m":"textarea__m_12s4k","l":"textarea__l_12s4k","xl":"textarea__xl_12s4k","customScrollbar":"textarea__customScrollbar_12s4k","hasInnerLabel":"textarea__hasInnerLabel_12s4k","resizeVertical":"textarea__resizeVertical_12s4k","pseudoTextarea":"textarea__pseudoTextarea_12s4k","overflow":"textarea__overflow_12s4k","nativeScrollbar":"textarea__nativeScrollbar_12s4k","sub":"textarea__sub_12s4k","focusVisible":"textarea__focusVisible_12s4k","filled":"textarea__filled_12s4k"};
 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-713b4a35.js');
+var components_PseudoTextArea = require('../PseudoTextArea-ca7de9d2.js');
 
 
 

package/textarea/components/index.d.ts

@@ -1 +1 @@
-export * from "../PseudoTextArea-713b4a35";
+export * from "../PseudoTextArea-ca7de9d2";

package/textarea/components/index.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_PseudoTextArea = require('../PseudoTextArea-713b4a35.js');
+var components_PseudoTextArea = require('../PseudoTextArea-ca7de9d2.js');
 require('react');
 require('classnames');