@ozen-ui/kit 0.76.0 → 0.78.0

package/__inner__/esm/components/ImageBase/components/ImageBasePicture/types.d.ts

@@ -0,0 +1,7 @@
+import type { ComponentRef, ReactNode } from 'react';
+import type { ImageBaseSources } from '../../entities';
+export type ImageBasePictureRef = ComponentRef<'picture'>;
+export type ImageBasePictureProps = {
+    children: ReactNode;
+    sources: ImageBaseSources | undefined;
+};

package/__inner__/esm/components/ImageBase/components/ImageBasePicture/types.js

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

package/__inner__/esm/components/ImageBase/components/index.d.ts

@@ -0,0 +1 @@
+export * from './ImageBasePicture';

package/__inner__/esm/components/ImageBase/components/index.js

@@ -0,0 +1 @@
+export * from './ImageBasePicture';

package/__inner__/esm/components/ImageBase/constants.d.ts

@@ -0,0 +1 @@
+export declare const IMAGE_BASE_DEFAULT_ELEMENT = "div";

package/__inner__/esm/components/ImageBase/constants.js

@@ -0,0 +1 @@
+export var IMAGE_BASE_DEFAULT_ELEMENT = 'div';

package/__inner__/esm/components/ImageBase/entities/aspectRatio.d.ts

@@ -0,0 +1 @@
+export type ImageBaseAspectRatio = `${number}x${number}`;

package/__inner__/esm/components/ImageBase/entities/aspectRatio.js

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

package/__inner__/esm/components/ImageBase/entities/imageRef.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentRef } from 'react';
+export type ImageBaseImageRef = ComponentRef<'img'>;

package/__inner__/esm/components/ImageBase/entities/imageRef.js

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

package/__inner__/esm/components/ImageBase/entities/index.d.ts

@@ -0,0 +1,3 @@
+export * from './aspectRatio';
+export * from './imageRef';
+export * from './source';

package/__inner__/esm/components/ImageBase/entities/index.js

@@ -0,0 +1,3 @@
+export * from './aspectRatio';
+export * from './imageRef';
+export * from './source';

package/__inner__/esm/components/ImageBase/entities/source.d.ts

@@ -0,0 +1,7 @@
+export type ImageBaseSourceObject = {
+    srcSet: string;
+    type?: string;
+    media?: string;
+};
+export type ImageBaseSource = string | ImageBaseSourceObject;
+export type ImageBaseSources = ImageBaseSource[];

package/__inner__/esm/components/ImageBase/entities/source.js

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

package/__inner__/esm/components/ImageBase/hooks/index.d.ts

@@ -0,0 +1 @@
+export * from './useImageBaseStatus';

package/__inner__/esm/components/ImageBase/hooks/index.js

@@ -0,0 +1 @@
+export * from './useImageBaseStatus';

package/__inner__/esm/components/ImageBase/hooks/useImageBaseStatus.d.ts

@@ -0,0 +1,7 @@
+export declare const useImageBaseStatus: (src: string) => {
+    onLoad: () => void;
+    onError: () => void;
+    isError: boolean;
+    isLoaded: boolean;
+    isLoading: boolean;
+};

package/__inner__/esm/components/ImageBase/hooks/useImageBaseStatus.js

@@ -0,0 +1,32 @@
+import { __read } from "tslib";
+import { useEffect, useState } from 'react';
+import { useStoredValue } from '../../../hooks/useStoredValue';
+export var useImageBaseStatus = function (src) {
+    var lastFinishedSrc = useStoredValue(null);
+    var _a = __read(useState(src ? 'loading' : 'error'), 2), status = _a[0], setStatus = _a[1];
+    var onLoad = function () {
+        setStatus('loaded');
+        lastFinishedSrc.current = src;
+    };
+    var onError = function () {
+        setStatus('error');
+        lastFinishedSrc.current = src;
+    };
+    var isError = status === 'error';
+    var isLoaded = status === 'loaded';
+    var isLoading = status === 'loading';
+    useEffect(function () {
+        var isAlreadyFinished = lastFinishedSrc.current === src;
+        if (isAlreadyFinished) {
+            return;
+        }
+        setStatus('loading');
+    }, [src]);
+    return {
+        onLoad: onLoad,
+        onError: onError,
+        isError: isError,
+        isLoaded: isLoaded,
+        isLoading: isLoading,
+    };
+};

