@ozen-ui/kit 0.67.0 → 0.69.0

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInput/types.js

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

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputIcon/AutocompleteBaseInputIcon.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { AutocompleteBaseInputIconProps } from './types';
+export declare const cnAutocompleteBaseInputIcon: import("@bem-react/classname").ClassNameFormatter;
+export declare const AutocompleteBaseInputIcon: React.ForwardRefExoticComponent<Omit<AutocompleteBaseInputIconProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputIcon/AutocompleteBaseInputIcon.js

@@ -0,0 +1,15 @@
+import { __assign, __rest } from "tslib";
+import React, { forwardRef } from 'react';
+import { useThemeProps } from '../../../../hooks/useThemeProps';
+import { cn } from '../../../../utils/classname';
+import { FieldIcon } from '../../../FieldIcon';
+export var cnAutocompleteBaseInputIcon = cn('AutocompleteBaseInputIcon');
+export var AutocompleteBaseInputIcon = forwardRef(function (inProps, ref) {
+    var props = useThemeProps({
+        props: inProps,
+        name: 'AutocompleteBaseInputIcon',
+    });
+    var className = props.className, icon = props.icon, other = __rest(props, ["className", "icon"]);
+    return (React.createElement(FieldIcon, __assign({}, other, { icon: icon, className: cnAutocompleteBaseInputIcon('', [className]), ref: ref })));
+});
+AutocompleteBaseInputIcon.displayName = 'AutocompleteBaseInputIcon';

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputIcon/index.d.ts

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

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputIcon/index.js

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

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputIcon/types.d.ts

@@ -0,0 +1,4 @@
+import type { FieldIconProps } from '../../../FieldIcon';
+import type { TagRef } from '../../../TagNext';
+export type AutocompleteBaseInputIconProps = Omit<FieldIconProps, 'size'>;
+export type AutocompleteBaseInputIconRef = TagRef;

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputIcon/types.js

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

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputTag/AutocompleteBaseInputTag.css

