@ozen-ui/kit 0.66.0 → 0.67.0

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

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DIALOG_BOTTOM_SHEET_MAX_HEIGHT_BY_VARIANT = exports.DIALOG_BOTTOM_SHEET_SNAPS_BY_VARIANT = exports.DIALOG_BOTTOM_SHEET_DEFAULT_PADDING_TOP = void 0;
+exports.DIALOG_BOTTOM_SHEET_DEFAULT_PADDING_TOP = 44;
+exports.DIALOG_BOTTOM_SHEET_SNAPS_BY_VARIANT = {
+    small: function (_a) {
+        var minHeight = _a.minHeight;
+        return [minHeight];
+    },
+    medium: function (_a) {
+        var minHeight = _a.minHeight;
+        return [minHeight];
+    },
+    large: function (_a) {
+        var maxHeight = _a.maxHeight;
+        return [
+            maxHeight - exports.DIALOG_BOTTOM_SHEET_DEFAULT_PADDING_TOP,
+        ];
+    },
+    fullscreen: function (_a) {
+        var maxHeight = _a.maxHeight;
+        return [maxHeight];
+    },
+};
+exports.DIALOG_BOTTOM_SHEET_MAX_HEIGHT_BY_VARIANT = {
+    small: function (_a) {
+        var maxHeight = _a.maxHeight;
+        return maxHeight - exports.DIALOG_BOTTOM_SHEET_DEFAULT_PADDING_TOP;
+    },
+    medium: function (_a) {
+        var maxHeight = _a.maxHeight;
+        return maxHeight - exports.DIALOG_BOTTOM_SHEET_DEFAULT_PADDING_TOP;
+    },
+    large: function (_a) {
+        var maxHeight = _a.maxHeight;
+        return maxHeight;
+    },
+    fullscreen: function (_a) {
+        var maxHeight = _a.maxHeight;
+        return maxHeight;
+    },
+};

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

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

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

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

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

@@ -0,0 +1,15 @@
+import type { ReactNode } from 'react';
+import type { ExtendableProps } from '../../../../types/ExtendableProps';
+import type { BottomSheetBaseProps } from '../../../BottomSheetBase';
+import type { DialogVariant, DialogSizeAllVariants } from '../../entities';
+import type { DialogRef } from '../../types';
+export type DialogBottomSheetRef = DialogRef;
+export type DialogBottomSheetProps = ExtendableProps<{
+    open: boolean;
+    size: DialogSizeAllVariants;
+    variant: DialogVariant;
+    closeButton: ReactNode;
+    hideCloseButton: boolean | undefined;
+    className: string | undefined;
+    onClose: (() => void) | undefined;
+}, Omit<BottomSheetBaseProps, 'snaps'>>;

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

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

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

@@ -0,0 +1,91 @@
+.DialogNextModal {
+  --dialog-modal-inline-size: 480px;
+  --dialog-modal-max-inline-size: calc(100% - 64px);
+  --dialog-modal-max-block-size: calc(100% - 64px);
+}
+
+  .DialogNextModal .Modal-Window {
+    position: relative;
+    outline: none;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    border: none;
+    padding: 0;
+    inline-size: var(--dialog-modal-max-inline-size);
+    max-inline-size: var(--dialog-modal-inline-size);
+    max-block-size: var(--dialog-modal-max-block-size);
+  }
+
+  .DialogNextModal-InnerContainer {
+    display: flex;
+    flex-direction: column;
+    flex-grow: 1;
+    max-block-size: 100%;
+    overflow: auto;
+  }
+
+  .DialogNextModal-CloseButton {
+    position: absolute;
+    inset-block-start: 8px;
+    inset-inline-end: 8px;
+  }
+
+  /* ---- VARIANT ----  */
+
+  .DialogNextModal_variant_medium {
+    --dialog-modal-inline-size: 720px;
+  }
+
+  .DialogNextModal_variant_large {
+    --dialog-modal-inline-size: 960px;
+  }
+
+  .DialogNextModal_variant_fullscreen {
+    --dialog-modal-inline-size: 100%;
+    --dialog-modal-max-inline-size: 100%;
+    --dialog-modal-max-block-size: 100%;
+  }
+
+  .DialogNextModal_variant_fullscreen .Modal-Window {
+      block-size: 100%;
+      border-radius: 0;
+      inset: 0;
+      margin: 0;
+      transform: translate(0, 0);
+    }
+
+
+.DialogNextModal_animation_fullscreen-appear .Modal-Window, .DialogNextModal_animation_fullscreen-enter .Modal-Window {
+      transform: translate(0, 100%);
+    }
+
+
+.DialogNextModal_animation_fullscreen-appear-active .Modal-Window, .DialogNextModal_animation_fullscreen-enter-active .Modal-Window {
+      transition: transform var(--transition-slow);
+      transform: translate(0, 0);
+    }
+
+
+.DialogNextModal_animation_fullscreen-enter-done .Modal-Window {
+      transform: translate(0, 0);
+    }
+
+
+.DialogNextModal_animation_fullscreen-exit .Modal-Window {
+      visibility: visible;
+      transform: translate(0, 0);
+    }
+
+
+.DialogNextModal_animation_fullscreen-exit-active .Modal-Window {
+      visibility: visible;
+      transition: transform var(--transition-slow);
+      transform: translate(0, 100%);
+    }
+
+
+.DialogNextModal_animation_fullscreen-exit-done .Modal-Window {
+      visibility: hidden;
+      transform: translate(0, 100%);
+    }

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

