@ozen-ui/kit 0.66.0 → 0.67.0

package/__inner__/esm/components/DialogNext/modules/DialogSubtitle/DialogSubtitle.d.ts

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

package/__inner__/esm/components/DialogNext/modules/DialogSubtitle/DialogSubtitle.js

@@ -0,0 +1,14 @@
+import { __assign, __rest } from "tslib";
+import React, { forwardRef } from 'react';
+import { cn } from '../../../../utils/classname';
+import { useDialogContext } from '../../DialogContext';
+export var cnDialogSubtitle = cn('DialogNextSubtitle');
+export var DialogSubtitle = forwardRef(function (_a, ref) {
+    var children = _a.children, className = _a.className, other = __rest(_a, ["children", "className"]);
+    var _b = useDialogContext(), deviceType = _b.deviceType, size = _b.size;
+    return (React.createElement("div", __assign({}, other, { ref: ref, className: cnDialogSubtitle({
+            deviceType: deviceType,
+            size: size,
+        }, [className]) }), children));
+});
+DialogSubtitle.displayName = 'DialogSubtitle';

package/__inner__/esm/components/DialogNext/modules/DialogSubtitle/index.d.ts

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

package/__inner__/esm/components/DialogNext/modules/DialogSubtitle/index.js

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

package/__inner__/esm/components/DialogNext/modules/DialogSubtitle/types.d.ts

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

package/__inner__/esm/components/DialogNext/modules/DialogSubtitle/types.js

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

package/__inner__/esm/components/DialogNext/modules/DialogTitle/DialogTitle.css

@@ -0,0 +1,23 @@
+/* stylelint-disable */
+.DialogNextTitle {
+  --dialog-title-gap: var(--spacing-xs);
+
+  font: var(--typography-heading-xl-font);
+
+  letter-spacing: var(--typography-heading-xl-letter_spacing, 0);
+
+  text-transform: var(--typography-heading-xl-text_transform, none);
+  display: flex;
+  align-items: center;
+  gap: var(--dialog-title-gap);
+  padding-inline-end: var(--dialog-header-item-padding-right);
+  color: var(--color-content-primary);
+}
+.DialogNextTitle_deviceType_desktop.DialogNextTitle_size_m {
+    font: var(--typography-heading-2xl-font);
+    letter-spacing: var(--typography-heading-2xl-letter_spacing, 0);
+    text-transform: var(--typography-heading-2xl-text_transform, none);
+  }
+.DialogNextTitle_size_m {
+    --dialog-title-gap: var(--spacing-s);
+  }

package/__inner__/esm/components/DialogNext/modules/DialogTitle/DialogTitle.d.ts

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

package/__inner__/esm/components/DialogNext/modules/DialogTitle/DialogTitle.js

@@ -0,0 +1,22 @@
+import { __assign, __rest } from "tslib";
+import React, { forwardRef } from 'react';
+import { cn } from '../../../../utils/classname';
+import { renderContent } from '../../../../utils/renderContent';
+import { useDialogContext } from '../../DialogContext';
+export var cnDialogTitle = cn('DialogNextTitle');
+export var DialogTitle = forwardRef(function (_a, ref) {
+    var children = _a.children, className = _a.className, iconLeft = _a.iconLeft, other = __rest(_a, ["children", "className", "iconLeft"]);
+    var _b = useDialogContext(), deviceType = _b.deviceType, size = _b.size;
+    var renderIcon = function (content) {
+        return renderContent({
+            content: content,
+            props: {
+                size: 'm',
+            },
+        });
+    };
+    return (React.createElement("div", __assign({}, other, { ref: ref, className: cnDialogTitle({ size: size, deviceType: deviceType }, [className]) }),
+        renderIcon(iconLeft),
+        children));
+});
+DialogTitle.displayName = 'DialogTitle';

package/__inner__/esm/components/DialogNext/modules/DialogTitle/index.d.ts

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

