@snack-uikit/fields 0.43.1-preview-e9e71368.0 → 0.45.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.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)
+
+
+### Features
+
+* **PDS-2225:** actions at the bottom of textarea input ([9a050ec](https://github.com/cloud-ru-tech/snack-uikit/commit/9a050ec1c60c3df39789a13b652a37373ed80027))
+
+
+
+
+
 # 0.43.0 (2025-05-21)
 
 

package/README.md

@@ -509,6 +509,7 @@ FieldStepper в основном предназначен для работы с
 | onCopyButtonClick | `() => void` | - | Колбек клика по кнопке Копировать для поля |
 | showClearButton | `boolean` | true | Отображение кнопки очистки поля |
 | allowMoreThanMaxLength | `boolean` | true | Можно ли вводить больше разрешённого кол-ва символов |
+| footer | `ReactNode` | - | Нода под футер |
 | value | `string` | - | HTML-аттрибут value |
 | id | `string` | - | HTML-аттрибут id |
 | name | `string` | - | HTML-аттрибут name |
@@ -518,6 +519,7 @@ FieldStepper в основном предназначен для работы с
 | onBlur | `FocusEventHandler<HTMLTextAreaElement>` | - | Колбек потери фокуса |
 | placeholder | `string` | - | Плейсхолдер |
 | maxLength | `number` | - | Максимальное кол-во символов |
+| onKeyDown | `KeyboardEventHandler<HTMLTextAreaElement>` | - | Колбек нажатия клавиши клавиатуры |
 | className | `string` | - | CSS-класс |
 | label | `string` | - | Лейбл |
 | labelTooltip | `ReactNode` | - | Всплывающая подсказка лейбла |

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

@@ -40,5 +40,5 @@ export declare const FieldColor: import("react").ForwardRefExoticComponent<{
     showClearButton?: boolean;
     value?: string;
     onChange?(value: string): void;
-} & Omit<ColorPickerProps, "onChange" | "value"> & InputProps & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & Omit<ColorPickerProps, "value" | "onChange"> & InputProps & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

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

@@ -23,5 +23,5 @@ type FieldSecureOwnProps = {
 export type FieldSecureProps = WithSupportProps<FieldSecureOwnProps & InputProps & WrapperProps>;
 export declare const FieldSecure: import("react").ForwardRefExoticComponent<{
     'data-test-id'?: string;
-} & import("react").AriaAttributes & FieldSecureOwnProps & Pick<Partial<InputPrivateProps>, "onChange" | "value"> & Pick<InputPrivateProps, "id" | "name" | "onFocus" | "onBlur" | "disabled" | "readonly" | "placeholder" | "autoComplete" | "maxLength"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & import("react").AriaAttributes & FieldSecureOwnProps & Pick<Partial<InputPrivateProps>, "value" | "onChange"> & Pick<InputPrivateProps, "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly" | "placeholder" | "autoComplete" | "maxLength"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

package/dist/cjs/components/FieldSelect/FieldSelectMultiple.d.ts

@@ -28,4 +28,4 @@ export declare const FieldSelectMultiple: import("react").ForwardRefExoticCompon
     resetSearchOnOptionSelection?: boolean;
     onOpenChange?(open: boolean): void;
     selectedOptionFormatter?: SelectedOptionFormatter;
-} & Pick<import("@snack-uikit/list").DroplistProps, "untouchableScrollbars" | "dataError" | "dataFiltered" | "scrollToSelectedItem" | "virtualized" | "noDataState" | "noResultsState" | "errorDataState">, "showCopyButton" | "onCopyButtonClick"> & import("react").RefAttributes<HTMLInputElement>>;
+} & Pick<import("@snack-uikit/list").DroplistProps, "scrollToSelectedItem" | "virtualized" | "untouchableScrollbars" | "dataFiltered" | "dataError" | "noDataState" | "noResultsState" | "errorDataState">, "showCopyButton" | "onCopyButtonClick"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/cjs/components/FieldSelect/FieldSelectSingle.d.ts

@@ -26,4 +26,4 @@ export declare const FieldSelectSingle: import("react").ForwardRefExoticComponen
     resetSearchOnOptionSelection?: boolean;
     onOpenChange?(open: boolean): void;
     selectedOptionFormatter?: SelectedOptionFormatter;
-} & Pick<import("@snack-uikit/list").DroplistProps, "untouchableScrollbars" | "dataError" | "dataFiltered" | "scrollToSelectedItem" | "virtualized" | "noDataState" | "noResultsState" | "errorDataState"> & import("react").RefAttributes<HTMLInputElement>>;
+} & Pick<import("@snack-uikit/list").DroplistProps, "scrollToSelectedItem" | "virtualized" | "untouchableScrollbars" | "dataFiltered" | "dataError" | "noDataState" | "noResultsState" | "errorDataState"> & import("react").RefAttributes<HTMLInputElement>>;

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