@@ -0,0 +1,4 @@
+.AutocompleteBaseInputTag_disabled {
+    pointer-events: none;
+    opacity: 0.6;
+  }

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputTag/AutocompleteBaseInputTag.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const cnAutocompleteBaseInputTag: import("@bem-react/classname").ClassNameFormatter;
+export declare const AutocompleteBaseInputTag: React.ForwardRefExoticComponent<Omit<import("../../../TagNext").TagProps, "size"> & {
+    disabled?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputTag/AutocompleteBaseInputTag.js

@@ -0,0 +1,21 @@
+import { __assign, __rest } from "tslib";
+import React, { forwardRef } from 'react';
+import { useThemeProps } from '../../../../hooks/useThemeProps';
+import { cn } from '../../../../utils/classname';
+import { Tag } from '../../../TagNext';
+import { useAutocompleteBaseContext } from '../../AutocompleteBaseContext';
+import { AUTOCOMPLETE_BASE_INPUT_TAG_DEFAULT_COLOR, AUTOCOMPLETE_BASE_INPUT_TAG_DEFAULT_TAG, AUTOCOMPLETE_BASE_SIZE_TO_TAG_SIZE, } from './constants';
+export var cnAutocompleteBaseInputTag = cn('AutocompleteBaseInputTag');
+export var AutocompleteBaseInputTag = forwardRef(function (inProps, ref) {
+    var props = useThemeProps({
+        props: inProps,
+        name: 'AutocompleteBaseInputTag',
+    });
+    var className = props.className, _a = props.as, as = _a === void 0 ? AUTOCOMPLETE_BASE_INPUT_TAG_DEFAULT_TAG : _a, _b = props.color, color = _b === void 0 ? AUTOCOMPLETE_BASE_INPUT_TAG_DEFAULT_COLOR : _b, disabled = props.disabled, other = __rest(props, ["className", "as", "color", "disabled"]);
+    var autocompleteSize = useAutocompleteBaseContext().size;
+    var size = AUTOCOMPLETE_BASE_SIZE_TO_TAG_SIZE[autocompleteSize];
+    return (React.createElement(Tag, __assign({ as: as, size: size, className: cnAutocompleteBaseInputTag({
+            disabled: disabled,
+        }, [className]), color: color }, other, { ref: ref })));
+});
+AutocompleteBaseInputTag.displayName = 'AutocompleteBaseInputTag';

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputTag/constants.d.ts

@@ -0,0 +1,5 @@
+import type { TagSizeVariant } from '../../../TagNext';
+import type { AutocompleteBaseSize } from '../../entities';
+export declare const AUTOCOMPLETE_BASE_SIZE_TO_TAG_SIZE: Readonly<Record<AutocompleteBaseSize, TagSizeVariant>>;
+export declare const AUTOCOMPLETE_BASE_INPUT_TAG_DEFAULT_COLOR = "neutral";
+export declare const AUTOCOMPLETE_BASE_INPUT_TAG_DEFAULT_TAG = "div";

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputTag/constants.js

@@ -0,0 +1,9 @@
+export var AUTOCOMPLETE_BASE_SIZE_TO_TAG_SIZE = {
+    '2xs': '2xs',
+    xs: '2xs',
+    s: '2xs',
+    m: 'xs',
+    l: 'xs',
+};
+export var AUTOCOMPLETE_BASE_INPUT_TAG_DEFAULT_COLOR = 'neutral';
+export var AUTOCOMPLETE_BASE_INPUT_TAG_DEFAULT_TAG = 'div';

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputTag/index.d.ts

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

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputTag/index.js

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

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputTag/types.d.ts

@@ -0,0 +1,5 @@
+import type { TagProps, TagRef } from '../../../TagNext';
+export type AutocompleteBaseInputTagRef = TagRef;
+export type AutocompleteBaseInputTagProps = Omit<TagProps, 'size'> & {
+    disabled?: boolean;
+};

package/__inner__/esm/components/AutocompleteBase/modules/AutocompleteBaseInputTag/types.js

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

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

@@ -0,0 +1,4 @@
+export * from './AutocompleteBaseDropdown';
+export * from './AutocompleteBaseInput';
+export * from './AutocompleteBaseInputIcon';
+export * from './AutocompleteBaseInputTag';

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

@@ -0,0 +1,4 @@
+export * from './AutocompleteBaseDropdown';
+export * from './AutocompleteBaseInput';
+export * from './AutocompleteBaseInputIcon';
+export * from './AutocompleteBaseInputTag';

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

@@ -0,0 +1,45 @@
+import type { AutocompleteBaseOnInputChange, AutocompleteBaseOnChange, AutocompleteBaseRenderInput, AutocompleteBaseOnClose, AutocompleteBaseOnOpen, AutocompleteBaseDefaultOption, AutocompleteBasePropPrepareOption, AutocompleteBaseSearchFunction, AutocompleteBaseSize, AutocompleteBaseValue, AutocompleteBaseRenderDropdown } from './entities';
+export type AutocompleteBaseProps<Option = AutocompleteBaseDefaultOption, Multiple extends boolean = false> = {
+    /** Если `true` из списка можно выбрать несколько вариантов */
+    multiple?: Multiple;
+    /** Список вариантов выбора (опции) */
+    options: Option[];
+    /** Размер */
+    size?: AutocompleteBaseSize;
+    /** Если `true` переводит поле в состояние ошибки */
+    error?: boolean;
+    /** Выбранное значение опции */
+    value?: AutocompleteBaseValue<Option, Multiple>;
+    /** Выбранное значение опции по умолчанию */
+    defaultValue?: AutocompleteBaseValue<Option, Multiple>;
+    /** Текущее состояние списка. Если `true`, список отображается. */
+    open?: boolean;
+    /** Состояние открытие по умолчанию (неконтролируемый компонент) */
+    defaultOpen?: boolean;
+    /** Функция обратного вызова, которая будет вызвана когда компонент запрашивает открытие */
+    onOpen?: AutocompleteBaseOnOpen;
+    /** Функция обратного вызова, которая будет вызвана когда компонент запрашивает закрытие */
+    onClose?: AutocompleteBaseOnClose;
+    /** Функция обратного вызова, которая будет вызвана при выборе значения */
+    onChange?: AutocompleteBaseOnChange<Option, Multiple>;
+    /** Функция обратного вызова, которая будет вызвана при вводе значения с клавиатуры */
+    onInputChange?: AutocompleteBaseOnInputChange;
+    /** Введённое значение в текстовом поле */
+    inputValue?: string;
+    /** Если `true` отображает статус загрузки (при условии отсутствующих опций) */
+    loading?: boolean;
+    /** Функция поиска */
+    searchFunction?: AutocompleteBaseSearchFunction<Option>;
+    /** Функция для кастомизации текстового поля */
+    renderInput: AutocompleteBaseRenderInput;
+    /** Функция для кастомизации выпадающего элемента для выбора значения */
+    renderDropdown: AutocompleteBaseRenderDropdown;
+    /** Функция для приведения опцию к внутреннему формату */
+    prepareOption?: AutocompleteBasePropPrepareOption<Option>;
+    /** Если `true` делает элемент неактивным */
+    disabled?: boolean;
+    /** Если `true` позволяет вводить кастомное значение в текстовом поле */
+    allowCustomValue?: boolean;
+    /** Если `true` закрывает выпадающий список при выборе опции */
+    closeOnSelect?: boolean;
+};

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

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

package/__inner__/esm/components/AutocompleteBase/utils/index.d.ts

@@ -0,0 +1,3 @@
+export * from './isMultiple';
+export * from './isSingle';
+export * from './prepareOption';

package/__inner__/esm/components/AutocompleteBase/utils/index.js

@@ -0,0 +1,3 @@
+export * from './isMultiple';
+export * from './isSingle';
+export * from './prepareOption';

package/__inner__/esm/components/AutocompleteBase/utils/isMultiple.d.ts

@@ -0,0 +1,4 @@
+import type { AutocompleteBaseInternalMultipleValue, AutocompleteBaseInternalValue } from '../entities';
+import type { AutocompleteBaseProps } from '../types';
+export declare const isMultipleProps: <Option>(props: AutocompleteBaseProps<Option, boolean>) => props is AutocompleteBaseProps<Option, true>;
+export declare const isMultipleInternalValue: <Option>(_: AutocompleteBaseInternalValue<Option, boolean> | undefined, multiple: boolean) => _ is AutocompleteBaseInternalMultipleValue<Option> | undefined;

package/__inner__/esm/components/AutocompleteBase/utils/isMultiple.js

@@ -0,0 +1,2 @@
+export var isMultipleProps = function (props) { return !!props.multiple; };
+export var isMultipleInternalValue = function (_, multiple) { return multiple; };

package/__inner__/esm/components/AutocompleteBase/utils/isSingle.d.ts

@@ -0,0 +1,4 @@
+import type { AutocompleteBaseInternalSingleValue, AutocompleteBaseInternalValue } from '../entities';
+import type { AutocompleteBaseProps } from '../types';
+export declare const isSingleProps: <Option>(props: AutocompleteBaseProps<Option, boolean>) => props is AutocompleteBaseProps<Option, false>;
+export declare const isSingleInternalValue: <Option>(_: AutocompleteBaseInternalValue<Option, boolean> | undefined, multiple: boolean) => _ is AutocompleteBaseInternalSingleValue<Option> | undefined;

package/__inner__/esm/components/AutocompleteBase/utils/isSingle.js

@@ -0,0 +1,2 @@
+export var isSingleProps = function (props) { return !props.multiple; };
+export var isSingleInternalValue = function (_, multiple) { return !multiple; };

package/__inner__/esm/components/AutocompleteBase/utils/prepareOption.d.ts

@@ -0,0 +1,2 @@
+import type { AutocompleteBaseDefaultOption, AutocompleteBasePropPrepareOption } from '../entities';
+export declare const autocompleteBaseDefaultPrepareOption: AutocompleteBasePropPrepareOption<AutocompleteBaseDefaultOption>;

package/__inner__/esm/components/AutocompleteBase/utils/prepareOption.js

@@ -0,0 +1,16 @@
+import { isString } from '../../../utils/isString';
+export var autocompleteBaseDefaultPrepareOption = function (option) {
+    var _a;
+    if (isString(option)) {
+        return {
+            id: option,
+            label: option,
+            disabled: false,
+        };
+    }
+    return {
+        id: option.id,
+        label: option.label,
+        disabled: (_a = option.disabled) !== null && _a !== void 0 ? _a : false,
+    };
+};

package/__inner__/esm/components/AutocompleteNext/Autocomplete.js

@@ -211,3 +211,4 @@ function AutocompleteRender(inProps, ref) {
         React.createElement(AutocompleteDropdown, { open: open, size: size, loading: loading, setUpdate: setUpdate, value: valueState, multiple: multiple, onClose: handleClose, listProps: listProps, anchorRef: anchorRef, hasOptions: hasOptions, options: filteredOptions, loadingText: loadingText, renderOption: renderOption, getOptionKey: getOptionKey, noOptionsText: noOptionsText, onChange: handleChangeDropdown, getOptionLabel: getOptionLabel, getOptionDisabled: getOptionDisabled, disableShowEmptyOptionsList: disableShowEmptyOptionsList, popoverProps: __assign(__assign({}, popoverProps), { onExited: handleExited }) })));
 }
 export var Autocomplete = forwardRef(AutocompleteRender);