package/__inner__/esm/components/DialogNext/modules/DialogTitle/index.js

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

package/__inner__/esm/components/DialogNext/modules/DialogTitle/types.d.ts

@@ -0,0 +1,14 @@
+import type { ReactNode } from 'react';
+import type { IconProps } from '@ozen-ui/icons';
+import type { ExtendableComponentPropsWithRef } from '../../../../types/ExtendableComponentPropsWithRef';
+import type { RenderContentType } from '../../../../utils/renderContent';
+export type DialogTitleRef = HTMLHeadingElement;
+export type DialogTitleIcon = RenderContentType<IconProps>['content'];
+export type DialogTitleProps = ExtendableComponentPropsWithRef<{
+    /** Содержимое */
+    children: ReactNode;
+    /** Иконка слева */
+    iconLeft?: DialogTitleIcon;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+}, 'h2'>;

package/__inner__/esm/components/DialogNext/modules/DialogTitle/types.js

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

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

@@ -0,0 +1,8 @@
+export * from './DialogBody';
+export * from './DialogCloseButton';
+export * from './DialogFooter';
+export * from './DialogFooterButton';
+export * from './DialogFooterButtonsGroup';
+export * from './DialogHeader';
+export * from './DialogSubtitle';
+export * from './DialogTitle';

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

@@ -0,0 +1,8 @@
+export * from './DialogBody';
+export * from './DialogCloseButton';
+export * from './DialogFooter';
+export * from './DialogFooterButton';
+export * from './DialogFooterButtonsGroup';
+export * from './DialogHeader';
+export * from './DialogSubtitle';
+export * from './DialogTitle';

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

@@ -0,0 +1,44 @@
+import type { RenderContentType } from '../../utils/renderContent';
+import type { BackdropProps } from '../Backdrop';
+import type { PortalProps } from '../Portal';
+import type { DialogBottomSheetProps, DialogModalProps } from './components';
+import type { DIALOG_DEFAULT_DEVICE_TYPE } from './constants';
+import type { DialogDeviceType, DialogSizeVariantByDeviceType, DialogVariant } from './entities';
+export type DialogRef = HTMLDivElement;
+export type DialogRenderCloseButton = RenderContentType<{}>['content'];
+export type DialogContentBottomSheetProps = Omit<DialogBottomSheetProps, 'hideCloseButton' | 'backdrop' | 'open' | 'size' | 'variant' | 'closeButton' | 'onClose' | 'className'>;
+export type DialogContentModalProps = Omit<DialogModalProps, 'open' | 'onClose' | 'hideCloseButton' | 'className' | 'closeButton' | 'size' | 'variant'>;
+export type DialogBaseProps = {
+    /** Если `true`, будет отображаться окно диалога */
+    open: boolean;
+    /** Вариант представления шторки */
+    variant?: DialogVariant;
+    /** Свойства компонента шторки */
+    bottomSheetProps?: DialogContentBottomSheetProps;
+    /** Свойства компонента модального окна */
+    modalProps?: DialogContentModalProps;
+    /** Кнопка закрытия */
+    renderCloseButton?: DialogRenderCloseButton;
+    /** Если `true`, скрывается кнопка закрытия */
+    hideCloseButton?: boolean;
+    /** Вызывается при закрытии Dialog */
+    onClose?: () => void;
+    /** Дополнительные CSS-классы */
+    className?: string;
+    /** Свойства компонента backdrop */
+    backdropProps?: BackdropProps;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
+} & PortalProps;
+export type DialogDeviceTypeProps<DeviceType extends DialogDeviceType | undefined> = DialogBaseProps & (DeviceType extends DialogDeviceType ? {
+    /** Размер */
+    size?: DialogSizeVariantByDeviceType[DeviceType];
+    /** Тип устройства */
+    deviceType: DeviceType;
+} : {
+    /** Размер */
+    size?: DialogSizeVariantByDeviceType[typeof DIALOG_DEFAULT_DEVICE_TYPE];
+    /** Тип устройства */
+    deviceType?: undefined;
+});
+export type DialogProps = DialogDeviceTypeProps<DialogDeviceType> | DialogDeviceTypeProps<undefined>;

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

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