@@ -23,5 +23,5 @@ type FieldSliderOwnProps = {
 export type FieldSliderProps = WithSupportProps<FieldSliderOwnProps & SliderProps & WrapperProps>;
 export declare const FieldSlider: import("react").ForwardRefExoticComponent<{
     'data-test-id'?: string;
-} & import("react").AriaAttributes & FieldSliderOwnProps & Pick<InputPrivateProps, "id" | "name" | "onFocus" | "onBlur" | "disabled" | "readonly"> & Pick<SliderComponentProps, "onChange" | "value" | "range" | "tipFormatter"> & Required<Pick<SliderComponentProps, "max" | "min" | "step" | "marks">> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & import("react").AriaAttributes & FieldSliderOwnProps & Pick<InputPrivateProps, "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly"> & Pick<SliderComponentProps, "value" | "onChange" | "range" | "tipFormatter"> & Required<Pick<SliderComponentProps, "max" | "min" | "step" | "marks">> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

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

@@ -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>, "onChange" | "value"> & Pick<InputPrivateProps, "id" | "name" | "onPaste" | "onFocus" | "onBlur" | "onKeyDown" | "disabled" | "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"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

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

@@ -1,8 +1,8 @@
-import { ChangeEvent } from 'react';
+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'>;
 type WrapperProps = Pick<FieldDecoratorProps, 'className' | 'label' | 'labelTooltip' | 'required' | 'caption' | 'hint' | 'size' | 'validationState' | 'showHintIcon' | 'labelTooltipPlacement' | 'error'>;
 type FieldTextAreaOwnProps = {
     /** Минимальное кол-во строк, до которого размер поля может быть увеличен @default 3*/
@@ -24,9 +24,11 @@ type FieldTextAreaOwnProps = {
     showClearButton?: boolean;
     /** Можно ли вводить больше разрешённого кол-ва символов */
     allowMoreThanMaxLength?: boolean;
+    /** Нода под футер */
+    footer?: ReactNode;
 };
 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, "id" | "name" | "onFocus" | "onBlur" | "disabled" | "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"> & 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,
@@ -58,9 +59,10 @@ exports.FieldTextArea = (0, react_1.forwardRef)((_a, ref) => {
       error,
       size = input_private_1.SIZE.S,
       validationState = constants_1.VALIDATION_STATE.Default,
-      onCopyButtonClick
+      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"]);
+    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"]);
   const localRef = (0, react_1.useRef)(null);
   const clearButtonRef = (0, react_1.useRef)(null);
   const copyButtonRef = (0, react_1.useRef)(null);
@@ -106,6 +108,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,
@@ -126,13 +132,14 @@ exports.FieldTextArea = (0, react_1.forwardRef)((_a, ref) => {
     error: error,
     validationState: fieldValidationState
   }, (0, utils_1.extractSupportProps)(rest), {
-    children: (0, jsx_runtime_1.jsx)(helperComponents_1.FieldContainerPrivate, {
+    children: (0, jsx_runtime_1.jsxs)(helperComponents_1.FieldContainerPrivate, {
       className: styles_module_scss_1.default.container,
       size: size,
       validationState: fieldValidationState,
       disabled: disabled,
       readonly: readonly,
       "data-resizable": isResizable || undefined,
+      "data-actions": Boolean(footer) || undefined,
       variant: constants_1.CONTAINER_VARIANT.MultiLine,
       style: {
         '--max-rows': maxRows,
@@ -143,7 +150,7 @@ exports.FieldTextArea = (0, react_1.forwardRef)((_a, ref) => {
         className: styles_module_scss_1.default.postfix,
         children: postfixButtons
       }),
-      children: (0, jsx_runtime_1.jsx)(scroll_1.Scroll, {
+      children: [(0, jsx_runtime_1.jsx)(scroll_1.Scroll, {
         className: styles_module_scss_1.default.scrollContainer,
         size: 's',
         barHideStrategy: 'never',
@@ -163,12 +170,12 @@ 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,
           maxLength: allowMoreThanMaxLength ? undefined : maxLength || undefined,
           "data-test-id": 'field-textarea__input'
         })
-      })
+      }), footer]
     })
   }));
 });

package/dist/cjs/components/FieldTextArea/styles.module.css

@@ -2,6 +2,10 @@
   --max-rows:1000;
   --min-rows:3;
 }
+.container[data-actions]{
+  display:flex;
+  flex-direction:column;
+}
 .container .scrollContainer{
   min-height:calc(var(--min-rows) * var(--row-height) + var(--horizontal-scroll-bar-height));
   max-height:calc(var(--max-rows) * var(--row-height) + var(--horizontal-scroll-bar-height));

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

@@ -1,4 +1,4 @@
 import { ButtonFieldProps } from '../ButtonField';
-export declare const ButtonFieldList: import("react").ForwardRefExoticComponent<Omit<ButtonFieldProps, "hasArrow" | "arrowOpen"> & Pick<import("@snack-uikit/list").DroplistProps, "search" | "open" | "onOpenChange" | "items" | "scroll"> & {
+export declare const ButtonFieldList: import("react").ForwardRefExoticComponent<Omit<ButtonFieldProps, "hasArrow" | "arrowOpen"> & Pick<import("@snack-uikit/list").DroplistProps, "open" | "onOpenChange" | "items" | "search" | "scroll"> & {
     selection?: Omit<import("@snack-uikit/list").SelectionSingleState, "mode">;
 } & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/cjs/hooks/index.d.ts

@@ -2,6 +2,7 @@ export * from './dateHandlers';
 export * from './useCopyButton';
 export * from './useHideButton';
 export * from './usePostfix';
-export * from './addonButton';
+export * from './usePostfixButton';
 export * from './usePrefix';
+export * from './usePrefixButton';
 export * from './useValueControl';

package/dist/cjs/hooks/index.js

@@ -26,6 +26,7 @@ __exportStar(require("./dateHandlers"), exports);
 __exportStar(require("./useCopyButton"), exports);
 __exportStar(require("./useHideButton"), exports);
 __exportStar(require("./usePostfix"), exports);
-__exportStar(require("./addonButton"), exports);
+__exportStar(require("./usePostfixButton"), exports);
 __exportStar(require("./usePrefix"), exports);
+__exportStar(require("./usePrefixButton"), exports);
 __exportStar(require("./useValueControl"), exports);

package/dist/cjs/hooks/usePostfixButton.d.ts

@@ -0,0 +1,11 @@
+import { ReactElement } from 'react';
+import { ButtonProps, Size } from '@snack-uikit/input-private';
+import { ButtonFieldProps } from '../helperComponents';
+import { Button } from '../types';
+export declare function usePostfixButton({ button, size, postfixIcon, disabled, readonly, onFocus, onBlur, }: {
+    button?: Button;
+    size: Size;
+    postfixIcon?: ReactElement;
+    disabled?: boolean;
+    readonly?: boolean;
+} & Pick<ButtonFieldProps, 'onFocus' | 'onBlur'>): ButtonProps;

package/dist/cjs/hooks/{addonButton/useAddonButton.js → usePostfixButton.js}

@@ -3,38 +3,36 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useAddonButton = useAddonButton;
+exports.usePostfixButton = usePostfixButton;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const helperComponents_1 = require("../../helperComponents");
-function useAddonButton(_ref) {
+const helperComponents_1 = require("../helperComponents");
+function usePostfixButton(_ref) {
   let {
-    variant,
     button,
-    icon,
     size,
+    postfixIcon,
     disabled,
     readonly,
-    type,
     onFocus,
     onBlur
   } = _ref;
   const buttonListRef = (0, react_1.useRef)(null);
   const postfixIconProps = (0, react_1.useMemo)(() => ({
-    id: `${type}Icon`,
+    id: 'postfixIcon',
     active: false,
-    show: Boolean(icon && !button),
+    show: Boolean(postfixIcon && !button),
     render: () => (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {
-      children: icon
+      children: postfixIcon
     })
-  }), [button, icon, type]);
-  const addonButtonProps = (0, react_1.useMemo)(() => ({
-    id: `${type}Button`,
+  }), [button, postfixIcon]);
+  const postfixButtonProps = (0, react_1.useMemo)(() => ({
+    id: 'postfixButton',
     active: false,
-    show: Boolean(button && button.variant === variant),
+    show: Boolean(button && button.variant === 'after'),
     render: renderProps => {
       const buttonProps = Object.assign(Object.assign({}, renderProps), {
-        variant,
+        variant: 'after',
         size,
         content: button === null || button === void 0 ? void 0 : button.content,
         disabled: disabled || readonly,
@@ -58,12 +56,8 @@ function useAddonButton(_ref) {
           onOpenChange: button.onOpenChange
         }));
       }
-      const buttonField = (0, jsx_runtime_1.jsx)(helperComponents_1.ButtonField, Object.assign({}, buttonProps, {
-        hasArrow: button === null || button === void 0 ? void 0 : button.hasArrow,
-        arrowOpen: button === null || button === void 0 ? void 0 : button.arrowOpen
-      }));
-      return (button === null || button === void 0 ? void 0 : button.wrapper) ? button.wrapper(buttonField) : buttonField;
+      return (0, jsx_runtime_1.jsx)(helperComponents_1.ButtonField, Object.assign({}, buttonProps));
     }
-  }), [type, button, variant, size, disabled, readonly, onFocus, onBlur]);
-  return button ? addonButtonProps : postfixIconProps;
+  }), [button, size, disabled, readonly, onFocus, onBlur]);
+  return button ? postfixButtonProps : postfixIconProps;
 }

