@ozen-ui/kit 0.66.0 → 0.67.0

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseContent/BottomSheetBaseContent.d.ts

@@ -0,0 +1,4 @@
+import './BottomSheetBaseContent.css';
+import React from 'react';
+export declare const cnBottomSheetBaseContent: import("@bem-react/classname").ClassNameFormatter;
+export declare const BottomSheetBaseContent: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseContent/BottomSheetBaseContent.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BottomSheetBaseContent = exports.cnBottomSheetBaseContent = void 0;
+var tslib_1 = require("tslib");
+require("./BottomSheetBaseContent.css");
+var react_1 = tslib_1.__importStar(require("react"));
+var useMultiRef_1 = require("../../../../hooks/useMultiRef");
+var classname_1 = require("../../../../utils/classname");
+var context_1 = require("../../context");
+exports.cnBottomSheetBaseContent = (0, classname_1.cn)('BottomSheetBaseContent');
+exports.BottomSheetBaseContent = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, className = _a.className, other = tslib_1.__rest(_a, ["children", "className"]);
+    var _b = (0, context_1.useBottomSheetBaseContext)(), scrollRef = _b.scrollRef, contentRef = _b.contentRef;
+    return (react_1.default.createElement("div", tslib_1.__assign({}, other, { ref: (0, useMultiRef_1.useMultiRef)([ref, scrollRef]), className: (0, exports.cnBottomSheetBaseContent)('Wrapper', [className]) }),
+        react_1.default.createElement("div", { ref: contentRef, className: (0, exports.cnBottomSheetBaseContent)() }, children)));
+});
+exports.BottomSheetBaseContent.displayName = 'BottomSheetBaseContent';

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseContent/index.d.ts

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

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseContent/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./BottomSheetBaseContent"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseContent/types.d.ts

@@ -0,0 +1,2 @@
+import type { ComponentPropsWithoutRef } from 'react';
+export type BottomSheetBaseContentProps = ComponentPropsWithoutRef<'div'>;

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseContent/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseFooter/BottomSheetBaseFooter.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const cnBottomSheetBaseFooter: import("@bem-react/classname").ClassNameFormatter;
+export declare const BottomSheetBaseFooter: React.ForwardRefExoticComponent<{
+    expandOnDrag?: boolean;
+} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "expandOnDrag"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseFooter/BottomSheetBaseFooter.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BottomSheetBaseFooter = exports.cnBottomSheetBaseFooter = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var classname_1 = require("../../../../utils/classname");
+var BottomSheetBaseBlock_1 = require("../BottomSheetBaseBlock");
+var constants_1 = require("./constants");
+exports.cnBottomSheetBaseFooter = (0, classname_1.cn)('BottomSheetBaseFooter');
+exports.BottomSheetBaseFooter = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, className = _a.className, _b = _a.expandOnDrag, expandOnDrag = _b === void 0 ? constants_1.BOTTOM_SHEET_BASE_FOOTER_DEFAULT_EXPAND_ON_DRAG : _b, other = tslib_1.__rest(_a, ["children", "className", "expandOnDrag"]);
+    return (react_1.default.createElement(BottomSheetBaseBlock_1.BottomSheetBaseBlock, tslib_1.__assign({}, other, { ref: ref, className: (0, exports.cnBottomSheetBaseFooter)('', [className]), expandOnDrag: expandOnDrag }), children));
+});
+exports.BottomSheetBaseFooter.displayName = 'BottomSheetBaseFooter';

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseFooter/constants.d.ts

@@ -0,0 +1 @@
+export declare const BOTTOM_SHEET_BASE_FOOTER_DEFAULT_EXPAND_ON_DRAG = true;

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseFooter/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BOTTOM_SHEET_BASE_FOOTER_DEFAULT_EXPAND_ON_DRAG = void 0;
+exports.BOTTOM_SHEET_BASE_FOOTER_DEFAULT_EXPAND_ON_DRAG = true;

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseFooter/index.d.ts

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

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseFooter/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./BottomSheetBaseFooter"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseFooter/types.d.ts