package/__inner__/esm/components/ImageBase/index.d.ts

@@ -0,0 +1,5 @@
+export * from './entities';
+export * from './modules';
+export * from './constants';
+export * from './ImageBase';
+export * from './types';

package/__inner__/esm/components/ImageBase/index.js

@@ -0,0 +1,5 @@
+export * from './entities';
+export * from './modules';
+export * from './constants';
+export * from './ImageBase';
+export * from './types';

package/__inner__/esm/components/ImageBase/modules/ImageBaseLoader/ImageBaseLoader.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { ImageBaseLoaderProps } from './types';
+export declare const cnImageBaseLoader: import("@bem-react/classname").ClassNameFormatter;
+export declare const ImageBaseLoader: ({ className, ...other }: ImageBaseLoaderProps) => React.JSX.Element;

package/__inner__/esm/components/ImageBase/modules/ImageBaseLoader/ImageBaseLoader.js

@@ -0,0 +1,9 @@
+import { __assign, __rest } from "tslib";
+import React from 'react';
+import { cn } from '../../../../utils';
+import { Skeleton } from '../../../Skeleton';
+export var cnImageBaseLoader = cn('ImageBaseLoader');
+export var ImageBaseLoader = function (_a) {
+    var className = _a.className, other = __rest(_a, ["className"]);
+    return (React.createElement(Skeleton, __assign({ variant: "rectangular", className: cnImageBaseLoader('', className), height: "100%" }, other)));
+};

package/__inner__/esm/components/ImageBase/modules/ImageBaseLoader/index.d.ts

@@ -0,0 +1,2 @@
+export * from './ImageBaseLoader';
+export * from './types';

package/__inner__/esm/components/ImageBase/modules/ImageBaseLoader/index.js

@@ -0,0 +1,2 @@
+export * from './ImageBaseLoader';
+export * from './types';

package/__inner__/esm/components/ImageBase/modules/ImageBaseLoader/types.d.ts

@@ -0,0 +1,2 @@
+import type { SkeletonRectangularProps } from '../../../Skeleton';
+export type ImageBaseLoaderProps = SkeletonRectangularProps;

package/__inner__/esm/components/ImageBase/modules/ImageBaseLoader/types.js

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

package/__inner__/esm/components/ImageBase/modules/index.d.ts

@@ -0,0 +1 @@
+export * from './ImageBaseLoader';

package/__inner__/esm/components/ImageBase/modules/index.js

@@ -0,0 +1 @@
+export * from './ImageBaseLoader';

package/__inner__/esm/components/ImageBase/types.d.ts

@@ -0,0 +1,26 @@
+import type { ComponentPropsWithRef, ComponentRef, ElementType, ForwardedRef, ReactNode } from 'react';
+import type { ExtendableComponentPropsWithRef } from '../../types';
+import type { PolymorphicComponentPropsWithRef } from '../../utils';
+import type { ImageBasePictureRef } from './components';
+import type { IMAGE_BASE_DEFAULT_ELEMENT } from './constants';
+import type { ImageBaseAspectRatio, ImageBaseImageRef, ImageBaseSources } from './entities';
+export type ImageBaseBaseProps = ExtendableComponentPropsWithRef<{
+    /** Путь к картинке */
+    src: string;
+    /** Компонент, который отображается при ошибке загрузки изображения */
+    placeholder?: ReactNode;
+    /** Компонент, который отображается при загрузке изображения */
+    loader?: ReactNode;
+    /** Соотношения сторон изображения */
+    aspectRatio?: ImageBaseAspectRatio | null;
+    /** HTML-sources */
+    sources?: ImageBaseSources;
+    /** Ref изображения */
+    imgRef?: ForwardedRef<ImageBaseImageRef>;
+    /** Ref picture-элемента */
+    pictureRef?: ForwardedRef<ImageBasePictureRef>;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+} & Pick<ComponentPropsWithRef<'img'>, 'alt' | 'loading' | 'decoding'>, 'div'>;
+export type ImageBaseRef<As extends ElementType = typeof IMAGE_BASE_DEFAULT_ELEMENT> = ComponentRef<As>;
+export type ImageBaseProps<As extends ElementType = typeof IMAGE_BASE_DEFAULT_ELEMENT> = PolymorphicComponentPropsWithRef<ImageBaseBaseProps, As>;

