@snack-uikit/fields 0.44.0 → 0.46.0

package/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# 0.46.0 (2025-05-26)
+
+
+### Features
+
+* **PDS-2223:** add spellcheck prop to FieldTextArea and FieldText ([60e8c86](https://github.com/cloud-ru-tech/snack-uikit/commit/60e8c8693ad4c69efdac887938180af99000af9e))
+
+
+
+
+
+# 0.45.0 (2025-05-26)
+
+
+### Features
+
+* **PDS-2223:** add onKeyDown props to FieldTextArea ([818f74d](https://github.com/cloud-ru-tech/snack-uikit/commit/818f74d498068e5cd9ed13bc9d2f9bfcc1943d2f))
+
+
+
+
+
 # 0.44.0 (2025-05-23)
 
 

package/README.md

@@ -482,6 +482,7 @@ FieldStepper в основном предназначен для работы с
 | placeholder | `string` | - | Значение плейсхолдера |
 | maxLength | `number` | - | Максимальная длина вводимого значения |
 | autoComplete | `string \| boolean` | false | Включен ли автокомплит для поля |
+| spellCheck | `boolean` | true | Значение атрибута spellcheck (проверка орфографии) |
 | onKeyDown | `KeyboardEventHandler<HTMLInputElement>` | - | Колбек обработки начала нажатия клавиши клавиатуры |
 | onPaste | `ClipboardEventHandler<HTMLInputElement>` | - | Колбек обработки вставки значения |
 | className | `string` | - | CSS-класс |
@@ -519,6 +520,8 @@ FieldStepper в основном предназначен для работы с
 | onBlur | `FocusEventHandler<HTMLTextAreaElement>` | - | Колбек потери фокуса |
 | placeholder | `string` | - | Плейсхолдер |
 | maxLength | `number` | - | Максимальное кол-во символов |
+| spellCheck | `boolean` | true | Включение проверки орфографии |
+| onKeyDown | `KeyboardEventHandler<HTMLTextAreaElement>` | - | Колбек нажатия клавиши клавиатуры |
 | className | `string` | - | CSS-класс |
 | label | `string` | - | Лейбл |
 | labelTooltip | `ReactNode` | - | Всплывающая подсказка лейбла |

package/dist/cjs/components/FieldText/FieldText.d.ts

@@ -3,7 +3,7 @@ import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
 import { Button } from '../../types';
 import { FieldDecoratorProps } from '../FieldDecorator';
-type InputProps = Pick<Partial<InputPrivateProps>, 'value' | 'onChange'> & Pick<InputPrivateProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur' | 'autoComplete' | 'onPaste' | 'onKeyDown'>;
+type InputProps = Pick<Partial<InputPrivateProps>, 'value' | 'onChange'> & Pick<InputPrivateProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur' | 'autoComplete' | 'onPaste' | 'onKeyDown' | 'spellCheck'>;
 type WrapperProps = Pick<FieldDecoratorProps, 'className' | 'label' | 'labelTooltip' | 'required' | 'caption' | 'hint' | 'showHintIcon' | 'size' | 'validationState' | 'labelTooltipPlacement' | 'error'>;
 type FieldTextOwnProps = {
     /** Отображение кнопки Копировать для поля (актуально только для `readonly = true`) */
@@ -30,5 +30,5 @@ type FieldTextOwnProps = {
 export type FieldTextProps = WithSupportProps<FieldTextOwnProps & InputProps & WrapperProps>;
 export declare const FieldText: import("react").ForwardRefExoticComponent<{
     'data-test-id'?: string;
-} & import("react").AriaAttributes & FieldTextOwnProps & Pick<Partial<InputPrivateProps>, "value" | "onChange"> & Pick<InputPrivateProps, "onKeyDown" | "onFocus" | "onBlur" | "id" | "disabled" | "name" | "onPaste" | "readonly" | "placeholder" | "autoComplete" | "maxLength"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & import("react").AriaAttributes & FieldTextOwnProps & Pick<Partial<InputPrivateProps>, "value" | "onChange"> & Pick<InputPrivateProps, "onKeyDown" | "onFocus" | "onBlur" | "id" | "disabled" | "name" | "onPaste" | "readonly" | "placeholder" | "autoComplete" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

package/dist/cjs/components/FieldText/FieldText.js

@@ -62,9 +62,10 @@ exports.FieldText = (0, react_1.forwardRef)((_a, ref) => {
       button: buttonProp,
       onPaste,
       onKeyDown,
-      type = 'text'
+      type = 'text',
+      spellCheck
     } = _a,
-    rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "disabled", "readonly", "showCopyButton", "showClearButton", "allowMoreThanMaxLength", "onChange", "onFocus", "onBlur", "onCopyButtonClick", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "validationState", "error", "autoComplete", "prefixIcon", "prefix", "postfix", "button", "onPaste", "onKeyDown", "type"]);
+    rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "disabled", "readonly", "showCopyButton", "showClearButton", "allowMoreThanMaxLength", "onChange", "onFocus", "onBlur", "onCopyButtonClick", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "validationState", "error", "autoComplete", "prefixIcon", "prefix", "postfix", "button", "onPaste", "onKeyDown", "type", "spellCheck"]);
   const [value = '', onChange] = (0, hooks_1.useValueControl)({
     value: valueProp,
     defaultValue: '',
@@ -209,6 +210,7 @@ exports.FieldText = (0, react_1.forwardRef)((_a, ref) => {
         id: id,
         name: name,
         autoComplete: autoComplete,
+        spellCheck: spellCheck,
         "data-test-id": 'field-text__input'
       })
     })

package/dist/cjs/components/FieldTextArea/FieldTextArea.d.ts

@@ -2,7 +2,7 @@ import { ChangeEvent, ReactNode } from 'react';
 import { WithSupportProps } from '@snack-uikit/utils';
 import { TextAreaProps } from '../../helperComponents';
 import { FieldDecoratorProps } from '../FieldDecorator';
-type InputProps = Pick<Partial<TextAreaProps>, 'value'> & Pick<TextAreaProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur'>;
+type InputProps = Pick<Partial<TextAreaProps>, 'value'> & Pick<TextAreaProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'spellCheck'>;
 type WrapperProps = Pick<FieldDecoratorProps, 'className' | 'label' | 'labelTooltip' | 'required' | 'caption' | 'hint' | 'size' | 'validationState' | 'showHintIcon' | 'labelTooltipPlacement' | 'error'>;
 type FieldTextAreaOwnProps = {
     /** Минимальное кол-во строк, до которого размер поля может быть увеличен @default 3*/
@@ -30,5 +30,5 @@ type FieldTextAreaOwnProps = {
 export type FieldTextAreaProps = WithSupportProps<FieldTextAreaOwnProps & InputProps & WrapperProps>;
 export declare const FieldTextArea: import("react").ForwardRefExoticComponent<{
     'data-test-id'?: string;
-} & import("react").AriaAttributes & FieldTextAreaOwnProps & Pick<Partial<TextAreaProps>, "value"> & Pick<TextAreaProps, "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly" | "placeholder" | "maxLength"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+} & import("react").AriaAttributes & FieldTextAreaOwnProps & Pick<Partial<TextAreaProps>, "value"> & Pick<TextAreaProps, "onKeyDown" | "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly" | "placeholder" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>>;
 export {};

package/dist/cjs/components/FieldTextArea/FieldTextArea.js

@@ -48,6 +48,7 @@ exports.FieldTextArea = (0, react_1.forwardRef)((_a, ref) => {
       onChange: onChangeProp,
       onFocus,
       onBlur,
+      onKeyDown,
       className,
       label,
       labelTooltip,
@@ -59,9 +60,10 @@ exports.FieldTextArea = (0, react_1.forwardRef)((_a, ref) => {
       size = input_private_1.SIZE.S,
       validationState = constants_1.VALIDATION_STATE.Default,
       onCopyButtonClick,
-      footer
+      footer,
+      spellCheck
     } = _a,
-    rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "minRows", "maxRows", "disabled", "resizable", "readonly", "showCopyButton", "showClearButton", "allowMoreThanMaxLength", "showHintIcon", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "error", "size", "validationState", "onCopyButtonClick", "footer"]);
+    rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "minRows", "maxRows", "disabled", "resizable", "readonly", "showCopyButton", "showClearButton", "allowMoreThanMaxLength", "showHintIcon", "onChange", "onFocus", "onBlur", "onKeyDown", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "error", "size", "validationState", "onCopyButtonClick", "footer", "spellCheck"]);
   const localRef = (0, react_1.useRef)(null);
   const clearButtonRef = (0, react_1.useRef)(null);
   const copyButtonRef = (0, react_1.useRef)(null);
@@ -107,6 +109,10 @@ exports.FieldTextArea = (0, react_1.forwardRef)((_a, ref) => {
     readonly,
     submitKeys: ['Enter', 'Space', 'Tab']
   });
+  const handleKeyDown = event => {
+    onInputKeyDown(event);
+    onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
+  };
   return (0, jsx_runtime_1.jsx)(FieldDecorator_1.FieldDecorator, Object.assign({
     className: className,
     label: label,
@@ -165,8 +171,9 @@ exports.FieldTextArea = (0, react_1.forwardRef)((_a, ref) => {
           ref: (0, merge_refs_1.default)(ref, localRef),
           onFocus: onFocus,
           onBlur: onBlur,
-          onKeyDown: onInputKeyDown,
+          onKeyDown: handleKeyDown,
           tabIndex: inputTabIndex,
+          spellCheck: spellCheck,
           maxLength: allowMoreThanMaxLength ? undefined : maxLength || undefined,
           "data-test-id": 'field-textarea__input'
         })

package/dist/cjs/helperComponents/TextArea/TextArea.d.ts

@@ -30,5 +30,7 @@ export type TextAreaProps = RefAttributes<HTMLTextAreaElement> & WithSupportProp
     tabIndex?: number;
     /** Минимальное кол-во строк, до которого размер поля может быть увеличен @default 3*/
     minRows?: number;
+    /** Включение проверки орфографии @default true*/
+    spellCheck?: boolean;
 }>;
 export declare const TextArea: import("react").ForwardRefExoticComponent<Omit<TextAreaProps, "ref"> & RefAttributes<HTMLTextAreaElement>>;

package/dist/cjs/helperComponents/TextArea/TextArea.js

@@ -39,9 +39,10 @@ exports.TextArea = (0, react_1.forwardRef)((_a, ref) => {
       onBlur,
       onKeyDown,
       tabIndex,
-      minRows = 3
+      minRows = 3,
+      spellCheck
     } = _a,
-    rest = __rest(_a, ["name", "value", "onChange", "placeholder", "id", "className", "disabled", "readonly", "autoComplete", "maxLength", "onFocus", "onBlur", "onKeyDown", "tabIndex", "minRows"]);
+    rest = __rest(_a, ["name", "value", "onChange", "placeholder", "id", "className", "disabled", "readonly", "autoComplete", "maxLength", "onFocus", "onBlur", "onKeyDown", "tabIndex", "minRows", "spellCheck"]);
   // fix of height on the initial render
   // see https://github.com/Andarist/react-textarea-autosize/issues/337#issuecomment-1024980737
   const [, setIsRerendered] = (0, react_1.useState)(false);
@@ -65,6 +66,7 @@ exports.TextArea = (0, react_1.forwardRef)((_a, ref) => {
     onBlur: onBlur,
     onKeyDown: onKeyDown,
     tabIndex: tabIndex,
-    minRows: minRows
+    minRows: minRows,
+    spellCheck: spellCheck
   }, (0, utils_1.extractSupportProps)(rest)));
 });

package/dist/esm/components/FieldText/FieldText.d.ts

@@ -3,7 +3,7 @@ import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
 import { Button } from '../../types';
 import { FieldDecoratorProps } from '../FieldDecorator';
-type InputProps = Pick<Partial<InputPrivateProps>, 'value' | 'onChange'> & Pick<InputPrivateProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur' | 'autoComplete' | 'onPaste' | 'onKeyDown'>;
+type InputProps = Pick<Partial<InputPrivateProps>, 'value' | 'onChange'> & Pick<InputPrivateProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur' | 'autoComplete' | 'onPaste' | 'onKeyDown' | 'spellCheck'>;
 type WrapperProps = Pick<FieldDecoratorProps, 'className' | 'label' | 'labelTooltip' | 'required' | 'caption' | 'hint' | 'showHintIcon' | 'size' | 'validationState' | 'labelTooltipPlacement' | 'error'>;
 type FieldTextOwnProps = {
     /** Отображение кнопки Копировать для поля (актуально только для `readonly = true`) */
@@ -30,5 +30,5 @@ type FieldTextOwnProps = {
 export type FieldTextProps = WithSupportProps<FieldTextOwnProps & InputProps & WrapperProps>;
 export declare const FieldText: import("react").ForwardRefExoticComponent<{
     'data-test-id'?: string;
-} & import("react").AriaAttributes & FieldTextOwnProps & Pick<Partial<InputPrivateProps>, "value" | "onChange"> & Pick<InputPrivateProps, "onKeyDown" | "onFocus" | "onBlur" | "id" | "disabled" | "name" | "onPaste" | "readonly" | "placeholder" | "autoComplete" | "maxLength"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & import("react").AriaAttributes & FieldTextOwnProps & Pick<Partial<InputPrivateProps>, "value" | "onChange"> & Pick<InputPrivateProps, "onKeyDown" | "onFocus" | "onBlur" | "id" | "disabled" | "name" | "onPaste" | "readonly" | "placeholder" | "autoComplete" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

package/dist/esm/components/FieldText/FieldText.js

@@ -21,7 +21,7 @@ import { getValidationState } from '../../utils/getValidationState';
 import { FieldDecorator } from '../FieldDecorator';
 import { getContainerVariant } from './helpers';
 export const FieldText = forwardRef((_a, ref) => {
-    var { id, name, value: valueProp, placeholder, maxLength, disabled = false, readonly = false, showCopyButton: showCopyButtonProp = true, showClearButton: showClearButtonProp = true, allowMoreThanMaxLength = false, onChange: onChangeProp, onFocus, onBlur, onCopyButtonClick, className, label, labelTooltip, labelTooltipPlacement, required = false, caption, hint, showHintIcon, size = SIZE.S, validationState = VALIDATION_STATE.Default, error, autoComplete, prefixIcon, prefix, postfix, button: buttonProp, onPaste, onKeyDown, type = 'text' } = _a, rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "disabled", "readonly", "showCopyButton", "showClearButton", "allowMoreThanMaxLength", "onChange", "onFocus", "onBlur", "onCopyButtonClick", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "validationState", "error", "autoComplete", "prefixIcon", "prefix", "postfix", "button", "onPaste", "onKeyDown", "type"]);
+    var { id, name, value: valueProp, placeholder, maxLength, disabled = false, readonly = false, showCopyButton: showCopyButtonProp = true, showClearButton: showClearButtonProp = true, allowMoreThanMaxLength = false, onChange: onChangeProp, onFocus, onBlur, onCopyButtonClick, className, label, labelTooltip, labelTooltipPlacement, required = false, caption, hint, showHintIcon, size = SIZE.S, validationState = VALIDATION_STATE.Default, error, autoComplete, prefixIcon, prefix, postfix, button: buttonProp, onPaste, onKeyDown, type = 'text', spellCheck } = _a, rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "disabled", "readonly", "showCopyButton", "showClearButton", "allowMoreThanMaxLength", "onChange", "onFocus", "onBlur", "onCopyButtonClick", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "validationState", "error", "autoComplete", "prefixIcon", "prefix", "postfix", "button", "onPaste", "onKeyDown", "type", "spellCheck"]);
     const [value = '', onChange] = useValueControl({
         value: valueProp,
         defaultValue: '',
@@ -91,5 +91,5 @@ export const FieldText = forwardRef((_a, ref) => {
         onInputKeyDown(event);
         onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
     };
-    return (_jsx(FieldDecorator, Object.assign({ className: className, label: label, labelTooltip: labelTooltip, labelTooltipPlacement: labelTooltipPlacement, labelFor: id, required: required, caption: caption, length: maxLength ? { max: maxLength, current: value.length } : undefined, hint: hint, disabled: disabled, readonly: readonly, showHintIcon: showHintIcon, size: size, validationState: fieldValidationState, error: error }, extractSupportProps(rest), { children: _jsx(FieldContainerPrivate, { size: size, validationState: fieldValidationState, disabled: disabled, readonly: readonly, variant: containerVariant, inputRef: localRef, prefix: prefixButtons, postfix: postfixButtons, disableFocus: isButtonFocused, children: _jsx(InputPrivate, { ref: mergeRefs(ref, localRef), "data-size": size, value: value, onChange: onChange, onFocus: onFocus, onBlur: onBlur, tabIndex: inputTabIndex, onKeyDown: handleKeyDown, onPaste: onPaste, placeholder: placeholder, disabled: disabled, readonly: readonly, type: type, maxLength: allowMoreThanMaxLength ? undefined : maxLength || undefined, id: id, name: name, autoComplete: autoComplete, "data-test-id": 'field-text__input' }) }) })));
+    return (_jsx(FieldDecorator, Object.assign({ className: className, label: label, labelTooltip: labelTooltip, labelTooltipPlacement: labelTooltipPlacement, labelFor: id, required: required, caption: caption, length: maxLength ? { max: maxLength, current: value.length } : undefined, hint: hint, disabled: disabled, readonly: readonly, showHintIcon: showHintIcon, size: size, validationState: fieldValidationState, error: error }, extractSupportProps(rest), { children: _jsx(FieldContainerPrivate, { size: size, validationState: fieldValidationState, disabled: disabled, readonly: readonly, variant: containerVariant, inputRef: localRef, prefix: prefixButtons, postfix: postfixButtons, disableFocus: isButtonFocused, children: _jsx(InputPrivate, { ref: mergeRefs(ref, localRef), "data-size": size, value: value, onChange: onChange, onFocus: onFocus, onBlur: onBlur, tabIndex: inputTabIndex, onKeyDown: handleKeyDown, onPaste: onPaste, placeholder: placeholder, disabled: disabled, readonly: readonly, type: type, maxLength: allowMoreThanMaxLength ? undefined : maxLength || undefined, id: id, name: name, autoComplete: autoComplete, spellCheck: spellCheck, "data-test-id": 'field-text__input' }) }) })));
 });

package/dist/esm/components/FieldTextArea/FieldTextArea.d.ts

@@ -2,7 +2,7 @@ import { ChangeEvent, ReactNode } from 'react';
 import { WithSupportProps } from '@snack-uikit/utils';
 import { TextAreaProps } from '../../helperComponents';
 import { FieldDecoratorProps } from '../FieldDecorator';
-type InputProps = Pick<Partial<TextAreaProps>, 'value'> & Pick<TextAreaProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur'>;
+type InputProps = Pick<Partial<TextAreaProps>, 'value'> & Pick<TextAreaProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'spellCheck'>;
 type WrapperProps = Pick<FieldDecoratorProps, 'className' | 'label' | 'labelTooltip' | 'required' | 'caption' | 'hint' | 'size' | 'validationState' | 'showHintIcon' | 'labelTooltipPlacement' | 'error'>;
 type FieldTextAreaOwnProps = {
     /** Минимальное кол-во строк, до которого размер поля может быть увеличен @default 3*/
@@ -30,5 +30,5 @@ type FieldTextAreaOwnProps = {
 export type FieldTextAreaProps = WithSupportProps<FieldTextAreaOwnProps & InputProps & WrapperProps>;
 export declare const FieldTextArea: import("react").ForwardRefExoticComponent<{
     'data-test-id'?: string;
-} & import("react").AriaAttributes & FieldTextAreaOwnProps & Pick<Partial<TextAreaProps>, "value"> & Pick<TextAreaProps, "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly" | "placeholder" | "maxLength"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+} & import("react").AriaAttributes & FieldTextAreaOwnProps & Pick<Partial<TextAreaProps>, "value"> & Pick<TextAreaProps, "onKeyDown" | "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly" | "placeholder" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>>;
 export {};

package/dist/esm/components/FieldTextArea/FieldTextArea.js

@@ -22,7 +22,7 @@ import { getValidationState } from '../../utils/getValidationState';
 import { FieldDecorator } from '../FieldDecorator';
 import styles from './styles.module.css';
 export const FieldTextArea = forwardRef((_a, ref) => {
-    var { id, name, value: valueProp, placeholder, maxLength, minRows = 3, maxRows = 1000, disabled = false, resizable = false, readonly = false, showCopyButton: showCopyButtonProp = true, showClearButton: showClearButtonProp = true, allowMoreThanMaxLength = true, showHintIcon, onChange: onChangeProp, onFocus, onBlur, className, label, labelTooltip, labelTooltipPlacement, required = false, caption, hint, error, size = SIZE.S, validationState = VALIDATION_STATE.Default, onCopyButtonClick, footer } = _a, rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "minRows", "maxRows", "disabled", "resizable", "readonly", "showCopyButton", "showClearButton", "allowMoreThanMaxLength", "showHintIcon", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "error", "size", "validationState", "onCopyButtonClick", "footer"]);
+    var { id, name, value: valueProp, placeholder, maxLength, minRows = 3, maxRows = 1000, disabled = false, resizable = false, readonly = false, showCopyButton: showCopyButtonProp = true, showClearButton: showClearButtonProp = true, allowMoreThanMaxLength = true, showHintIcon, onChange: onChangeProp, onFocus, onBlur, onKeyDown, className, label, labelTooltip, labelTooltipPlacement, required = false, caption, hint, error, size = SIZE.S, validationState = VALIDATION_STATE.Default, onCopyButtonClick, footer, spellCheck } = _a, rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "minRows", "maxRows", "disabled", "resizable", "readonly", "showCopyButton", "showClearButton", "allowMoreThanMaxLength", "showHintIcon", "onChange", "onFocus", "onBlur", "onKeyDown", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "error", "size", "validationState", "onCopyButtonClick", "footer", "spellCheck"]);
     const localRef = useRef(null);
     const clearButtonRef = useRef(null);
     const copyButtonRef = useRef(null);
@@ -56,5 +56,9 @@ export const FieldTextArea = forwardRef((_a, ref) => {
         readonly,
         submitKeys: ['Enter', 'Space', 'Tab'],
     });
-    return (_jsx(FieldDecorator, Object.assign({ className: className, label: label, labelTooltip: labelTooltip, labelTooltipPlacement: labelTooltipPlacement, labelFor: id, required: required, caption: caption, length: maxLength ? { max: maxLength, current: value.length } : undefined, hint: hint, disabled: disabled, readonly: readonly, showHintIcon: showHintIcon, size: size, error: error, validationState: fieldValidationState }, extractSupportProps(rest), { children: _jsxs(FieldContainerPrivate, { className: styles.container, size: size, validationState: fieldValidationState, disabled: disabled, readonly: readonly, "data-resizable": isResizable || undefined, "data-actions": Boolean(footer) || undefined, variant: CONTAINER_VARIANT.MultiLine, style: { '--max-rows': maxRows, '--min-rows': minRows }, inputRef: localRef, postfix: _jsx("span", { className: styles.postfix, children: postfixButtons }), children: [_jsx(Scroll, { className: styles.scrollContainer, size: 's', barHideStrategy: 'never', resize: isResizable ? 'vertical' : 'none', "data-test-id": 'field-textarea__scroll-area', children: _jsx(TextArea, { className: styles.textarea, "data-size": size, value: value, onChange: onChange, placeholder: placeholder, disabled: disabled, readonly: readonly, minRows: minRows, id: id, name: name, ref: mergeRefs(ref, localRef), onFocus: onFocus, onBlur: onBlur, onKeyDown: onInputKeyDown, tabIndex: inputTabIndex, maxLength: allowMoreThanMaxLength ? undefined : maxLength || undefined, "data-test-id": 'field-textarea__input' }) }), footer] }) })));
+    const handleKeyDown = event => {
+        onInputKeyDown(event);
+        onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
+    };
+    return (_jsx(FieldDecorator, Object.assign({ className: className, label: label, labelTooltip: labelTooltip, labelTooltipPlacement: labelTooltipPlacement, labelFor: id, required: required, caption: caption, length: maxLength ? { max: maxLength, current: value.length } : undefined, hint: hint, disabled: disabled, readonly: readonly, showHintIcon: showHintIcon, size: size, error: error, validationState: fieldValidationState }, extractSupportProps(rest), { children: _jsxs(FieldContainerPrivate, { className: styles.container, size: size, validationState: fieldValidationState, disabled: disabled, readonly: readonly, "data-resizable": isResizable || undefined, "data-actions": Boolean(footer) || undefined, variant: CONTAINER_VARIANT.MultiLine, style: { '--max-rows': maxRows, '--min-rows': minRows }, inputRef: localRef, postfix: _jsx("span", { className: styles.postfix, children: postfixButtons }), children: [_jsx(Scroll, { className: styles.scrollContainer, size: 's', barHideStrategy: 'never', resize: isResizable ? 'vertical' : 'none', "data-test-id": 'field-textarea__scroll-area', children: _jsx(TextArea, { className: styles.textarea, "data-size": size, value: value, onChange: onChange, placeholder: placeholder, disabled: disabled, readonly: readonly, minRows: minRows, id: id, name: name, ref: mergeRefs(ref, localRef), onFocus: onFocus, onBlur: onBlur, onKeyDown: handleKeyDown, tabIndex: inputTabIndex, spellCheck: spellCheck, maxLength: allowMoreThanMaxLength ? undefined : maxLength || undefined, "data-test-id": 'field-textarea__input' }) }), footer] }) })));
 });

package/dist/esm/helperComponents/TextArea/TextArea.d.ts

@@ -30,5 +30,7 @@ export type TextAreaProps = RefAttributes<HTMLTextAreaElement> & WithSupportProp
     tabIndex?: number;
     /** Минимальное кол-во строк, до которого размер поля может быть увеличен @default 3*/
     minRows?: number;
+    /** Включение проверки орфографии @default true*/
+    spellCheck?: boolean;
 }>;
 export declare const TextArea: import("react").ForwardRefExoticComponent<Omit<TextAreaProps, "ref"> & RefAttributes<HTMLTextAreaElement>>;