+Autocomplete.displayName = 'Autocomplete';

package/__inner__/esm/components/AutocompleteNext/components/AutocompleteDropdown/AutocompleteDropdown.js

@@ -89,7 +89,7 @@ var AutocompleteDropdownRender = function (inProps, ref) {
     /** Отображение опций */
     var renderOptionDefault = function (_a) {
         var props = _a.props, option = _a.option, selected = _a.state.selected;
-        return (React.createElement(ListItem, __assign({}, props),
+        return (React.createElement(ListItem, __assign({}, props, { key: props.key }),
             React.createElement(ListItemText, { primary: getOptionLabel(option) }),
             React.createElement(AutocompleteDropdownCheckIcon, { selected: selected })));
     };

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

@@ -1,6 +1,7 @@
 import type { ChangeEvent, HTMLAttributes, ReactElement, ReactNode, Ref, SyntheticEvent } from 'react';
 import type { TagProps, TagRef } from '../../components/TagNext';
 import type { FormElementSizeVariant } from '../../types/FormElementSizeVariant';
+import type { WithDisplayName } from '../../types/react';
 import type { InputProps, InputRef } from '../Input';
 import type { AutocompleteDropdownProps } from './components';
 export declare const autocompleteRenderRightPosition: readonly ["before", "between", "after"];
@@ -126,5 +127,5 @@ export type AutocompleteProps<OPTION = AutocompleteDefaultOption, MULTIPLE exten
 } ? object : {
     getOptionDisabled?: AutocompletePropGetOptionDisabled<OPTION>;
 });
-export type AutocompleteComponent = <OPTION = AutocompleteDefaultOption, MULTIPLE extends boolean = false>(props: AutocompleteProps<OPTION, MULTIPLE>) => ReactElement | null;
+export type AutocompleteComponent = WithDisplayName<(<OPTION = AutocompleteDefaultOption, MULTIPLE extends boolean = false>(props: AutocompleteProps<OPTION, MULTIPLE>) => ReactElement | null)>;
 export {};

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

@@ -12,6 +12,8 @@ export declare const BottomSheetBase: React.ForwardRefExoticComponent<{
     disableScrollLock?: boolean;
     bottomSheetClassName?: string;
     'data-testid'?: string;
-} & import("../Portal").PortalBaseProps & {
+} & {
+    container?: import("../../hooks/usePortalContainer").PortalContainer;
+} & Omit<import("../PortalBase").PortalBaseBaseProps, "container"> & {
     as?: "div" | undefined;
-} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof import("../Portal").PortalBaseProps> & React.RefAttributes<HTMLDivElement>>;
+} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "data-testid" | "container" | "disablePortal"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/BottomSheetBase/BottomSheetBase.js