@@ -0,0 +1,35 @@
+import './DialogModal.css';
+import React from 'react';
+export declare const cnDialogModal: import("@bem-react/classname").ClassNameFormatter;
+export declare const DialogModal: React.ForwardRefExoticComponent<{
+    closeButton: React.ReactNode;
+    size: import("../..").DialogSizeAllVariants;
+    variant: import("../..").DialogVariant;
+    hideCloseButton: boolean | undefined;
+    onClose: (() => void) | undefined;
+} & {
+    open?: boolean;
+    children: React.ReactNode;
+    onEnter?(): void;
+    onEntered?(): void;
+    onExit?(): void;
+    onExited?(): void;
+    onClose?(): void;
+    hideBackdrop?: boolean;
+    keepMounted?: boolean;
+    disableScrollLock?: boolean;
+    disableClickOutside?: boolean;
+    disableEscapeKeyDown?: boolean;
+    backdropProps?: import("../../../Backdrop").BackdropProps & {
+        "data-testid"?: string;
+    };
+    transitionProps?: Partial<import("react-transition-group/CSSTransition").CSSTransitionProps> & {
+        "data-testid"?: string;
+    };
+    windowProps?: import("../../../Paper").PaperProps;
+    className?: string;
+    'data-testid'?: string;
+    ignoreClickOutsideRefs?: React.RefObject<HTMLElement>[];
+} & import("../../../Portal").PortalBaseProps & {
+    as?: "div" | undefined;
+} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof import("../../../Portal").PortalBaseProps> & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogModal = exports.cnDialogModal = void 0;
+var tslib_1 = require("tslib");
+require("./DialogModal.css");
+var react_1 = tslib_1.__importStar(require("react"));
+var classname_1 = require("../../../../utils/classname");
+var Modal_1 = require("../../../Modal");
+exports.cnDialogModal = (0, classname_1.cn)('DialogNextModal');
+exports.DialogModal = (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, windowProps = _a.windowProps, transitionProps = _a.transitionProps, other = tslib_1.__rest(_a, ["children", "open", "closeButton", "onClose", "size", "variant", "className", "hideCloseButton", "windowProps", "transitionProps"]);
+    return (react_1.default.createElement(Modal_1.Modal, tslib_1.__assign({}, other, { open: open, onClose: onClose, windowProps: tslib_1.__assign({ role: 'dialog', radius: size === 's' ? 'l' : 'xl', shadow: 'l' }, windowProps), className: (0, exports.cnDialogModal)({ variant: variant, size: size, hasCloseButton: !hideCloseButton }, [className]), transitionProps: tslib_1.__assign(tslib_1.__assign({}, (variant === 'fullscreen' && {
+            classNames: (0, exports.cnDialogModal)({ animation: 'fullscreen' }),
+        })), transitionProps), ref: ref }),
+        react_1.default.createElement("div", { className: (0, exports.cnDialogModal)('InnerContainer') }, children),
+        !hideCloseButton && (react_1.default.createElement("div", { className: (0, exports.cnDialogModal)('CloseButton') }, closeButton))));
+});
+exports.DialogModal.displayName = 'DialogModal';

