@snack-uikit/fields 0.36.4 → 0.36.5-preview-c8fb5dcc.0

package/README.md

@@ -202,6 +202,7 @@ FieldStepper в основном предназначен для работы с
 | showClearButton | `boolean` | true | Отображение кнопки Очистки поля |
 | value | `string` | - | Значение input |
 | onChange | `(value: string) => void` | - |  |
+| decoratorRef | `ForwardedRef<HTMLDivElement>` | - | Ref для корневой обертки компонента |
 | withAlpha | `boolean` | - | Значение с альфаканалом |
 | autoApply | `boolean` | - | Применять изменения автоматически, если значение false - то изменения происходят по кнопке |
 | className | `string` | - | Класснейм |
@@ -237,6 +238,7 @@ FieldStepper в основном предназначен для работы с
 | showCopyButton | `boolean` | - | Отображение кнопки копирования |
 | onCopyButtonClick | `() => void` | - | Колбек клика по кнопке Копировать для поля |
 | showClearButton | `boolean` | true | Отображение кнопки Очистки поля |
+| decoratorRef | `ForwardedRef<HTMLDivElement>` | - | Ref для корневой обертки компонента |
 | buildCellProps | `(date: Date, viewMode: ViewMode) => { isDisabled?: boolean; isHoliday?: boolean } ;` | - | Колбек установки свойств ячеек календаря. Вызывается на построение каждой ячейки. Принимает два параметра: <br> `Date` - дата ячейки <br> `ViewMode`: <br>  - `month` отображение месяца, каждая ячейка - 1 день <br>  - `year` отображение года, каждая ячейка - 1 месяц <br>  - `decade` отображение декады, каждая ячейка - 1 год <br><br> Колбек должен возвращать объект с полями, отвечающими за отключение и подкраску ячейки. |
 | id | `string` | - | Значение html-атрибута id |
 | name | `string` | - | Значение html-атрибута name |
@@ -278,6 +280,8 @@ FieldStepper в основном предназначен для работы с
 | hint | `string` | - | Подсказка внизу |
 | validationState | enum ValidationState: `"error"`, `"default"`, `"warning"`, `"success"` | default | Состояние валидации |
 | showHintIcon | `boolean` | - | Отображать иконку подсказки |
+| ref | `LegacyRef<HTMLDivElement>` | - | Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref). @see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs} |
+| key | `Key` | - |  |
 ## FieldSecure
 ### Props
 | name | type | default value | description |
@@ -289,6 +293,7 @@ FieldStepper в основном предназначен для работы с
 | allowMoreThanMaxLength | `boolean` | - | Можно ли вводить больше разрешённого кол-ва символов |
 | prefixIcon | `ReactElement<any, string \| JSXElementConstructor<any>>` | - | Иконка-префикс для поля |
 | asyncValueGetter | `() => Promise<string>` | - | Свойство позволяет грузить данные в поле по требованию |
+| decoratorRef | `ForwardedRef<HTMLDivElement>` | - | Ref для корневой обертки компонента |
 | onChange | `(value: string, e?: ChangeEvent<HTMLInputElement>) => void` | - | Колбек смены значения |
 | value | `string` | - | Значение input |
 | id | `string` | - | Значение html-атрибута id |
@@ -348,6 +353,7 @@ FieldStepper в основном предназначен для работы с
 | open | `boolean` | - |  |
 | onOpenChange | `(open: boolean) => void` | - |  |
 | onCopyButtonClick | `() => void` | - | Колбек клика по кнопке Копировать для поля |
+| decoratorRef | `ForwardedRef<HTMLDivElement>` | - | Ref для корневой обертки компонента |
 | prefixIcon | `ReactElement<any, string \| JSXElementConstructor<any>>` | - | Иконка-префикс для поля |
 | widthStrategy | enum PopoverWidthStrategy: `"auto"`, `"gte"`, `"eq"` | - |  |
 | pinTop | `OptionProps[]` | - |  |
@@ -381,6 +387,7 @@ FieldStepper в основном предназначен для работы с
 | unbindInputFromMarks | `boolean` | - | Отвязать текстовое поле от значений на линейке |
 | prefix | `ReactNode` | - | Произвольный префикс для поля |
 | postfix | `ReactNode` | - | Произвольный постфикс для поля |