package/__inner__/esm/components/ImageBase/types.js

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

package/__inner__/esm/components/InputOTP/InputOTP.js

@@ -11,6 +11,7 @@ import { isString } from '../../utils/isString';
 import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
 import { setRef } from '../../utils/setRef';
 import { FieldControl } from '../FieldControl';
+import { FieldHint } from '../FieldHint';
 import { FieldInput } from '../FieldInput';
 import { Fieldset } from '../Fieldset';
 import { Stack } from '../Stack';
@@ -23,7 +24,7 @@ export var InputOTP = polymorphicComponentWithRef(function (inProps, ref) {
         props: inProps,
         name: 'InputOTP',
     });
-    var _a = props.as, as = _a === void 0 ? INPUT_OTP_DEFAULT_TAG : _a, className = props.className, length = props.length, autoComplete = props.autoComplete, _b = props.autoCompleteMode, autoCompleteMode = _b === void 0 ? INPUT_OTP_DEFAULT_AUTO_COMPLETE_MODE : _b, placeholder = props.placeholder, disabled = props.disabled, error = props.error, onChangeFromProps = props.onChange, ariaLabel = props.ariaLabel, value = props.value, defaultValue = props.defaultValue, mask = props.mask, autoFocus = props.autoFocus, onFinish = props.onFinish, onPasteFromProps = props.onPaste, onKeyDownFromProps = props.onKeyDown, _c = props.disableStroke, disableStroke = _c === void 0 ? INPUT_OTP_DEFAULT_DISABLE_STROKE : _c, validate = props.validate, _d = props.size, size = _d === void 0 ? INPUT_OTP_DEFAULT_SIZE : _d, inputProps = props.inputProps, fieldProps = props.fieldProps, _e = props.finishBehavior, finishBehavior = _e === void 0 ? INPUT_OTP_DEFAULT_FINISH_BEHAVIOR : _e, inputContainerProps = props.inputContainerProps, other = __rest(props, ["as", "className", "length", "autoComplete", "autoCompleteMode", "placeholder", "disabled", "error", "onChange", "ariaLabel", "value", "defaultValue", "mask", "autoFocus", "onFinish", "onPaste", "onKeyDown", "disableStroke", "validate", "size", "inputProps", "fieldProps", "finishBehavior", "inputContainerProps"]);
+    var _a = props.as, as = _a === void 0 ? INPUT_OTP_DEFAULT_TAG : _a, className = props.className, length = props.length, autoComplete = props.autoComplete, _b = props.autoCompleteMode, autoCompleteMode = _b === void 0 ? INPUT_OTP_DEFAULT_AUTO_COMPLETE_MODE : _b, placeholder = props.placeholder, disabled = props.disabled, error = props.error, onChangeFromProps = props.onChange, ariaLabel = props.ariaLabel, value = props.value, defaultValue = props.defaultValue, mask = props.mask, autoFocus = props.autoFocus, onFinish = props.onFinish, onPasteFromProps = props.onPaste, onKeyDownFromProps = props.onKeyDown, _c = props.disableStroke, disableStroke = _c === void 0 ? INPUT_OTP_DEFAULT_DISABLE_STROKE : _c, validate = props.validate, _d = props.size, size = _d === void 0 ? INPUT_OTP_DEFAULT_SIZE : _d, inputProps = props.inputProps, fieldProps = props.fieldProps, _e = props.finishBehavior, finishBehavior = _e === void 0 ? INPUT_OTP_DEFAULT_FINISH_BEHAVIOR : _e, inputContainerProps = props.inputContainerProps, hint = props.hint, other = __rest(props, ["as", "className", "length", "autoComplete", "autoCompleteMode", "placeholder", "disabled", "error", "onChange", "ariaLabel", "value", "defaultValue", "mask", "autoFocus", "onFinish", "onPaste", "onKeyDown", "disableStroke", "validate", "size", "inputProps", "fieldProps", "finishBehavior", "inputContainerProps", "hint"]);
     var _f = __read(useState(null), 2), focusedInputIndex = _f[0], setFocusedInputIndex = _f[1];
     var _g = __read(useControlled({
         value: isString(value) ? valueToArray(value) : value,
@@ -97,81 +98,83 @@ export var InputOTP = polymorphicComponentWithRef(function (inProps, ref) {
     return (React.createElement(Stack, __assign({ as: as, className: cnInputOTP({
             size: size,
             disabled: disabled,
-        }, [className]), gap: INPUT_OTP_SPACING_BY_SIZE[size] }, other, { ref: ref }), createEmptyArray(length).map(function (_, index) {
-        var _a, _b;
-        var calculatedInput = calculateInput(valueByIndex, index);
-        var isInputDisabled = calculatedInput.isDisabled, value = calculatedInput.value;
-        var processedAutocomplete = (function () {
-            if (autoCompleteMode === 'firstOnly') {
-                return !!autoComplete && index === 0 ? autoComplete : 'off';
-            }
-            return autoComplete;
-        })();
-        var processedContainerProps = isFunction(inputContainerProps)
-            ? inputContainerProps(calculatedInput, index)
-            : inputContainerProps;
-        var processedFieldProps = isFunction(fieldProps)
-            ? fieldProps(calculatedInput, index)
-            : fieldProps;
-        var processedInputProps = isFunction(inputProps)
-            ? inputProps(calculatedInput, index)
-            : inputProps;
-        var processedPlaceholder = isFunction(placeholder)
-            ? placeholder(calculatedInput, index)
-            : placeholder;
-        return (
-        // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
-        React.createElement("div", __assign({ key: index }, processedContainerProps, { className: cnInputOTP('InputContainer', [
-                processedContainerProps === null || processedContainerProps === void 0 ? void 0 : processedContainerProps.className,
-            ]), onClick: function () {
-                if (isInputDisabled) {
-                    focusFirstNonFilledInput();
+        }, [className]), direction: "column" }, other, { ref: ref }),
+        React.createElement(Stack, { className: cnInputOTP('Inputs'), gap: INPUT_OTP_SPACING_BY_SIZE[size] }, createEmptyArray(length).map(function (_, index) {
+            var _a, _b;
+            var calculatedInput = calculateInput(valueByIndex, index);
+            var isInputDisabled = calculatedInput.isDisabled, value = calculatedInput.value;
+            var processedAutocomplete = (function () {
+                if (autoCompleteMode === 'firstOnly') {
+                    return !!autoComplete && index === 0 ? autoComplete : 'off';
                 }
-            } }),
-            React.createElement(FieldControl, __assign({ size: size, disabled: disabled, error: error, disableStroke: disableStroke }, processedFieldProps, { className: cnInputOTP('Field', {
-                    notAvailable: isInputDisabled,
-                }, [processedFieldProps === null || processedFieldProps === void 0 ? void 0 : processedFieldProps.className]) }),
-                React.createElement(FieldInput, __assign({ inputMode: (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.inputMode) !== null && _a !== void 0 ? _a : 'numeric', type: (_b = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.type) !== null && _b !== void 0 ? _b : 'text', value: value, autoComplete: processedAutocomplete, "aria-label": ariaLabel && "".concat(ariaLabel, ": ").concat(index + 1, "."), placeholder: processedPlaceholder, disabled: isInputDisabled }, processedInputProps, { onMouseDown: function (event) {
-                        var _a;
-                        (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onMouseDown) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
-                        onInputSelect(index);
-                    }, onTouchStart: function (event) {
-                        var _a;
-                        (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onTouchStart) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
-                        onInputSelect(index);
-                    }, onPointerDown: function (event) {
-                        var _a;
-                        (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onPointerDown) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
-                        onInputSelect(index);
-                    }, onChange: function (event) {
-                        var _a;
-                        (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onChange) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
-                        onInputChange(event, index);
-                    }, onKeyDown: function (event) {
-                        var _a;
-                        (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
-                        onKeyDown(event, index);
-                    }, onPaste: function (event) {
-                        var _a;
-                        (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onPaste) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
-                        onPaste(event, index);
-                    }, onFocus: function (event) {
-                        var _a;
-                        (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onFocus) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
-                        setFocusedInputIndex(index);
-                    }, onBlur: function (event) {
-                        var _a;
-                        (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onBlur) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
-                        setFocusedInputIndex(null);
-                    }, className: cnInputOTP('Input', [
-                        processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.className,
-                    ]), ref: function (instance) {
-                        if (instance) {
-                            inputs.current[index] = instance;
-                        }
-                        setRef(processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.ref, instance);
-                    } })),
-                React.createElement(Fieldset, null))));
-    })));
+                return autoComplete;
+            })();
+            var processedContainerProps = isFunction(inputContainerProps)
+                ? inputContainerProps(calculatedInput, index)
+                : inputContainerProps;
+            var processedFieldProps = isFunction(fieldProps)
+                ? fieldProps(calculatedInput, index)
+                : fieldProps;
+            var processedInputProps = isFunction(inputProps)
+                ? inputProps(calculatedInput, index)
+                : inputProps;
+            var processedPlaceholder = isFunction(placeholder)
+                ? placeholder(calculatedInput, index)
+                : placeholder;
+            return (
+            // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
+            React.createElement("div", __assign({ key: index }, processedContainerProps, { className: cnInputOTP('InputContainer', [
+                    processedContainerProps === null || processedContainerProps === void 0 ? void 0 : processedContainerProps.className,
+                ]), onClick: function () {
+                    if (isInputDisabled) {
+                        focusFirstNonFilledInput();
+                    }
+                } }),
+                React.createElement(FieldControl, __assign({ size: size, disabled: disabled, error: error, disableStroke: disableStroke }, processedFieldProps, { className: cnInputOTP('Field', {
+                        notAvailable: isInputDisabled,
+                    }, [processedFieldProps === null || processedFieldProps === void 0 ? void 0 : processedFieldProps.className]) }),
+                    React.createElement(FieldInput, __assign({ inputMode: (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.inputMode) !== null && _a !== void 0 ? _a : 'numeric', type: (_b = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.type) !== null && _b !== void 0 ? _b : 'text', value: value, autoComplete: processedAutocomplete, "aria-label": ariaLabel && "".concat(ariaLabel, ": ").concat(index + 1, "."), placeholder: processedPlaceholder, disabled: isInputDisabled }, processedInputProps, { onMouseDown: function (event) {
+                            var _a;
+                            (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onMouseDown) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
+                            onInputSelect(index);
+                        }, onTouchStart: function (event) {
+                            var _a;
+                            (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onTouchStart) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
+                            onInputSelect(index);
+                        }, onPointerDown: function (event) {
+                            var _a;
+                            (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onPointerDown) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
+                            onInputSelect(index);
+                        }, onChange: function (event) {
+                            var _a;
+                            (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onChange) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
+                            onInputChange(event, index);
+                        }, onKeyDown: function (event) {
+                            var _a;
+                            (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
+                            onKeyDown(event, index);
+                        }, onPaste: function (event) {
+                            var _a;
+                            (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onPaste) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
+                            onPaste(event, index);
+                        }, onFocus: function (event) {
+                            var _a;
+                            (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onFocus) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
+                            setFocusedInputIndex(index);
+                        }, onBlur: function (event) {
+                            var _a;
+                            (_a = processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.onBlur) === null || _a === void 0 ? void 0 : _a.call(processedInputProps, event);
+                            setFocusedInputIndex(null);
+                        }, className: cnInputOTP('Input', [
+                            processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.className,
+                        ]), ref: function (instance) {
+                            if (instance) {
+                                inputs.current[index] = instance;
+                            }
+                            setRef(processedInputProps === null || processedInputProps === void 0 ? void 0 : processedInputProps.ref, instance);
+                        } })),
+                    React.createElement(Fieldset, null))));
+        })),
+        React.createElement(FieldHint, { className: cnInputOTP('Hint'), size: "l", disabled: disabled, error: error }, hint)));
 });
 InputOTP.displayName = 'InputOTP';