@@ -0,0 +1,4 @@
+import type { BottomSheetBaseBlockRef } from '../../entities';
+import type { BottomSheetBaseBlockProps } from '../BottomSheetBaseBlock';
+export type BottomSheetBaseFooterRef = BottomSheetBaseBlockRef;
+export type BottomSheetBaseFooterProps = BottomSheetBaseBlockProps;

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseFooter/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseHeader/BottomSheetBaseHeader.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const cnBottomSheetBaseHeader: import("@bem-react/classname").ClassNameFormatter;
+export declare const BottomSheetBaseHeader: React.ForwardRefExoticComponent<{
+    expandOnDrag?: boolean;
+} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "expandOnDrag"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseHeader/BottomSheetBaseHeader.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BottomSheetBaseHeader = exports.cnBottomSheetBaseHeader = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var classname_1 = require("../../../../utils/classname");
+var BottomSheetBaseBlock_1 = require("../BottomSheetBaseBlock");
+var constants_1 = require("./constants");
+exports.cnBottomSheetBaseHeader = (0, classname_1.cn)('BottomSheetBaseHeader');
+exports.BottomSheetBaseHeader = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, className = _a.className, _b = _a.expandOnDrag, expandOnDrag = _b === void 0 ? constants_1.BOTTOM_SHEET_BASE_HEADER_DEFAULT_EXPAND_ON_DRAG : _b, other = tslib_1.__rest(_a, ["children", "className", "expandOnDrag"]);
+    return (react_1.default.createElement(BottomSheetBaseBlock_1.BottomSheetBaseBlock, tslib_1.__assign({}, other, { ref: ref, className: (0, exports.cnBottomSheetBaseHeader)('', [className]), expandOnDrag: expandOnDrag }), children));
+});
+exports.BottomSheetBaseHeader.displayName = 'BottomSheetBaseHeader';

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseHeader/constants.d.ts

@@ -0,0 +1 @@
+export declare const BOTTOM_SHEET_BASE_HEADER_DEFAULT_EXPAND_ON_DRAG = true;

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseHeader/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BOTTOM_SHEET_BASE_HEADER_DEFAULT_EXPAND_ON_DRAG = void 0;
+exports.BOTTOM_SHEET_BASE_HEADER_DEFAULT_EXPAND_ON_DRAG = true;

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseHeader/index.d.ts

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

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseHeader/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./BottomSheetBaseHeader"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseHeader/types.d.ts

@@ -0,0 +1,4 @@
+import type { BottomSheetBaseBlockRef } from '../../entities';
+import type { BottomSheetBaseBlockProps } from '../BottomSheetBaseBlock';
+export type BottomSheetBaseHeaderRef = BottomSheetBaseBlockRef;
+export type BottomSheetBaseHeaderProps = BottomSheetBaseBlockProps;

package/__inner__/cjs/components/BottomSheetBase/modules/BottomSheetBaseHeader/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/BottomSheetBase/modules/index.d.ts

@@ -0,0 +1,5 @@
+export * from './BottomSheetBaseBackdrop';
+export * from './BottomSheetBaseBlock';
+export * from './BottomSheetBaseContent';
+export * from './BottomSheetBaseFooter';
+export * from './BottomSheetBaseHeader';

package/__inner__/cjs/components/BottomSheetBase/modules/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./BottomSheetBaseBackdrop"), exports);
+tslib_1.__exportStar(require("./BottomSheetBaseBlock"), exports);
+tslib_1.__exportStar(require("./BottomSheetBaseContent"), exports);
+tslib_1.__exportStar(require("./BottomSheetBaseFooter"), exports);
+tslib_1.__exportStar(require("./BottomSheetBaseHeader"), exports);

package/__inner__/cjs/components/BottomSheetBase/types.d.ts

