@astral/ui 4.18.3 → 4.18.5

package/node/components/Autocomplete/styles.js

@@ -1,7 +1,33 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StyledAutocomplete = exports.StyledMenuItem = void 0;
-const material_1 = require("@mui/material");
+const Autocomplete_1 = __importStar(require("@mui/material/Autocomplete"));
+const FormControl_1 = require("@mui/material/FormControl");
+const IconButton_1 = require("@mui/material/IconButton");
+const InputBase_1 = require("@mui/material/InputBase");
 const MenuItem_1 = require("../MenuItem");
 const SvgIcon_1 = require("../SvgIcon");
 const styled_1 = require("../styled");
@@ -12,16 +38,16 @@ exports.StyledMenuItem = (0, styled_1.styled)(MenuItem_1.MenuItem) `
         max-height: unset;
     }
 `;
-exports.StyledAutocomplete = (0, styled_1.styled)(material_1.Autocomplete) `
+exports.StyledAutocomplete = (0, styled_1.styled)(Autocomplete_1.default) `
     ${({ loading }) => {
     return (loading &&
-        `&& .${material_1.formControlClasses.root} .${material_1.inputBaseClasses.adornedEnd} .${SvgIcon_1.svgIconClassnames.root} {
+        `&& .${FormControl_1.formControlClasses.root} .${InputBase_1.inputBaseClasses.adornedEnd} .${SvgIcon_1.svgIconClassnames.root} {
         width: 100%;
         height: 100%;
       }`);
 }}
   
-  & .${material_1.autocompleteClasses.endAdornment} .${material_1.iconButtonClasses.root}:hover {
+  & .${Autocomplete_1.autocompleteClasses.endAdornment} .${IconButton_1.iconButtonClasses.root}:hover {
       background-color: ${({ loading, theme }) => (loading ? 'transparent' : theme.palette.grey[100])};
     }
 `;

package/node/components/Autocomplete/types.d.ts

@@ -1 +1,51 @@
-export type { AutocompleteOwnerState, AutocompleteProps as MuiAutocompleteProps, AutocompleteRenderGetTagProps, AutocompleteRenderInputParams, AutocompleteRenderOptionState, PopperProps, } from '@mui/material';
+import { type AutocompleteRenderInputParams, type AutocompleteProps as MuiAutocompleteProps } from '@mui/material/Autocomplete';
+import { type ReactNode } from 'react';
+import { type OverflowedElementProps } from '../OverflowTypography';
+import { type TextFieldProps } from '../TextField';
+import type { WithoutEmotionSpecific } from '../types/WithoutEmotionSpecific';
+export type { AutocompleteOwnerState, AutocompleteProps as MuiAutocompleteProps, AutocompleteRenderGetTagProps, AutocompleteRenderInputParams, AutocompleteRenderOptionState, } from '@mui/material/Autocomplete';
+export type { PopperProps } from '@mui/material/Popper';
+export type AutocompleteSize = 'small' | 'medium';
+export type AutocompleteProps<TAutocompleteValueProps, TMultiple extends boolean, TDisableClearable extends boolean, TFreeSolo extends boolean> = Omit<WithoutEmotionSpecific<MuiAutocompleteProps<TAutocompleteValueProps, TMultiple, TDisableClearable, TFreeSolo>>, 'size' | 'renderInput' | 'noOptionsText' | 'closeText' | 'openText' | 'clearText'> & Pick<TextFieldProps, 'error' | 'success' | 'helperText' | 'label' | 'required' | 'inputRef' | 'placeholder' | 'inputProps'> & {
+    renderInput?: (props: TextFieldProps & Omit<AutocompleteRenderInputParams, 'size'>) => ReactNode;
+    size?: AutocompleteSize;
+    /**
+     * Опции для OverflowTypography, который оборачивает содержимое item
+     */
+    overflowOption?: OverflowedElementProps;
+    /**
+     * Текст ошибки, который будет отображаться в меню автокомплита
+     * Пример использования: информирование пользователя о том, что АПИ
+     * используемого сервиса в текущий момент недоступно
+     */
+    loadedDataError?: string;
+    /**
+     * Если true, будет отображено сообщение об ошибке при загрузке данных
+     * в меню автокомплита
+     */
+    isLoadedDataError?: boolean;
+    /**
+     * Текст для отображения, когда нет данных
+     * @default Нет данных
+     */
+    noOptionsText?: ReactNode;
+    /**
+     * Переопределяет текст для кнопки закрытия всплывающего окна
+     * @default Закрыть
+     */
+    closeText?: string;
+    /**
+     * Переопределяет текст для кнопки открытия всплывающего окна
+     * @default Открыть
+     */
+    openText?: string;
+    /**
+     * Переопределяет текст для кнопки отчистки поля
+     * @default Очистить
+     */
+    clearText?: string;
+    /**
+     * Включает/отключает резервирование места под helperText
+     */
+    hideHelperText?: boolean;
+};

package/node/components/Autocomplete/useLogic/useLogic.d.ts

@@ -1,6 +1,6 @@
-import { type AutocompleteInputChangeReason } from '@mui/material';
+import { type AutocompleteInputChangeReason } from '@mui/material/Autocomplete';
 import { type SyntheticEvent } from 'react';
-import type { AutocompleteProps } from '../Autocomplete';
+import { type AutocompleteProps } from '../types';
 type UseLogicParams<TAutocompleteValueProps, TMultiple extends boolean, TDisableClearable extends boolean, TFreeSolo extends boolean> = AutocompleteProps<TAutocompleteValueProps, TMultiple, TDisableClearable, TFreeSolo>;
 export declare const useLogic: <TAutocompleteValueProps, TMultiple extends boolean, TDisableClearable extends boolean, TFreeSolo extends boolean>({ value, isOptionEqualToValue: externalOptionEqualToValue, autoHighlight, freeSolo, options, loading, isLoadedDataError, loadedDataError, noOptionsText, onInputChange, }: UseLogicParams<TAutocompleteValueProps, TMultiple, TDisableClearable, TFreeSolo>) => {
     isValueEmpty: boolean;

package/node/components/Avatar/styles.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { type AvatarSize } from './types';
-export declare const StyledAvatar: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("@mui/material").AvatarOwnProps & import("@mui/material").AvatarSlotsAndSlotProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "style" | "classes" | "className" | "children" | "sx" | "variant" | "slots" | "slotProps" | "alt" | "src" | "imgProps" | "sizes" | "srcSet"> & {
+export declare const StyledAvatar: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("@mui/material/Avatar").AvatarOwnProps & import("@mui/material/Avatar").AvatarSlotsAndSlotProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "sx" | "classes" | "className" | "style" | "children" | "variant" | "slots" | "slotProps" | "alt" | "src" | "sizes" | "srcSet" | "imgProps"> & {
     theme?: import("@emotion/react").Theme | undefined;
 } & {
     $size?: AvatarSize | undefined;

package/node/components/Avatar/styles.js

@@ -1,7 +1,10 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StyledAvatar = void 0;
-const material_1 = require("@mui/material");
+const Avatar_1 = __importDefault(require("@mui/material/Avatar"));
 const styled_1 = require("../styled/styled");
 const getFont = (size) => {
     if (size === 'sm') {
@@ -12,7 +15,7 @@ const getFont = (size) => {
     }
     return 'h5';
 };
-exports.StyledAvatar = (0, styled_1.styled)(material_1.Avatar, {
+exports.StyledAvatar = (0, styled_1.styled)(Avatar_1.default, {
     shouldForwardProp: (prop) => !['$size'].includes(prop),
 }) `
   font-size: ${({ theme, $size }) => theme.typography[getFont($size)].fontSize};

package/node/components/Avatar/types.d.ts

@@ -1,5 +1,5 @@
 import type { AvatarProps as MuiAvatarProps } from '@mui/material/Avatar/Avatar';
-import type { WithoutEmotionSpecific } from '../types';
+import type { WithoutEmotionSpecific } from '../types/WithoutEmotionSpecific';
 export type AvatarSize = 'sm' | 'md' | 'lg';
 export type AvatarProps = WithoutEmotionSpecific<MuiAvatarProps> & {
     /**

package/node/components/AvatarGroup/AvatarGroup.d.ts

@@ -1,5 +1,5 @@
-import { type AvatarGroupProps as MuiAvatarGroupProps } from '@mui/material';
-import { type WithoutEmotionSpecific } from '../types';
+import type { AvatarGroupProps as MuiAvatarGroupProps } from '@mui/material/AvatarGroup';
+import { type WithoutEmotionSpecific } from '../types/WithoutEmotionSpecific';
 import { type AvatarGroupSize } from './types';
 export type AvatarGroupProps = WithoutEmotionSpecific<MuiAvatarGroupProps> & {
     size?: AvatarGroupSize;

package/node/components/AvatarGroup/styles.d.ts

@@ -1,5 +1,5 @@
 import { type AvatarGroupSize } from './types';
-export declare const StyledAvatarGroup: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("@mui/material").AvatarGroupProps & {
+export declare const StyledAvatarGroup: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("@mui/material/AvatarGroup").AvatarGroupProps & {
     theme?: import("@emotion/react").Theme | undefined;
 } & {
     $size: AvatarGroupSize;

package/node/components/AvatarGroup/styles.js

@@ -1,7 +1,30 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StyledAvatarGroup = void 0;
-const material_1 = require("@mui/material");
+const AvatarGroup_1 = __importStar(require("@mui/material/AvatarGroup"));
 const styled_1 = require("../styled");
 const getFontSize = (theme, size) => {
     const sizes = {
@@ -19,10 +42,10 @@ const getWidth = (size) => {
     };
     return sizes[size];
 };
-exports.StyledAvatarGroup = (0, styled_1.styled)(material_1.AvatarGroup, {
+exports.StyledAvatarGroup = (0, styled_1.styled)(AvatarGroup_1.default, {
     shouldForwardProp: (prop) => !['$size'].includes(prop),
 }) `
-  & .${material_1.avatarGroupClasses.avatar} {
+  & .${AvatarGroup_1.avatarGroupClasses.avatar} {
     width: ${({ $size }) => getWidth($size)};
     height: ${({ $size }) => getWidth($size)};
 

package/node/components/BackdropStack/hooks/useBackdropStackToggle/useBackdropStackToggle.d.ts

@@ -1,5 +1,5 @@
 import { type SyntheticEvent } from 'react';
-import { type CloseEventReason } from '../../../types';
+import { type CloseEventReason } from '../../../types/CloseEventReason';
 /**
  * необязательные настройки для использования хука
  */

package/node/components/BackdropStack/services/BackdropStackManager/BackdropStackManager.d.ts

@@ -1,4 +1,4 @@
-import { type CloseEventReason } from '../../../types';
+import { type CloseEventReason } from '../../../types/CloseEventReason';
 /**
  * айдишка модалки/поппера/тултипа
  */

package/node/components/Badge/Badge.d.ts

@@ -1,5 +1,5 @@
 import { type BadgeProps as MuiBadgeProps } from '@mui/material/Badge/Badge';
-import { type WithoutEmotionSpecific } from '../types';
+import { type WithoutEmotionSpecific } from '../types/WithoutEmotionSpecific';
 import { type BadgeColor, type BadgeVariantsColor } from './types';
 export type BadgeProps = Omit<WithoutEmotionSpecific<MuiBadgeProps>, 'color'> & {
     /**

package/node/components/Badge/styles.d.ts

@@ -5,7 +5,7 @@ type StyledBadgeProps = {
     $withBorder?: boolean;
     $variantColor: BadgeVariantsColor;
 };
-export declare const StyledBadge: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("@mui/material").BadgeOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "components" | "style" | "color" | "classes" | "className" | "children" | "sx" | "variant" | "max" | "componentsProps" | "slots" | "slotProps" | "anchorOrigin" | "badgeContent" | "invisible" | "overlap" | "showZero"> & {
+export declare const StyledBadge: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("@mui/material/Badge").BadgeOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "components" | "sx" | "classes" | "className" | "style" | "color" | "children" | "max" | "variant" | "componentsProps" | "slots" | "slotProps" | "invisible" | "anchorOrigin" | "badgeContent" | "overlap" | "showZero"> & {
     theme?: import("@emotion/react").Theme | undefined;
 } & StyledBadgeProps, {}, {}>;
 export {};

package/node/components/Badge/styles.js

@@ -1,7 +1,10 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StyledBadge = void 0;
-const material_1 = require("@mui/material");
+const Badge_1 = __importDefault(require("@mui/material/Badge"));
 const styled_1 = require("../styled");
 const getBgColor = ({ $customColor, theme, $variantColor, }) => {
     const colors = {
@@ -41,7 +44,7 @@ const getTextColor = ({ $customColor, theme, $variantColor, }) => {
     }
     return lightTextColor[$customColor || 'default'];
 };
-exports.StyledBadge = (0, styled_1.styled)(material_1.Badge, {
+exports.StyledBadge = (0, styled_1.styled)(Badge_1.default, {
     shouldForwardProp: (prop) => !['$customColor', '$withBorder', '$variantColor'].includes(prop),
 }) `
   .MuiBadge-badge {

package/node/components/Banner/BannerActionButton/BannerActionButton.js

@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.BannerActionButton = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const Button_1 = require("../../Button");
-const hooks_1 = require("../../hooks");
+const useViewportType_1 = require("../../hooks/useViewportType");
 const BannerActionButton = ({ children, ...restProps }) => {
-    const { isMobile } = (0, hooks_1.useViewportType)();
+    const { isMobile } = (0, useViewportType_1.useViewportType)();
     return ((0, jsx_runtime_1.jsx)(Button_1.Button, { ...restProps, fullWidth: isMobile, size: "large", children: children }));
 };
 exports.BannerActionButton = BannerActionButton;

package/node/components/Banner/BannerContainer/BannerContainer.js

@@ -4,7 +4,7 @@ exports.BannerContainer = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const Dialog_1 = require("../../Dialog");
-const hooks_1 = require("../../hooks");
+const useViewportType_1 = require("../../hooks/useViewportType");
 const Notification_1 = require("../../Notification");
 const Banner_1 = require("../Banner");
 const BannerTemplate_1 = require("../BannerTemplate");
@@ -14,7 +14,7 @@ const styles_1 = require("./styles");
  * Используется внутри NotificationContainer и NotificationStackContainer.
  * */
 const BannerContainer = ({ bannerContainerId = Notification_1.BANNER_CONTAINER_ID, }) => {
-    const { isMobile } = (0, hooks_1.useViewportType)();
+    const { isMobile } = (0, useViewportType_1.useViewportType)();
     const [isOpenDialog, setIsOpenDialog] = (0, react_1.useState)(false);
     (0, react_1.useEffect)(() => {
         Banner_1.banner._init(isMobile, setIsOpenDialog);

package/node/components/Banner/BannerTemplate/BannerTemplate.js

@@ -3,12 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.BannerTemplate = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const Button_1 = require("../../Button");
-const hooks_1 = require("../../hooks");
+const useViewportType_1 = require("../../hooks/useViewportType");
 const Typography_1 = require("../../Typography");
 const styles_1 = require("./styles");
 const BannerTemplate = (props) => {
     const { closeToast, imageSrc, title, description, onClose, action, setIsOpenDialog, } = props;
-    const { isMobile } = (0, hooks_1.useViewportType)();
+    const { isMobile } = (0, useViewportType_1.useViewportType)();
     const handleClose = () => {
         closeToast?.();
         onClose?.();

package/node/components/Banner/constants.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.bannerClassnames = void 0;
-const utils_1 = require("../utils");
+const createUIKitClassname_1 = require("../utils/createUIKitClassname");
 exports.bannerClassnames = {
-    root: (0, utils_1.createUIKitClassname)('banner'),
+    root: (0, createUIKitClassname_1.createUIKitClassname)('banner'),
 };

package/node/components/BottomDrawer/BottomDrawer.d.ts

@@ -1,6 +1,6 @@
-import { type DrawerProps as MuiDrawerProps } from '@mui/material';
+import type { DrawerProps as MuiDrawerProps } from '@mui/material/Drawer';
 import { type ReactElement } from 'react';
-import { type WithoutEmotionSpecific } from '../types';
+import { type WithoutEmotionSpecific } from '../types/WithoutEmotionSpecific';
 export type BottomDrawerProps = {
     /**
      * Заголовок

package/node/components/BottomDrawer/BottomDrawer.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BottomDrawer = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const icons_1 = require("../../icons");
+const CrossOutlineMd_1 = require("../../icons/CrossOutlineMd");
 const IconButton_1 = require("../IconButton");
 const constants_1 = require("./constants");
 const styles_1 = require("./styles");
@@ -12,6 +12,6 @@ const BottomDrawer = ({ title, drawerHeaderHeight = constants_1.DEFAULT_HEADER_H
             onClose(event, 'escapeKeyDown');
         }
     };
-    return ((0, jsx_runtime_1.jsxs)(styles_1.StyledDrawer, { ...props, anchor: "bottom", onClose: onClose, children: [(0, jsx_runtime_1.jsxs)(styles_1.Header, { drawerHeaderHeight: drawerHeaderHeight, children: [(0, jsx_runtime_1.jsx)(styles_1.HeaderTitle, { variant: "h6", noWrap: true, children: title }), (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { variant: "text", onClick: handleClose, size: "large", children: (0, jsx_runtime_1.jsx)(icons_1.CrossOutlineMd, {}) })] }), (0, jsx_runtime_1.jsx)(styles_1.Body, { children: children })] }));
+    return ((0, jsx_runtime_1.jsxs)(styles_1.StyledDrawer, { ...props, anchor: "bottom", onClose: onClose, children: [(0, jsx_runtime_1.jsxs)(styles_1.Header, { drawerHeaderHeight: drawerHeaderHeight, children: [(0, jsx_runtime_1.jsx)(styles_1.HeaderTitle, { variant: "h6", noWrap: true, children: title }), (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, { variant: "text", onClick: handleClose, size: "large", children: (0, jsx_runtime_1.jsx)(CrossOutlineMd_1.CrossOutlineMd, {}) })] }), (0, jsx_runtime_1.jsx)(styles_1.Body, { children: children })] }));
 };
 exports.BottomDrawer = BottomDrawer;

package/node/components/BottomDrawer/styles.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { type DrawerProps } from '@mui/material';
+import { type DrawerProps } from '@mui/material/Drawer';
 export declare const StyledDrawer: import("@emotion/styled/dist/declarations/src/types").StyledComponent<DrawerProps & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
@@ -9,19 +9,13 @@ export declare const Header: import("@emotion/styled/dist/declarations/src/types
 } & {
     drawerHeaderHeight: number;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
-export declare const HeaderTitle: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "typography" | "zIndex" | "p" | "style" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "classes" | "className" | "children" | "sx" | "variant" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "displayPrint" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
+export declare const HeaderTitle: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("@mui/material/Typography").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "typography" | "zIndex" | "fontFamily" | "fontSize" | "fontWeight" | "lineHeight" | "sx" | "classes" | "className" | "style" | "color" | "children" | "p" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxShadow" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "border" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "displayPrint" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "marginX" | "marginY" | "paddingX" | "paddingY" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variant" | "variantMapping"> & {
     theme?: import("@emotion/react").Theme | undefined;
-} & {
-    children?: import("react").ReactNode;
-    align?: "inherit" | "left" | "right" | "center" | "justify" | undefined;
-    gutterBottom?: boolean | undefined;
-    noWrap?: boolean | undefined;
-    paragraph?: boolean | undefined;
-} & {
+} & import("../Typography/types").TypographyPropsBase & {
     color?: import("../Typography").TypographyColor | undefined;
     variant?: import("../Typography").TypographyVariant | undefined;
     colorIntensity?: import("../Typography").Intensity | undefined;
-    component?: ("symbol" | "object" | "main" | "body" | "small" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "caption" | "button" | "link" | "a" | "abbr" | "address" | "area" | "article" | "aside" | "audio" | "b" | "base" | "bdi" | "bdo" | "blockquote" | "br" | "canvas" | "cite" | "code" | "col" | "colgroup" | "data" | "datalist" | "dd" | "del" | "details" | "dfn" | "dialog" | "div" | "dl" | "dt" | "em" | "embed" | "fieldset" | "figcaption" | "figure" | "footer" | "form" | "head" | "header" | "hgroup" | "hr" | "html" | "i" | "iframe" | "img" | "input" | "ins" | "kbd" | "label" | "legend" | "li" | "map" | "mark" | "menu" | "meta" | "meter" | "nav" | "noscript" | "ol" | "optgroup" | "option" | "output" | "p" | "picture" | "pre" | "progress" | "q" | "rp" | "rt" | "ruby" | "s" | "samp" | "script" | "search" | "section" | "select" | "slot" | "source" | "span" | "strong" | "style" | "sub" | "summary" | "sup" | "table" | "tbody" | "td" | "template" | "textarea" | "tfoot" | "th" | "thead" | "time" | "title" | "tr" | "track" | "u" | "ul" | "var" | "video" | "wbr" | "clipPath" | "filter" | "marker" | "mask" | "big" | "center" | "keygen" | "menuitem" | "noindex" | "param" | "webview" | "svg" | "animate" | "animateMotion" | "animateTransform" | "circle" | "defs" | "desc" | "ellipse" | "feBlend" | "feColorMatrix" | "feComponentTransfer" | "feComposite" | "feConvolveMatrix" | "feDiffuseLighting" | "feDisplacementMap" | "feDistantLight" | "feDropShadow" | "feFlood" | "feFuncA" | "feFuncB" | "feFuncG" | "feFuncR" | "feGaussianBlur" | "feImage" | "feMerge" | "feMergeNode" | "feMorphology" | "feOffset" | "fePointLight" | "feSpecularLighting" | "feSpotLight" | "feTile" | "feTurbulence" | "foreignObject" | "g" | "image" | "line" | "linearGradient" | "metadata" | "mpath" | "path" | "pattern" | "polygon" | "polyline" | "radialGradient" | "rect" | "set" | "stop" | "switch" | "text" | "textPath" | "tspan" | "use" | "view" | import("react").ComponentType<any>) | undefined;
+    component?: import("../Typography/types").ComponentProp | undefined;
     isUpperCase?: boolean | undefined;
 } & import("react").HTMLAttributes<HTMLParagraphElement>, {}, {}>;
 export declare const Body: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{

package/node/components/BottomDrawer/styles.js

@@ -1,11 +1,16 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Body = exports.HeaderTitle = exports.Header = exports.StyledDrawer = void 0;
-const material_1 = require("@mui/material");
+const Drawer_1 = __importDefault(require("@mui/material/Drawer"));
+const Paper_1 = require("@mui/material/Paper");
+const Typography_1 = __importDefault(require("@mui/material/Typography"));
 const styled_1 = require("../styled");
 const constants_1 = require("./constants");
-exports.StyledDrawer = (0, styled_1.styled)(material_1.Drawer) `
-  ${`.${material_1.paperClasses.root}`} {
+exports.StyledDrawer = (0, styled_1.styled)(Drawer_1.default) `
+  ${`.${Paper_1.paperClasses.root}`} {
     max-height: calc(100vh - ${constants_1.OFFSET_TOP_SCREEN});
 
     @supports (height: 100dvh) {
@@ -27,7 +32,7 @@ exports.Header = styled_1.styled.header `
 
   border-bottom: 1px solid ${({ theme }) => theme.palette.grey[300]};
 `;
-exports.HeaderTitle = (0, styled_1.styled)(material_1.Typography) `
+exports.HeaderTitle = (0, styled_1.styled)(Typography_1.default) `
   margin-right: ${({ theme }) => theme.spacing(2)};
 `;
 exports.Body = styled_1.styled.div `

package/node/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -1,3 +1,3 @@
-import type { BreadcrumbsProps as MuiBreadcrumbsProps } from '@mui/material';
+import type { BreadcrumbsProps as MuiBreadcrumbsProps } from '@mui/material/Breadcrumbs';
 export type BreadcrumbsProps = MuiBreadcrumbsProps;
 export declare const Breadcrumbs: (props: BreadcrumbsProps) => import("react/jsx-runtime").JSX.Element;

package/node/components/Breadcrumbs/styles.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
-export declare const StyledBreadcrumbs: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("@mui/material").BreadcrumbsOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "style" | "classes" | "className" | "children" | "sx" | "separator" | "slots" | "slotProps" | "expandText" | "itemsAfterCollapse" | "itemsBeforeCollapse" | "maxItems"> & {
+export declare const StyledBreadcrumbs: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("@mui/material/Breadcrumbs").BreadcrumbsOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "sx" | "classes" | "className" | "style" | "children" | "separator" | "slots" | "slotProps" | "expandText" | "itemsAfterCollapse" | "itemsBeforeCollapse" | "maxItems"> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;

package/node/components/Breadcrumbs/styles.js

@@ -1,10 +1,15 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StyledBreadcrumbs = void 0;
-const material_1 = require("@mui/material");
+const Breadcrumbs_1 = __importDefault(require("@mui/material/Breadcrumbs"));
+const ButtonBase_1 = require("@mui/material/ButtonBase");
+const Link_1 = require("@mui/material/Link");
 const styled_1 = require("../styled");
-exports.StyledBreadcrumbs = (0, styled_1.styled)(material_1.Breadcrumbs) `
-  .${material_1.buttonBaseClasses.root} {
+exports.StyledBreadcrumbs = (0, styled_1.styled)(Breadcrumbs_1.default) `
+  .${ButtonBase_1.buttonBaseClasses.root} {
     align-items: end;
 
     min-height: 20px;
@@ -35,7 +40,7 @@ exports.StyledBreadcrumbs = (0, styled_1.styled)(material_1.Breadcrumbs) `
     color: ${({ theme }) => theme.palette.primary[800]};
   }
 
-  .${material_1.linkClasses.root} {
+  .${Link_1.linkClasses.root} {
     color: ${({ theme }) => theme.palette.grey[700]};
 
     &:visited {

package/node/components/BulletListItem/BulletListItem.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { type TypographyProps } from '../Typography';
-import { type WithoutEmotionSpecific } from '../types';
+import { type WithoutEmotionSpecific } from '../types/WithoutEmotionSpecific';
 export type BulletListItemProps = WithoutEmotionSpecific<TypographyProps>;
 /**
  * Элемент с маркерами

package/node/components/BulletListItem/BulletListItem.js

@@ -4,12 +4,12 @@ exports.BulletListItem = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const Typography_1 = require("../Typography");
-const utils_1 = require("../utils");
+const classNames_1 = require("../utils/classNames");
 const styles_1 = require("./styles");
 /**
  * Элемент с маркерами
  */
 exports.BulletListItem = (0, react_1.forwardRef)((props, ref) => {
     const { children, className, ...restProps } = props;
-    return ((0, jsx_runtime_1.jsxs)(styles_1.Wrapper, { ref: ref, className: (0, utils_1.classNames)(className), children: [(0, jsx_runtime_1.jsx)(styles_1.Icon, {}), (0, jsx_runtime_1.jsx)(Typography_1.Typography, { component: "span", ...restProps, children: children })] }));
+    return ((0, jsx_runtime_1.jsxs)(styles_1.Wrapper, { ref: ref, className: (0, classNames_1.classNames)(className), children: [(0, jsx_runtime_1.jsx)(styles_1.Icon, {}), (0, jsx_runtime_1.jsx)(Typography_1.Typography, { component: "span", ...restProps, children: children })] }));
 });

package/node/components/BulletListItem/styles.js

@@ -1,13 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Icon = exports.Wrapper = void 0;
-const icons_1 = require("../../icons");
+const DotOutlineSm_1 = require("../../icons/DotOutlineSm");
 const styled_1 = require("../styled");
 exports.Wrapper = (0, styled_1.styled)('li') `
   display: flex;
   align-items: center;
 `;
-exports.Icon = (0, styled_1.styled)(icons_1.DotOutlineSm) `
+exports.Icon = (0, styled_1.styled)(DotOutlineSm_1.DotOutlineSm) `
   align-self: start;
 
   margin: ${({ theme }) => theme.spacing(1)};

package/node/components/Button/Button.d.ts

@@ -1,49 +1,9 @@
-import type { ButtonProps as MuiButtonProps } from '@mui/material';
-import { type ComponentPropsWithRef, type ElementType } from 'react';
-import type { WithoutEmotionSpecific } from '../types';
-import { ButtonColors, ButtonVariants } from './enums';
-export type ButtonProps<TComponent extends ElementType = ElementType> = Omit<WithoutEmotionSpecific<MuiButtonProps>, 'variant' | 'color' | 'centerRipple' | 'disableRipple' | 'TouchRippleProps' | 'disableTouchRipple' | 'disableFocusRipple' | 'focusRipple' | 'touchRippleRef' | 'component'> & {
-    /**
-     * Тип кнопки
-     */
-    variant?: `${ButtonVariants}`;
-    /**
-     * Если `true`, появляется loader внутри кнопки
-     */
-    loading?: boolean;
-    /**
-     * Цвет текста кнопки
-     */
-    color?: `${ButtonColors}`;
-    /**
-     * Тип html-элемента
-     */
-    component?: TComponent;
-    /**
-     * Состояние кнопки - selected
-     */
-    selected?: boolean;
-} & Omit<ComponentPropsWithRef<ElementType extends TComponent ? 'button' : TComponent>, ''>;
-export declare const Button: <TComponent extends ElementType>(props: Omit<WithoutEmotionSpecific<MuiButtonProps>, "color" | "variant" | "component" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple"> & {
-    /**
-     * Тип кнопки
-     */
-    variant?: "light" | "link" | "outlined" | "text" | "contained" | undefined;
-    /**
-     * Если `true`, появляется loader внутри кнопки
-     */
+import { type ElementType } from 'react';
+export declare const Button: <TComponent extends ElementType>(props: Omit<import("..").WithoutEmotionSpecific<import("@mui/material").ButtonProps>, "color" | "component" | "variant" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple"> & {
+    variant?: "light" | "link" | "text" | "contained" | "outlined" | undefined;
     loading?: boolean | undefined;
-    /**
-     * Цвет текста кнопки
-     */
-    color?: "grey" | "error" | "success" | "warning" | "primary" | undefined;
-    /**
-     * Тип html-элемента
-     */
+    color?: "primary" | "success" | "warning" | "error" | "grey" | undefined;
     component?: TComponent | undefined;
-    /**
-     * Состояние кнопки - selected
-     */
     selected?: boolean | undefined;
-} & Omit<ComponentPropsWithRef<ElementType extends TComponent ? "button" : TComponent>, ""> & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null;
+} & Omit<import("react").ComponentPropsWithRef<ElementType extends TComponent ? "button" : TComponent>, ""> & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null;
 export default Button;

package/node/components/Button/Button.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Button = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const forwardRefWithGeneric_1 = require("../forwardRefWithGeneric");
-const utils_1 = require("../utils");
+const classNames_1 = require("../utils/classNames");
 const constants_1 = require("./constants");
 const enums_1 = require("./enums");
 const styles_1 = require("./styles");
@@ -13,7 +13,7 @@ const UnwrappedButton = (props, ref) => {
     const { variant = enums_1.ButtonVariants.Contained, color = variant === enums_1.ButtonVariants.Text
         ? enums_1.ButtonColors.Grey
         : enums_1.ButtonColors.Primary, loading, disabled, children, className, selected, ...restProps } = props;
-    return ((0, jsx_runtime_1.jsxs)(styles_1.StyledButton, { variant: variant, ref: ref, color: color, disabled: disabled, selected: selected, ...restProps, className: (0, utils_1.classNames)(className, {
+    return ((0, jsx_runtime_1.jsxs)(styles_1.StyledButton, { variant: variant, ref: ref, color: color, disabled: disabled, selected: selected, ...restProps, className: (0, classNames_1.classNames)(className, {
             [constants_1.buttonClassnames.loading]: loading,
             [constants_1.buttonClassnames.selected]: selected,
         }), "aria-disabled": loading, children: [loading && ((0, jsx_runtime_1.jsx)(styles_1.StyledLoader, { color: loadingIndicatorColor, size: "small", "$color": color, "$variant": variant, "$isDisabled": disabled })), children] }));