package/__inner__/esm/components/InputOTP/constants.d.ts

@@ -1,8 +1,8 @@
 import type { StackGapVariant } from '../Stack';
-import type { InputOTPAutoCompleteMode, InputOTPSizeVariant } from './types';
+import type { InputOTPSizeVariant } from './types';
 export declare const INPUT_OTP_DEFAULT_TAG = "div";
-export declare const INPUT_OTP_DEFAULT_AUTO_COMPLETE_MODE: InputOTPAutoCompleteMode;
-export declare const INPUT_OTP_DEFAULT_DISABLE_STROKE: boolean;
-export declare const INPUT_OTP_DEFAULT_SIZE: InputOTPSizeVariant;
+export declare const INPUT_OTP_DEFAULT_AUTO_COMPLETE_MODE = "firstOnly";
+export declare const INPUT_OTP_DEFAULT_DISABLE_STROKE = false;
+export declare const INPUT_OTP_DEFAULT_SIZE = "s";
 export declare const INPUT_OTP_SPACING_BY_SIZE: Readonly<Record<InputOTPSizeVariant, StackGapVariant>>;
 export declare const INPUT_OTP_DEFAULT_FINISH_BEHAVIOR: ({ isFullFilled }: import("./types").InputOTPFinishBehaviorContext) => boolean;