@@ -0,0 +1,27 @@
+import type { ReactNode } from 'react';
+import type { PortalProps } from '../Portal';
+import type { BottomSheetBaseGetMaxHeight, BottomSheetBaseGetSnap, BottomSheetBaseGetSnaps, BottomSheetBaseMaxHeight, BottomSheetBaseOnClose, BottomSheetBaseSnap, BottomSheetBaseSnaps } from './entities';
+export type BottomSheetBaseProps = {
+    /** Точки привязки. */
+    snaps: BottomSheetBaseSnaps | BottomSheetBaseGetSnaps;
+    /** Текущее состояние открытости. Если `true`, шторка отображается. */
+    open: boolean;
+    /** Дефолтная точка привязки. */
+    defaultSnap?: BottomSheetBaseSnap | BottomSheetBaseGetSnap;
+    /** Максимальная высота. */
+    maxHeight?: BottomSheetBaseMaxHeight | BottomSheetBaseGetMaxHeight;
+    /** Функция, которая вызывается при закрытии. */
+    onClose?: BottomSheetBaseOnClose;
+    /** При `true` шторка будет закрываемой. */
+    closable?: boolean;
+    /** Компонент backdrop. */
+    backdrop?: ReactNode;
+    /** Если `true` backdrop будет скрыт. */
+    hideBackdrop?: boolean;
+    /** Если `true` отключает блокировку прокрутки основного экрана приложения. */
+    disableScrollLock?: boolean;
+    /** Дополнительные CSS-классы шторки */
+    bottomSheetClassName?: string;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+} & PortalProps;

package/__inner__/cjs/components/BottomSheetBase/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/BottomSheetBase/utils/index.d.ts

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

package/__inner__/cjs/components/BottomSheetBase/utils/index.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./utils"), exports);

package/__inner__/cjs/components/BottomSheetBase/utils/utils.d.ts

@@ -0,0 +1,16 @@
+import type { BottomSheetBaseGetSnap, BottomSheetBaseGetSnaps, BottomSheetBaseSnap, BottomSheetBaseSnaps } from '../entities';
+import type { BottomSheetBaseFindClosestSnap } from '../hooks';
+export declare const cnBottomSheetBase: import("@bem-react/classname").ClassNameFormatter;
+export declare const bottomSheetCalculateSnaps: ({ minHeight, maxHeight, snaps: snapsProp, isReady, defaultSnap: defaultSnapProp, }: {
+    minHeight: number;
+    maxHeight: number;
+    snaps: BottomSheetBaseSnaps | BottomSheetBaseGetSnaps;
+    isReady: boolean;
+    defaultSnap: BottomSheetBaseSnap | BottomSheetBaseGetSnap | undefined;
+}) => {
+    minSnap: number;
+    maxSnap: number;
+    snaps: number[];
+    defaultSnap: number;
+    findClosestSnap: BottomSheetBaseFindClosestSnap;
+};

package/__inner__/cjs/components/BottomSheetBase/utils/utils.js

@@ -0,0 +1,60 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.bottomSheetCalculateSnaps = exports.cnBottomSheetBase = void 0;
+var tslib_1 = require("tslib");
+var logger_1 = require("@ozen-ui/logger");
+var classname_1 = require("../../../utils/classname");
+var isFunction_1 = require("../../../utils/isFunction");
+var math_1 = require("../../../utils/math");
+var number_1 = require("../../../utils/number");
+exports.cnBottomSheetBase = (0, classname_1.cn)('BottomSheetBase');
+var bottomSheetCalculateSnaps = function (_a) {
+    var minHeight = _a.minHeight, maxHeight = _a.maxHeight, snapsProp = _a.snaps, isReady = _a.isReady, defaultSnapProp = _a.defaultSnap;
+    var getSnapParams = {
+        minHeight: minHeight,
+        maxHeight: maxHeight,
+    };
+    var snapsRaw = (function () {
+        if (!isReady) {
+            return [0];
+        }
+        if ((0, isFunction_1.isFunction)(snapsProp)) {
+            return snapsProp(getSnapParams);
+        }
+        return snapsProp;
+    })();
+    var snapsSet = snapsRaw.reduce(function (acc, snapPoint) {
+        if ((0, number_1.isNaN)(snapPoint)) {
+            logger_1.logger.error('Компонент "BottomSheetBase" имеет NaN в prop "snaps"');
+            return acc;
+        }
+        acc.add((0, math_1.clamp)(snapPoint, 0, maxHeight));
+        return acc;
+    }, new Set());
+    var snaps = tslib_1.__spreadArray([], tslib_1.__read(snapsSet), false);
+    var minSnap = Math.min.apply(Math, tslib_1.__spreadArray([], tslib_1.__read(snaps), false));
+    var maxSnap = Math.min(maxHeight, Math.max.apply(Math, tslib_1.__spreadArray([], tslib_1.__read(snaps), false)));
+    var findClosestSnap = function (point) {
+        return snaps.reduce(function (prev, curr) {
+            return Math.abs(curr - point) < Math.abs(prev - point) ? curr : prev;
+        }, minSnap);
+    };
+    var defaultSnapRaw = (function () {
+        if ((0, isFunction_1.isFunction)(defaultSnapProp)) {
+            return defaultSnapProp(getSnapParams);
+        }
+        if ((0, number_1.isNumber)(defaultSnapProp)) {
+            return defaultSnapProp;
+        }
+        return minSnap;
+    })();
+    var defaultSnap = findClosestSnap((0, math_1.clamp)(defaultSnapRaw, minSnap, maxSnap));
+    return {
+        minSnap: minSnap,
+        maxSnap: maxSnap,
+        snaps: snaps,
+        defaultSnap: defaultSnap,
+        findClosestSnap: findClosestSnap,
+    };
+};
+exports.bottomSheetCalculateSnaps = bottomSheetCalculateSnaps;