@@ -2,23 +2,25 @@ import { __assign, __read, __rest } from "tslib";
 import './BottomSheetBase.css';
 import React, { forwardRef, useState } from 'react';
 import { useLockBodyScroll } from '../../hooks/useLockBodyScroll';
+import { usePortalContainer } from '../../hooks/usePortalContainer';
 import { BottomSheetBaseLayout } from './components';
-import { BOTTOM_SHEET_BASE_CLOSABLE, BOTTOM_SHEET_BASE_DISABLE_SCROLL_LOCK, BOTTOM_SHEET_BASE_HIDE_BACKDROP, } from './constants';
+import { BOTTOM_SHEET_BASE_CLOSABLE, BOTTOM_SHEET_BASE_DISABLE_SCROLL_LOCK, BOTTOM_SHEET_BASE_HIDE_BACKDROP, BOTTOM_SHEET_BASE_PORTAL_CONTAINER, } from './constants';
 import { BottomSheetBaseContextProvider } from './context/BottomSheetBaseContextProvider';
 import { useBottomSheetBaseVisibility } from './hooks';
 import { BottomSheetBaseBackdrop } from './modules';
 export var BottomSheetBase = forwardRef(function (_a, ref) {
-    var children = _a.children, snaps = _a.snaps, open = _a.open, maxHeight = _a.maxHeight, defaultSnap = _a.defaultSnap, _b = _a.onClose, onClose = _b === void 0 ? function () { } : _b, _c = _a.closable, closable = _c === void 0 ? BOTTOM_SHEET_BASE_CLOSABLE : _c, _d = _a.backdrop, backdrop = _d === void 0 ? React.createElement(BottomSheetBaseBackdrop, null) : _d, _e = _a.hideBackdrop, hideBackdrop = _e === void 0 ? BOTTOM_SHEET_BASE_HIDE_BACKDROP : _e, _f = _a.disableScrollLock, disableScrollLock = _f === void 0 ? BOTTOM_SHEET_BASE_DISABLE_SCROLL_LOCK : _f, bottomSheetClassName = _a.bottomSheetClassName, other = __rest(_a, ["children", "snaps", "open", "maxHeight", "defaultSnap", "onClose", "closable", "backdrop", "hideBackdrop", "disableScrollLock", "bottomSheetClassName"]);
-    var _g = __read(useState(false), 2), isAnimating = _g[0], setIsAnimating = _g[1];
+    var children = _a.children, snaps = _a.snaps, open = _a.open, maxHeight = _a.maxHeight, defaultSnap = _a.defaultSnap, _b = _a.onClose, onClose = _b === void 0 ? function () { } : _b, _c = _a.closable, closable = _c === void 0 ? BOTTOM_SHEET_BASE_CLOSABLE : _c, _d = _a.backdrop, backdrop = _d === void 0 ? React.createElement(BottomSheetBaseBackdrop, null) : _d, _e = _a.hideBackdrop, hideBackdrop = _e === void 0 ? BOTTOM_SHEET_BASE_HIDE_BACKDROP : _e, _f = _a.disableScrollLock, disableScrollLock = _f === void 0 ? BOTTOM_SHEET_BASE_DISABLE_SCROLL_LOCK : _f, bottomSheetClassName = _a.bottomSheetClassName, _g = _a.container, containerProp = _g === void 0 ? BOTTOM_SHEET_BASE_PORTAL_CONTAINER : _g, other = __rest(_a, ["children", "snaps", "open", "maxHeight", "defaultSnap", "onClose", "closable", "backdrop", "hideBackdrop", "disableScrollLock", "bottomSheetClassName", "container"]);
+    var _h = __read(useState(false), 2), isAnimating = _h[0], setIsAnimating = _h[1];
     var isVisible = useBottomSheetBaseVisibility({
         isAnimating: isAnimating,
         isOpen: open,
     });
     useLockBodyScroll(open && !disableScrollLock);
-    if (!isVisible) {
+    var container = usePortalContainer(containerProp);
+    if (!isVisible || !container) {
         return null;
     }
     return (React.createElement(BottomSheetBaseContextProvider, { snaps: snaps, onClose: onClose, defaultSnap: defaultSnap, maxHeight: maxHeight, isClosable: closable, isOpen: open, setIsAnimating: setIsAnimating },
-        React.createElement(BottomSheetBaseLayout, __assign({}, other, { ref: ref, backdrop: backdrop, hideBackdrop: hideBackdrop, bottomSheetClassName: bottomSheetClassName }), children)));
+        React.createElement(BottomSheetBaseLayout, __assign({}, other, { ref: ref, backdrop: backdrop, container: container, hideBackdrop: hideBackdrop, bottomSheetClassName: bottomSheetClassName }), children)));
 });
 BottomSheetBase.displayName = 'BottomSheetBase';

