@snack-uikit/fields 0.46.0 → 0.47.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# 0.47.0 (2025-05-27)
+
+
+### Features
+
+* **PDS-2255:** extend button prefix props ([ee14165](https://github.com/cloud-ru-tech/snack-uikit/commit/ee14165a43d23faf09106434072df85faeaae3c1))
+
+
+
+
+
 # 0.46.0 (2025-05-26)
 
 

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, "value" | "onChange"> & InputProps & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & Omit<ColorPickerProps, "onChange" | "value"> & 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>, "value" | "onChange"> & Pick<InputPrivateProps, "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly" | "placeholder" | "autoComplete" | "maxLength"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & 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>>;
 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, "scrollToSelectedItem" | "virtualized" | "untouchableScrollbars" | "dataFiltered" | "dataError" | "noDataState" | "noResultsState" | "errorDataState">, "showCopyButton" | "onCopyButtonClick"> & import("react").RefAttributes<HTMLInputElement>>;
+} & Pick<import("@snack-uikit/list").DroplistProps, "untouchableScrollbars" | "dataError" | "dataFiltered" | "scrollToSelectedItem" | "virtualized" | "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, "scrollToSelectedItem" | "virtualized" | "untouchableScrollbars" | "dataFiltered" | "dataError" | "noDataState" | "noResultsState" | "errorDataState"> & import("react").RefAttributes<HTMLInputElement>>;
+} & Pick<import("@snack-uikit/list").DroplistProps, "untouchableScrollbars" | "dataError" | "dataFiltered" | "scrollToSelectedItem" | "virtualized" | "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, "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly"> & Pick<SliderComponentProps, "value" | "onChange" | "range" | "tipFormatter"> & Required<Pick<SliderComponentProps, "max" | "min" | "step" | "marks">> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & 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>>;
 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>, "value" | "onChange"> & Pick<InputPrivateProps, "onKeyDown" | "onFocus" | "onBlur" | "id" | "disabled" | "name" | "onPaste" | "readonly" | "placeholder" | "autoComplete" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & import("react").AriaAttributes & FieldTextOwnProps & Pick<Partial<InputPrivateProps>, "onChange" | "value"> & Pick<InputPrivateProps, "id" | "name" | "onPaste" | "onFocus" | "onBlur" | "onKeyDown" | "disabled" | "readonly" | "placeholder" | "autoComplete" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

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

@@ -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, "onKeyDown" | "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly" | "placeholder" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+} & import("react").AriaAttributes & FieldTextAreaOwnProps & Pick<Partial<TextAreaProps>, "value"> & Pick<TextAreaProps, "id" | "name" | "onFocus" | "onBlur" | "onKeyDown" | "disabled" | "readonly" | "placeholder" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>>;
 export {};

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

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

@@ -0,0 +1,2 @@
+export * from './usePostfixButton';
+export * from './usePrefixButton';