package/__inner__/cjs/components/Breadcrumbs/components/types.d.ts

@@ -2,5 +2,5 @@ import type { ElementType } from 'react';
 import type { PolymorphicComponentPropsWithoutRef } from '../../../utils/polymorphicComponentWithRef';
 import type { ButtonProps } from '../../ButtonNext';
 import type { BREADCRUMB_ITEM_DEFAULT_TAG } from '../constants';
-export type BreadcrumbItemBaseProps = Pick<ButtonProps, 'disabled' | 'iconLeft' | 'iconRight'>;
+export type BreadcrumbItemBaseProps = Pick<ButtonProps, 'disabled' | 'iconLeft' | 'iconRight' | 'data-testid'>;
 export type BreadcrumbItemProps<As extends ElementType = typeof BREADCRUMB_ITEM_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<BreadcrumbItemBaseProps, As>;

package/__inner__/cjs/components/Breadcrumbs/types.d.ts

@@ -14,4 +14,6 @@ export type BreadcrumbsProps = ExtendableComponentPropsWithRef<{
     separator?: BreadcrumbsSeparatorComponent;
     /** Размер */
     size?: BreadcrumbsSizeVariant;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
 }, 'nav'>;

package/__inner__/cjs/components/Collapse/Collapse.js

@@ -8,8 +8,8 @@ var react_transition_group_1 = require("react-transition-group");
 var useMultiRef_1 = require("../../hooks/useMultiRef");
 var useThemeProps_1 = require("../../hooks/useThemeProps");
 var classname_1 = require("../../utils/classname");
-var isNumber_1 = require("../../utils/isNumber");
 var isString_1 = require("../../utils/isString");