package/__inner__/esm/components/BottomSheetBase/components/BottomSheetBaseLayout/BottomSheetBaseLayout.d.ts

@@ -4,6 +4,6 @@ export declare const BottomSheetBaseLayout: React.ForwardRefExoticComponent<{
     backdrop: React.ReactNode;
     bottomSheetClassName: string | undefined;
     'data-testid'?: string;
-} & import("../../../Portal").PortalBaseProps & {
+} & import("../../../PortalBase").PortalBaseBaseProps & {
     as?: "div" | undefined;
-} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof import("../../../Portal").PortalBaseProps> & React.RefAttributes<HTMLDivElement>>;
+} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof import("../../../PortalBase").PortalBaseBaseProps> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/BottomSheetBase/components/BottomSheetBaseLayout/BottomSheetBaseLayout.js

@@ -1,14 +1,14 @@
 import { __assign, __rest } from "tslib";
 import React, { forwardRef } from 'react';
 import { useMultiRef } from '../../../../hooks/useMultiRef';
-import { Portal } from '../../../Portal';
+import { PortalBase } from '../../../PortalBase';
 import { useBottomSheetBaseContext } from '../../context';
 import { cnBottomSheetBase } from '../../utils';
 export var BottomSheetBaseLayout = forwardRef(function (_a, ref) {
     var children = _a.children, backdrop = _a.backdrop, hideBackdrop = _a.hideBackdrop, className = _a.className, bottomSheetClassName = _a.bottomSheetClassName, portalProps = __rest(_a, ["children", "backdrop", "hideBackdrop", "className", "bottomSheetClassName"]);
     var rootRef = useBottomSheetBaseContext().rootRef;
     var multiRef = useMultiRef([ref, rootRef]);
-    return (React.createElement(Portal, __assign({}, portalProps, { ref: multiRef, className: cnBottomSheetBase('Wrapper', [className]) }),
+    return (React.createElement(PortalBase, __assign({}, portalProps, { ref: multiRef, className: cnBottomSheetBase('Wrapper', [className]) }),
         !hideBackdrop && backdrop,
         React.createElement("div", { className: cnBottomSheetBase('', [bottomSheetClassName]) }, children)));
 });

package/__inner__/esm/components/BottomSheetBase/components/BottomSheetBaseLayout/types.d.ts

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
-import type { PortalProps } from '../../../Portal';
+import type { PortalBaseProps } from '../../../PortalBase';
 import type { BottomSheetBaseRef } from '../../entities';
 export type BottomSheetBaseLayoutRef = BottomSheetBaseRef;
 export type BottomSheetBaseLayoutProps = {
@@ -7,4 +7,4 @@ export type BottomSheetBaseLayoutProps = {
     backdrop: ReactNode;
     bottomSheetClassName: string | undefined;
     'data-testid'?: string;
-} & PortalProps;
+} & PortalBaseProps;

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

@@ -8,3 +8,4 @@ export type BottomSheetBaseCSSVariable = (typeof BOTTOM_SHEET_BASE_CSS_VARIABLE)
 export declare const BOTTOM_SHEET_BASE_CLOSABLE = true;
 export declare const BOTTOM_SHEET_BASE_HIDE_BACKDROP = false;
 export declare const BOTTOM_SHEET_BASE_DISABLE_SCROLL_LOCK = false;
+export declare const BOTTOM_SHEET_BASE_PORTAL_CONTAINER: () => HTMLElement;

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

@@ -7,3 +7,6 @@ export var BOTTOM_SHEET_BASE_CSS_VARIABLE = {
 export var BOTTOM_SHEET_BASE_CLOSABLE = true;
 export var BOTTOM_SHEET_BASE_HIDE_BACKDROP = false;
 export var BOTTOM_SHEET_BASE_DISABLE_SCROLL_LOCK = false;
+export var BOTTOM_SHEET_BASE_PORTAL_CONTAINER = (function () {
+    return window.document.body;
+});

package/__inner__/esm/components/BottomSheetBase/context/BottomSheetBaseContext.js

@@ -1,5 +1,5 @@
 import { createContext, useContext } from 'react';
-import { IS_DEV } from '../../../constants/environment';
+import { isDev } from '../../../constants/environment';
 export var BottomSheetBaseContext = createContext({
     rootRef: {
         current: null,
@@ -40,6 +40,6 @@ export var useBottomSheetBaseContext = function () {
     return useContext(BottomSheetBaseContext);
 };
 // Именованный провайдер
-if (IS_DEV) {
+if (isDev) {
     BottomSheetBaseContext.displayName = 'BottomSheetBaseContext';
 }

package/__inner__/esm/components/BottomSheetBase/modules/BottomSheetBaseBackdrop/BottomSheetBaseBackdrop.js

@@ -21,3 +21,4 @@ export var BottomSheetBaseBackdrop = polymorphicComponentWithRef(function (_a, r
             draggable: expandOnDrag,
         }, [className]) })));
 });
+BottomSheetBaseBackdrop.displayName = 'BottomSheetBaseBackdrop';

package/__inner__/esm/components/Button/Button.js

@@ -1,8 +1,8 @@
 import { __assign, __rest } from "tslib";
 import './Button.css';
 import React, { useRef } from 'react';
-import { deprecate } from '@ozen-ui/logger';
 import { CSSTransition } from 'react-transition-group';
+import { useDeprecatedComponent } from '../../hooks/useDeprecated';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
 import { getIconSizeToFormElement } from '../../utils/getIconSizeToFormElement';
@@ -32,9 +32,7 @@ export var Button = polymorphicComponentWithRef(function (inProps, ref) {
         name: 'Button',
     });
     var loaderRef = useRef(null);
-    if (process.env.NODE_ENV !== 'production') {
-        deprecate('Компонент «Button» устарел. Для замены используйте компонент «ButtonNext».');
-    }
+    useDeprecatedComponent('Button');
     var _a = props.as, Tag = _a === void 0 ? BUTTON_DEFAULT_TAG : _a, _b = props.variant, variant = _b === void 0 ? BUTTON_DEFAULT_VARIANT : _b, _c = props.color, color = _c === void 0 ? BUTTON_DEFAULT_COLOR : _c, _d = props.size, size = _d === void 0 ? BUTTON_DEFAULT_SIZE : _d, iconLeft = props.iconLeft, iconRight = props.iconRight, loading = props.loading, children = props.children, disabled = props.disabled, className = props.className, fullWidth = props.fullWidth, labelProps = props.labelProps, onClick = props.onClick, other = __rest(props, ["as", "variant", "color", "size", "iconLeft", "iconRight", "loading", "children", "disabled", "className", "fullWidth", "labelProps", "onClick"]);
     var iconSize = getIconSizeToFormElement(size);
     var handleClick = function (event) {

package/__inner__/esm/components/Calendar/Calendar.js

@@ -10,7 +10,6 @@ var typeMap = {
     range: CalendarModeRange,
     single: CalendarModeSingle,
 };
-// eslint-disable-next-line react/display-name
 export var Calendar = forwardRef(function (inProps, ref) {
     var props = useThemeProps({
         props: inProps,
@@ -21,3 +20,4 @@ export var Calendar = forwardRef(function (inProps, ref) {
     var Component = getByMap(typeMap, mode);
     return (React.createElement(Component, __assign({ size: size, startDay: startDay, calendars: calendars, getPeriodSwitchAriaLabel: getPeriodSwitchAriaLabel }, other, { ref: ref })));
 });
+Calendar.displayName = 'Calendar';

package/__inner__/esm/components/Calendar/components/CalendarModeRange/CalendarModeRange.js

@@ -7,7 +7,6 @@ import { CalendarContext } from '../../CalendarContext';
 import { cnCalendar } from '../../utils';
 import { Calendars } from '../index';
 import { CalendarAdditionalControls } from './components';
-// eslint-disable-next-line react/display-name
 export var CalendarModeRange = forwardRef(function (inProps, ref) {
     var props = useThemeProps({
         props: inProps,
@@ -70,3 +69,4 @@ export var CalendarModeRange = forwardRef(function (inProps, ref) {
                 React.createElement(Calendars, { onCalendarsChange: onCalendarsChange }),
                 React.createElement(CalendarAdditionalControls, { renderAdditionalControls: renderAdditionalControls })))));
 });
+CalendarModeRange.displayName = 'CalendarModeRange';

package/__inner__/esm/components/Calendar/components/CalendarModeSingle/CalendarModeSingle.js

@@ -6,7 +6,6 @@ import { CalendarContext } from '../../CalendarContext';
 import { cnCalendar } from '../../utils';
 import { Calendars } from '../index';
 import { CalendarAdditionalControls } from './components';
-// eslint-disable-next-line react/display-name
 export var CalendarModeSingle = forwardRef(function (props, ref) {
     var size = props.size, startDay = props.startDay, renderAdditionalControls = props.renderAdditionalControls, locale = props.locale, onChangeProp = props.onChange, onOffsetDateChangeProp = props.onOffsetDateChange, onMonthClick = props.onMonthClick, onDayClick = props.onDayClick, onYearClick = props.onYearClick, valueProp = props.value, defaultValue = props.defaultValue, offsetDateProp = props.offsetDate, onCalendarsChange = props.onCalendarsChange, defaultOffsetDate = props.defaultOffsetDate, exclude = props.exclude, minDate = props.minDate, maxDate = props.maxDate, calendars = props.calendars, className = props.className, getPeriodSwitchAriaLabel = props.getPeriodSwitchAriaLabel, other = __rest(props, ["size", "startDay", "renderAdditionalControls", "locale", "onChange", "onOffsetDateChange", "onMonthClick", "onDayClick", "onYearClick", "value", "defaultValue", "offsetDate", "onCalendarsChange", "defaultOffsetDate", "exclude", "minDate", "maxDate", "calendars", "className", "getPeriodSwitchAriaLabel"]);
     var _a = __read(useControlled({
@@ -61,3 +60,4 @@ export var CalendarModeSingle = forwardRef(function (props, ref) {
                 React.createElement(Calendars, { onCalendarsChange: onCalendarsChange }),
                 React.createElement(CalendarAdditionalControls, { renderAdditionalControls: renderAdditionalControls })))));
 });
+CalendarModeSingle.displayName = 'CalendarModeSingle';

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

@@ -1,6 +1,7 @@
 import type { MouseEvent, ReactElement, ReactNode } from 'react';
 import type { DPExcludeConfig, DPDayInteger } from '@rehookify/datepicker';
 import type { ExtendableComponentPropsWithRef } from '../../types/ExtendableComponentPropsWithRef';
+import type { WithDisplayName } from '../../types/react';
 import type { CALENDAR_DEFAULT_MODE } from './constants';
 export declare const calendarStepVariant: readonly ["days", "months", "years"];
 export declare const calendarSizeVariant: readonly ["s", "m", "l"];
@@ -89,5 +90,5 @@ export type CalendarProps<MODE extends CalendarModeVariant = typeof CALENDAR_DEF
     calendars?: CalendarPropCalendars;
     children?: never;
 }, 'div'>;
-export type CalendarComponent = <MODE extends CalendarModeVariant = typeof CALENDAR_DEFAULT_MODE>(props: CalendarProps<MODE>) => ReactNode;
-export type CalendarModeComponent<MODE extends CalendarModeVariant> = (props: Omit<CalendarProps<MODE>, 'mode'>) => ReactNode;
+export type CalendarComponent = WithDisplayName<(<MODE extends CalendarModeVariant = typeof CALENDAR_DEFAULT_MODE>(props: CalendarProps<MODE>) => ReactNode)>;
+export type CalendarModeComponent<MODE extends CalendarModeVariant> = WithDisplayName<(props: Omit<CalendarProps<MODE>, 'mode'>) => ReactNode>;

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

@@ -2,4 +2,7 @@ import './Checkbox.css';
 import React from 'react';
 import type { CheckboxProps } from './index';
 export declare const cnCheckbox: import("@bem-react/classname").ClassNameFormatter;
+/**
+ * @deprecated Компонент устарел. Для замены используйте компонент CheckboxNext
+ */
 export declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & React.RefAttributes<HTMLLabelElement>>;

package/__inner__/esm/components/Checkbox/Checkbox.js

@@ -1,6 +1,7 @@
 import { __assign, __rest } from "tslib";
 import './Checkbox.css';
 import React, { forwardRef, useContext } from 'react';
+import { useDeprecatedComponent } from '../../hooks/useDeprecated';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
 import { CheckboxGroupContext } from '../CheckboxGroup/CheckboxGroupContext';
@@ -8,7 +9,11 @@ import { FormControlLabel } from '../FormControlLabel';
 import { CheckboxIcon } from './components';
 import { CHECKBOX_DEFAULT_ALIGN, CHECKBOX_DEFAULT_LABEL_PLACEMENT, CHECKBOX_DEFAULT_SIZE, } from './constants';
 export var cnCheckbox = cn('Checkbox');
+/**
+ * @deprecated Компонент устарел. Для замены используйте компонент CheckboxNext
+ */
 export var Checkbox = forwardRef(function (inProps, ref) {
+    useDeprecatedComponent('Checkbox');
     var props = useThemeProps({
         props: inProps,
         name: 'Checkbox',

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

@@ -1,4 +1,7 @@
 import './CheckboxGroup.css';
 import type { CheckboxGroupBaseProps } from './index';
 export declare const cnCheckboxGroup: import("@bem-react/classname").ClassNameFormatter;
+/**
+ * @deprecated Компонент устарел. Для замены используйте компонент CheckboxGroupNext
+ */
 export declare const CheckboxGroup: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<CheckboxGroupBaseProps, "div">;

package/__inner__/esm/components/CheckboxGroup/CheckboxGroup.js

@@ -2,6 +2,7 @@ import { __assign, __read, __rest, __spreadArray } from "tslib";
 import './CheckboxGroup.css';
 import React from 'react';
 import { useControlled } from '../../hooks/useControlled';
+import { useDeprecatedComponent } from '../../hooks/useDeprecated';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
 import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
@@ -10,7 +11,11 @@ import { FormTitle } from '../FormTitle';
 import { CheckboxGroupContext } from './CheckboxGroupContext';
 import { CHECKBOX_GROUP_DEFAULT_DIRECTION, CHECKBOX_GROUP_DEFAULT_SIZE, CHECKBOX_GROUP_DEFAULT_AS, } from './constants';
 export var cnCheckboxGroup = cn('CheckboxGroup');
+/**
+ * @deprecated Компонент устарел. Для замены используйте компонент CheckboxGroupNext
+ */
 export var CheckboxGroup = polymorphicComponentWithRef(function (inProps, ref) {
+    useDeprecatedComponent('CheckboxGroup');
     var props = useThemeProps({
         props: inProps,
         name: 'CheckboxGroup',

package/__inner__/esm/components/CheckboxGroupNext/CheckboxGroup.css

@@ -0,0 +1,8 @@
+.CheckboxGroupNext {
+  display: flex;
+  flex-direction: column;
+}
+
+  .CheckboxGroupNext .FormGroup {
+    align-items: flex-start;
+  }

package/__inner__/esm/components/CheckboxGroupNext/CheckboxGroup.d.ts

@@ -0,0 +1,4 @@
+import './CheckboxGroup.css';
+import type { CheckboxGroupBaseProps } from './types';
+export declare const cnCheckboxGroup: import("@bem-react/classname").ClassNameFormatter;
+export declare const CheckboxGroup: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<CheckboxGroupBaseProps, "div">;

package/__inner__/esm/components/CheckboxGroupNext/CheckboxGroup.js

@@ -0,0 +1,46 @@
+import { __assign, __read, __rest, __spreadArray } from "tslib";
+import './CheckboxGroup.css';
+import React from 'react';
+import { useControlled } from '../../hooks/useControlled';
+import { useThemeProps } from '../../hooks/useThemeProps';
+import { cn } from '../../utils/classname';
+import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
+import { FormGroup } from '../FormGroup';
+import { FormTitle } from '../FormTitle';
+import { CheckboxGroupContext } from './CheckboxGroupContext';
+import { CHECKBOX_GROUP_DEFAULT_DIRECTION, CHECKBOX_GROUP_DEFAULT_SIZE, CHECKBOX_GROUP_DEFAULT_AS, CHECKBOX_GROUP_DEFAULT_VARIANT, CHECKBOX_GROUP_DEFAULT_MIRRORED, CHECKBOX_GROUP_DEFAULT_ALIGN, } from './constants';
+export var cnCheckboxGroup = cn('CheckboxGroupNext');
+export var CheckboxGroup = polymorphicComponentWithRef(function (inProps, ref) {
+    var props = useThemeProps({
+        props: inProps,
+        name: 'CheckboxGroupNext',
+    });
+    var _a = props.direction, direction = _a === void 0 ? CHECKBOX_GROUP_DEFAULT_DIRECTION : _a, _b = props.size, size = _b === void 0 ? CHECKBOX_GROUP_DEFAULT_SIZE : _b, _c = props.as, Tag = _c === void 0 ? CHECKBOX_GROUP_DEFAULT_AS : _c, _d = props.variant, variant = _d === void 0 ? CHECKBOX_GROUP_DEFAULT_VARIANT : _d, _e = props.align, align = _e === void 0 ? CHECKBOX_GROUP_DEFAULT_ALIGN : _e, _f = props.mirrored, mirrored = _f === void 0 ? CHECKBOX_GROUP_DEFAULT_MIRRORED : _f, title = props.title, className = props.className, children = props.children, name = props.name, valueProp = props.value, defaultValue = props.defaultValue, onChange = props.onChange, other = __rest(props, ["direction", "size", "as", "variant", "align", "mirrored", "title", "className", "children", "name", "value", "defaultValue", "onChange"]);
+    var _g = __read(useControlled({
+        value: valueProp,
+        defaultValue: defaultValue,
+        name: 'CheckboxGroup',
+        state: 'value',
+    }), 2), valueState = _g[0], setValueState = _g[1];
+    var handleChange = function (event) {
+        var itemValue = event.currentTarget.value;
+        var value = (valueState === null || valueState === void 0 ? void 0 : valueState.includes(itemValue))
+            ? valueState.filter(function (item) { return item !== itemValue; })
+            : __spreadArray(__spreadArray([], __read((valueState || [])), false), [itemValue], false);
+        setValueState(value);
+        onChange === null || onChange === void 0 ? void 0 : onChange(value);
+    };
+    return (React.createElement(CheckboxGroupContext.Provider, { value: {
+            value: valueState,
+            onChange: handleChange,
+            name: name,
+            size: size,
+            variant: variant,
+            align: align,
+            mirrored: mirrored,
+        } },
+        React.createElement(Tag, __assign({ className: cnCheckboxGroup({ size: size }, [className]), role: "radiogroup" }, other, { ref: ref }),
+            title && React.createElement(FormTitle, { size: size }, title),
+            React.createElement(FormGroup, { direction: direction, size: size }, children))));
+});
+CheckboxGroup.displayName = 'CheckboxGroup';