package/__inner__/cjs/components/DialogNext/components/DialogModal/index.d.ts

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

package/__inner__/cjs/components/DialogNext/components/DialogModal/index.js

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

package/__inner__/cjs/components/DialogNext/components/DialogModal/types.d.ts

@@ -0,0 +1,11 @@
+import type { ReactNode } from 'react';
+import type { ModalProps, ModalRef } from '../../../Modal';
+import type { DialogSizeAllVariants, DialogVariant } from '../../entities';
+export type DialogModalRef = ModalRef;
+export type DialogModalProps = {
+    closeButton: ReactNode;
+    size: DialogSizeAllVariants;
+    variant: DialogVariant;
+    hideCloseButton: boolean | undefined;
+    onClose: (() => void) | undefined;
+} & ModalProps;

package/__inner__/cjs/components/DialogNext/components/DialogModal/types.js

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

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

@@ -0,0 +1,2 @@
+export * from './DialogBottomSheet';
+export * from './DialogModal';

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

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

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

@@ -0,0 +1,6 @@
+import type { DialogVariant } from './entities';
+export declare const DIALOG_DEFAULT_DEVICE_TYPE = "desktop";
+export declare const DIALOG_DEFAULT_SIZE = "m";
+export declare const DIALOG_DEFAULT_VARIANT = "medium";
+export declare const DIALOG_DEFAULT_HIDE_CLOSE_BUTTON = false;
+export declare const DIALOG_MOBILE_BOTTOM_SHEET_VIEW_VARIANTS: Readonly<DialogVariant[]>;

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

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DIALOG_MOBILE_BOTTOM_SHEET_VIEW_VARIANTS = exports.DIALOG_DEFAULT_HIDE_CLOSE_BUTTON = exports.DIALOG_DEFAULT_VARIANT = exports.DIALOG_DEFAULT_SIZE = exports.DIALOG_DEFAULT_DEVICE_TYPE = void 0;
+exports.DIALOG_DEFAULT_DEVICE_TYPE = 'desktop';
+exports.DIALOG_DEFAULT_SIZE = 'm';
+exports.DIALOG_DEFAULT_VARIANT = 'medium';
+exports.DIALOG_DEFAULT_HIDE_CLOSE_BUTTON = false;
+exports.DIALOG_MOBILE_BOTTOM_SHEET_VIEW_VARIANTS = ['medium', 'large'];

package/__inner__/cjs/components/DialogNext/entities/device.d.ts

@@ -0,0 +1,2 @@
+export declare const dialogDeviceType: readonly ["mobile", "desktop"];
+export type DialogDeviceType = (typeof dialogDeviceType)[number];

package/__inner__/cjs/components/DialogNext/entities/device.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.dialogDeviceType = void 0;
+exports.dialogDeviceType = ['mobile', 'desktop'];

package/__inner__/cjs/components/DialogNext/entities/index.d.ts

@@ -0,0 +1,4 @@
+export * from './device';
+export * from './size';
+export * from './variant';
+export * from './viewType';

package/__inner__/cjs/components/DialogNext/entities/index.js

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

package/__inner__/cjs/components/DialogNext/entities/size.d.ts

@@ -0,0 +1,12 @@
+import type { DialogDeviceType } from './device';
+export declare const dialogSizeVariantByDeviceType: {
+    readonly desktop: readonly ["s", "m"];
+    readonly mobile: readonly ["m"];
+};
+export type DialogSizeVariantByDeviceType = {
+    [key in DialogDeviceType]: (typeof dialogSizeVariantByDeviceType)[key][number];
+};
+export type DialogSizeAllVariants = DialogSizeVariantByDeviceType[DialogDeviceType];
+export type DialogValueBySize<DeviceType extends DialogDeviceType, Value> = {
+    [key in DialogSizeVariantByDeviceType[DeviceType]]: Value;
+};

package/__inner__/cjs/components/DialogNext/entities/size.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.dialogSizeVariantByDeviceType = void 0;
+exports.dialogSizeVariantByDeviceType = {
+    desktop: ['s', 'm'],
+    mobile: ['m'],
+};

package/__inner__/cjs/components/DialogNext/entities/variant.d.ts

@@ -0,0 +1,2 @@
+export declare const dialogVariant: readonly ["small", "medium", "large", "fullscreen"];
+export type DialogVariant = (typeof dialogVariant)[number];