package/dist/cjs/hooks/usePrefixButton.d.ts

@@ -0,0 +1,11 @@
+import { ReactElement } from 'react';
+import { ButtonProps, Size } from '@snack-uikit/input-private';
+import { ButtonFieldProps } from '../helperComponents';
+import { Button } from '../types';
+export declare function usePrefixButton({ button, prefixIcon, size, disabled, readonly, onFocus, onBlur, }: {
+    button?: Button;
+    prefixIcon?: ReactElement;
+    size: Size;
+    disabled?: boolean;
+    readonly?: boolean;
+} & Pick<ButtonFieldProps, 'onFocus' | 'onBlur'>): ButtonProps;

package/dist/cjs/hooks/usePrefixButton.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePrefixButton = usePrefixButton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const helperComponents_1 = require("../helperComponents");
+function usePrefixButton(_ref) {
+  let {
+    button,
+    prefixIcon,
+    size,
+    disabled,
+    readonly,
+    onFocus,
+    onBlur
+  } = _ref;
+  const buttonListRef = (0, react_1.useRef)(null);
+  const prefixIconProps = (0, react_1.useMemo)(() => ({
+    id: 'prefixIcon',
+    active: false,
+    show: Boolean(prefixIcon && !button),
+    render: () => (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {
+      children: prefixIcon
+    })
+  }), [button, prefixIcon]);
+  const prefixButtonProps = (0, react_1.useMemo)(() => ({
+    id: 'prefixButton',
+    active: false,
+    show: Boolean(button && button.variant === 'before'),
+    render: renderProps => {
+      const buttonProps = Object.assign(Object.assign({}, renderProps), {
+        variant: 'before',
+        size,
+        content: button === null || button === void 0 ? void 0 : button.content,
+        disabled: disabled || readonly,
+        onFocus,
+        onBlur
+      });
+      if (button === null || button === void 0 ? void 0 : button.items) {
+        return (0, jsx_runtime_1.jsx)(helperComponents_1.ButtonFieldList, Object.assign({}, buttonProps, {
+          ref: buttonListRef,
+          onClick: () => {
+            setTimeout(() => {
+              var _a;
+              return (_a = buttonListRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            }, 0);
+          },
+          search: button.search,
+          items: button.items,
+          selection: button.selection,
+          open: button.open,
+          scroll: button.scroll,
+          onOpenChange: button.onOpenChange
+        }));
+      }
+      return (0, jsx_runtime_1.jsx)(helperComponents_1.ButtonField, Object.assign({}, buttonProps));
+    }
+  }), [button, size, disabled, readonly, onFocus, onBlur]);
+  return button ? prefixButtonProps : prefixIconProps;
+}

package/dist/cjs/types/allFields.d.ts

@@ -2,7 +2,6 @@ import { ReactNode } from 'react';
 import { DroplistProps, SelectionSingleState } from '@snack-uikit/list';
 import { ValueOf } from '@snack-uikit/utils';
 import { BUTTON_VARIANT, CONTAINER_VARIANT, VALIDATION_STATE } from '../constants';
-import { ButtonFieldProps } from '../helperComponents';
 export type ValidationState = ValueOf<typeof VALIDATION_STATE>;
 export type ContainerVariant = ValueOf<typeof CONTAINER_VARIANT>;
 export type ButtonVariant = ValueOf<typeof BUTTON_VARIANT>;
@@ -13,12 +12,8 @@ export type AsyncValueRequest = Promise<{
 export type NativeDroplistProps = Pick<DroplistProps, 'items' | 'open' | 'onOpenChange' | 'search' | 'scroll'> & {
     selection?: Omit<SelectionSingleState, 'mode'>;
 };
-export type Button = Omit<NativeDroplistProps, 'items'> & Pick<ButtonFieldProps, 'variant' | 'content'> & ({
+export type Button = Omit<NativeDroplistProps, 'items'> & {
+    variant: ButtonVariant;
+    content?: ReactNode;
     items?: DroplistProps['items'];
-    hasArrow?: never;
-    arrowOpen?: never;
-    wrapper?: never;
-} | (Pick<ButtonFieldProps, 'hasArrow' | 'arrowOpen'> & {
-    items?: never;
-    wrapper?: (button: ReactNode) => JSX.Element;
-}));
+};

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

@@ -40,5 +40,5 @@ export declare const FieldColor: import("react").ForwardRefExoticComponent<{
     showClearButton?: boolean;
     value?: string;
     onChange?(value: string): void;
-} & Omit<ColorPickerProps, "onChange" | "value"> & InputProps & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & Omit<ColorPickerProps, "value" | "onChange"> & InputProps & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

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

@@ -23,5 +23,5 @@ type FieldSecureOwnProps = {
 export type FieldSecureProps = WithSupportProps<FieldSecureOwnProps & InputProps & WrapperProps>;
 export declare const FieldSecure: import("react").ForwardRefExoticComponent<{
     'data-test-id'?: string;
-} & import("react").AriaAttributes & FieldSecureOwnProps & Pick<Partial<InputPrivateProps>, "onChange" | "value"> & Pick<InputPrivateProps, "id" | "name" | "onFocus" | "onBlur" | "disabled" | "readonly" | "placeholder" | "autoComplete" | "maxLength"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & import("react").AriaAttributes & FieldSecureOwnProps & Pick<Partial<InputPrivateProps>, "value" | "onChange"> & Pick<InputPrivateProps, "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly" | "placeholder" | "autoComplete" | "maxLength"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

package/dist/esm/components/FieldSelect/FieldSelectMultiple.d.ts

@@ -28,4 +28,4 @@ export declare const FieldSelectMultiple: import("react").ForwardRefExoticCompon
     resetSearchOnOptionSelection?: boolean;
     onOpenChange?(open: boolean): void;
     selectedOptionFormatter?: SelectedOptionFormatter;
-} & Pick<import("@snack-uikit/list").DroplistProps, "untouchableScrollbars" | "dataError" | "dataFiltered" | "scrollToSelectedItem" | "virtualized" | "noDataState" | "noResultsState" | "errorDataState">, "showCopyButton" | "onCopyButtonClick"> & import("react").RefAttributes<HTMLInputElement>>;
+} & Pick<import("@snack-uikit/list").DroplistProps, "scrollToSelectedItem" | "virtualized" | "untouchableScrollbars" | "dataFiltered" | "dataError" | "noDataState" | "noResultsState" | "errorDataState">, "showCopyButton" | "onCopyButtonClick"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/esm/components/FieldSelect/FieldSelectSingle.d.ts

@@ -26,4 +26,4 @@ export declare const FieldSelectSingle: import("react").ForwardRefExoticComponen
     resetSearchOnOptionSelection?: boolean;
     onOpenChange?(open: boolean): void;
     selectedOptionFormatter?: SelectedOptionFormatter;
-} & Pick<import("@snack-uikit/list").DroplistProps, "untouchableScrollbars" | "dataError" | "dataFiltered" | "scrollToSelectedItem" | "virtualized" | "noDataState" | "noResultsState" | "errorDataState"> & import("react").RefAttributes<HTMLInputElement>>;
+} & Pick<import("@snack-uikit/list").DroplistProps, "scrollToSelectedItem" | "virtualized" | "untouchableScrollbars" | "dataFiltered" | "dataError" | "noDataState" | "noResultsState" | "errorDataState"> & import("react").RefAttributes<HTMLInputElement>>;

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