package/dist/cjs/hooks/addonButton/index.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var __createBinding = void 0 && (void 0).__createBinding || (Object.create ? function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  var desc = Object.getOwnPropertyDescriptor(m, k);
+  if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+    desc = {
+      enumerable: true,
+      get: function () {
+        return m[k];
+      }
+    };
+  }
+  Object.defineProperty(o, k2, desc);
+} : function (o, m, k, k2) {
+  if (k2 === undefined) k2 = k;
+  o[k2] = m[k];
+});
+var __exportStar = void 0 && (void 0).__exportStar || function (m, exports) {
+  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+__exportStar(require("./usePostfixButton"), exports);
+__exportStar(require("./usePrefixButton"), exports);

package/dist/cjs/hooks/addonButton/useAddonButton.d.ts

@@ -0,0 +1,14 @@
+import { ReactElement } from 'react';
+import { ButtonProps, Size } from '@snack-uikit/input-private';
+import { ButtonFieldProps } from '../../helperComponents';
+import { Button, ButtonVariant } from '../../types';
+export type UseAddonProps = {
+    button?: Button;
+    size: Size;
+    icon?: ReactElement;
+    disabled?: boolean;
+    readonly?: boolean;
+    variant: ButtonVariant;
+    type: 'prefix' | 'postfix';
+} & Pick<ButtonFieldProps, 'onFocus' | 'onBlur'>;
+export declare function useAddonButton({ variant, button, icon, size, disabled, readonly, type, onFocus, onBlur, }: UseAddonProps): ButtonProps;

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

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

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

@@ -0,0 +1,6 @@
+import { ReactElement } from 'react';
+import { ButtonProps } from '@snack-uikit/input-private';
+import { UseAddonProps } from './useAddonButton';
+export declare function usePostfixButton({ postfixIcon, ...props }: Omit<UseAddonProps, 'type' | 'variant'> & {
+    postfixIcon?: ReactElement;
+}): ButtonProps;

package/dist/cjs/hooks/addonButton/usePostfixButton.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePostfixButton = usePostfixButton;
+const useAddonButton_1 = require("./useAddonButton");
+function usePostfixButton(_a) {
+  var {
+      postfixIcon
+    } = _a,
+    props = __rest(_a, ["postfixIcon"]);
+  return (0, useAddonButton_1.useAddonButton)(Object.assign(Object.assign({}, props), {
+    icon: postfixIcon,
+    type: 'postfix',
+    variant: 'after'
+  }));
+}

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

@@ -0,0 +1,6 @@
+import { ReactElement } from 'react';
+import { ButtonProps } from '@snack-uikit/input-private';
+import { UseAddonProps } from './useAddonButton';
+export declare function usePrefixButton({ prefixIcon, ...props }: Omit<UseAddonProps, 'type' | 'variant'> & {
+    prefixIcon?: ReactElement;
+}): ButtonProps;

package/dist/cjs/hooks/addonButton/usePrefixButton.js

@@ -0,0 +1,26 @@
+"use strict";
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePrefixButton = usePrefixButton;
+const useAddonButton_1 = require("./useAddonButton");
+function usePrefixButton(_a) {
+  var {
+      prefixIcon
+    } = _a,
+    props = __rest(_a, ["prefixIcon"]);
+  return (0, useAddonButton_1.useAddonButton)(Object.assign(Object.assign({}, props), {
+    icon: prefixIcon,
+    type: 'prefix',
+    variant: 'before'
+  }));
+}

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

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

package/dist/cjs/hooks/index.js

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

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

@@ -2,6 +2,7 @@ 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>;
@@ -12,8 +13,12 @@ export type AsyncValueRequest = Promise<{
 export type NativeDroplistProps = Pick<DroplistProps, 'items' | 'open' | 'onOpenChange' | 'search' | 'scroll'> & {
     selection?: Omit<SelectionSingleState, 'mode'>;
 };
-export type Button = Omit<NativeDroplistProps, 'items'> & {
-    variant: ButtonVariant;
-    content?: ReactNode;
+export type Button = Omit<NativeDroplistProps, 'items'> & Pick<ButtonFieldProps, 'variant' | 'content'> & ({
     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, "value" | "onChange"> & InputProps & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & Omit<ColorPickerProps, "onChange" | "value"> & 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>, "value" | "onChange"> & Pick<InputPrivateProps, "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly" | "placeholder" | "autoComplete" | "maxLength"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & 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>>;
 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, "scrollToSelectedItem" | "virtualized" | "untouchableScrollbars" | "dataFiltered" | "dataError" | "noDataState" | "noResultsState" | "errorDataState">, "showCopyButton" | "onCopyButtonClick"> & import("react").RefAttributes<HTMLInputElement>>;
+} & Pick<import("@snack-uikit/list").DroplistProps, "untouchableScrollbars" | "dataError" | "dataFiltered" | "scrollToSelectedItem" | "virtualized" | "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, "scrollToSelectedItem" | "virtualized" | "untouchableScrollbars" | "dataFiltered" | "dataError" | "noDataState" | "noResultsState" | "errorDataState"> & import("react").RefAttributes<HTMLInputElement>>;
+} & Pick<import("@snack-uikit/list").DroplistProps, "untouchableScrollbars" | "dataError" | "dataFiltered" | "scrollToSelectedItem" | "virtualized" | "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, "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly"> & Pick<SliderComponentProps, "value" | "onChange" | "range" | "tipFormatter"> & Required<Pick<SliderComponentProps, "max" | "min" | "step" | "marks">> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & 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>>;
 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>, "value" | "onChange"> & Pick<InputPrivateProps, "onKeyDown" | "onFocus" | "onBlur" | "id" | "disabled" | "name" | "onPaste" | "readonly" | "placeholder" | "autoComplete" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
+} & import("react").AriaAttributes & FieldTextOwnProps & Pick<Partial<InputPrivateProps>, "onChange" | "value"> & Pick<InputPrivateProps, "id" | "name" | "onPaste" | "onFocus" | "onBlur" | "onKeyDown" | "disabled" | "readonly" | "placeholder" | "autoComplete" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

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

@@ -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, "onKeyDown" | "onFocus" | "onBlur" | "id" | "disabled" | "name" | "readonly" | "placeholder" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+} & import("react").AriaAttributes & FieldTextAreaOwnProps & Pick<Partial<TextAreaProps>, "value"> & Pick<TextAreaProps, "id" | "name" | "onFocus" | "onBlur" | "onKeyDown" | "disabled" | "readonly" | "placeholder" | "maxLength" | "spellCheck"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>>;
 export {};

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

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

@@ -0,0 +1,2 @@
+export * from './usePostfixButton';
+export * from './usePrefixButton';

package/dist/esm/hooks/addonButton/index.js

@@ -0,0 +1,2 @@
+export * from './usePostfixButton';
+export * from './usePrefixButton';

package/dist/esm/hooks/addonButton/useAddonButton.d.ts

@@ -0,0 +1,14 @@
+import { ReactElement } from 'react';
+import { ButtonProps, Size } from '@snack-uikit/input-private';
+import { ButtonFieldProps } from '../../helperComponents';
+import { Button, ButtonVariant } from '../../types';
+export type UseAddonProps = {
+    button?: Button;
+    size: Size;
+    icon?: ReactElement;
+    disabled?: boolean;
+    readonly?: boolean;
+    variant: ButtonVariant;
+    type: 'prefix' | 'postfix';
+} & Pick<ButtonFieldProps, 'onFocus' | 'onBlur'>;
+export declare function useAddonButton({ variant, button, icon, size, disabled, readonly, type, onFocus, onBlur, }: UseAddonProps): ButtonProps;

package/dist/esm/hooks/addonButton/useAddonButton.js

@@ -0,0 +1,30 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { useMemo, useRef } from 'react';
+import { ButtonField, ButtonFieldList } from '../../helperComponents';
+export function useAddonButton({ variant, button, icon, size, disabled, readonly, type, onFocus, onBlur, }) {
+    const buttonListRef = useRef(null);
+    const addonIconProps = useMemo(() => ({
+        id: `${type}Icon`,
+        active: false,
+        show: Boolean(icon && !button),
+        render: () => _jsx(_Fragment, { children: icon }),
+    }), [button, icon, type]);
+    const addonButtonProps = useMemo(() => ({
+        id: `${type}Button`,
+        active: false,
+        show: Boolean(button && button.variant === variant),
+        render: renderProps => {
+            const buttonProps = Object.assign(Object.assign({}, renderProps), { variant,
+                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 (_jsx(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 })));
+            }
+            const buttonField = _jsx(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;
+        },
+    }), [type, button, variant, size, disabled, readonly, onFocus, onBlur]);
+    return button ? addonButtonProps : addonIconProps;
+}

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

@@ -0,0 +1,6 @@
+import { ReactElement } from 'react';
+import { ButtonProps } from '@snack-uikit/input-private';
+import { UseAddonProps } from './useAddonButton';
+export declare function usePostfixButton({ postfixIcon, ...props }: Omit<UseAddonProps, 'type' | 'variant'> & {
+    postfixIcon?: ReactElement;
+}): ButtonProps;

package/dist/esm/hooks/addonButton/usePostfixButton.js

@@ -0,0 +1,16 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { useAddonButton } from './useAddonButton';
+export function usePostfixButton(_a) {
+    var { postfixIcon } = _a, props = __rest(_a, ["postfixIcon"]);
+    return useAddonButton(Object.assign(Object.assign({}, props), { icon: postfixIcon, type: 'postfix', variant: 'after' }));
+}

package/dist/esm/hooks/addonButton/usePrefixButton.d.ts

@@ -0,0 +1,6 @@
+import { ReactElement } from 'react';
+import { ButtonProps } from '@snack-uikit/input-private';
+import { UseAddonProps } from './useAddonButton';
+export declare function usePrefixButton({ prefixIcon, ...props }: Omit<UseAddonProps, 'type' | 'variant'> & {
+    prefixIcon?: ReactElement;
+}): ButtonProps;

package/dist/esm/hooks/addonButton/usePrefixButton.js

@@ -0,0 +1,16 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { useAddonButton } from './useAddonButton';
+export function usePrefixButton(_a) {
+    var { prefixIcon } = _a, props = __rest(_a, ["prefixIcon"]);
+    return useAddonButton(Object.assign(Object.assign({}, props), { icon: prefixIcon, type: 'prefix', variant: 'before' }));
+}

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

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

package/dist/esm/hooks/index.js

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

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

@@ -2,6 +2,7 @@ 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>;
@@ -12,8 +13,12 @@ export type AsyncValueRequest = Promise<{
 export type NativeDroplistProps = Pick<DroplistProps, 'items' | 'open' | 'onOpenChange' | 'search' | 'scroll'> & {
     selection?: Omit<SelectionSingleState, 'mode'>;
 };
-export type Button = Omit<NativeDroplistProps, 'items'> & {
-    variant: ButtonVariant;
-    content?: ReactNode;
+export type Button = Omit<NativeDroplistProps, 'items'> & Pick<ButtonFieldProps, 'variant' | 'content'> & ({
     items?: DroplistProps['items'];
-};
+    hasArrow?: never;
+    arrowOpen?: never;
+    wrapper?: never;
+} | (Pick<ButtonFieldProps, 'hasArrow' | 'arrowOpen'> & {
+    items?: never;
+    wrapper?: (button: ReactNode) => JSX.Element;
+}));

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Fields",
-  "version": "0.46.0",
+  "version": "0.47.0",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -65,5 +65,5 @@
   "peerDependencies": {
     "@snack-uikit/locale": "*"
   },
-  "gitHead": "26339d9278602025de86964e817a842e97e69d94"
+  "gitHead": "ccea2a8bfe66ef6b5e55747de61d55fe7a2368f7"
 }

package/src/hooks/addonButton/index.ts

@@ -0,0 +1,2 @@
+export * from './usePostfixButton';
+export * from './usePrefixButton';

package/src/hooks/{usePostfixButton.tsx → addonButton/useAddonButton.tsx}

@@ -2,45 +2,51 @@ import { ReactElement, useMemo, useRef } from 'react';
 
 import { ButtonProps, InactiveItem, Size } from '@snack-uikit/input-private';
 
-import { ButtonField, ButtonFieldList, ButtonFieldProps } from '../helperComponents';
-import { Button } from '../types';
+import { ButtonField, ButtonFieldList, ButtonFieldProps } from '../../helperComponents';
+import { Button, ButtonVariant } from '../../types';
 
-export function usePostfixButton({
+export type UseAddonProps = {
+  button?: Button;
+  size: Size;
+  icon?: ReactElement;
+  disabled?: boolean;
+  readonly?: boolean;
+  variant: ButtonVariant;
+  type: 'prefix' | 'postfix';
+} & Pick<ButtonFieldProps, 'onFocus' | 'onBlur'>;
+
+export function useAddonButton({
+  variant,
   button,
+  icon,
   size,
-  postfixIcon,
   disabled,
   readonly,
+  type,
   onFocus,
   onBlur,
-}: {
-  button?: Button;
-  size: Size;
-  postfixIcon?: ReactElement;
-  disabled?: boolean;
-  readonly?: boolean;
-} & Pick<ButtonFieldProps, 'onFocus' | 'onBlur'>): ButtonProps {
+}: UseAddonProps): ButtonProps {
   const buttonListRef = useRef<HTMLButtonElement>(null);
 
-  const postfixIconProps: InactiveItem = useMemo(
+  const addonIconProps: InactiveItem = useMemo(
     () => ({
-      id: 'postfixIcon',
+      id: `${type}Icon`,
       active: false,
-      show: Boolean(postfixIcon && !button),
-      render: () => <>{postfixIcon}</>,
+      show: Boolean(icon && !button),
+      render: () => <>{icon}</>,
     }),
-    [button, postfixIcon],
+    [button, icon, type],
   );
 
-  const postfixButtonProps: InactiveItem = useMemo(
+  const addonButtonProps: InactiveItem = useMemo(
     () => ({
-      id: 'postfixButton',
+      id: `${type}Button`,
       active: false,
-      show: Boolean(button && button.variant === 'after'),
+      show: Boolean(button && button.variant === variant),
       render: renderProps => {
         const buttonProps: ButtonFieldProps = {
           ...renderProps,
-          variant: 'after',
+          variant,
           size,
           content: button?.content,
           disabled: disabled || readonly,
@@ -66,11 +72,12 @@ export function usePostfixButton({
           );
         }
 
-        return <ButtonField {...buttonProps} />;
+        const buttonField = <ButtonField {...buttonProps} hasArrow={button?.hasArrow} arrowOpen={button?.arrowOpen} />;
+        return button?.wrapper ? button.wrapper(buttonField) : buttonField;
       },
     }),
-    [button, size, disabled, readonly, onFocus, onBlur],
+    [type, button, variant, size, disabled, readonly, onFocus, onBlur],
   );
 
-  return button ? postfixButtonProps : postfixIconProps;
+  return button ? addonButtonProps : addonIconProps;
 }

package/src/hooks/addonButton/usePostfixButton.tsx

@@ -0,0 +1,12 @@
+import { ReactElement } from 'react';
+
+import { ButtonProps } from '@snack-uikit/input-private';
+
+import { useAddonButton, UseAddonProps } from './useAddonButton';
+
+export function usePostfixButton({
+  postfixIcon,
+  ...props
+}: Omit<UseAddonProps, 'type' | 'variant'> & { postfixIcon?: ReactElement }): ButtonProps {
+  return useAddonButton({ ...props, icon: postfixIcon, type: 'postfix', variant: 'after' });
+}

package/src/hooks/addonButton/usePrefixButton.tsx

@@ -0,0 +1,12 @@
+import { ReactElement } from 'react';
+
+import { ButtonProps } from '@snack-uikit/input-private';
+
+import { useAddonButton, UseAddonProps } from './useAddonButton';
+
+export function usePrefixButton({
+  prefixIcon,
+  ...props
+}: Omit<UseAddonProps, 'type' | 'variant'> & { prefixIcon?: ReactElement }): ButtonProps {
+  return useAddonButton({ ...props, icon: prefixIcon, type: 'prefix', variant: 'before' });
+}

package/src/hooks/index.ts

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

package/src/types/allFields.ts

@@ -4,6 +4,7 @@ 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>;
 
@@ -17,8 +18,17 @@ export type NativeDroplistProps = Pick<DroplistProps, 'items' | 'open' | 'onOpen
   selection?: Omit<SelectionSingleState, 'mode'>;
 };
 
-export type Button = Omit<NativeDroplistProps, 'items'> & {
-  variant: ButtonVariant;
-  content?: ReactNode;
-  items?: DroplistProps['items'];
-};
+export type Button = Omit<NativeDroplistProps, 'items'> &
+  Pick<ButtonFieldProps, 'variant' | 'content'> &
+  (
+    | {
+        items?: DroplistProps['items'];
+        hasArrow?: never;
+        arrowOpen?: never;
+        wrapper?: never;
+      }
+    | (Pick<ButtonFieldProps, 'hasArrow' | 'arrowOpen'> & {
+        items?: never;
+        wrapper?: (button: ReactNode) => JSX.Element;
+      })
+  );

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

@@ -1,11 +0,0 @@
-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/usePrefixButton.d.ts

@@ -1,11 +0,0 @@
-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

@@ -1,63 +0,0 @@
-"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/esm/hooks/usePostfixButton.d.ts

@@ -1,11 +0,0 @@
-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/esm/hooks/usePostfixButton.js

@@ -1,28 +0,0 @@
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import { useMemo, useRef } from 'react';
-import { ButtonField, ButtonFieldList } from '../helperComponents';
-export function usePostfixButton({ button, size, postfixIcon, disabled, readonly, onFocus, onBlur, }) {
-    const buttonListRef = useRef(null);
-    const postfixIconProps = useMemo(() => ({
-        id: 'postfixIcon',
-        active: false,
-        show: Boolean(postfixIcon && !button),
-        render: () => _jsx(_Fragment, { children: postfixIcon }),
-    }), [button, postfixIcon]);
-    const postfixButtonProps = useMemo(() => ({
-        id: 'postfixButton',
-        active: false,
-        show: Boolean(button && button.variant === 'after'),
-        render: renderProps => {
-            const buttonProps = Object.assign(Object.assign({}, renderProps), { variant: 'after', 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 (_jsx(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 _jsx(ButtonField, Object.assign({}, buttonProps));
-        },
-    }), [button, size, disabled, readonly, onFocus, onBlur]);
-    return button ? postfixButtonProps : postfixIconProps;
-}

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

@@ -1,11 +0,0 @@
-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/esm/hooks/usePrefixButton.js

@@ -1,28 +0,0 @@
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import { useMemo, useRef } from 'react';
-import { ButtonField, ButtonFieldList } from '../helperComponents';
-export function usePrefixButton({ button, prefixIcon, size, disabled, readonly, onFocus, onBlur, }) {
-    const buttonListRef = useRef(null);
-    const prefixIconProps = useMemo(() => ({
-        id: 'prefixIcon',
-        active: false,
-        show: Boolean(prefixIcon && !button),
-        render: () => _jsx(_Fragment, { children: prefixIcon }),
-    }), [button, prefixIcon]);
-    const prefixButtonProps = 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 (_jsx(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 _jsx(ButtonField, Object.assign({}, buttonProps));
-        },
-    }), [button, size, disabled, readonly, onFocus, onBlur]);
-    return button ? prefixButtonProps : prefixIconProps;
-}

package/src/hooks/usePrefixButton.tsx

@@ -1,76 +0,0 @@
-import { ReactElement, useMemo, useRef } from 'react';
-
-import { ButtonProps, InactiveItem, Size } from '@snack-uikit/input-private';
-
-import { ButtonField, ButtonFieldList, ButtonFieldProps } from '../helperComponents';
-import { Button } from '../types';
-
-export function usePrefixButton({
-  button,
-  prefixIcon,
-  size,
-  disabled,
-  readonly,
-  onFocus,
-  onBlur,
-}: {
-  button?: Button;
-  prefixIcon?: ReactElement;
-  size: Size;
-  disabled?: boolean;
-  readonly?: boolean;
-} & Pick<ButtonFieldProps, 'onFocus' | 'onBlur'>): ButtonProps {
-  const buttonListRef = useRef<HTMLButtonElement>(null);
-
-  const prefixIconProps: InactiveItem = useMemo(
-    () => ({
-      id: 'prefixIcon',
-      active: false,
-      show: Boolean(prefixIcon && !button),
-      render: () => <>{prefixIcon}</>,
-    }),
-    [button, prefixIcon],
-  );
-
-  const prefixButtonProps: InactiveItem = useMemo(
-    () => ({
-      id: 'prefixButton',
-      active: false,
-      show: Boolean(button && button.variant === 'before'),
-      render: renderProps => {
-        const buttonProps: ButtonFieldProps = {
-          ...renderProps,
-          variant: 'before',
-          size,
-          content: button?.content,
-          disabled: disabled || readonly,
-          onFocus,
-          onBlur,
-        };
-
-        if (button?.items) {
-          return (
-            <ButtonFieldList
-              {...buttonProps}
-              ref={buttonListRef}
-              onClick={() => {
-                setTimeout(() => buttonListRef.current?.focus(), 0);
-              }}
-              search={button.search}
-              items={button.items}
-              selection={button.selection}
-              open={button.open}
-              scroll={button.scroll}
-              onOpenChange={button.onOpenChange}
-            />
-          );
-        }
-
-        return <ButtonField {...buttonProps} />;
-      },
-    }),
-    [button, size, disabled, readonly, onFocus, onBlur],
-  );
-
-  return button ? prefixButtonProps : prefixIconProps;
-}