package/__inner__/cjs/components/DialogNext/entities/variant.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.dialogVariant = void 0;
+exports.dialogVariant = [
+    'small',
+    'medium',
+    'large',
+    'fullscreen',
+];

package/__inner__/cjs/components/DialogNext/entities/viewType.d.ts

@@ -0,0 +1,2 @@
+export declare const dialogViewType: readonly ["bottomSheet", "modal"];
+export type DialogViewType = (typeof dialogViewType)[number];

package/__inner__/cjs/components/DialogNext/entities/viewType.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.dialogViewType = void 0;
+exports.dialogViewType = ['bottomSheet', 'modal'];

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

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

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

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

package/__inner__/cjs/components/DialogNext/modules/DialogBody/DialogBody.css

@@ -0,0 +1,28 @@
+.DialogNextBody {
+  --dialog-body-first-child-margin-top: var(--spacing-3xl);
+  padding-inline: var(--dialog-inline-padding);
+}
+
+  .BottomSheetBaseHeader + .DialogNextBody, .DialogNextBody_viewType_modal.DialogNextBody:first-child {
+    margin-block-start: calc(var(--dialog-body-first-child-margin-top) - var(--dialog-header-size));
+  }
+
+  .DialogNextBody:last-child {
+    margin-block-end: var(--dialog-block-padding);
+  }
+
+  /* ---- DEVICE TYPE ---- */
+
+  .DialogNextBody_deviceType_desktop.DialogNextBody_size_s {
+    --dialog-body-first-child-margin-top: var(--spacing-xl);
+  }
+
+  /* ---- VIEW TYPE ---- */
+
+  .DialogNextBody_viewType_modal {
+    flex-grow: 1;
+    max-block-size: 100%;
+    overflow: auto;
+  }
+
+

package/__inner__/cjs/components/DialogNext/modules/DialogBody/DialogBody.d.ts

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

package/__inner__/cjs/components/DialogNext/modules/DialogBody/DialogBody.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogBody = exports.cnDialogBody = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var classname_1 = require("../../../../utils/classname");
+var BottomSheetBase_1 = require("../../../BottomSheetBase");
+var DialogContext_1 = require("../../DialogContext");
+exports.cnDialogBody = (0, classname_1.cn)('DialogNextBody');
+exports.DialogBody = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, className = _a.className, other = tslib_1.__rest(_a, ["children", "className"]);
+    var _b = (0, DialogContext_1.useDialogContext)(), size = _b.size, deviceType = _b.deviceType, isBottomSheet = _b.isBottomSheet, viewType = _b.viewType;
+    var Component = (isBottomSheet ? BottomSheetBase_1.BottomSheetBaseContent : 'div');
+    return (react_1.default.createElement(Component, tslib_1.__assign({}, other, { ref: ref, className: (0, exports.cnDialogBody)({
+            size: size,
+            deviceType: deviceType,
+            viewType: viewType,
+        }, [className]) }), children));
+});
+exports.DialogBody.displayName = 'DialogBody';

package/__inner__/cjs/components/DialogNext/modules/DialogBody/index.d.ts

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

package/__inner__/cjs/components/DialogNext/modules/DialogBody/index.js

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

package/__inner__/cjs/components/DialogNext/modules/DialogBody/types.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from 'react';
+import type { ExtendableComponentPropsWithRef } from '../../../../types/ExtendableComponentPropsWithRef';
+export type DialogBodyPropsRef = HTMLDivElement;
+export type DialogBodyProps = ExtendableComponentPropsWithRef<{
+    /** Содержимое */
+    children: ReactNode;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+}, 'div'>;

package/__inner__/cjs/components/DialogNext/modules/DialogBody/types.js

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

package/__inner__/cjs/components/DialogNext/modules/DialogCloseButton/DialogCloseButton.d.ts