@@ -23,5 +23,5 @@ type FieldSliderOwnProps = {
 export type FieldSliderProps = WithSupportProps<FieldSliderOwnProps & SliderProps & WrapperProps>;
 export declare const FieldSlider: import("react").ForwardRefExoticComponent<{
     'data-test-id'?: string;
-} & import("react").AriaAttributes & FieldSliderOwnProps & Pick<InputPrivateProps, "id" | "name" | "onFocus" | "onBlur" | "disabled" | "readonly"> & Pick<SliderComponentProps, "onChange" | "value" | "range" | "tipFormatter"> & Required<Pick<SliderComponentProps, "max" | "min" | "step" | "marks">> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & import("react").AriaAttributes & FieldSliderOwnProps & Pick<InputPrivateProps, "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly"> & Pick<SliderComponentProps, "value" | "onChange" | "range" | "tipFormatter"> & Required<Pick<SliderComponentProps, "max" | "min" | "step" | "marks">> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

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

@@ -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>, "onChange" | "value"> & Pick<InputPrivateProps, "id" | "name" | "onPaste" | "onFocus" | "onBlur" | "onKeyDown" | "disabled" | "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"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

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

@@ -1,8 +1,8 @@
-import { ChangeEvent } from 'react';
+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'>;
 type WrapperProps = Pick<FieldDecoratorProps, 'className' | 'label' | 'labelTooltip' | 'required' | 'caption' | 'hint' | 'size' | 'validationState' | 'showHintIcon' | 'labelTooltipPlacement' | 'error'>;
 type FieldTextAreaOwnProps = {
     /** Минимальное кол-во строк, до которого размер поля может быть увеличен @default 3*/
@@ -24,9 +24,11 @@ type FieldTextAreaOwnProps = {
     showClearButton?: boolean;
     /** Можно ли вводить больше разрешённого кол-ва символов */
     allowMoreThanMaxLength?: boolean;
+    /** Нода под футер */
+    footer?: ReactNode;
 };
 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, "id" | "name" | "onFocus" | "onBlur" | "disabled" | "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"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>>;
 export {};

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

@@ -9,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import mergeRefs from 'merge-refs';
 import { forwardRef, useMemo, useRef } from 'react';
 import { SIZE, useButtonNavigation, useClearButton } from '@snack-uikit/input-private';
@@ -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 } = _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"]);
+    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 } = _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"]);
     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: _jsx(FieldContainerPrivate, { className: styles.container, size: size, validationState: fieldValidationState, disabled: disabled, readonly: readonly, "data-resizable": isResizable || 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' }) }) }) })));
+    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, maxLength: allowMoreThanMaxLength ? undefined : maxLength || undefined, "data-test-id": 'field-textarea__input' }) }), footer] }) })));
 });

