@snack-uikit/fields 0.9.2 → 0.10.0

package/dist/components/FieldSelect/FieldSelectMulti.js

@@ -12,14 +12,13 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useCallback, useMemo, useRef, useState } from 'react';
 import { useUncontrolledProp } from 'uncontrollable';
-import { DEFAULT_LOCALE } from './constants';
+import { DEFAULT_LOCALE, SELECTION_MODE } from './constants';
 import { FieldSelectBase } from './FieldSelectBase';
 import { getDisplayedValue } from './helpers';
 import { useList } from './hooks';
-import { SelectionMode } from './types';
 export const FieldSelectMulti = forwardRef((_a, ref) => {
     var { value: valueProp, onChange, options, disabled = false, readonly = false, searchable = true, required = false, open, onOpenChange, locale = DEFAULT_LOCALE, getSelectedItemsText = number => ((locale === null || locale === void 0 ? void 0 : locale.language) === 'ru' ? `Выбрано: ${number}` : `Selected: ${number}`), showCopyButton: showCopyButtonProp = true, onFocus, onBlur } = _a, rest = __rest(_a, ["value", "onChange", "options", "disabled", "readonly", "searchable", "required", "open", "onOpenChange", "locale", "getSelectedItemsText", "showCopyButton", "onFocus", "onBlur"]);
-    const selectionMode = SelectionMode.Multi;
+    const selectionMode = SELECTION_MODE.Multi;
     const [value, setValue] = useUncontrolledProp(valueProp, [], onChange);
     const selected = useMemo(() => options.filter(option => value === null || value === void 0 ? void 0 : value.includes(option.value)), [options, value]);
     const displayedValue = getDisplayedValue({ selectionMode, selected, getSelectedItemsText });

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

@@ -21,14 +21,14 @@ export declare const FieldSelectSingle: import("react").ForwardRefExoticComponen
     onBlur?: import("react").FocusEventHandler<HTMLInputElement> | undefined;
 } & {
     showHintIcon?: boolean | undefined;
-    validationState?: import("../../constants").ValidationState | undefined;
+    validationState?: import("../../types").ValidationState | undefined;
     hint?: string | undefined;
     size?: import("@snack-uikit/input-private").Size | undefined;
     label?: string | undefined;
     className?: string | undefined;
     labelTooltip?: string | undefined;
     required?: boolean | undefined;
-    labelTooltipPlacement?: import("@snack-uikit/popover-private/dist/constants").Placement | undefined;
+    labelTooltipPlacement?: import("@snack-uikit/popover-private/dist/types").Placement | undefined;
 } & {
     value?: string | undefined;
     onChange?(value: string): void;

package/dist/components/FieldSelect/FieldSelectSingle.js

@@ -13,14 +13,13 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { forwardRef, useCallback, useEffect, useMemo, useState } from 'react';
 import { useUncontrolledProp } from 'uncontrollable';
 import { selectAll } from '@snack-uikit/input-private';
-import { DEFAULT_LOCALE, EMPTY_OPTION } from './constants';
+import { DEFAULT_LOCALE, EMPTY_OPTION, SELECTION_MODE } from './constants';
 import { FieldSelectBase } from './FieldSelectBase';
 import { getDisplayedValue } from './helpers';
 import { useList } from './hooks';
-import { SelectionMode } from './types';
 export const FieldSelectSingle = forwardRef((_a, ref) => {
     var { value: valueProp, onChange, options, disabled = false, readonly = false, searchable = true, required = false, locale = DEFAULT_LOCALE, open, onOpenChange, showCopyButton: showCopyButtonProp = true } = _a, rest = __rest(_a, ["value", "onChange", "options", "disabled", "readonly", "searchable", "required", "locale", "open", "onOpenChange", "showCopyButton"]);
-    const selectionMode = SelectionMode.Single;
+    const selectionMode = SELECTION_MODE.Single;
     const [value, setValue] = useUncontrolledProp(valueProp, '', onChange);
     const selected = useMemo(() => { var _a; return (_a = options.find(option => option.value === value)) !== null && _a !== void 0 ? _a : EMPTY_OPTION; }, [options, value]);
     const displayedValue = getDisplayedValue({ selectionMode, selected });

package/dist/components/FieldSelect/constants.d.ts

@@ -1,3 +1,7 @@
 import { Option } from './types';
 export declare const EMPTY_OPTION: Option;
 export declare const DEFAULT_LOCALE: Intl.Locale;
+export declare const SELECTION_MODE: {
+    readonly Single: "single";
+    readonly Multi: "multi";
+};

package/dist/components/FieldSelect/constants.js

@@ -1,2 +1,6 @@
 export const EMPTY_OPTION = { value: '', label: '' };
 export const DEFAULT_LOCALE = new Intl.Locale('ru-RU');
+export const SELECTION_MODE = {
+    Single: 'single',
+    Multi: 'multi',
+};

package/dist/components/FieldSelect/helpers/getArrowIcon.d.ts

@@ -1,8 +1,8 @@
-import { IconSize, Size } from '@snack-uikit/input-private';
+import { Size } from '@snack-uikit/input-private';
 export declare function getArrowIcon({ size, open }: {
     size: Size;
     open: boolean;
 }): {
     ArrowIcon: ({ size, ...props }: import("@snack-uikit/icons/dist/components/interface-icons/chevronUp").ISvgIconProps) => import("react/jsx-runtime").JSX.Element;
-    arrowIconSize: IconSize;
+    arrowIconSize: 16 | 24;
 };

package/dist/components/FieldSelect/helpers/getArrowIcon.js

@@ -1,5 +1,8 @@
 import { ChevronDownSVG, ChevronUpSVG } from '@snack-uikit/icons';
-import { IconSize, Size } from '@snack-uikit/input-private';
+import { ICON_SIZE, SIZE } from '@snack-uikit/input-private';
 export function getArrowIcon({ size, open }) {
-    return { ArrowIcon: open ? ChevronUpSVG : ChevronDownSVG, arrowIconSize: size === Size.S ? IconSize.Xs : IconSize.S };
+    return {
+        ArrowIcon: open ? ChevronUpSVG : ChevronDownSVG,
+        arrowIconSize: size === SIZE.S ? ICON_SIZE.Xs : ICON_SIZE.S,
+    };
 }

package/dist/components/FieldSelect/helpers/getDisplayedValue.d.ts

@@ -1,9 +1,10 @@
-import { Option, SelectionMode } from '../types';
+import { SELECTION_MODE } from '../constants';
+import { Option } from '../types';
 export declare const getDisplayedValue: (props: {
-    selectionMode: SelectionMode.Single;
+    selectionMode: typeof SELECTION_MODE.Single;
     selected: Option;
 } | {
-    selectionMode: SelectionMode.Multi;
+    selectionMode: typeof SELECTION_MODE.Multi;
     selected: Option[];
     getSelectedItemsText(amount: number): string;
 }) => string;

package/dist/components/FieldSelect/helpers/getDisplayedValue.js

@@ -1,6 +1,6 @@
-import { SelectionMode } from '../types';
+import { SELECTION_MODE } from '../constants';
 export const getDisplayedValue = (props) => {
-    if (props.selectionMode === SelectionMode.Single) {
+    if (props.selectionMode === SELECTION_MODE.Single) {
         return props.selected.label;
     }
     const { selected, getSelectedItemsText } = props;

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

@@ -3,10 +3,6 @@ import { ItemSingleProps } from '@snack-uikit/droplist';
 import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
 import { FieldDecoratorProps } from '../FieldDecorator';
-export declare enum SelectionMode {
-    Single = "single",
-    Multi = "multi"
-}
 export type Option = Pick<ItemSingleProps, 'caption' | 'description' | 'tagLabel' | 'icon' | 'avatar' | 'disabled'> & {
     value: string;
     label: string;

package/dist/components/FieldSelect/types.js

@@ -1,5 +1 @@
-export var SelectionMode;
-(function (SelectionMode) {
-    SelectionMode["Single"] = "single";
-    SelectionMode["Multi"] = "multi";
-})(SelectionMode || (SelectionMode = {}));
+export {};

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

@@ -1,8 +1,6 @@
 import { ReactElement } from 'react';
-import { InputPrivateProps, Size } from '@snack-uikit/input-private';
-import { Tooltip } from '@snack-uikit/tooltip';
+import { InputPrivateProps } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
-import { ValidationState } from '../../constants';
 import { FieldDecoratorProps } from '../FieldDecorator';
 type InputProps = Pick<Partial<InputPrivateProps>, 'value' | 'onChange'> & Pick<InputPrivateProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur'>;
 type WrapperProps = Pick<FieldDecoratorProps, 'className' | 'label' | 'labelTooltip' | 'required' | 'hint' | 'showHintIcon' | 'size' | 'validationState' | 'labelTooltipPlacement'>;
@@ -17,9 +15,5 @@ type FieldTextOwnProps = {
 export type FieldTextProps = WithSupportProps<FieldTextOwnProps & InputProps & WrapperProps>;
 export declare const FieldText: import("react").ForwardRefExoticComponent<{
     'data-test-id'?: string | undefined;
-} & import("react").AriaAttributes & FieldTextOwnProps & Pick<Partial<InputPrivateProps>, "value" | "onChange"> & Pick<InputPrivateProps, "disabled" | "readonly" | "name" | "placeholder" | "id" | "maxLength" | "onFocus" | "onBlur"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>> & {
-    sizes: typeof Size;
-    validationStates: typeof ValidationState;
-    labelTooltipPlacements: typeof Tooltip.placements;
-};
+} & import("react").AriaAttributes & FieldTextOwnProps & Pick<Partial<InputPrivateProps>, "value" | "onChange"> & Pick<InputPrivateProps, "disabled" | "readonly" | "name" | "placeholder" | "id" | "maxLength" | "onFocus" | "onBlur"> & WrapperProps & import("react").RefAttributes<HTMLInputElement>>;
 export {};

package/dist/components/FieldText/FieldText.js

@@ -13,15 +13,14 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import mergeRefs from 'merge-refs';
 import { forwardRef, useMemo, useRef } from 'react';
 import { useUncontrolledProp } from 'uncontrollable';
-import { InputPrivate, Size, useButtonNavigation, useClearButton } from '@snack-uikit/input-private';
-import { Tooltip } from '@snack-uikit/tooltip';
+import { InputPrivate, SIZE, useButtonNavigation, useClearButton } from '@snack-uikit/input-private';
 import { extractSupportProps } from '@snack-uikit/utils';
-import { ContainerVariant, ValidationState } from '../../constants';
+import { CONTAINER_VARIANT, VALIDATION_STATE } from '../../constants';
 import { FieldContainerPrivate } from '../../helperComponents';
 import { useCopyButton } from '../../hooks';
 import { FieldDecorator } from '../FieldDecorator';
-const ForwardedFieldText = forwardRef((_a, ref) => {
-    var { id, name, value: valueProp, placeholder, maxLength, disabled = false, readonly = false, showCopyButton: showCopyButtonProp = true, allowMoreThanMaxLength = false, onChange: onChangeProp, onFocus, onBlur, className, label, labelTooltip, labelTooltipPlacement, required = false, hint, showHintIcon, size = Size.S, validationState = ValidationState.Default, prefixIcon } = _a, rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "disabled", "readonly", "showCopyButton", "allowMoreThanMaxLength", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "hint", "showHintIcon", "size", "validationState", "prefixIcon"]);
+export const FieldText = forwardRef((_a, ref) => {
+    var { id, name, value: valueProp, placeholder, maxLength, disabled = false, readonly = false, showCopyButton: showCopyButtonProp = true, allowMoreThanMaxLength = false, onChange: onChangeProp, onFocus, onBlur, className, label, labelTooltip, labelTooltipPlacement, required = false, hint, showHintIcon, size = SIZE.S, validationState = VALIDATION_STATE.Default, prefixIcon } = _a, rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "disabled", "readonly", "showCopyButton", "allowMoreThanMaxLength", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "hint", "showHintIcon", "size", "validationState", "prefixIcon"]);
     const [value, onChange] = useUncontrolledProp(valueProp, '', onChangeProp);
     const localRef = useRef(null);
     const clearButtonRef = useRef(null);
@@ -44,9 +43,5 @@ const ForwardedFieldText = 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, length: maxLength ? { max: maxLength, current: value.length } : undefined, hint: hint, disabled: disabled, readonly: readonly, showHintIcon: showHintIcon, size: size, validationState: validationState }, extractSupportProps(rest), { children: _jsx(FieldContainerPrivate, Object.assign({ size: size, validationState: validationState, disabled: disabled, readonly: readonly, variant: ContainerVariant.SingleLine, inputRef: localRef, prefix: prefixIcon, postfix: buttons }, { children: _jsx(InputPrivate, { ref: mergeRefs(ref, localRef), "data-size": size, value: value, onChange: onChange, onFocus: onFocus, onBlur: onBlur, tabIndex: inputTabIndex, onKeyDown: onInputKeyDown, placeholder: placeholder, disabled: disabled, readonly: readonly, type: InputPrivate.types.Text, maxLength: allowMoreThanMaxLength ? undefined : maxLength || undefined, id: id, name: name, "data-test-id": 'field-text__input' }) })) })));
+    return (_jsx(FieldDecorator, Object.assign({ className: className, label: label, labelTooltip: labelTooltip, labelTooltipPlacement: labelTooltipPlacement, labelFor: id, required: required, length: maxLength ? { max: maxLength, current: value.length } : undefined, hint: hint, disabled: disabled, readonly: readonly, showHintIcon: showHintIcon, size: size, validationState: validationState }, extractSupportProps(rest), { children: _jsx(FieldContainerPrivate, Object.assign({ size: size, validationState: validationState, disabled: disabled, readonly: readonly, variant: CONTAINER_VARIANT.SingleLine, inputRef: localRef, prefix: prefixIcon, postfix: buttons }, { children: _jsx(InputPrivate, { ref: mergeRefs(ref, localRef), "data-size": size, value: value, onChange: onChange, onFocus: onFocus, onBlur: onBlur, tabIndex: inputTabIndex, onKeyDown: onInputKeyDown, placeholder: placeholder, disabled: disabled, readonly: readonly, type: 'text', maxLength: allowMoreThanMaxLength ? undefined : maxLength || undefined, id: id, name: name, "data-test-id": 'field-text__input' }) })) })));
 });
-export const FieldText = ForwardedFieldText;
-FieldText.sizes = Size;
-FieldText.validationStates = ValidationState;
-FieldText.labelTooltipPlacements = Tooltip.placements;

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

@@ -1,8 +1,5 @@
 import { ChangeEvent } from 'react';
-import { Size } from '@snack-uikit/input-private';
-import { Tooltip } from '@snack-uikit/tooltip';
 import { WithSupportProps } from '@snack-uikit/utils';
-import { ValidationState } from '../../constants';
 import { TextAreaProps } from '../../helperComponents';
 import { FieldDecoratorProps } from '../FieldDecorator';
 type InputProps = Pick<Partial<TextAreaProps>, 'value'> & Pick<TextAreaProps, 'id' | 'name' | 'placeholder' | 'maxLength' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur'>;
@@ -22,9 +19,5 @@ type FieldTextAreaOwnProps = {
 export type FieldTextAreaProps = WithSupportProps<FieldTextAreaOwnProps & InputProps & WrapperProps>;
 export declare const FieldTextArea: import("react").ForwardRefExoticComponent<{
     'data-test-id'?: string | undefined;
-} & import("react").AriaAttributes & FieldTextAreaOwnProps & Pick<Partial<TextAreaProps>, "value"> & Pick<TextAreaProps, "disabled" | "readonly" | "name" | "placeholder" | "id" | "maxLength" | "onFocus" | "onBlur"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>> & {
-    sizes: typeof Size;
-    validationStates: typeof ValidationState;
-    labelTooltipPlacements: typeof Tooltip.placements;
-};
+} & import("react").AriaAttributes & FieldTextAreaOwnProps & Pick<Partial<TextAreaProps>, "value"> & Pick<TextAreaProps, "disabled" | "readonly" | "name" | "placeholder" | "id" | "maxLength" | "onFocus" | "onBlur"> & WrapperProps & import("react").RefAttributes<HTMLTextAreaElement>>;
 export {};

package/dist/components/FieldTextArea/FieldTextArea.js

@@ -13,17 +13,16 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import mergeRefs from 'merge-refs';
 import { forwardRef, useMemo, useRef } from 'react';
 import { useUncontrolledProp } from 'uncontrollable';
-import { Size, useButtonNavigation, useClearButton } from '@snack-uikit/input-private';
+import { SIZE, useButtonNavigation, useClearButton } from '@snack-uikit/input-private';
 import { Scroll } from '@snack-uikit/scroll';
-import { Tooltip } from '@snack-uikit/tooltip';
 import { extractSupportProps } from '@snack-uikit/utils';
-import { ContainerVariant, ValidationState } from '../../constants';
+import { CONTAINER_VARIANT, VALIDATION_STATE } from '../../constants';
 import { FieldContainerPrivate, TextArea } from '../../helperComponents';
 import { useCopyButton } from '../../hooks';
 import { FieldDecorator } from '../FieldDecorator';
 import styles from './styles.module.css';
-const ForwardedFieldTextArea = forwardRef((_a, ref) => {
-    var { id, name, value: valueProp, placeholder, maxLength, maxRows, disabled = false, resizable = false, readonly = false, showCopyButton: showCopyButtonProp = true, allowMoreThanMaxLength = true, showHintIcon, onChange: onChangeProp, onFocus, onBlur, className, label, labelTooltip, labelTooltipPlacement, required = false, hint, size = Size.S, validationState = ValidationState.Default } = _a, rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "maxRows", "disabled", "resizable", "readonly", "showCopyButton", "allowMoreThanMaxLength", "showHintIcon", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "hint", "size", "validationState"]);
+export const FieldTextArea = forwardRef((_a, ref) => {
+    var { id, name, value: valueProp, placeholder, maxLength, maxRows, disabled = false, resizable = false, readonly = false, showCopyButton: showCopyButtonProp = true, allowMoreThanMaxLength = true, showHintIcon, onChange: onChangeProp, onFocus, onBlur, className, label, labelTooltip, labelTooltipPlacement, required = false, hint, size = SIZE.S, validationState = VALIDATION_STATE.Default } = _a, rest = __rest(_a, ["id", "name", "value", "placeholder", "maxLength", "maxRows", "disabled", "resizable", "readonly", "showCopyButton", "allowMoreThanMaxLength", "showHintIcon", "onChange", "onFocus", "onBlur", "className", "label", "labelTooltip", "labelTooltipPlacement", "required", "hint", "size", "validationState"]);
     const localRef = useRef(null);
     const clearButtonRef = useRef(null);
     const copyButtonRef = useRef(null);
@@ -46,9 +45,5 @@ const ForwardedFieldTextArea = 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, length: maxLength ? { max: maxLength, current: value.length } : undefined, hint: hint, disabled: disabled, readonly: readonly, showHintIcon: showHintIcon, size: size, validationState: validationState }, extractSupportProps(rest), { children: _jsx(FieldContainerPrivate, Object.assign({ className: styles.container, size: size, validationState: validationState, disabled: disabled, readonly: readonly, "data-resizable": isResizable || undefined, variant: ContainerVariant.MultiLine, style: { '--max-rows': maxRows }, inputRef: localRef, postfix: _jsx("span", Object.assign({ className: styles.postfix }, { children: buttons })) }, { children: _jsx(Scroll, Object.assign({ className: styles.scrollContainer, size: Scroll.sizes.S, barHideStrategy: Scroll.barHideStrategies.Never, resize: isResizable ? Scroll.resizes.Vertical : Scroll.resizes.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, 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' }) })) })) })));
+    return (_jsx(FieldDecorator, Object.assign({ className: className, label: label, labelTooltip: labelTooltip, labelTooltipPlacement: labelTooltipPlacement, labelFor: id, required: required, length: maxLength ? { max: maxLength, current: value.length } : undefined, hint: hint, disabled: disabled, readonly: readonly, showHintIcon: showHintIcon, size: size, validationState: validationState }, extractSupportProps(rest), { children: _jsx(FieldContainerPrivate, Object.assign({ className: styles.container, size: size, validationState: validationState, disabled: disabled, readonly: readonly, "data-resizable": isResizable || undefined, variant: CONTAINER_VARIANT.MultiLine, style: { '--max-rows': maxRows }, inputRef: localRef, postfix: _jsx("span", Object.assign({ className: styles.postfix }, { children: buttons })) }, { children: _jsx(Scroll, Object.assign({ 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, 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' }) })) })) })));
 });
-export const FieldTextArea = ForwardedFieldTextArea;
-FieldTextArea.sizes = Size;
-FieldTextArea.validationStates = ValidationState;
-FieldTextArea.labelTooltipPlacements = Tooltip.placements;

package/dist/constants.d.ts

@@ -1,10 +1,10 @@
-export declare enum ValidationState {
-    Default = "default",
-    Error = "error",
-    Warning = "warning",
-    Success = "success"
-}
-export declare enum ContainerVariant {
-    SingleLine = "single-line-container",
-    MultiLine = "multi-line-container"
-}
+export declare const VALIDATION_STATE: {
+    readonly Default: "default";
+    readonly Error: "error";
+    readonly Warning: "warning";
+    readonly Success: "success";
+};
+export declare const CONTAINER_VARIANT: {
+    readonly SingleLine: "single-line-container";
+    readonly MultiLine: "multi-line-container";
+};

package/dist/constants.js

@@ -1,12 +1,10 @@
-export var ValidationState;
-(function (ValidationState) {
-    ValidationState["Default"] = "default";
-    ValidationState["Error"] = "error";
-    ValidationState["Warning"] = "warning";
-    ValidationState["Success"] = "success";
-})(ValidationState || (ValidationState = {}));
-export var ContainerVariant;
-(function (ContainerVariant) {
-    ContainerVariant["SingleLine"] = "single-line-container";
-    ContainerVariant["MultiLine"] = "multi-line-container";
-})(ContainerVariant || (ContainerVariant = {}));
+export const VALIDATION_STATE = {
+    Default: 'default',
+    Error: 'error',
+    Warning: 'warning',
+    Success: 'success',
+};
+export const CONTAINER_VARIANT = {
+    SingleLine: 'single-line-container',
+    MultiLine: 'multi-line-container',
+};

package/dist/helperComponents/ButtonCopyValue/helpers.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { CheckSVG, CopySVG } from '@snack-uikit/icons';
-import { ButtonSize } from '@snack-uikit/input-private';
+import { BUTTON_SIZE } from '@snack-uikit/input-private';
 export function getIcon({ size, isChecked }) {
     switch (size) {
-        case ButtonSize.S: {
+        case BUTTON_SIZE.S: {
             return isChecked ? _jsx(CheckSVG, { size: 16 }) : _jsx(CopySVG, { size: 16 });
         }
-        case ButtonSize.M:
+        case BUTTON_SIZE.M:
         default: {
             return isChecked ? _jsx(CheckSVG, { size: 24 }) : _jsx(CopySVG, { size: 24 });
         }

package/dist/helperComponents/ButtonHideValue/ButtonHideValue.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { forwardRef } from 'react';
 import { EyeClosedSVG, EyeSVG } from '@snack-uikit/icons';
-import { ButtonSize } from '@snack-uikit/input-private';
+import { BUTTON_SIZE } from '@snack-uikit/input-private';
 import styles from './styles.module.css';
 export const ButtonHideValue = forwardRef(({ size, onClick, hidden, disabled, tabIndex = -1, onKeyDown }, ref) => {
     const handleClick = event => {
@@ -11,5 +11,5 @@ export const ButtonHideValue = forwardRef(({ size, onClick, hidden, disabled, ta
         event.stopPropagation();
         onClick(event);
     };
-    return (_jsx("button", Object.assign({ className: styles.buttonHideValue, "data-size": size, "data-disabled": disabled || undefined, disabled: disabled, onClick: handleClick, "data-test-id": 'button-hide-value', ref: ref, onKeyDown: onKeyDown, type: 'button', tabIndex: disabled ? -1 : tabIndex }, { children: hidden ? (_jsxs(_Fragment, { children: [size === ButtonSize.S && _jsx(EyeClosedSVG, { size: 16 }), size === ButtonSize.M && _jsx(EyeClosedSVG, {})] })) : (_jsxs(_Fragment, { children: [size === ButtonSize.S && _jsx(EyeSVG, { size: 16 }), size === ButtonSize.M && _jsx(EyeSVG, {})] })) })));
+    return (_jsx("button", Object.assign({ className: styles.buttonHideValue, "data-size": size, "data-disabled": disabled || undefined, disabled: disabled, onClick: handleClick, "data-test-id": 'button-hide-value', ref: ref, onKeyDown: onKeyDown, type: 'button', tabIndex: disabled ? -1 : tabIndex }, { children: hidden ? (_jsxs(_Fragment, { children: [size === BUTTON_SIZE.S && _jsx(EyeClosedSVG, { size: 16 }), size === BUTTON_SIZE.M && _jsx(EyeClosedSVG, {})] })) : (_jsxs(_Fragment, { children: [size === BUTTON_SIZE.S && _jsx(EyeSVG, { size: 16 }), size === BUTTON_SIZE.M && _jsx(EyeSVG, {})] })) })));
 });

package/dist/helperComponents/FieldContainerPrivate/FieldContainerPrivate.d.ts

@@ -1,7 +1,7 @@
 import { CSSProperties, MouseEventHandler, ReactElement, ReactNode, RefObject } from 'react';
 import { Size } from '@snack-uikit/input-private';
 import { WithSupportProps } from '@snack-uikit/utils';
-import { ContainerVariant, ValidationState } from '../../constants';
+import { ContainerVariant, ValidationState } from '../../types';
 export type FieldContainerPrivateProps = WithSupportProps<{
     className?: string;
     children: ReactNode;

package/dist/helperComponents/FieldContainerPrivate/FieldContainerPrivate.js

@@ -12,7 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import cn from 'classnames';
 import { extractSupportProps } from '@snack-uikit/utils';
-import { ValidationState } from '../../constants';
+import { VALIDATION_STATE } from '../../constants';
 import styles from './styles.module.css';
 export function FieldContainerPrivate(_a) {
     var { className, children, size, validationState, variant, disabled, readonly, focused, selectable, style, prefix, postfix, inputRef, onMouseDown } = _a, rest = __rest(_a, ["className", "children", "size", "validationState", "variant", "disabled", "readonly", "focused", "selectable", "style", "prefix", "postfix", "inputRef", "onMouseDown"]);
@@ -23,5 +23,5 @@ export function FieldContainerPrivate(_a) {
         }
         (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     };
-    return (_jsxs("div", Object.assign({ className: cn(className, styles.container), style: style, "data-size": size, "data-validation": disabled || readonly ? ValidationState.Default : validationState, "data-variant": variant, "data-disabled": disabled || undefined, "data-readonly": readonly || undefined, "data-focused": focused || undefined, "data-selectable": selectable || undefined, "data-test-id": 'field-container-private', onClick: handleContainerClick, onMouseDown: onMouseDown, role: 'textbox', tabIndex: -1 }, extractSupportProps(rest), { children: [prefix && (_jsx("span", Object.assign({ className: styles.prefix, "data-test-id": 'field-container-private__prefix-icon' }, { children: prefix }))), children, postfix && _jsx("span", Object.assign({ className: styles.postfix }, { children: postfix }))] })));
+    return (_jsxs("div", Object.assign({ className: cn(className, styles.container), style: style, "data-size": size, "data-validation": disabled || readonly ? VALIDATION_STATE.Default : validationState, "data-variant": variant, "data-disabled": disabled || undefined, "data-readonly": readonly || undefined, "data-focused": focused || undefined, "data-selectable": selectable || undefined, "data-test-id": 'field-container-private', onClick: handleContainerClick, onMouseDown: onMouseDown, role: 'textbox', tabIndex: -1 }, extractSupportProps(rest), { children: [prefix && (_jsx("span", Object.assign({ className: styles.prefix, "data-test-id": 'field-container-private__prefix-icon' }, { children: prefix }))), children, postfix && _jsx("span", Object.assign({ className: styles.postfix }, { children: postfix }))] })));
 }

package/dist/types.d.ts

@@ -0,0 +1,4 @@
+import { ValueOf } from '@snack-uikit/utils';
+import { CONTAINER_VARIANT, VALIDATION_STATE } from './constants';
+export type ValidationState = ValueOf<typeof VALIDATION_STATE>;
+export type ContainerVariant = ValueOf<typeof CONTAINER_VARIANT>;

package/dist/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Fields",
-  "version": "0.9.2",
+  "version": "0.10.0",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -32,14 +32,14 @@
   "license": "Apache-2.0",
   "scripts": {},
   "dependencies": {
-    "@snack-uikit/calendar": "0.5.1",
-    "@snack-uikit/droplist": "0.11.2",
+    "@snack-uikit/calendar": "0.6.0",
+    "@snack-uikit/droplist": "0.12.0",
     "@snack-uikit/icons": "0.19.0",
-    "@snack-uikit/input-private": "2.0.1",
-    "@snack-uikit/scroll": "0.4.1",
-    "@snack-uikit/tooltip": "0.9.1",
-    "@snack-uikit/truncate-string": "0.3.1",
-    "@snack-uikit/utils": "3.1.0",
+    "@snack-uikit/input-private": "3.0.0",
+    "@snack-uikit/scroll": "0.5.0",
+    "@snack-uikit/tooltip": "0.10.0",
+    "@snack-uikit/truncate-string": "0.4.0",
+    "@snack-uikit/utils": "3.2.0",
     "classnames": "2.3.2",
     "copy-to-clipboard": "3.3.3",
     "merge-refs": "1.0.0",
@@ -49,5 +49,5 @@
   "devDependencies": {
     "@types/merge-refs": "1.0.0"
   },
-  "gitHead": "e124e31699926810648702f97db72413d7ebd2b2"
+  "gitHead": "bd39c5e674f3b91b0e2487782a04b15034cf3d8b"
 }

package/src/components/FieldDate/FieldDate.tsx

@@ -16,18 +16,18 @@ import { Calendar, CalendarProps } from '@snack-uikit/calendar';
 import { Dropdown } from '@snack-uikit/droplist';
 import { CalendarSVG } from '@snack-uikit/icons';
 import {
-  IconSize,
+  ICON_SIZE,
   InputPrivate,
   InputPrivateProps,
   runAfterRerender,
+  SIZE,
   Size,
   useButtonNavigation,
   useClearButton,
 } from '@snack-uikit/input-private';
-import { Tooltip } from '@snack-uikit/tooltip';
 import { extractSupportProps, WithSupportProps } from '@snack-uikit/utils';
 
-import { ContainerVariant, ValidationState } from '../../constants';
+import { CONTAINER_VARIANT, VALIDATION_STATE } from '../../constants';
 import { FieldContainerPrivate } from '../../helperComponents';
 import { useCopyButton } from '../../hooks';
 import { FieldDecorator, FieldDecoratorProps } from '../FieldDecorator';
@@ -68,13 +68,13 @@ type FieldDateOwnProps = {
 
 export type FieldDateProps = WithSupportProps<FieldDateOwnProps & InputProps & WrapperProps>;
 
-const CALENDAR_SIZE_MAP = {
-  [Size.S]: Calendar.sizes.S,
-  [Size.M]: Calendar.sizes.M,
-  [Size.L]: Calendar.sizes.M,
+const CALENDAR_SIZE_MAP: Record<Size, CalendarProps['size']> = {
+  [SIZE.S]: 's',
+  [SIZE.M]: 'm',
+  [SIZE.L]: 'm',
 };
 
-const ForwardedFieldDate = forwardRef<HTMLInputElement, FieldDateProps>(
+export const FieldDate = forwardRef<HTMLInputElement, FieldDateProps>(
   (
     {
       id,
@@ -95,8 +95,8 @@ const ForwardedFieldDate = forwardRef<HTMLInputElement, FieldDateProps>(
       required = false,
       hint,
       showHintIcon,
-      size = Size.S,
-      validationState = ValidationState.Default,
+      size = SIZE.S,
+      validationState = VALIDATION_STATE.Default,
       locale = DEFAULT_LOCALE,
       ...rest
     },
@@ -108,7 +108,7 @@ const ForwardedFieldDate = forwardRef<HTMLInputElement, FieldDateProps>(
     const localRef = useRef<HTMLInputElement>(null);
     const clearButtonRef = useRef<HTMLButtonElement>(null);
     const copyButtonRef = useRef<HTMLButtonElement>(null);
-    const calendarIconSize = size === Size.S ? IconSize.Xs : IconSize.S;
+    const calendarIconSize = size === SIZE.S ? ICON_SIZE.Xs : ICON_SIZE.S;
     const showDropList = isOpen && !readonly && !disabled;
     const showAdditionalButton = Boolean(valueProp && !disabled);
     const showClearButton = showAdditionalButton && !readonly;
@@ -257,9 +257,9 @@ const ForwardedFieldDate = forwardRef<HTMLInputElement, FieldDateProps>(
         {...extractSupportProps(rest)}
       >
         <Dropdown
-          trigger={Dropdown.triggers.Click}
+          trigger='click'
           triggerClassName={styles.triggerClassName}
-          widthStrategy={Dropdown.widthStrategies.Gte}
+          widthStrategy='gte'
           {...(readonly || disabled
             ? { open: false }
             : {
@@ -269,7 +269,7 @@ const ForwardedFieldDate = forwardRef<HTMLInputElement, FieldDateProps>(
           content={
             <div className={styles.calendarWrapper} data-size={size}>
               <Calendar
-                mode={Calendar.modes.Date}
+                mode='date'
                 size={CALENDAR_SIZE_MAP[size]}
                 value={valueProp ? parseDate(valueProp) : undefined}
                 onChangeValue={handleSelectDate}
@@ -292,7 +292,7 @@ const ForwardedFieldDate = forwardRef<HTMLInputElement, FieldDateProps>(
             validationState={validationState}
             disabled={disabled}
             readonly={readonly}
-            variant={ContainerVariant.SingleLine}
+            variant={CONTAINER_VARIANT.SingleLine}
             focused={showDropList}
             inputRef={localRef}
             postfix={
@@ -316,7 +316,7 @@ const ForwardedFieldDate = forwardRef<HTMLInputElement, FieldDateProps>(
               disabled={disabled}
               readonly={readonly}
               tabIndex={inputTabIndex}
-              type={InputPrivate.types.Text}
+              type='text'
               id={id}
               name={name}
               data-test-id='field-date__input'
@@ -327,13 +327,3 @@ const ForwardedFieldDate = forwardRef<HTMLInputElement, FieldDateProps>(
     );
   },
 );
-
-export const FieldDate = ForwardedFieldDate as typeof ForwardedFieldDate & {
-  sizes: typeof Size;
-  validationStates: typeof ValidationState;
-  labelTooltipPlacements: typeof Tooltip.placements;
-};
-
-FieldDate.sizes = Size;
-FieldDate.validationStates = ValidationState;
-FieldDate.labelTooltipPlacements = Tooltip.placements;

package/src/components/FieldDecorator/FieldDecorator.tsx

@@ -1,10 +1,10 @@
 import cn from 'classnames';
 import { ReactNode } from 'react';
 
-import { Size } from '@snack-uikit/input-private';
+import { SIZE } from '@snack-uikit/input-private';
 import { extractSupportProps, WithSupportProps } from '@snack-uikit/utils';
 
-import { ValidationState } from '../../constants';
+import { VALIDATION_STATE } from '../../constants';
 import { Footer, FooterProps } from './Footer';
 import { Header, HeaderProps } from './Header';
 import styles from './styles.module.scss';
@@ -35,8 +35,8 @@ export function FieldDecorator({
   readonly,
   showHintIcon,
   labelTooltipPlacement,
-  size = Size.S,
-  validationState = ValidationState.Default,
+  size = SIZE.S,
+  validationState = VALIDATION_STATE.Default,
   ...rest
 }: FieldDecoratorProps) {
   const isFieldActive = !disabled && !readonly;
@@ -59,11 +59,8 @@ export function FieldDecorator({
         hint={hint}
         showHintIcon={showHintIcon}
         size={size}
-        validationState={isFieldActive ? validationState : ValidationState.Default}
+        validationState={isFieldActive ? validationState : VALIDATION_STATE.Default}
       />
     </div>
   );
 }
-
-FieldDecorator.validationStates = ValidationState;
-FieldDecorator.sizes = Size;

package/src/components/FieldDecorator/Footer.tsx

@@ -3,7 +3,8 @@ import { useMemo } from 'react';
 import { AlarmFilledSVG, CheckFilledSVG, CrossFilledSVG, InfoFilledSVG } from '@snack-uikit/icons';
 import { Size } from '@snack-uikit/input-private';
 
-import { ValidationState } from '../../constants';
+import { VALIDATION_STATE } from '../../constants';
+import { ValidationState } from '../../types';
 import styles from './styles.module.scss';
 
 export type FooterProps = {
@@ -33,19 +34,19 @@ function getValidationIcon(props: Pick<FooterProps, 'showHintIcon' | 'validation
   let showIcon: boolean;
 
   switch (props.validationState) {
-    case ValidationState.Success:
+    case VALIDATION_STATE.Success:
       Component = CheckFilledSVG;
       showIcon = true;
       break;
-    case ValidationState.Error:
+    case VALIDATION_STATE.Error:
       Component = CrossFilledSVG;
       showIcon = true;
       break;
-    case ValidationState.Warning:
+    case VALIDATION_STATE.Warning:
       Component = AlarmFilledSVG;
       showIcon = true;
       break;
-    case ValidationState.Default:
+    case VALIDATION_STATE.Default:
     default:
       Component = InfoFilledSVG;
       showIcon = false;
@@ -57,7 +58,7 @@ function getValidationIcon(props: Pick<FooterProps, 'showHintIcon' | 'validation
   ) : null;
 }
 
-export function Footer({ length, hint, size, validationState = ValidationState.Default, showHintIcon }: FooterProps) {
+export function Footer({ length, hint, size, validationState = VALIDATION_STATE.Default, showHintIcon }: FooterProps) {
   const isReverseContainer = !hint && length;
   const limitExceeded = length && length.max && length.current > length.max;