@@ -0,0 +1,3 @@
+import type { DialogCloseButtonBaseProps } from './types';
+export declare const cnDialogCloseButton: import("@bem-react/classname").ClassNameFormatter;
+export declare const DialogCloseButton: import("../../../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<DialogCloseButtonBaseProps, "button">;

package/__inner__/cjs/components/DialogNext/modules/DialogCloseButton/DialogCloseButton.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogCloseButton = exports.cnDialogCloseButton = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var icons_1 = require("@ozen-ui/icons");
+var classname_1 = require("../../../../utils/classname");
+var polymorphicComponentWithRef_1 = require("../../../../utils/polymorphicComponentWithRef");
+var IconButtonNext_1 = require("../../../IconButtonNext");
+var DialogContext_1 = require("../../DialogContext");
+var constants_1 = require("./constants");
+exports.cnDialogCloseButton = (0, classname_1.cn)('DialogNextCloseButton');
+exports.DialogCloseButton = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (_a, ref) {
+    var _b = _a.as, as = _b === void 0 ? constants_1.DIALOG_CLOSE_BUTTON_DEFAULT_TAG : _b, className = _a.className, onClickProp = _a.onClick, _c = _a.icon, icon = _c === void 0 ? icons_1.CrossIcon : _c, _d = _a.variant, variant = _d === void 0 ? constants_1.DIALOG_CLOSE_BUTTON_DEFAULT_VARIANT : _d, _e = _a.name, name = _e === void 0 ? constants_1.DIALOG_CLOSE_BUTTON_DEFAULT_NAME : _e, other = tslib_1.__rest(_a, ["as", "className", "onClick", "icon", "variant", "name"]);
+    var _f = (0, DialogContext_1.useDialogContext)(), onClose = _f.onClose, size = _f.size;
+    var onClick = function (event) {
+        onClickProp === null || onClickProp === void 0 ? void 0 : onClickProp(event);
+        onClose();
+    };
+    return (react_1.default.createElement(IconButtonNext_1.IconButton, tslib_1.__assign({ variant: variant, name: name, as: as, size: size, ref: ref, className: (0, exports.cnDialogCloseButton)('', [className]), onClick: onClick, icon: icon, compressed: true }, other)));
+});

package/__inner__/cjs/components/DialogNext/modules/DialogCloseButton/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const DIALOG_CLOSE_BUTTON_DEFAULT_TAG = "button";
+export declare const DIALOG_CLOSE_BUTTON_DEFAULT_VARIANT = "ghost";
+export declare const DIALOG_CLOSE_BUTTON_DEFAULT_NAME = "close";

package/__inner__/cjs/components/DialogNext/modules/DialogCloseButton/constants.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DIALOG_CLOSE_BUTTON_DEFAULT_NAME = exports.DIALOG_CLOSE_BUTTON_DEFAULT_VARIANT = exports.DIALOG_CLOSE_BUTTON_DEFAULT_TAG = void 0;
+exports.DIALOG_CLOSE_BUTTON_DEFAULT_TAG = 'button';
+exports.DIALOG_CLOSE_BUTTON_DEFAULT_VARIANT = 'ghost';
+exports.DIALOG_CLOSE_BUTTON_DEFAULT_NAME = 'close';

package/__inner__/cjs/components/DialogNext/modules/DialogCloseButton/index.d.ts

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

package/__inner__/cjs/components/DialogNext/modules/DialogCloseButton/index.js

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

package/__inner__/cjs/components/DialogNext/modules/DialogCloseButton/types.d.ts

@@ -0,0 +1,7 @@
+import type { ElementType } from 'react';
+import type { WithPartial } from '../../../../types/object';
+import type { PolymorphicComponentPropsWithoutRef } from '../../../../utils/polymorphicComponentWithRef';
+import type { IconButtonBaseProps } from '../../../IconButtonNext';
+import type { DIALOG_CLOSE_BUTTON_DEFAULT_TAG } from './constants';
+export type DialogCloseButtonBaseProps = WithPartial<Omit<IconButtonBaseProps, 'size'>, 'icon'>;
+export type DialogCloseButtonProps<As extends ElementType = typeof DIALOG_CLOSE_BUTTON_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<DialogCloseButtonBaseProps, As>;

package/__inner__/cjs/components/DialogNext/modules/DialogCloseButton/types.js

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

package/__inner__/cjs/components/DialogNext/modules/DialogFooter/DialogFooter.css