package/__inner__/esm/components/InputNumber/utils.js

@@ -1,5 +1,5 @@
 import { Decimal } from 'decimal.js';
-import { isNumber } from '../../utils/isNumber';
+import { isNumber } from '../../utils/number';
 export var isValidValue = function (value) {
     return value !== '' && !Number.isNaN(value) && isNumber(value);
 };

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

@@ -1,6 +1,6 @@
 import { isFunction } from '../../utils/isFunction';
-import { isNumber } from '../../utils/isNumber';
 import { isString } from '../../utils/isString';
+import { isNumber } from '../../utils/number';
 export var maskSymbol = function (mask, value, index) {
     if (value === '') {
         return '';

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

@@ -2,7 +2,7 @@ import { __read, __spreadArray } from "tslib";
 import { isFunction } from '../../../utils/isFunction';
 import { isKey } from '../../../utils/isKey';
 import { isKeys } from '../../../utils/isKeys';
-import { isNumber } from '../../../utils/isNumber';
+import { isNumber } from '../../../utils/number';
 import { maskSymbol, maskValue, valueToString } from '../helper';
 export var useInputOTPEvents = function (_a) {
     var inputs = _a.inputs, valueByIndex = _a.valueByIndex, setValueByIndex = _a.setValueByIndex, validateFromProps = _a.validate, length = _a.length, onPasteFromProps = _a.onPaste, onKeyDownFromProps = _a.onKeyDown, onFinish = _a.onFinish, mask = _a.mask, finishBehavior = _a.finishBehavior;

package/__inner__/esm/components/Pagination/Pagination.js

@@ -3,7 +3,7 @@ import './Pagination.css';
 import React, { useMemo } from 'react';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
-import { isNumber } from '../../utils/isNumber';
+import { isNumber } from '../../utils/number';
 import { polymorphicComponentWithRef } from '../../utils/polymorphicComponentWithRef';
 import { PaginationItem, cnPaginationItem, } from './components';
 import { PAGINATION_DEFAULT_TAG, PAGINATION_DEFAULT_PAGE, PAGINATION_DEFAULT_SIBLING_COUNT, PAGINATION_DEFAULT_SIZE, ELLIPSIS, NEXT, PAGE, PREVIOUS, } from './constants';

package/__inner__/esm/components/Pagination/components/PaginationItem/PaginationItem.js

@@ -1,7 +1,7 @@
 import { __assign, __rest } from "tslib";
 import React, { forwardRef } from 'react';
 import { cn } from '../../../../utils/classname';
-import { isNumber } from '../../../../utils/isNumber';
+import { isNumber } from '../../../../utils/number';
 import { ButtonBase } from '../../../ButtonBase';
 import { IconButton } from '../../../IconButtonNext';
 import { NEXT, ELLIPSIS, PREVIOUS, PAGINATION_ITEM_DEFAULT_SELECTED, PAGINATION_ITEM_DEFAULT_DISABLED, PAGINATION_ITEM_DEFAULT_SIZE, } from '../../constants';

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

@@ -1,5 +1,6 @@
+import './modules/SectionMessageButton/SectionMessageButton.css';
 import './SectionMessage.css';
 import React from 'react';
-import type { SectionMessageProps } from './index';
+import type { SectionMessageProps } from './types';
 export declare const cnSectionMessage: import("@bem-react/classname").ClassNameFormatter;
 export declare const SectionMessage: React.ForwardRefExoticComponent<Omit<SectionMessageProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/SectionMessage/SectionMessage.js

@@ -1,33 +1,13 @@
 import { __assign, __rest } from "tslib";
+import './modules/SectionMessageButton/SectionMessageButton.css';
 import './SectionMessage.css';
 import React, { forwardRef } from 'react';
-import { InfoCircleOutlineIcon, CheckCircleOutlineIcon, WarningTriangleOutlineIcon, WarningCircleOutlineIcon, } from '@ozen-ui/icons';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
+import { SECTION_MESSAGE_ICON_BY_STATUS } from './config';
 import { SECTION_MESSAGE_DEFAULT_SIZE, SECTION_MESSAGE_DEFAULT_STATUS, } from './constants';
+import { SectionMessageContext } from './SectionMessageContext';
 export var cnSectionMessage = cn('SectionMessage');
-var matchVariantToIcon = {
-    neutral: {
-        m: React.createElement(InfoCircleOutlineIcon, { size: "m" }),
-        s: React.createElement(InfoCircleOutlineIcon, { size: "s" }),
-    },
-    info: {
-        m: React.createElement(InfoCircleOutlineIcon, { size: "m" }),
-        s: React.createElement(InfoCircleOutlineIcon, { size: "s" }),
-    },
-    warning: {
-        m: React.createElement(WarningTriangleOutlineIcon, { size: "m" }),
-        s: React.createElement(WarningTriangleOutlineIcon, { size: "s" }),
-    },
-    success: {
-        m: React.createElement(CheckCircleOutlineIcon, { size: "m" }),
-        s: React.createElement(CheckCircleOutlineIcon, { size: "s" }),
-    },
-    error: {
-        m: React.createElement(WarningCircleOutlineIcon, { size: "m" }),
-        s: React.createElement(WarningCircleOutlineIcon, { size: "s" }),
-    },
-};
 export var SectionMessage = forwardRef(function (inProps, ref) {
     var props = useThemeProps({
         props: inProps,
@@ -49,11 +29,14 @@ export var SectionMessage = forwardRef(function (inProps, ref) {
         }
         return React.cloneElement(action, actionProps);
     };
-    return (React.createElement("div", __assign({ className: cnSectionMessage({ status: status, size: size }, [className]), role: "alert" }, otherProps, { ref: ref }),
-        showIcon && (React.createElement("div", { className: cnSectionMessage('Icon') }, matchVariantToIcon[status][iconSize])),
-        React.createElement("div", { className: cnSectionMessage('Content') },
-            title && React.createElement("div", { className: cnSectionMessage('Title') }, title),
-            children && React.createElement("div", { className: cnSectionMessage('Body') }, children),
-            action && (React.createElement("div", { className: cnSectionMessage('Action') }, resolveAction(action))))));
+    return (React.createElement(SectionMessageContext.Provider, { value: {
+            size: size,
+        } },
+        React.createElement("div", __assign({ className: cnSectionMessage({ status: status, size: size }, [className]), role: "alert" }, otherProps, { ref: ref }),
+            showIcon && (React.createElement("div", { className: cnSectionMessage('Icon') }, SECTION_MESSAGE_ICON_BY_STATUS[status][iconSize])),
+            React.createElement("div", { className: cnSectionMessage('Content') },
+                title && React.createElement("div", { className: cnSectionMessage('Title') }, title),
+                children && (React.createElement("div", { className: cnSectionMessage('Body') }, children)),
+                action && (React.createElement("div", { className: cnSectionMessage('Action') }, resolveAction(action)))))));
 });
 SectionMessage.displayName = 'SectionMessage';

package/__inner__/esm/components/SectionMessage/SectionMessageContext.d.ts

@@ -0,0 +1,7 @@
+import type { SectionMessageSizeVariant } from './types';
+export type SectionMessageContextValue = {
+    size: SectionMessageSizeVariant;
+};
+export declare const SectionMessageContextDefaultValue: SectionMessageContextValue;
+export declare const SectionMessageContext: import("react").Context<SectionMessageContextValue>;
+export declare const useSectionMessageContext: () => SectionMessageContextValue;

package/__inner__/esm/components/SectionMessage/SectionMessageContext.js

@@ -0,0 +1,12 @@
+import { createContext, useContext } from 'react';
+import { IS_DEV } from '../../constants/environment';
+import { SECTION_MESSAGE_DEFAULT_SIZE } from './constants';
+export var SectionMessageContextDefaultValue = {
+    size: SECTION_MESSAGE_DEFAULT_SIZE,
+};
+export var SectionMessageContext = createContext(SectionMessageContextDefaultValue);
+export var useSectionMessageContext = function () { return useContext(SectionMessageContext); };
+// Именованный провайдер
+if (IS_DEV) {
+    SectionMessageContext.displayName = 'SectionMessageContext';
+}

package/__inner__/esm/components/SectionMessage/config.d.ts

@@ -0,0 +1,3 @@
+import type { ReactNode } from 'react';
+import type { SectionMessageStatusVariant } from './types';
+export declare const SECTION_MESSAGE_ICON_BY_STATUS: Readonly<Record<SectionMessageStatusVariant, Record<'s' | 'm', ReactNode>>>;

package/__inner__/esm/components/SectionMessage/config.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import { CheckCircleOutlineIcon, InfoCircleOutlineIcon, WarningCircleOutlineIcon, WarningTriangleOutlineIcon, } from '@ozen-ui/icons';
+export var SECTION_MESSAGE_ICON_BY_STATUS = {
+    neutral: {
+        m: React.createElement(InfoCircleOutlineIcon, { size: "m" }),
+        s: React.createElement(InfoCircleOutlineIcon, { size: "s" }),
+    },
+    info: {
+        m: React.createElement(InfoCircleOutlineIcon, { size: "m" }),
+        s: React.createElement(InfoCircleOutlineIcon, { size: "s" }),
+    },
+    warning: {
+        m: React.createElement(WarningTriangleOutlineIcon, { size: "m" }),
+        s: React.createElement(WarningTriangleOutlineIcon, { size: "s" }),
+    },
+    success: {
+        m: React.createElement(CheckCircleOutlineIcon, { size: "m" }),
+        s: React.createElement(CheckCircleOutlineIcon, { size: "s" }),
+    },
+    error: {
+        m: React.createElement(WarningCircleOutlineIcon, { size: "m" }),
+        s: React.createElement(WarningCircleOutlineIcon, { size: "s" }),
+    },
+};

package/__inner__/esm/components/SectionMessage/modules/SectionMessageButton/SectionMessageButton.css

@@ -0,0 +1,12 @@
+.SectionMessageButton.ButtonNext {
+    color: var(--section-message-button-color);
+  }
+
+    .SectionMessageButton.ButtonNext:hover,
+    .SectionMessageButton.ButtonNext:focus:not(:focus-visible) {
+      color: var(--section-message-button-color);
+    }
+
+    .SectionMessageButton.ButtonNext:focus {
+      color: var(--section-message-button-color-hover);
+    }

package/__inner__/esm/components/SectionMessage/modules/SectionMessageButton/SectionMessageButton.d.ts

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

package/__inner__/esm/components/SectionMessage/modules/SectionMessageButton/SectionMessageButton.js

@@ -0,0 +1,14 @@
+import { __assign, __rest } from "tslib";
+import React from 'react';
+import { cn } from '../../../../utils/classname';
+import { polymorphicComponentWithRef } from '../../../../utils/polymorphicComponentWithRef';
+import { Button } from '../../../ButtonNext';
+import { useSectionMessageContext } from '../../SectionMessageContext';
+import { SECTION_MESSAGE_BUTTON_DEFAULT_TAG } from './constants';
+export var cnSectionMessageButton = cn('SectionMessageButton');
+export var SectionMessageButton = polymorphicComponentWithRef(function (_a, ref) {
+    var children = _a.children, className = _a.className, _b = _a.as, as = _b === void 0 ? SECTION_MESSAGE_BUTTON_DEFAULT_TAG : _b, other = __rest(_a, ["children", "className", "as"]);
+    var size = useSectionMessageContext().size;
+    return (React.createElement(Button, __assign({}, other, { as: as, ref: ref, size: size, className: cnSectionMessageButton('', [className]), variant: "function" }), children));
+});
+SectionMessageButton.displayName = 'SectionMessageButton';

package/__inner__/esm/components/SectionMessage/modules/SectionMessageButton/constants.d.ts

@@ -0,0 +1 @@
+export declare const SECTION_MESSAGE_BUTTON_DEFAULT_TAG = "button";

package/__inner__/esm/components/SectionMessage/modules/SectionMessageButton/constants.js

@@ -0,0 +1 @@
+export var SECTION_MESSAGE_BUTTON_DEFAULT_TAG = 'button';

package/__inner__/esm/components/SectionMessage/modules/SectionMessageButton/index.d.ts

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

package/__inner__/esm/components/SectionMessage/modules/SectionMessageButton/index.js

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

package/__inner__/esm/components/SectionMessage/modules/SectionMessageButton/types.d.ts

@@ -0,0 +1,6 @@
+import type { ElementType } from 'react';
+import type { PolymorphicComponentPropsWithoutRef } from '../../../../utils/polymorphicComponentWithRef';
+import type { ButtonBaseProps } from '../../../ButtonNext';
+import type { SECTION_MESSAGE_BUTTON_DEFAULT_TAG } from './constants';
+export type SectionMessageButtonBaseProps = Omit<ButtonBaseProps, 'size' | 'variant'>;
+export type SectionMessageButtonProps<As extends ElementType = typeof SECTION_MESSAGE_BUTTON_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<SectionMessageButtonBaseProps, As>;

package/__inner__/esm/components/SectionMessage/modules/SectionMessageButton/types.js

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

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

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

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

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

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

@@ -25,6 +25,8 @@ export type TagBaseProps = {
     iconLeft?: TagIcon;
     /** Иконка справа */
     iconRight?: TagIcon;
+    /** Идентификатор компонента для тестов */
+    'data-testid'?: string;
 };
 export type TagProps<As extends ElementType = typeof TAG_DEFAULT_TAG> = PolymorphicComponentPropsWithoutRef<TagBaseProps, As>;
 export type TagRef = ComponentRef<typeof TAG_DEFAULT_TAG>;

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

@@ -23,6 +23,7 @@ import type { ContainerProps } from '../Container';
 import type { DataListProps } from '../DataList';
 import type { DatePickerProps } from '../DatePicker';
 import type { DialogProps } from '../Dialog';
+import type { DialogProps as DialogNextProps } from '../DialogNext';
 import type { DividerProps } from '../Divider';
 import type { DrawerProps } from '../Drawer';
 import type { DrawerProps as DrawerNextProps } from '../DrawerNext';
@@ -100,6 +101,7 @@ export type Theme = {
         Container?: Partial<ContainerProps>;
         DataList?: Partial<DataListProps>;
         Dialog?: Partial<DialogProps>;
+        DialogNext?: Partial<DialogNextProps>;
         DatePicker?: Partial<DatePickerProps>;
         Divider?: Partial<DividerProps>;
         Drawer?: Partial<DrawerProps>;

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

@@ -1,4 +1,4 @@
-import './modules/tag/TitleTag.css';
+import './modules/TitleTag/TitleTag.css';
 import type { TitleBaseProps } from './types';
 export declare const cnTitle: import("@bem-react/classname").ClassNameFormatter;
 export declare const Title: import("../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<TitleBaseProps, "div">;

package/__inner__/esm/components/Title/Title.js

@@ -1,5 +1,5 @@
 import { __assign, __rest } from "tslib";
-import './modules/tag/TitleTag.css';
+import './modules/TitleTag/TitleTag.css';
 import React from 'react';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';

package/__inner__/esm/components/Title/TitleContext.d.ts

@@ -4,5 +4,6 @@ export type TitleContextValue = {
     variant: TitleVariant;
     size: TitleSizeVariant;
 };
+export declare const TitleContextDefaultValue: TitleContextValue;
 export declare const TitleContext: React.Context<TitleContextValue>;
 export declare const useTitleContext: () => TitleContextValue;

package/__inner__/esm/components/Title/TitleContext.js

@@ -1,10 +1,11 @@
 import React, { useContext } from 'react';
 import { IS_DEV } from '../../constants/environment';
 import { TITLE_DEFAULT_SIZE, TITLE_DEFAULT_VARIANT } from './constants';
-export var TitleContext = React.createContext({
+export var TitleContextDefaultValue = {
     variant: TITLE_DEFAULT_VARIANT,
     size: TITLE_DEFAULT_SIZE,
-});
+};
+export var TitleContext = React.createContext(TitleContextDefaultValue);
 export var useTitleContext = function () { return useContext(TitleContext); };
 // Именованный провайдер
 if (IS_DEV) {

package/__inner__/esm/components/Title/components/variant/main/TitleMain.css

@@ -3,16 +3,18 @@
   display: inline-flex;
   flex-direction: column;
   align-items: flex-start;
-  gap: var(--space-xs);
+  gap: var(--spacing-3xs);
 }
-.TitleMain_defaultMargin {
-    margin-block: var(--title-main-default-margin-block);
+.TitleMain_withSpace {
+    margin-block: var(--title-main-default-margin-block-start) var(--title-main-default-margin-block-end);
+  }
+.TitleMain_withoutBreadcrumbs.TitleMain_withSpace {
+    margin-block-start: calc(var(--title-main-default-mock-breadcrumbs-height) + var(--title-main-default-margin-block-start));
   }
-.TitleMain_defaultMargin .TitleMain-Label {
-      block-size: 1em;
-    }
 .TitleMain_size_s {
-      --title-main-default-margin-block: 12px 16px;
+      --title-main-default-margin-block-start: 12px;
+      --title-main-default-margin-block-end: 16px;
+      --title-main-default-mock-breadcrumbs-height: 20px;
     }
 .TitleMain_size_s .TitleMain-Content {
         font: var(--typography-heading-xl-font);
@@ -20,7 +22,9 @@
         text-transform: var(--typography-heading-xl-text_transform, none);
       }
 .TitleMain_size_m {
-      --title-main-default-margin-block: 16px 24px;
+      --title-main-default-margin-block-start: 16px;
+      --title-main-default-margin-block-end: 24px;
+      --title-main-default-mock-breadcrumbs-height: 24px;
     }
 .TitleMain_size_m .TitleMain-Content {
         font: var(--typography-heading-2xl-font);
@@ -33,6 +37,3 @@
 .TitleMain-Content {
     color: var(--color-content-primary);
   }
-.TitleMain-Label {
-    cursor: default;
-  }

package/__inner__/esm/components/Title/components/variant/main/TitleMain.js

@@ -5,14 +5,13 @@ import { cn } from '../../../../../utils/classname';
 import { getIconSizeToFormElement } from '../../../../../utils/getIconSizeToFormElement';
 import { polymorphicComponentWithRef } from '../../../../../utils/polymorphicComponentWithRef';
 import { renderContent } from '../../../../../utils/renderContent';
-import { BreadcrumbItem, Breadcrumbs } from '../../../../Breadcrumbs';
 import { Stack } from '../../../../Stack';
 import { TITLE_DEFAULT_TAG } from '../../../constants';
-import { TITLE_MAIN_LABEL_SIZE_MAP } from './config';
 export var cnTitleMain = cn('TitleMain');
 export var TitleMain = polymorphicComponentWithRef(function (_a, ref) {
-    var size = _a.size, className = _a.className, _b = _a.as, Tag = _b === void 0 ? TITLE_DEFAULT_TAG : _b, children = _a.children, renderLeft = _a.renderLeft, renderRight = _a.renderRight, label = _a.label, defaultMarginProp = _a.defaultMargin, other = __rest(_a, ["size", "className", "as", "children", "renderLeft", "renderRight", "label", "defaultMargin"]);
-    var defaultMargin = defaultMarginProp === undefined ? !!label : defaultMarginProp;
+    var size = _a.size, className = _a.className, _b = _a.as, Tag = _b === void 0 ? TITLE_DEFAULT_TAG : _b, children = _a.children, renderLeft = _a.renderLeft, renderRight = _a.renderRight, breadcrumbs = _a.breadcrumbs, withBreadcrumbs = _a.withBreadcrumbs, other = __rest(_a, ["size", "className", "as", "children", "renderLeft", "renderRight", "breadcrumbs", "withBreadcrumbs"]);
+    var hasBreadcrumbs = !!breadcrumbs;
+    var withSpace = withBreadcrumbs || hasBreadcrumbs;
     var renderIcon = function (content) {
         return renderContent({
             content: content,
@@ -21,9 +20,12 @@ export var TitleMain = polymorphicComponentWithRef(function (_a, ref) {
             },
         });
     };
-    return (React.createElement(Tag, __assign({ className: cnTitleMain({ size: size, defaultMargin: defaultMargin }, [className]) }, other, { ref: ref }),
-        (label || defaultMargin) && (React.createElement(Breadcrumbs, { size: TITLE_MAIN_LABEL_SIZE_MAP[size], className: cnTitleMain('LabelContainer') },
-            React.createElement(BreadcrumbItem, { as: "span", className: cnTitleMain('Label') }, label))),
+    return (React.createElement(Tag, __assign({ className: cnTitleMain({
+            size: size,
+            withSpace: withSpace,
+            withoutBreadcrumbs: !hasBreadcrumbs,
+        }, [className]) }, other, { ref: ref }),
+        breadcrumbs,
         React.createElement(Stack, { gap: "s", align: "center", className: cnTitleMain('ContentContainer') },
             renderIcon(renderLeft),
             React.createElement("span", { className: cnTitleMain('Content') }, children),

package/__inner__/esm/components/Title/components/variant/main/types.d.ts

@@ -1,18 +1,18 @@
-import type { ElementType } from 'react';
+import type { ElementType, ReactNode } from 'react';
 import type { PolymorphicComponentPropsWithoutRef } from '../../../../../utils/polymorphicComponentWithRef';
 import type { TITLE_DEFAULT_TAG } from '../../../constants';
 import type { TitleIcon, TitleSizeVariant } from '../../../entities';
 export type TitleMainBaseProps = {
     /** Свойство, регулирующее размер слайдера */
     size: TitleSizeVariant;
-    /** Лейбл */
-    label?: string;
+    /** Хлебные крошки */
+    breadcrumbs?: ReactNode;
+    /** Если `true`, всегда будет добавлять отступ под хлебные крошки */
+    withBreadcrumbs?: boolean;
     /** Компонент слева */
     renderLeft?: TitleIcon;
     /** Компонент справа */
     renderRight?: TitleIcon;
-    /** Если `true` добавляет отступы */
-    defaultMargin?: boolean;
     /** data-атрибут для тестирования */
     'data-testid'?: string;
 };

package/__inner__/esm/components/Title/components/variant/secondary/TitleSecondary.css

@@ -2,6 +2,7 @@
 .TitleSecondary {
   display: inline-block;
   color: var(--color-content-secondary);
+  margin-block: var(--title-secondary-default-margin-block);
 }
 .TitleSecondary_size_s {
       --title-secondary-default-margin-block: 24px 12px;
@@ -21,6 +22,3 @@
 
       text-transform: var(--typography-text-m_1-text_transform, none);
     }
-.TitleSecondary_defaultMargin {
-    margin-block: var(--title-secondary-default-margin-block);
-  }