+| decoratorRef | `ForwardedRef<HTMLDivElement>` | - | Ref для корневой обертки компонента |
 | id | `string` | - | Значение html-атрибута id |
 | name | `string` | - | Значение html-атрибута name |
 | disabled | `boolean` | - | Является ли поле деактивированным |
@@ -416,6 +423,7 @@ FieldStepper в основном предназначен для работы с
 | allowMoreThanLimits | `boolean` | true | Можно ли вводить c клавиатуры числа, выходящие за пределы min/max |
 | prefix | `ReactNode` | - | Произвольный префикс для поля |
 | postfix | `ReactNode` | - | Произвольный постфикс для поля |
+| decoratorRef | `ForwardedRef<HTMLDivElement>` | - | Ref для корневой обертки компонента |
 | id | `string` | - | Значение html-атрибута id |
 | name | `string` | - | Значение html-атрибута name |
 | disabled | `boolean` | - | Является ли поле деактивированным |
@@ -449,6 +457,7 @@ FieldStepper в основном предназначен для работы с
 | prefix | `ReactNode` | - | Произвольный префикс для поля |
 | postfix | `ReactNode` | - | Произвольный постфикс для поля |
 | button | `Button` | - | Кнопка действия внутри поля |
+| decoratorRef | `ForwardedRef<HTMLDivElement>` | - | Ref для корневой обертки компонента |
 | onChange | `(value: string, e?: ChangeEvent<HTMLInputElement>) => void` | - | Колбек смены значения |
 | value | `string` | - | Значение input |
 | id | `string` | - | Значение html-атрибута id |
@@ -487,6 +496,7 @@ FieldStepper в основном предназначен для работы с
 | onCopyButtonClick | `() => void` | - | Колбек клика по кнопке Копировать для поля |
 | showClearButton | `boolean` | true | Отображение кнопки очистки поля |
 | allowMoreThanMaxLength | `boolean` | true | Можно ли вводить больше разрешённого кол-ва символов |
+| decoratorRef | `ForwardedRef<HTMLDivElement>` | - | Ref для корневой обертки компонента |
 | value | `string` | - | HTML-аттрибут value |
 | id | `string` | - | HTML-аттрибут id |
 | name | `string` | - | HTML-аттрибут name |
@@ -521,6 +531,7 @@ FieldStepper в основном предназначен для работы с
 | onCopyButtonClick | `() => void` | - | Колбек клика по кнопке Копировать для поля |
 | showSeconds | `boolean` | true | Показывать ли секунды |
 | showClearButton | `boolean` | true | Отображение кнопки Очистки поля |
+| decoratorRef | `ForwardedRef<HTMLDivElement>` | - | Ref для корневой обертки компонента |
 | id | `string` | - | Значение html-атрибута id |
 | name | `string` | - | Значение html-атрибута name |
 | disabled | `boolean` | - | Является ли поле деактивированным |

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

@@ -1,3 +1,4 @@
+import { ForwardedRef } from 'react';
 import { ColorPickerProps } from '@snack-uikit/color-picker';
 import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