package/dist/esm/helperComponents/TextArea/TextArea.js

@@ -16,12 +16,12 @@ import TextareaAutosize from 'react-textarea-autosize';
 import { extractSupportProps, useLayoutEffect } from '@snack-uikit/utils';
 import styles from './styles.module.css';
 export const TextArea = forwardRef((_a, ref) => {
-    var { name, value = '', onChange, placeholder, id, className, disabled = false, readonly = false, autoComplete = false, maxLength, onFocus, onBlur, onKeyDown, tabIndex, minRows = 3 } = _a, rest = __rest(_a, ["name", "value", "onChange", "placeholder", "id", "className", "disabled", "readonly", "autoComplete", "maxLength", "onFocus", "onBlur", "onKeyDown", "tabIndex", "minRows"]);
+    var { name, value = '', onChange, placeholder, id, className, disabled = false, readonly = false, autoComplete = false, maxLength, onFocus, onBlur, onKeyDown, tabIndex, minRows = 3, spellCheck } = _a, rest = __rest(_a, ["name", "value", "onChange", "placeholder", "id", "className", "disabled", "readonly", "autoComplete", "maxLength", "onFocus", "onBlur", "onKeyDown", "tabIndex", "minRows", "spellCheck"]);
     // fix of height on the initial render
     // see https://github.com/Andarist/react-textarea-autosize/issues/337#issuecomment-1024980737
     const [, setIsRerendered] = useState(false);
     useLayoutEffect(() => setIsRerendered(true), []);
     const onChangeHandler = e => onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value, e);
     const stopPropagation = e => e.stopPropagation();
-    return (_jsx(TextareaAutosize, Object.assign({ id: id, name: name, value: value, ref: ref, className: cn(className, styles.textarea), autoComplete: autoComplete ? 'on' : 'off', placeholder: placeholder, disabled: disabled, readOnly: readonly, maxLength: maxLength, onChange: onChangeHandler, onClick: stopPropagation, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, tabIndex: tabIndex, minRows: minRows }, extractSupportProps(rest))));
+    return (_jsx(TextareaAutosize, Object.assign({ id: id, name: name, value: value, ref: ref, className: cn(className, styles.textarea), autoComplete: autoComplete ? 'on' : 'off', placeholder: placeholder, disabled: disabled, readOnly: readonly, maxLength: maxLength, onChange: onChangeHandler, onClick: stopPropagation, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, tabIndex: tabIndex, minRows: minRows, spellCheck: spellCheck }, extractSupportProps(rest))));
 });

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Fields",
-  "version": "0.44.0",
+  "version": "0.46.0",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -37,13 +37,13 @@
   "scripts": {},
   "dependencies": {
     "@snack-uikit/button": "0.19.11",
-    "@snack-uikit/calendar": "0.12.4",
-    "@snack-uikit/color-picker": "0.3.28",
+    "@snack-uikit/calendar": "0.12.5",
+    "@snack-uikit/color-picker": "0.3.29",
     "@snack-uikit/divider": "3.2.6",
     "@snack-uikit/dropdown": "0.4.8",
     "@snack-uikit/icons": "0.26.3",
-    "@snack-uikit/input-private": "4.5.9",
-    "@snack-uikit/list": "0.29.2",
+    "@snack-uikit/input-private": "4.6.0",
+    "@snack-uikit/list": "0.29.3",
     "@snack-uikit/scroll": "0.10.1",
     "@snack-uikit/skeleton": "0.6.5",
     "@snack-uikit/slider": "0.3.18",
@@ -65,5 +65,5 @@
   "peerDependencies": {
     "@snack-uikit/locale": "*"
   },
-  "gitHead": "98d8215a4c461746557441b6a31b109ebe43ce5c"
+  "gitHead": "26339d9278602025de86964e817a842e97e69d94"
 }