@@ -0,0 +1,71 @@
+.DialogNextFooter {
+  --dialog-footer-padding-block-start: var(--spacing-m);
+  display: flex;
+  padding-block-end: var(--dialog-block-padding);
+  padding-inline: var(--dialog-inline-padding);
+  margin-block-start: auto;
+}
+
+  .DialogNextFooter-Container {
+    position: relative;
+  }
+
+  .DialogNextFooter-Divider {
+    position: absolute;
+  }
+
+  .DialogNextFooter_marginTop {
+    padding-block-start: var(--dialog-footer-padding-block-start);
+  }
+
+  /* ---- MODE ---- */
+
+  .DialogNextFooter_mode_start {
+    justify-content: flex-start;
+  }
+
+  .DialogNextFooter_mode_end {
+    justify-content: flex-end;
+  }
+
+  .DialogNextFooter_mode_space-between {
+    justify-content: space-between;
+  }
+
+  /* ---- ALIGN ---- */
+
+  .DialogNextFooter_align_left {
+    justify-content: space-between;
+  }
+
+  .DialogNextFooter_align_right {
+    justify-content: flex-end;
+  }
+
+  .DialogNextFooter_align_vertical {
+    flex-direction: column;
+  }
+
+  .DialogNextFooter_align_vertical .DialogNextFooterButtonsGroup {
+      flex-direction: column;
+    }
+
+  .DialogNextFooter_align_horizontal {
+    flex-direction: row;
+  }
+
+  .DialogNextFooter_align_horizontal > *, .DialogNextFooter_align_horizontal .DialogNextFooterButtonsGroup > * {
+      flex-grow: 1;
+    }
+
+  /* ---- DEVICE TYPE ---- */
+
+  .DialogNextFooter_deviceType_desktop.DialogNextFooter_size_m {
+    --dialog-footer-padding-block-start: var(--spacing-l)
+  }
+
+  /* ---- VIEW TYPE ---- */
+
+  .DialogNextFooter_viewType_modal {
+    flex-shrink: 0;
+  }

package/__inner__/cjs/components/DialogNext/modules/DialogFooter/DialogFooter.d.ts

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

package/__inner__/cjs/components/DialogNext/modules/DialogFooter/DialogFooter.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogFooter = exports.cnDialogFooter = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var classname_1 = require("../../../../utils/classname");
+var object_1 = require("../../../../utils/object");
+var BottomSheetBase_1 = require("../../../BottomSheetBase");
+var Divider_1 = require("../../../Divider");
+var DialogContext_1 = require("../../DialogContext");
+var constants_1 = require("./constants");
+exports.cnDialogFooter = (0, classname_1.cn)('DialogNextFooter');
+exports.DialogFooter = (0, react_1.forwardRef)(function (_a, ref) {
+    var children = _a.children, _b = _a.align, alignProp = _b === void 0 ? constants_1.DIALOG_FOOTER_DEFAULT_ALIGN : _b, className = _a.className, _c = _a.expandOnDrag, expandOnDrag = _c === void 0 ? constants_1.DIALOG_FOOTER_DEFAULT_EXPAND_ON_DRAG : _c, _d = _a.marginTop, marginTop = _d === void 0 ? constants_1.DIALOG_FOOTER_DEFAULT_MARGIN_TOP : _d, _e = _a.withDivider, withDivider = _e === void 0 ? constants_1.DIALOG_FOOTER_DEFAULT_WITH_DIVIDER : _e, other = tslib_1.__rest(_a, ["children", "align", "className", "expandOnDrag", "marginTop", "withDivider"]);
+    var _f = (0, DialogContext_1.useDialogContext)(), size = _f.size, deviceType = _f.deviceType, isBottomSheet = _f.isBottomSheet;
+    var Component = isBottomSheet
+        ? BottomSheetBase_1.BottomSheetBaseFooter
+        : 'div';
+    var bottomSheetProps = isBottomSheet
+        ? {
+            expandOnDrag: expandOnDrag,
+        }
+        : undefined;
+    var align = (function () {
+        if ((0, object_1.isPlainObject)(alignProp)) {
+            return alignProp[deviceType];
+        }
+        return alignProp;
+    })();
+    return (react_1.default.createElement(Component, tslib_1.__assign({}, other, bottomSheetProps, { ref: ref, className: (0, exports.cnDialogFooter)('Container', [className]) }),
+        withDivider && react_1.default.createElement(Divider_1.Divider, { className: (0, exports.cnDialogFooter)('Divider') }),
+        react_1.default.createElement("div", { className: (0, exports.cnDialogFooter)({
+                size: size,
+                align: align,
+                deviceType: deviceType,
+                marginTop: marginTop,
+            }) }, children)));
+});
+exports.DialogFooter.displayName = 'DialogFooter';