package/__inner__/esm/components/InputOTP/presets.d.ts

@@ -1,12 +1,17 @@
 export declare const INPUT_OTP_VALIDATE_PRESET: {
+    /** Только текст */
     TEXT: (value: string) => boolean;
+    /** Только числа */
     NUMERIC: (value: string) => boolean;
+    /** Текст и числа */
     TEXT_NUMERIC: (value: string) => boolean;
 };
 export declare const INPUT_OTP_MASK_PRESET: {
     PASSWORD: string;
 };
 export declare const INPUT_OTP_FINISH_BEHAVIOR_PRESET: {
+    /** Реагирует на полный ввод на любом из input */
     FULL_FILLED_NON_LAST_INPUT: ({ isFullFilled }: import("./types").InputOTPFinishBehaviorContext) => boolean;
+    /** Реагирует на полный ввод только на последнем input, либо на нажатие на Enter при полном заполнении */
     FULL_FILLED_ON_LAST_INPUT: ({ isFullFilled, isChangeOnLastInput, isEnter, }: import("./types").InputOTPFinishBehaviorContext) => boolean;
 };

package/__inner__/esm/components/InputOTP/presets.js

@@ -1,16 +1,21 @@
 export var INPUT_OTP_VALIDATE_PRESET = {
+    /** Только текст */
     TEXT: function (value) { return /[a-zA-Z]{1}/.test(value); },
+    /** Только числа */
     NUMERIC: function (value) { return /\d{1}/.test(value); },
+    /** Текст и числа */
     TEXT_NUMERIC: function (value) { return /[a-zA-Z0-9]{1}/.test(value); },
 };
 export var INPUT_OTP_MASK_PRESET = {
     PASSWORD: '•',
 };
 export var INPUT_OTP_FINISH_BEHAVIOR_PRESET = {
+    /** Реагирует на полный ввод на любом из input */
     FULL_FILLED_NON_LAST_INPUT: function (_a) {
         var isFullFilled = _a.isFullFilled;
         return isFullFilled;
     },
+    /** Реагирует на полный ввод только на последнем input, либо на нажатие на Enter при полном заполнении */
     FULL_FILLED_ON_LAST_INPUT: function (_a) {
         var isFullFilled = _a.isFullFilled, isChangeOnLastInput = _a.isChangeOnLastInput, isEnter = _a.isEnter;
         if (isFullFilled && isChangeOnLastInput) {

package/__inner__/esm/components/InputOTP/types.d.ts

@@ -1,4 +1,4 @@
-import type { ComponentPropsWithRef, ElementType } from 'react';
+import type { ComponentPropsWithRef, ComponentRef, ElementType, ReactNode } from 'react';
 import type { PolymorphicComponentPropsWithRef } from '../../utils/polymorphicComponentWithRef';
 import type { FIELD_CONTROL_DEFAULT_TAG, FieldControlBaseProps } from '../FieldControl';
 import type { FieldInputProps } from '../FieldInput';
@@ -38,15 +38,15 @@ export type InputOTPFinishBehaviorContext = {
     value: string;
     /** Необработанное значение */
     rawValue: InputOTPRawValue;
-    /** Значение с маской */
+    /** Значение с примененной маской */
     maskedValue: string;
-    /** Необработанное значение с маской */
+    /** Необработанное значение с примененной маской */
     maskedRawValue: InputOTPRawValue;
-    /** Флаг: Это изменение на последнем input'е */
+    /** Если `true` — это изменение на последнем input */
     isChangeOnLastInput: boolean;
-    /** index input'а, на котором произошло изменение */
+    /** index input, на котором произошло изменение */
     inputIndex: number;
-    /** Флаг: Был нажат enter */
+    /** Если `true` — это нажатие Enter */
     isEnter: boolean;
 };
 export type InputOTPFinishBehavior = (context: InputOTPFinishBehaviorContext) => boolean;
@@ -87,6 +87,8 @@ export type InputOTPBaseProps = {
     placeholder?: InputOTPDynamicInputParameter<string>;
     /** Свойства Field */
     fieldProps?: InputOTPDynamicInputParameter<PolymorphicComponentPropsWithRef<FieldControlBaseProps, typeof FIELD_CONTROL_DEFAULT_TAG>>;
+    /** Дополнительное описание к полю */
+    hint?: ReactNode;
     /** Свойства Input */
     inputProps?: InputOTPDynamicInputParameter<FieldInputProps>;
     /** Свойства InputContainer */
@@ -99,3 +101,4 @@ export type InputOTPBaseProps = {
     'data-testid'?: string;
 };
 export type InputOTPProps<As extends ElementType = typeof INPUT_OTP_DEFAULT_TAG> = PolymorphicComponentPropsWithRef<InputOTPBaseProps, As>;
+export type InputOTPRef<As extends ElementType = typeof INPUT_OTP_DEFAULT_TAG> = ComponentRef<As>;

package/__inner__/esm/components/OzenProvider/providers/theme/entities/defaultProps.d.ts

@@ -66,6 +66,7 @@ import type { SelectProps } from '../../../../Select';
 import type { SliderProps } from '../../../../Slider';
 import type { SnackbarProviderProps } from '../../../../Snackbar';
 import type { StackProps } from '../../../../Stack';
+import type { StepperVerticalProps, StepperVerticalStepButtonProps, StepperVerticalStepProps, StepperVerticalIndicatorProps, StepperVerticalIconIndicatorProps } from '../../../../StepperVertical';
 import type { TableContainerProps, TableProps, TableCaptionProps, TableCellProps } from '../../../../Table';
 import type { TagProps } from '../../../../Tag';
 import type { TagProps as TagPropsNext } from '../../../../TagNext';
@@ -188,6 +189,11 @@ export type ThemeDefaultProps = {
     Slider?: Partial<SliderProps>;
     SnackbarProvider?: Partial<SnackbarProviderProps>;
     Stack?: Partial<StackProps>;
+    StepperVertical?: Partial<StepperVerticalProps>;
+    StepperVerticalStep?: Partial<StepperVerticalStepProps>;
+    StepperVerticalStepButton?: Partial<StepperVerticalStepButtonProps>;
+    StepperVerticalIconIndicator?: Partial<StepperVerticalIconIndicatorProps>;
+    StepperVerticalIndicator?: Partial<StepperVerticalIndicatorProps>;
     Table?: Partial<TableProps>;
     TableCaption?: Partial<TableCaptionProps>;
     TableCell?: Partial<TableCellProps>;

package/__inner__/esm/components/StepperVertical/StepperVertical.css

@@ -0,0 +1,4 @@
+.StepperVertical {
+  max-inline-size: 100%;
+  box-sizing: border-box;
+}

package/__inner__/esm/components/StepperVertical/StepperVertical.d.ts

@@ -0,0 +1,7 @@
+import './StepperVertical.css';
+import './modules/StepperVerticalIconIndicator/StepperVerticalIconIndicator.css';
+import './modules/StepperVerticalIndicator/StepperVerticalIndicator.css';
+import './modules/StepperVerticalStep/StepperVerticalStep.css';
+import type { StepperVerticalBaseProps } from './types';
+export declare const cnStepperVertical: import("@bem-react/classname").ClassNameFormatter;
+export declare const StepperVertical: import("../../utils").PolymorphicComponentWithRef<StepperVerticalBaseProps, "div", "as">;

package/__inner__/esm/components/StepperVertical/StepperVertical.js

@@ -0,0 +1,18 @@
+import { __assign, __rest } from "tslib";
+import './StepperVertical.css';
+import './modules/StepperVerticalIconIndicator/StepperVerticalIconIndicator.css';
+import './modules/StepperVerticalIndicator/StepperVerticalIndicator.css';
+import './modules/StepperVerticalStep/StepperVerticalStep.css';
+import React from 'react';
+import { useThemeProps } from '../../hooks/useThemeProps';
+import { cn, polymorphicComponentWithRef } from '../../utils';
+import { Stack } from '../Stack';
+import { STEPPER_VERTICAL_DEFAULT_ELLIPSIS, STEPPER_VERTICAL_DEFAULT_TAG, } from './constants';
+import { StepperVerticalContext } from './StepperVerticalContext';
+export var cnStepperVertical = cn('StepperVertical');
+export var StepperVertical = polymorphicComponentWithRef(function (inProps, ref) {
+    var props = useThemeProps({ name: 'StepperVertical', props: inProps });
+    var children = props.children, _a = props.as, as = _a === void 0 ? STEPPER_VERTICAL_DEFAULT_TAG : _a, _b = props.ellipsis, ellipsis = _b === void 0 ? STEPPER_VERTICAL_DEFAULT_ELLIPSIS : _b, className = props.className, fullWidth = props.fullWidth, other = __rest(props, ["children", "as", "ellipsis", "className", "fullWidth"]);
+    return (React.createElement(StepperVerticalContext.Provider, { value: { ellipsis: ellipsis } },
+        React.createElement(Stack, __assign({}, other, { ref: ref, as: as, className: cnStepperVertical('', [className]), direction: "column", display: fullWidth ? 'block' : 'inline' }), children)));
+});

package/__inner__/esm/components/StepperVertical/StepperVerticalContext.d.ts

@@ -0,0 +1,6 @@
+export type StepperVerticalContextValue = {
+    ellipsis: boolean;
+};
+export declare const StepperVerticalContextDefaultValue: StepperVerticalContextValue;
+export declare const StepperVerticalContext: import("react").Context<StepperVerticalContextValue>;
+export declare const useStepperVerticalContext: () => StepperVerticalContextValue;

package/__inner__/esm/components/StepperVertical/StepperVerticalContext.js

@@ -0,0 +1,14 @@
+import { useContext, createContext } from 'react';
+import { isDev } from '../../constants/environment';
+import { STEPPER_VERTICAL_DEFAULT_ELLIPSIS } from './constants';
+export var StepperVerticalContextDefaultValue = {
+    ellipsis: STEPPER_VERTICAL_DEFAULT_ELLIPSIS,
+};
+export var StepperVerticalContext = createContext(StepperVerticalContextDefaultValue);
+export var useStepperVerticalContext = function () {
+    return useContext(StepperVerticalContext);
+};
+// Именованный провайдер
+if (isDev) {
+    StepperVerticalContext.displayName = 'StepperVerticalContext';
+}

package/__inner__/esm/components/StepperVertical/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const STEPPER_VERTICAL_DEFAULT_TAG = "div";
+export declare const STEPPER_VERTICAL_DEFAULT_FULL_WIDTH = false;
+export declare const STEPPER_VERTICAL_DEFAULT_ELLIPSIS = false;

package/__inner__/esm/components/StepperVertical/constants.js

@@ -0,0 +1,3 @@
+export var STEPPER_VERTICAL_DEFAULT_TAG = 'div';
+export var STEPPER_VERTICAL_DEFAULT_FULL_WIDTH = false;
+export var STEPPER_VERTICAL_DEFAULT_ELLIPSIS = false;

package/__inner__/esm/components/StepperVertical/index.d.ts

@@ -0,0 +1,5 @@
+export * from './modules';
+export * from './constants';
+export * from './StepperVertical';
+export * from './StepperVerticalContext';
+export * from './types';

package/__inner__/esm/components/StepperVertical/index.js

@@ -0,0 +1,5 @@
+export * from './modules';
+export * from './constants';
+export * from './StepperVertical';
+export * from './StepperVerticalContext';
+export * from './types';

package/__inner__/esm/components/StepperVertical/modules/StepperVerticalIconIndicator/StepperVerticalIconIndicator.css

@@ -0,0 +1,4 @@
+.StepperVerticalIconIndicator {
+  color: var(--stepper-vertical-indicator-color);
+  transition: var(--transition-default) color;
+}

package/__inner__/esm/components/StepperVertical/modules/StepperVerticalIconIndicator/StepperVerticalIconIndicator.d.ts

@@ -0,0 +1,3 @@
+import type { StepperVerticalIconIndicatorProps } from './types';
+export declare const cnStepperVerticalIconIndicator: import("@bem-react/classname").ClassNameFormatter;
+export declare const StepperVerticalIconIndicator: import("react").ForwardRefExoticComponent<Omit<StepperVerticalIconIndicatorProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;