package/src/components/FieldText/FieldText.tsx

@@ -35,6 +35,7 @@ type InputProps = Pick<Partial<InputPrivateProps>, 'value' | 'onChange'> &
     | 'autoComplete'
     | 'onPaste'
     | 'onKeyDown'
+    | 'spellCheck'
   >;
 
 type WrapperProps = Pick<
@@ -115,6 +116,7 @@ export const FieldText = forwardRef<HTMLInputElement, FieldTextProps>(
       onPaste,
       onKeyDown,
       type = 'text',
+      spellCheck,
       ...rest
     },
     ref,
@@ -259,6 +261,7 @@ export const FieldText = forwardRef<HTMLInputElement, FieldTextProps>(
             id={id}
             name={name}
             autoComplete={autoComplete}
+            spellCheck={spellCheck}
             data-test-id='field-text__input'
           />
         </FieldContainerPrivate>

package/src/components/FieldTextArea/FieldTextArea.tsx

@@ -1,5 +1,5 @@
 import mergeRefs from 'merge-refs';
-import { ChangeEvent, forwardRef, ReactNode, useMemo, useRef } from 'react';
+import { ChangeEvent, forwardRef, KeyboardEventHandler, ReactNode, useMemo, useRef } from 'react';
 
 import { SIZE, useButtonNavigation, useClearButton } from '@snack-uikit/input-private';
 import { Scroll } from '@snack-uikit/scroll';
@@ -13,7 +13,19 @@ import { FieldDecorator, FieldDecoratorProps } from '../FieldDecorator';
 import styles from './styles.module.scss';
 
 type InputProps = Pick<Partial<TextAreaProps>, 'value'> &
-  Pick<TextAreaProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur'>;
+  Pick<
+    TextAreaProps,
+    | 'id'
+    | 'name'
+    | 'placeholder'
+    | 'maxLength'
+    | 'disabled'
+    | 'readonly'
+    | 'onFocus'
+    | 'onBlur'
+    | 'onKeyDown'
+    | 'spellCheck'
+  >;
 
 type WrapperProps = Pick<
   FieldDecoratorProps,
@@ -76,6 +88,7 @@ export const FieldTextArea = forwardRef<HTMLTextAreaElement, FieldTextAreaProps>
       onChange: onChangeProp,
       onFocus,
       onBlur,
+      onKeyDown,
       className,
       label,
       labelTooltip,
@@ -88,6 +101,7 @@ export const FieldTextArea = forwardRef<HTMLTextAreaElement, FieldTextAreaProps>
       validationState = VALIDATION_STATE.Default,
       onCopyButtonClick,
       footer,
+      spellCheck,
       ...rest
     },
     ref,