@@ -20,6 +21,8 @@ type FieldDateOwnProps = {
     showClearButton?: boolean;
     value?: string;
     onChange?(value: string): void;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 } & Omit<ColorPickerProps, 'onChange' | 'value'>;
 export type FieldColorProps = WithSupportProps<FieldDateOwnProps & InputProps & WrapperProps>;
 export declare const FieldColor: import("react").ForwardRefExoticComponent<{
@@ -40,5 +43,7 @@ export declare const FieldColor: import("react").ForwardRefExoticComponent<{
     showClearButton?: boolean;
     value?: string;
     onChange?(value: string): void;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 } & Omit<ColorPickerProps, "value" | "onChange"> & InputProps & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

package/dist/cjs/components/FieldColor/FieldColor.js

@@ -59,9 +59,10 @@ exports.FieldColor = (0, react_1.forwardRef)((_a, ref) => {
       placeholder,
       onFocus,
       onBlur,
-      onCopyButtonClick
+      onCopyButtonClick,
+      decoratorRef
     } = _a,
-    rest = __rest(_a, ["id", "name", "value", "disabled", "readonly", "showCopyButton", "showClearButton", "open", "onChange", "onOpenChange", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "validationState", "error", "withAlpha", "autoApply", "placeholder", "onFocus", "onBlur", "onCopyButtonClick"]);
+    rest = __rest(_a, ["id", "name", "value", "disabled", "readonly", "showCopyButton", "showClearButton", "open", "onChange", "onOpenChange", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "validationState", "error", "withAlpha", "autoApply", "placeholder", "onFocus", "onBlur", "onCopyButtonClick", "decoratorRef"]);
   const [isOpen, setIsOpen] = (0, uncontrollable_1.useUncontrolledProp)(open, false, onOpenChange);
   const localRef = (0, react_1.useRef)(null);
   const showDropList = isOpen && !readonly && !disabled;
@@ -128,7 +129,8 @@ exports.FieldColor = (0, react_1.forwardRef)((_a, ref) => {
     showHintIcon: showHintIcon,
     size: size,
     error: error,
-    validationState: fieldValidationState
+    validationState: fieldValidationState,
+    ref: decoratorRef
   }, (0, utils_1.extractSupportProps)(rest), {
     children: (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({
       trigger: 'click',

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

@@ -1,3 +1,4 @@
+import { ForwardedRef } from 'react';
 import { CalendarProps } from '@snack-uikit/calendar';
 import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
@@ -29,6 +30,8 @@ type FieldDateOwnProps = {
      */
     showClearButton?: boolean;
     mode: Mode;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 } & Pick<CalendarProps, 'buildCellProps'> & ({
     mode: typeof MODES.Date;
 } | FieldDateWithSeconds);

package/dist/cjs/components/FieldDate/FieldDate.js

@@ -60,9 +60,10 @@ exports.FieldDate = (0, react_1.forwardRef)((_a, ref) => {
       buildCellProps,
       error,
       mode,
-      onCopyButtonClick
+      onCopyButtonClick,
+      decoratorRef
     } = _a,
-    rest = __rest(_a, ["id", "name", "value", "disabled", "readonly", "showCopyButton", "showClearButton", "open", "onOpenChange", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "validationState", "buildCellProps", "error", "mode", "onCopyButtonClick"]);
+    rest = __rest(_a, ["id", "name", "value", "disabled", "readonly", "showCopyButton", "showClearButton", "open", "onOpenChange", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "validationState", "buildCellProps", "error", "mode", "onCopyButtonClick", "decoratorRef"]);
   const [isOpen, setIsOpen] = (0, uncontrollable_1.useUncontrolledProp)(open, false, onOpenChange);
   const localRef = (0, react_1.useRef)(null);
   const clearButtonRef = (0, react_1.useRef)(null);
@@ -232,7 +233,8 @@ exports.FieldDate = (0, react_1.forwardRef)((_a, ref) => {
     showHintIcon: showHintIcon,
     size: size,
     error: error,
-    validationState: fieldValidationState
+    validationState: fieldValidationState,
+    ref: decoratorRef
   }, (0, utils_1.extractSupportProps)(rest), {
     children: (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({
       trigger: 'click',

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

@@ -12,4 +12,15 @@ export type FieldDecoratorProps = WithSupportProps<{
     readonly?: boolean;
     error?: string;
 } & HeaderProps & FooterProps>;
-export declare function FieldDecorator({ children, className, label, labelTooltip, required, labelFor, caption, length, hint, disabled, readonly, showHintIcon, labelTooltipPlacement, size, error, validationState, ...rest }: FieldDecoratorProps): import("react/jsx-runtime").JSX.Element;
+export declare const FieldDecorator: import("react").ForwardRefExoticComponent<{
+    'data-test-id'?: string;
+} & import("react").AriaAttributes & {
+    className?: string;
+    /** Контент */
+    children: ReactNode;
+    /** Деактивирован ли элемент */
+    disabled?: boolean;
+    /** Является ли поле доступным только на чтение */
+    readonly?: boolean;
+    error?: string;
+} & HeaderProps & FooterProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/FieldDecorator/FieldDecorator.js

@@ -16,9 +16,10 @@ var __importDefault = void 0 && (void 0).__importDefault || function (mod) {
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.FieldDecorator = FieldDecorator;
+exports.FieldDecorator = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const classnames_1 = __importDefault(require("classnames"));
+const react_1 = require("react");
 const input_private_1 = require("@snack-uikit/input-private");
 const utils_1 = require("@snack-uikit/utils");
 const constants_1 = require("../../constants");
@@ -26,7 +27,7 @@ const getValidationState_1 = require("../../utils/getValidationState");
 const Footer_1 = require("./Footer");
 const Header_1 = require("./Header");
 const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
-function FieldDecorator(_a) {
+exports.FieldDecorator = (0, react_1.forwardRef)((_a, ref) => {
   var {
       children,
       className,
@@ -55,6 +56,7 @@ function FieldDecorator(_a) {
     className: (0, classnames_1.default)(styles_module_scss_1.default.decorator, className)
   }, (0, utils_1.extractSupportProps)(rest), {
     "data-size": size,
+    ref: ref,
     children: [label && (0, jsx_runtime_1.jsx)(Header_1.Header, {
       labelTooltipPlacement: labelTooltipPlacement,
       required: required,
@@ -71,4 +73,4 @@ function FieldDecorator(_a) {
       validationState: isFieldActive ? fieldValidationState : constants_1.VALIDATION_STATE.Default
     })]
   }));
-}
+});

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

@@ -1,4 +1,4 @@
-import { ReactElement } from 'react';
+import { ForwardedRef, ReactElement } from 'react';
 import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
 import { FieldDecoratorProps } from '../FieldDecorator';
@@ -19,6 +19,8 @@ type FieldSecureOwnProps = {
     prefixIcon?: ReactElement;
     /** Свойство позволяет грузить данные в поле по требованию */
     asyncValueGetter?(): Promise<string>;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 };
 export type FieldSecureProps = WithSupportProps<FieldSecureOwnProps & InputProps & WrapperProps>;
 export declare const FieldSecure: import("react").ForwardRefExoticComponent<{

package/dist/cjs/components/FieldSecure/FieldSecure.js

@@ -85,9 +85,10 @@ exports.FieldSecure = (0, react_1.forwardRef)((_a, ref) => {
       error,
       asyncValueGetter,
       autoComplete,
-      onCopyButtonClick
+      onCopyButtonClick,
+      decoratorRef
     } = _a,
-    rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "disabled", "readonly", "showCopyButton", "allowMoreThanMaxLength", "hidden", "onHiddenChange", "showHintIcon", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "size", "validationState", "prefixIcon", "error", "asyncValueGetter", "autoComplete", "onCopyButtonClick"]);
+    rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "disabled", "readonly", "showCopyButton", "allowMoreThanMaxLength", "hidden", "onHiddenChange", "showHintIcon", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "size", "validationState", "prefixIcon", "error", "asyncValueGetter", "autoComplete", "onCopyButtonClick", "decoratorRef"]);
   const localRef = (0, react_1.useRef)(null);
   const copyButtonRef = (0, react_1.useRef)(null);
   const hideButtonRef = (0, react_1.useRef)(null);
@@ -194,7 +195,8 @@ exports.FieldSecure = (0, react_1.forwardRef)((_a, ref) => {
     showHintIcon: showHintIcon,
     size: size,
     error: error,
-    validationState: fieldValidationState
+    validationState: fieldValidationState,
+    ref: decoratorRef
   }, (0, utils_1.extractSupportProps)(rest), {
     children: (0, jsx_runtime_1.jsx)(helperComponents_1.FieldContainerPrivate, {
       size: size,

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

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

package/dist/cjs/components/FieldSelect/FieldSelectMultiple.js

@@ -67,9 +67,10 @@ exports.FieldSelectMultiple = (0, react_1.forwardRef)((props, ref) => {
       enableFuzzySearch = true,
       resetSearchOnOptionSelection = true,
       onOpenChange,
-      selectedOptionFormatter = defaultSelectedOptionFormatter
+      selectedOptionFormatter = defaultSelectedOptionFormatter,
+      decoratorRef
     } = props,
-    rest = __rest(props, ["id", "name", "placeholder", "size", "options", "value", "defaultValue", "onChange", "disabled", "readonly", "searchable", "showClearButton", "onKeyDown", "validationState", "search", "autocomplete", "prefixIcon", "prefix", "postfix", "removeByBackspace", "addOptionByEnter", "untouchableScrollbars", "open", "enableFuzzySearch", "resetSearchOnOptionSelection", "onOpenChange", "selectedOptionFormatter"]);
+    rest = __rest(props, ["id", "name", "placeholder", "size", "options", "value", "defaultValue", "onChange", "disabled", "readonly", "searchable", "showClearButton", "onKeyDown", "validationState", "search", "autocomplete", "prefixIcon", "prefix", "postfix", "removeByBackspace", "addOptionByEnter", "untouchableScrollbars", "open", "enableFuzzySearch", "resetSearchOnOptionSelection", "onOpenChange", "selectedOptionFormatter", "decoratorRef"]);
   const localRef = (0, react_1.useRef)(null);
   const inputPlugRef = (0, react_1.useRef)(null);
   const contentRef = (0, react_1.useRef)(null);
@@ -210,6 +211,7 @@ exports.FieldSelectMultiple = (0, react_1.forwardRef)((props, ref) => {
   });
   return (0, jsx_runtime_1.jsx)(FieldDecorator_1.FieldDecorator, Object.assign({}, (0, utils_1.extractSupportProps)(rest), (0, utils_2.extractFieldDecoratorProps)(props), {
     validationState: fieldValidationState,
+    ref: decoratorRef,
     children: (0, jsx_runtime_1.jsx)(list_1.Droplist, Object.assign({}, (0, utils_3.extractListProps)(props), {
       items: result,
       triggerElemRef: localRef,

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

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

package/dist/cjs/components/FieldSelect/FieldSelectSingle.js

@@ -65,9 +65,10 @@ exports.FieldSelectSingle = (0, react_1.forwardRef)((props, ref) => {
       onOpenChange,
       selectedOptionFormatter = defaultSelectedOptionFormatter,
       enableFuzzySearch = true,
-      onCopyButtonClick
+      onCopyButtonClick,
+      decoratorRef
     } = props,
-    rest = __rest(props, ["id", "name", "placeholder", "size", "options", "value", "defaultValue", "onChange", "disabled", "readonly", "searchable", "showCopyButton", "showClearButton", "onKeyDown", "required", "validationState", "search", "autocomplete", "prefixIcon", "prefix", "postfix", "addOptionByEnter", "untouchableScrollbars", "open", "onOpenChange", "selectedOptionFormatter", "enableFuzzySearch", "onCopyButtonClick"]);
+    rest = __rest(props, ["id", "name", "placeholder", "size", "options", "value", "defaultValue", "onChange", "disabled", "readonly", "searchable", "showCopyButton", "showClearButton", "onKeyDown", "required", "validationState", "search", "autocomplete", "prefixIcon", "prefix", "postfix", "addOptionByEnter", "untouchableScrollbars", "open", "onOpenChange", "selectedOptionFormatter", "enableFuzzySearch", "onCopyButtonClick", "decoratorRef"]);
   const localRef = (0, react_1.useRef)(null);
   const [open = false, setOpen] = (0, hooks_1.useValueControl)({
     value: openProp,
@@ -211,6 +212,7 @@ exports.FieldSelectSingle = (0, react_1.forwardRef)((props, ref) => {
   });
   return (0, jsx_runtime_1.jsx)(FieldDecorator_1.FieldDecorator, Object.assign({}, (0, utils_1.extractSupportProps)(rest), (0, utils_2.extractFieldDecoratorProps)(props), {
     validationState: fieldValidationState,
+    ref: decoratorRef,
     children: (0, jsx_runtime_1.jsx)(list_1.Droplist, Object.assign({}, (0, utils_3.extractListProps)(props), {
       items: result,
       selection: {

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

@@ -1,4 +1,4 @@
-import { ReactElement, ReactNode } from 'react';
+import { ForwardedRef, ReactElement, ReactNode } from 'react';
 import { InputPrivateProps } from '@snack-uikit/input-private';
 import { AccordionItemProps, BaseItemProps, DroplistProps, GroupItemProps, ItemContentProps, NextListItemProps, SelectionMultipleState, SelectionSingleState } from '@snack-uikit/list';
 import { TagProps } from '@snack-uikit/tag';
@@ -72,6 +72,8 @@ type FiledSelectCommonProps = WithSupportProps<{
     resetSearchOnOptionSelection?: boolean;
     onOpenChange?(open: boolean): void;
     selectedOptionFormatter?: SelectedOptionFormatter;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 }> & Pick<DroplistProps, 'dataError' | 'noDataState' | 'noResultsState' | 'errorDataState' | 'dataFiltered' | 'untouchableScrollbars' | 'scrollToSelectedItem'>;
 export type FieldSelectSingleProps = FieldSelectPrivateProps & Omit<SelectionSingleState, 'mode'> & WrapperProps & Omit<FiledSelectCommonProps, 'resetSearchOnOptionSelection'>;
 export type FieldSelectMultipleProps = FieldSelectPrivateProps & {

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

@@ -1,4 +1,4 @@
-import { ReactElement, ReactNode } from 'react';
+import { ForwardedRef, ReactElement, ReactNode } from 'react';
 import { InputPrivateProps } from '@snack-uikit/input-private';
 import { SliderProps as SliderComponentProps } from '@snack-uikit/slider';
 import { WithSupportProps } from '@snack-uikit/utils';
@@ -19,6 +19,8 @@ type FieldSliderOwnProps = {
     prefix?: ReactNode;
     /** Произвольный постфикс для поля */
     postfix?: ReactNode;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 };
 export type FieldSliderProps = WithSupportProps<FieldSliderOwnProps & SliderProps & WrapperProps>;
 export declare const FieldSlider: import("react").ForwardRefExoticComponent<{

package/dist/cjs/components/FieldSlider/FieldSlider.js

@@ -67,9 +67,10 @@ exports.FieldSlider = (0, react_1.forwardRef)((_a, ref) => {
       unbindInputFromMarks,
       postfixIcon,
       prefix,
-      postfix
+      postfix,
+      decoratorRef
     } = _a,
-    rest = __rest(_a, ["id", "name", "min", "max", "step", "marks", "showScaleBar", "value", "range", "disabled", "readonly", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "textInputFormatter", "unbindInputFromMarks", "postfixIcon", "prefix", "postfix"]);
+    rest = __rest(_a, ["id", "name", "min", "max", "step", "marks", "showScaleBar", "value", "range", "disabled", "readonly", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "textInputFormatter", "unbindInputFromMarks", "postfixIcon", "prefix", "postfix", "decoratorRef"]);
   const [value = getDefaultValue(range, min, max, valueProp), onChange] = (0, hooks_1.useValueControl)({
     value: valueProp,
     defaultValue: getDefaultValue(range, min, max, valueProp),
@@ -209,7 +210,8 @@ exports.FieldSlider = (0, react_1.forwardRef)((_a, ref) => {
     hint: hint,
     showHintIcon: showHintIcon,
     readonly: readonly,
-    size: size
+    size: size,
+    ref: decoratorRef
   }, (0, utils_1.extractSupportProps)(rest), {
     children: [(0, jsx_runtime_1.jsx)(helperComponents_1.FieldContainerPrivate, {
       className: styles_module_scss_1.default.fieldContainer,

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

@@ -1,4 +1,4 @@
-import { ChangeEvent, ReactNode } from 'react';
+import { ChangeEvent, ForwardedRef, ReactNode } from 'react';
 import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
 import { FieldDecoratorProps } from '../FieldDecorator';
@@ -17,6 +17,8 @@ type FieldStepperOwnProps = {
     prefix?: ReactNode;
     /** Произвольный постфикс для поля */
     postfix?: ReactNode;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 };
 export type FieldStepperProps = WithSupportProps<FieldStepperOwnProps & InputProps & WrapperProps>;
 export declare const FieldStepper: import("react").ForwardRefExoticComponent<{

package/dist/cjs/components/FieldStepper/FieldStepper.js

@@ -74,9 +74,10 @@ exports.FieldStepper = (0, react_1.forwardRef)((_a, ref) => {
       validationState = constants_1.VALIDATION_STATE.Default,
       error,
       prefix,
-      postfix
+      postfix,
+      decoratorRef
     } = _a,
-    rest = __rest(_a, ["id", "name", "value", "min", "max", "step", "disabled", "readonly", "allowMoreThanLimits", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "validationState", "error", "prefix", "postfix"]);
+    rest = __rest(_a, ["id", "name", "value", "min", "max", "step", "disabled", "readonly", "allowMoreThanLimits", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "size", "validationState", "error", "prefix", "postfix", "decoratorRef"]);
   const {
     t
   } = (0, locale_1.useLocale)('Fields');
@@ -173,7 +174,8 @@ exports.FieldStepper = (0, react_1.forwardRef)((_a, ref) => {
     showHintIcon: showHintIcon,
     size: size,
     validationState: fieldValidationState,
-    error: error
+    error: error,
+    ref: decoratorRef
   }, (0, utils_1.extractSupportProps)(rest), {
     children: (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, {
       tip: tooltip,

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

@@ -1,4 +1,4 @@
-import { ReactElement, ReactNode } from 'react';
+import { ForwardedRef, ReactElement, ReactNode } from 'react';
 import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
 import { Button } from '../../types';
@@ -25,6 +25,8 @@ type FieldTextOwnProps = {
     postfix?: ReactNode;
     /** Кнопка действия внутри поля */
     button?: Button;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 };
 export type FieldTextProps = WithSupportProps<FieldTextOwnProps & InputProps & WrapperProps>;
 export declare const FieldText: import("react").ForwardRefExoticComponent<{

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

@@ -61,9 +61,10 @@ exports.FieldText = (0, react_1.forwardRef)((_a, ref) => {
       postfix,
       button: buttonProp,
       onPaste,
-      onKeyDown
+      onKeyDown,
+      decoratorRef
     } = _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"]);
+    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", "decoratorRef"]);
   const [value = '', onChange] = (0, hooks_1.useValueControl)({
     value: valueProp,
     defaultValue: '',
@@ -178,7 +179,8 @@ exports.FieldText = (0, react_1.forwardRef)((_a, ref) => {
     showHintIcon: showHintIcon,
     size: size,
     validationState: fieldValidationState,
-    error: error
+    error: error,
+    ref: decoratorRef
   }, (0, utils_1.extractSupportProps)(rest), {
     children: (0, jsx_runtime_1.jsx)(helperComponents_1.FieldContainerPrivate, {
       size: size,

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

@@ -1,4 +1,4 @@
-import { ChangeEvent } from 'react';
+import { ChangeEvent, ForwardedRef } from 'react';
 import { WithSupportProps } from '@snack-uikit/utils';
 import { TextAreaProps } from '../../helperComponents';
 import { FieldDecoratorProps } from '../FieldDecorator';
@@ -24,6 +24,8 @@ type FieldTextAreaOwnProps = {
     showClearButton?: boolean;
     /** Можно ли вводить больше разрешённого кол-ва символов */
     allowMoreThanMaxLength?: boolean;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 };
 export type FieldTextAreaProps = WithSupportProps<FieldTextAreaOwnProps & InputProps & WrapperProps>;
 export declare const FieldTextArea: import("react").ForwardRefExoticComponent<{

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

@@ -58,9 +58,10 @@ exports.FieldTextArea = (0, react_1.forwardRef)((_a, ref) => {
       error,
       size = input_private_1.SIZE.S,
       validationState = constants_1.VALIDATION_STATE.Default,
-      onCopyButtonClick
+      onCopyButtonClick,
+      decoratorRef
     } = _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", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "error", "size", "validationState", "onCopyButtonClick", "decoratorRef"]);
   const localRef = (0, react_1.useRef)(null);
   const clearButtonRef = (0, react_1.useRef)(null);
   const copyButtonRef = (0, react_1.useRef)(null);
@@ -124,7 +125,8 @@ exports.FieldTextArea = (0, react_1.forwardRef)((_a, ref) => {
     showHintIcon: showHintIcon,
     size: size,
     error: error,
-    validationState: fieldValidationState
+    validationState: fieldValidationState,
+    ref: decoratorRef
   }, (0, utils_1.extractSupportProps)(rest), {
     children: (0, jsx_runtime_1.jsx)(helperComponents_1.FieldContainerPrivate, {
       className: styles_module_scss_1.default.container,

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

@@ -1,3 +1,4 @@
+import { ForwardedRef } from 'react';
 import { TimePickerProps } from '@snack-uikit/calendar';
 import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
@@ -24,6 +25,8 @@ type FieldTimeOwnProps = {
      * @default true
      */
     showClearButton?: boolean;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 };
 export type FieldTimeProps = WithSupportProps<FieldTimeOwnProps & InputProps & WrapperProps>;
 export declare const FieldTime: import("react").ForwardRefExoticComponent<{

package/dist/cjs/components/FieldTime/FieldTime.js

@@ -77,9 +77,10 @@ exports.FieldTime = (0, react_1.forwardRef)((_a, ref) => {
       size = input_private_1.SIZE.S,
       validationState = constants_1.VALIDATION_STATE.Default,
       error,
-      onCopyButtonClick
+      onCopyButtonClick,
+      decoratorRef
     } = _a,
-    rest = __rest(_a, ["id", "name", "value", "disabled", "readonly", "showCopyButton", "showClearButton", "open", "onOpenChange", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "showSeconds", "size", "validationState", "error", "onCopyButtonClick"]);
+    rest = __rest(_a, ["id", "name", "value", "disabled", "readonly", "showCopyButton", "showClearButton", "open", "onOpenChange", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "caption", "hint", "showHintIcon", "showSeconds", "size", "validationState", "error", "onCopyButtonClick", "decoratorRef"]);
   const [isOpen, setIsOpen] = (0, uncontrollable_1.useUncontrolledProp)(open, false, onOpenChange);
   const localRef = (0, react_1.useRef)(null);
   const clearButtonRef = (0, react_1.useRef)(null);
@@ -243,7 +244,8 @@ exports.FieldTime = (0, react_1.forwardRef)((_a, ref) => {
     showHintIcon: showHintIcon,
     size: size,
     error: error,
-    validationState: fieldValidationState
+    validationState: fieldValidationState,
+    ref: decoratorRef
   }, (0, utils_1.extractSupportProps)(rest), {
     children: (0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({
       trigger: 'click',

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

package/dist/cjs/helperComponents/ButtonFieldList/ButtonFieldList.js

@@ -29,9 +29,10 @@ exports.ButtonFieldList = (0, react_1.forwardRef)((_a, ref) => {
       items,
       selection,
       open,
-      onOpenChange
+      onOpenChange,
+      search
     } = _a,
-    rest = __rest(_a, ["items", "selection", "open", "onOpenChange"]);
+    rest = __rest(_a, ["items", "selection", "open", "onOpenChange", "search"]);
   const [isOpen, setIsOpen] = (0, uncontrollable_1.useUncontrolledProp)(open, false, onOpenChange);
   const placement = (0, helpers_1.getPlacement)(rest);
   return (0, jsx_runtime_1.jsx)(list_1.Droplist, {
@@ -43,6 +44,7 @@ exports.ButtonFieldList = (0, react_1.forwardRef)((_a, ref) => {
     open: isOpen,
     onOpenChange: setIsOpen,
     closeDroplistOnItemClick: true,
+    search: search,
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     // @ts-ignore
     triggerElemRef: ref,

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

@@ -9,7 +9,7 @@ export type AsyncValueRequest = Promise<{
     success: boolean;
     value?: string;
 }>;
-export type NativeDroplistProps = Pick<DroplistProps, 'items' | 'open' | 'onOpenChange'> & {
+export type NativeDroplistProps = Pick<DroplistProps, 'items' | 'open' | 'onOpenChange' | 'search'> & {
     selection?: Omit<SelectionSingleState, 'mode'>;
 };
 export type Button = Omit<NativeDroplistProps, 'items'> & {

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

@@ -1,3 +1,4 @@
+import { ForwardedRef } from 'react';
 import { ColorPickerProps } from '@snack-uikit/color-picker';
 import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
@@ -20,6 +21,8 @@ type FieldDateOwnProps = {
     showClearButton?: boolean;
     value?: string;
     onChange?(value: string): void;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 } & Omit<ColorPickerProps, 'onChange' | 'value'>;
 export type FieldColorProps = WithSupportProps<FieldDateOwnProps & InputProps & WrapperProps>;
 export declare const FieldColor: import("react").ForwardRefExoticComponent<{
@@ -40,5 +43,7 @@ export declare const FieldColor: import("react").ForwardRefExoticComponent<{
     showClearButton?: boolean;
     value?: string;
     onChange?(value: string): void;
+    /** Ref для корневой обертки компонента */
+    decoratorRef?: ForwardedRef<HTMLDivElement>;
 } & Omit<ColorPickerProps, "value" | "onChange"> & InputProps & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};