+var number_1 = require("../../utils/number");
 var constants_1 = require("./constants");
 exports.cnCollapse = (0, classname_1.cn)('Collapse');
 exports.Collapse = (0, react_1.forwardRef)(function (inProps, ref) {
@@ -21,7 +21,7 @@ exports.Collapse = (0, react_1.forwardRef)(function (inProps, ref) {
     var collapseRef = (0, useMultiRef_1.useMultiRef)([ref, rootRef]);
     var collapsedSize = (0, react_1.useMemo)(function () {
         if (!collapsedSizeProp ||
-            (!(0, isString_1.isString)(collapsedSizeProp) && !(0, isNumber_1.isNumber)(collapsedSizeProp))) {
+            (!(0, isString_1.isString)(collapsedSizeProp) && !(0, number_1.isNumber)(collapsedSizeProp))) {
             return '0px';
         }
         return (0, isString_1.isString)(collapsedSizeProp)

package/__inner__/cjs/components/DataList/components/DataListOption/DataListOption.js

@@ -5,8 +5,8 @@ var tslib_1 = require("tslib");
 require("./DataListOption.css");
 var react_1 = tslib_1.__importStar(require("react"));
 var classname_1 = require("../../../../utils/classname");
-var isNumber_1 = require("../../../../utils/isNumber");
 var isString_1 = require("../../../../utils/isString");
+var number_1 = require("../../../../utils/number");
 var List_1 = require("../../../List");
 var constants_1 = require("../../constants");
 var DataListContent_1 = require("../DataListContent");
@@ -14,7 +14,7 @@ exports.cnDataListOption = (0, classname_1.cn)('DataListOption');
 exports.DataListOption = (0, react_1.forwardRef)(function (_a, ref) {
     var _b = _a.disabled, disabled = _b === void 0 ? constants_1.DATA_LIST_OPTION_DEFAULT_DISABLED : _b, value = _a.value, label = _a.label, children = _a.children, className = _a.className, selected = _a.selected, focused = _a.focused, other = tslib_1.__rest(_a, ["disabled", "value", "label", "children", "className", "selected", "focused"]);
     var renderChildren = function () {
-        if ((0, isString_1.isString)(children) || (0, isNumber_1.isNumber)(children)) {
+        if ((0, isString_1.isString)(children) || (0, number_1.isNumber)(children)) {
             return react_1.default.createElement(DataListContent_1.DataListContent, { label: children, selected: selected });
         }
         if (label && !children) {

package/__inner__/cjs/components/Dialog/Dialog.d.ts

@@ -1,6 +1,9 @@
 import './Dialog.css';
 import React from 'react';
 export declare const cnDialog: import("@bem-react/classname").ClassNameFormatter;
+/**
+ * @deprecated Компонент устарел. Для замены используйте компонент DialogNext
+ */
 export declare const Dialog: React.ForwardRefExoticComponent<{
     size?: import("./types").DialogSizeVariant;
     variant?: import("./types").DialogVariant;

package/__inner__/cjs/components/Dialog/Dialog.js

@@ -12,6 +12,9 @@ var Modal_1 = require("../Modal");
 var constants_1 = require("./constants");
 var utils_1 = require("./utils");
 exports.cnDialog = (0, classname_1.cn)('Dialog');
+/**
+ * @deprecated Компонент устарел. Для замены используйте компонент DialogNext
+ */
 exports.Dialog = (0, react_1.forwardRef)(function (inProps, ref) {
     var props = (0, useThemeProps_1.useThemeProps)({
         props: inProps,

package/__inner__/cjs/components/DialogNext/Dialog.css

@@ -0,0 +1,21 @@
+.DialogNext {
+  --dialog-inline-padding: var(--spacing-s);
+  --dialog-block-padding: var(--spacing-l);
+  --dialog-header-size: 0px;
+}
+
+  /* ---- DEVICE TYPE ----  */
+
+  /* --- DESKTOP ---  */
+  .DialogNext_deviceType_desktop.DialogNext_size_s {
+    --dialog-inline-padding: var(--spacing-m);
+    --dialog-block-padding: var(--spacing-m);
+  }
+  .DialogNext_deviceType_desktop.DialogNext_size_m {
+    --dialog-inline-padding: var(--spacing-l);
+    --dialog-block-padding: var(--spacing-l);
+  }
+  /** ---- VIEW TYPE ---- */
+  .DialogNext_viewType_bottomSheet {
+    --dialog-header-size: 32px;
+  }

package/__inner__/cjs/components/DialogNext/Dialog.d.ts

@@ -0,0 +1,13 @@
+import './Dialog.css';
+import './components/DialogModal/DialogModal.css';
+import './components/DialogBottomSheet/DialogBottomSheet.css';
+import './modules/DialogBody/DialogBody.css';
+import './modules/DialogFooter/DialogFooter.css';
+import './modules/DialogFooterButtonsGroup/DialogFooterButtonsGroup.css';
+import './modules/DialogHeader/DialogHeader.css';
+import './modules/DialogSubtitle/DialogSubtitle.css';
+import './modules/DialogTitle/DialogTitle.css';
+import React from 'react';
+import type { DialogProps } from './types';
+export declare const cnDialog: import("@bem-react/classname").ClassNameFormatter;
+export declare const Dialog: React.ForwardRefExoticComponent<DialogProps & React.RefAttributes<HTMLDivElement>>;

package/__inner__/cjs/components/DialogNext/Dialog.js

@@ -0,0 +1,53 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dialog = exports.cnDialog = void 0;
+var tslib_1 = require("tslib");
+require("./Dialog.css");
+require("./components/DialogModal/DialogModal.css");
+require("./components/DialogBottomSheet/DialogBottomSheet.css");
+require("./modules/DialogBody/DialogBody.css");
+require("./modules/DialogFooter/DialogFooter.css");
+require("./modules/DialogFooterButtonsGroup/DialogFooterButtonsGroup.css");
+require("./modules/DialogHeader/DialogHeader.css");
+require("./modules/DialogSubtitle/DialogSubtitle.css");
+require("./modules/DialogTitle/DialogTitle.css");
+var react_1 = tslib_1.__importStar(require("react"));
+var useThemeProps_1 = require("../../hooks/useThemeProps");
+var classname_1 = require("../../utils/classname");
+var renderContent_1 = require("../../utils/renderContent");
+var BottomSheetBase_1 = require("../BottomSheetBase");
+var components_1 = require("./components");
+var constants_1 = require("./constants");
+var DialogContext_1 = require("./DialogContext");
+var modules_1 = require("./modules");
+exports.cnDialog = (0, classname_1.cn)('DialogNext');
+exports.Dialog = (0, react_1.forwardRef)(function (inProps, ref) {
+    var props = (0, useThemeProps_1.useThemeProps)({
+        props: inProps,
+        name: 'DialogNext',
+    });
+    var children = props.children, _a = props.variant, variant = _a === void 0 ? constants_1.DIALOG_DEFAULT_VARIANT : _a, _b = props.size, size = _b === void 0 ? constants_1.DIALOG_DEFAULT_SIZE : _b, _c = props.deviceType, deviceType = _c === void 0 ? constants_1.DIALOG_DEFAULT_DEVICE_TYPE : _c, _d = props.renderCloseButton, renderCloseButton = _d === void 0 ? react_1.default.createElement(modules_1.DialogCloseButton, null) : _d, open = props.open, _e = props.onClose, onClose = _e === void 0 ? function () { } : _e, classNameProp = props.className, _f = props.hideCloseButton, hideCloseButton = _f === void 0 ? constants_1.DIALOG_DEFAULT_HIDE_CLOSE_BUTTON : _f, modalProps = props.modalProps, bottomSheetProps = props.bottomSheetProps, backdropProps = props.backdropProps, other = tslib_1.__rest(props, ["children", "variant", "size", "deviceType", "renderCloseButton", "open", "onClose", "className", "hideCloseButton", "modalProps", "bottomSheetProps", "backdropProps"]);
+    var viewType = deviceType === 'mobile' &&
+        constants_1.DIALOG_MOBILE_BOTTOM_SHEET_VIEW_VARIANTS.includes(variant)
+        ? 'bottomSheet'
+        : 'modal';
+    var isBottomSheet = viewType === 'bottomSheet';
+    var closeButton = (0, renderContent_1.renderContent)({
+        content: renderCloseButton,
+        props: {},
+    });
+    var className = (0, exports.cnDialog)({
+        deviceType: deviceType,
+        size: size,
+        viewType: viewType,
+    }, [classNameProp]);
+    return (react_1.default.createElement(DialogContext_1.DialogContext.Provider, { value: {
+            onClose: onClose,
+            variant: variant,
+            size: size,
+            deviceType: deviceType,
+            viewType: viewType,
+            isBottomSheet: isBottomSheet,
+        } }, isBottomSheet ? (react_1.default.createElement(components_1.DialogBottomSheet, tslib_1.__assign({ ref: ref, open: open, size: size, variant: variant, closeButton: closeButton, onClose: onClose, hideCloseButton: hideCloseButton, className: className, backdrop: react_1.default.createElement(BottomSheetBase_1.BottomSheetBaseBackdrop, tslib_1.__assign({}, backdropProps)) }, bottomSheetProps, other), children)) : (react_1.default.createElement(components_1.DialogModal, tslib_1.__assign({ ref: ref, open: open, onClose: onClose, hideCloseButton: hideCloseButton, className: className, closeButton: closeButton, size: size, variant: variant, backdropProps: backdropProps }, modalProps, other), children))));
+});
+exports.Dialog.displayName = 'Dialog';

package/__inner__/cjs/components/DialogNext/DialogContext.d.ts

@@ -0,0 +1,12 @@
+import type { DialogVariant, DialogDeviceType, DialogSizeVariantByDeviceType, DialogViewType } from './entities';
+export type DialogContextValue<DeviceType extends DialogDeviceType> = {
+    size: DialogSizeVariantByDeviceType[DeviceType];
+    variant: DialogVariant;
+    onClose: () => void;
+    deviceType: DeviceType;
+    viewType: DialogViewType;
+    isBottomSheet: boolean;
+};
+export declare const DialogContextDefaultValue: DialogContextValue<DialogDeviceType>;
+export declare const DialogContext: import("react").Context<DialogContextValue<"mobile" | "desktop">>;
+export declare const useDialogContext: <DeviceType extends DialogDeviceType>() => DialogContextValue<DeviceType>;

package/__inner__/cjs/components/DialogNext/DialogContext.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDialogContext = exports.DialogContext = exports.DialogContextDefaultValue = void 0;
+var react_1 = require("react");
+var environment_1 = require("../../constants/environment");
+var constants_1 = require("./constants");
+exports.DialogContextDefaultValue = {
+    size: constants_1.DIALOG_DEFAULT_SIZE,
+    variant: constants_1.DIALOG_DEFAULT_VARIANT,
+    onClose: function () { },
+    deviceType: constants_1.DIALOG_DEFAULT_DEVICE_TYPE,
+    viewType: 'modal',
+    isBottomSheet: false,
+};
+exports.DialogContext = (0, react_1.createContext)(exports.DialogContextDefaultValue);
+var useDialogContext = function () {
+    return (0, react_1.useContext)(exports.DialogContext);
+};
+exports.useDialogContext = useDialogContext;
+// Именованный провайдер
+if (environment_1.IS_DEV) {
+    exports.DialogContext.displayName = 'DialogContext';
+}

package/__inner__/cjs/components/DialogNext/components/DialogBottomSheet/DialogBottomSheet.css

@@ -0,0 +1,33 @@
+.DialogNextBottomSheet {
+  --dialog-bottom-sheet-border-radius: var(--border-radius-xl);
+  --dialog-bottom-sheet-header-padding: 8px;
+}
+
+  .DialogNextBottomSheet-BottomSheet {
+    border-start-start-radius: var(--dialog-bottom-sheet-border-radius);
+    border-start-end-radius: var(--dialog-bottom-sheet-border-radius);
+  }
+
+  .DialogNextBottomSheet-CloseButton {
+    position: absolute;
+    inset-block-start: var(--dialog-bottom-sheet-header-padding);
+    inset-inline-end: var(--dialog-bottom-sheet-header-padding);
+  }
+
+  .DialogNextBottomSheet-Header {
+    position: relative;
+    block-size: var(--dialog-header-size);
+  }
+
+  .DialogNextBottomSheet-Header::before {
+    position: absolute;
+    content: '';
+    display: block;
+    inline-size: 36px;
+    block-size: 4px;
+    inset-block-start: var(--dialog-bottom-sheet-header-padding);
+    inset-inline-start: 50%;
+    transform: translateX(-50%);
+    border-radius: var(--border-radius-2xs);
+    background-color: var(--color-background-tertiary);
+  }

package/__inner__/cjs/components/DialogNext/components/DialogBottomSheet/DialogBottomSheet.d.ts

@@ -0,0 +1,12 @@
+import './DialogBottomSheet.css';
+import React from 'react';
+export declare const cnDialogBottomSheet: import("@bem-react/classname").ClassNameFormatter;
+export declare const DialogBottomSheet: React.ForwardRefExoticComponent<{
+    open: boolean;
+    size: import("../..").DialogSizeAllVariants;
+    variant: import("../..").DialogVariant;
+    closeButton: React.ReactNode;
+    hideCloseButton: boolean | undefined;
+    className: string | undefined;
+    onClose: (() => void) | undefined;
+} & Omit<Omit<import("../../../BottomSheetBase").BottomSheetBaseProps, "snaps">, "className" | "open" | "onClose" | "size" | "variant" | "hideCloseButton" | "closeButton"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/cjs/components/DialogNext/components/DialogBottomSheet/DialogBottomSheet.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogBottomSheet = exports.cnDialogBottomSheet = void 0;
+var tslib_1 = require("tslib");
+require("./DialogBottomSheet.css");
+var react_1 = tslib_1.__importStar(require("react"));
+var classname_1 = require("../../../../utils/classname");
+var BottomSheetBase_1 = require("../../../BottomSheetBase");
+var constants_1 = require("./constants");
+exports.cnDialogBottomSheet = (0, classname_1.cn)('DialogNextBottomSheet');
+exports.DialogBottomSheet = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, open = _a.open, closeButton = _a.closeButton, onClose = _a.onClose, size = _a.size, variant = _a.variant, className = _a.className, hideCloseButton = _a.hideCloseButton, other = tslib_1.__rest(_a, ["children", "open", "closeButton", "onClose", "size", "variant", "className", "hideCloseButton"]);
+    return (react_1.default.createElement(BottomSheetBase_1.BottomSheetBase, tslib_1.__assign({ ref: ref, className: (0, exports.cnDialogBottomSheet)({
+            size: size,
+        }, [className]), bottomSheetClassName: (0, exports.cnDialogBottomSheet)('BottomSheet'), snaps: constants_1.DIALOG_BOTTOM_SHEET_SNAPS_BY_VARIANT[variant], maxHeight: constants_1.DIALOG_BOTTOM_SHEET_MAX_HEIGHT_BY_VARIANT[variant], open: open, onClose: onClose, role: "dialog" }, other),
+        react_1.default.createElement(BottomSheetBase_1.BottomSheetBaseHeader, { className: (0, exports.cnDialogBottomSheet)('Header') }, !hideCloseButton && (react_1.default.createElement("div", { className: (0, exports.cnDialogBottomSheet)('CloseButton') }, closeButton))),
+        children));
+});
+exports.DialogBottomSheet.displayName = 'DialogBottomSheet';

package/__inner__/cjs/components/DialogNext/components/DialogBottomSheet/constants.d.ts

@@ -0,0 +1,13 @@
+export declare const DIALOG_BOTTOM_SHEET_DEFAULT_PADDING_TOP = 44;
+export declare const DIALOG_BOTTOM_SHEET_SNAPS_BY_VARIANT: {
+    small: ({ minHeight }: import("../../../BottomSheetBase").BottomSheetBaseGetSnapParams) => number[];
+    medium: ({ minHeight }: import("../../../BottomSheetBase").BottomSheetBaseGetSnapParams) => number[];
+    large: ({ maxHeight }: import("../../../BottomSheetBase").BottomSheetBaseGetSnapParams) => number[];
+    fullscreen: ({ maxHeight }: import("../../../BottomSheetBase").BottomSheetBaseGetSnapParams) => number[];
+};
+export declare const DIALOG_BOTTOM_SHEET_MAX_HEIGHT_BY_VARIANT: {
+    small: ({ maxHeight }: import("../../../BottomSheetBase").BottomSheetBaseGetMaxHeightParams) => number;
+    medium: ({ maxHeight }: import("../../../BottomSheetBase").BottomSheetBaseGetMaxHeightParams) => number;
+    large: ({ maxHeight }: import("../../../BottomSheetBase").BottomSheetBaseGetMaxHeightParams) => number;
+    fullscreen: ({ maxHeight }: import("../../../BottomSheetBase").BottomSheetBaseGetMaxHeightParams) => number;
+};