@@ -133,6 +147,11 @@ export const FieldTextArea = forwardRef<HTMLTextAreaElement, FieldTextAreaProps>
       submitKeys: ['Enter', 'Space', 'Tab'],
     });
 
+    const handleKeyDown: KeyboardEventHandler<HTMLTextAreaElement> = event => {
+      onInputKeyDown(event);
+      onKeyDown?.(event);
+    };
+
     return (
       <FieldDecorator
         className={className}
@@ -186,8 +205,9 @@ export const FieldTextArea = forwardRef<HTMLTextAreaElement, FieldTextAreaProps>
               ref={mergeRefs(ref, localRef)}
               onFocus={onFocus}
               onBlur={onBlur}
-              onKeyDown={onInputKeyDown}
+              onKeyDown={handleKeyDown}
               tabIndex={inputTabIndex}
+              spellCheck={spellCheck}
               maxLength={allowMoreThanMaxLength ? undefined : maxLength || undefined}
               data-test-id='field-textarea__input'
             />

package/src/helperComponents/TextArea/TextArea.tsx

@@ -46,6 +46,8 @@ export type TextAreaProps = RefAttributes<HTMLTextAreaElement> &
     tabIndex?: number;
     /** Минимальное кол-во строк, до которого размер поля может быть увеличен @default 3*/
     minRows?: number;
+    /** Включение проверки орфографии @default true*/
+    spellCheck?: boolean;
   }>;
 
 export const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(
@@ -66,6 +68,7 @@ export const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(
       onKeyDown,
       tabIndex,
       minRows = 3,
+      spellCheck,
       ...rest
     },
     ref,
@@ -97,6 +100,7 @@ export const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(
         onKeyDown={onKeyDown}
         tabIndex={tabIndex}
         minRows={minRows}
+        spellCheck={spellCheck}
         {...extractSupportProps(rest)}
       />
     );