package/dist/esm/components/FieldTextArea/styles.module.css

@@ -2,6 +2,10 @@
   --max-rows:1000;
   --min-rows:3;
 }
+.container[data-actions]{
+  display:flex;
+  flex-direction:column;
+}
 .container .scrollContainer{
   min-height:calc(var(--min-rows) * var(--row-height) + var(--horizontal-scroll-bar-height));
   max-height:calc(var(--max-rows) * var(--row-height) + var(--horizontal-scroll-bar-height));

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

@@ -1,4 +1,4 @@
 import { ButtonFieldProps } from '../ButtonField';
-export declare const ButtonFieldList: import("react").ForwardRefExoticComponent<Omit<ButtonFieldProps, "hasArrow" | "arrowOpen"> & Pick<import("@snack-uikit/list").DroplistProps, "search" | "open" | "onOpenChange" | "items" | "scroll"> & {
+export declare const ButtonFieldList: import("react").ForwardRefExoticComponent<Omit<ButtonFieldProps, "hasArrow" | "arrowOpen"> & Pick<import("@snack-uikit/list").DroplistProps, "open" | "onOpenChange" | "items" | "search" | "scroll"> & {
     selection?: Omit<import("@snack-uikit/list").SelectionSingleState, "mode">;
 } & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/esm/hooks/index.d.ts

@@ -2,6 +2,7 @@ export * from './dateHandlers';
 export * from './useCopyButton';
 export * from './useHideButton';
 export * from './usePostfix';
-export * from './addonButton';
+export * from './usePostfixButton';
 export * from './usePrefix';
+export * from './usePrefixButton';
 export * from './useValueControl';

package/dist/esm/hooks/index.js

@@ -2,6 +2,7 @@ export * from './dateHandlers';
 export * from './useCopyButton';
 export * from './useHideButton';
 export * from './usePostfix';
-export * from './addonButton';
+export * from './usePostfixButton';
 export * from './usePrefix';
+export * from './usePrefixButton';
 export * from './useValueControl';

package/dist/esm/hooks/usePostfixButton.d.ts

@@ -0,0 +1,11 @@
+import { ReactElement } from 'react';
+import { ButtonProps, Size } from '@snack-uikit/input-private';
+import { ButtonFieldProps } from '../helperComponents';
+import { Button } from '../types';
+export declare function usePostfixButton({ button, size, postfixIcon, disabled, readonly, onFocus, onBlur, }: {
+    button?: Button;
+    size: Size;
+    postfixIcon?: ReactElement;
+    disabled?: boolean;
+    readonly?: boolean;
+} & Pick<ButtonFieldProps, 'onFocus' | 'onBlur'>): ButtonProps;