@astral/ui 4.55.4 → 4.57.0

package/node/components/Tag/styles.js

@@ -235,7 +235,7 @@ exports.Wrapper = styled_1.styled.div `
     variant: $variant,
 })};
   border: ${({ theme, $variant, $color }) => $variant !== 'text' && $color === 'default'
-    ? `1px solid ${theme.palette.grey[400]}`
+    ? `1px solid ${theme.palette.components.border.default}`
     : 'none'};
   border-radius: ${({ theme }) => theme.shape.medium};
   

package/node/components/Tree/TreeItem/styles.js

@@ -35,7 +35,7 @@ exports.Item = (0, styled_1.styled)('li', {
     width: 0;
     height: 100%;
 
-    border-left: 1px solid ${({ theme }) => theme.palette.grey[400]};
+    border-left: 1px solid ${({ theme }) => theme.palette.components.border.default};
   }
 `;
 exports.ItemContent = (0, styled_1.styled)('div', {
@@ -133,8 +133,8 @@ exports.LabelWrapper = (0, styled_1.styled)('div', {
     /* Добавляем к высоте половину нижнего отступа, который не входит в высоту текущего элемента */
     height: ${({ theme }) => `calc(50% + ${theme.spacing(1)}/2)`};
 
-    border-bottom: 1px solid ${({ theme }) => theme.palette.grey[400]};
-    border-left: 1px solid ${({ theme }) => theme.palette.grey[400]};
+    border-bottom: 1px solid ${({ theme }) => theme.palette.components.border.default};
+    border-left: 1px solid ${({ theme }) => theme.palette.components.border.default};
     border-radius: 0 0 0 ${({ theme }) => theme.shape.small};
   }
 `;

package/node/components/fileUploading/FileUploaderDropzone/DropzoneWrapper/styles.js

@@ -9,7 +9,7 @@ const getBorderColor = (theme, isActive, isError) => {
     if (isError) {
         return theme.palette.error[900];
     }
-    return theme.palette.grey[400];
+    return theme.palette.components.border.default;
 };
 exports.Wrapper = styled_1.styled.div `
   display: flex;

package/node/components/fileUploading/FileUploaderFile/styles.js

@@ -9,7 +9,7 @@ const getBorderColor = (theme, isLoading, isError) => {
     if (isError) {
         return theme.palette.error[400];
     }
-    return theme.palette.grey[200];
+    return theme.palette.components.border.default;
 };
 exports.Wrapper = (0, styled_1.styled)('div', {
     shouldForwardProp: (prop) => !['$isLoading', '$isError'].includes(prop),

package/node/components/placeholders/LoadingPlaceholder/LoadingPlaceholder.d.ts

@@ -13,9 +13,13 @@ type Props = {
      * Используется вместе с хуком `useLoadingState`
      */
     isShowLoader?: boolean;
+    /**
+     * Класс применяемый для корневого элемента
+     */
+    className?: string;
 };
 /**
  * Дефолтный лоадер загрузки
  */
-export declare const LoadingPlaceholder: ({ title, content, isShowLoader, }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const LoadingPlaceholder: ({ title, content, isShowLoader, className, }: Props) => import("react/jsx-runtime").JSX.Element;
 export {};

package/node/components/placeholders/LoadingPlaceholder/LoadingPlaceholder.js

@@ -4,18 +4,19 @@ exports.LoadingPlaceholder = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const Loader_1 = require("../../Loader");
 const Typography_1 = require("../../Typography");
+const classNames_1 = require("../../utils/classNames");
 const constants_1 = require("./constants");
 const styles_1 = require("./styles");
 /**
  * Дефолтный лоадер загрузки
  */
-const LoadingPlaceholder = ({ title, content, isShowLoader = true, }) => {
+const LoadingPlaceholder = ({ title, content, isShowLoader = true, className, }) => {
     if (!isShowLoader) {
-        return (0, jsx_runtime_1.jsx)(styles_1.LoadingContainer, { className: constants_1.loadingPlaceholderClassnames.root });
+        return ((0, jsx_runtime_1.jsx)(styles_1.LoadingContainer, { className: (0, classNames_1.classNames)(constants_1.loadingPlaceholderClassnames.root, className) }));
     }
     if (content) {
-        return ((0, jsx_runtime_1.jsx)(styles_1.LoadingContainer, { className: constants_1.loadingPlaceholderClassnames.root, children: content }));
+        return ((0, jsx_runtime_1.jsx)(styles_1.LoadingContainer, { className: (0, classNames_1.classNames)(constants_1.loadingPlaceholderClassnames.root, className), children: content }));
     }
-    return ((0, jsx_runtime_1.jsxs)(styles_1.LoadingContainer, { className: constants_1.loadingPlaceholderClassnames.root, children: [(0, jsx_runtime_1.jsx)(Loader_1.Loader, {}), title && (0, jsx_runtime_1.jsx)(Typography_1.Typography, { variant: "h4", children: title })] }));
+    return ((0, jsx_runtime_1.jsxs)(styles_1.LoadingContainer, { className: (0, classNames_1.classNames)(constants_1.loadingPlaceholderClassnames.root, className), children: [(0, jsx_runtime_1.jsx)(Loader_1.Loader, {}), title && (0, jsx_runtime_1.jsx)(Typography_1.Typography, { variant: "h4", children: title })] }));
 };
 exports.LoadingPlaceholder = LoadingPlaceholder;

package/node/components/theme/components/MuiButton.js

@@ -84,7 +84,7 @@ const getBorder = ({ theme, variant, color, buttonState, selected, disabled, })
         return `1px solid ${theme.palette[color]['900']};`;
     }
     if (buttonState === 'default') {
-        return `1px solid ${theme.palette[color]['300']};`;
+        return `1px solid ${color === 'grey' ? theme.palette.components.border.default : theme.palette[color]['300']};`;
     }
     if (buttonState === 'hover') {
         return `1px solid ${theme.palette[color]['700']};`;

package/node/components/theme/components/MuiDivider.d.ts

@@ -0,0 +1,3 @@
+import { type Components } from '@mui/material/styles/components';
+import { type Theme } from '../types';
+export declare const MuiDivider: Components<Theme>['MuiDivider'];

package/node/components/theme/components/MuiDivider.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiDivider = void 0;
+exports.MuiDivider = {
+    styleOverrides: {
+        root({ theme }) {
+            return {
+                borderColor: theme.palette.components.border.default,
+            };
+        },
+    },
+};

package/node/components/theme/components/MuiListItem.d.ts

@@ -0,0 +1,3 @@
+import { type Components } from '@mui/material/styles/components';
+import { type Theme } from '../types';
+export declare const MuiListItem: Components<Theme>['MuiListItem'];

package/node/components/theme/components/MuiListItem.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MuiListItem = void 0;
+exports.MuiListItem = {
+    styleOverrides: {
+        divider({ theme }) {
+            return {
+                borderColor: theme.palette.components.border.default,
+            };
+        },
+    },
+};

package/node/components/theme/components/MuiOutlinedInput.js

@@ -54,7 +54,7 @@ exports.MuiOutlinedInput = {
                 },
                 '&::placeholder': {
                     opacity: 1,
-                    color: theme.palette.grey[400],
+                    color: theme.palette.grey[500],
                 },
             };
         },
@@ -67,7 +67,7 @@ exports.MuiOutlinedInput = {
         notchedOutline({ theme }) {
             return {
                 borderWidth: 1,
-                borderColor: theme.palette.grey[300],
+                borderColor: theme.palette.components.border.default,
                 top: 0,
                 transition: theme.transitions.create(['border-color'], {
                     easing: theme.transitions.easing.easeInOut,

package/node/components/theme/components/MuiPaper.js

@@ -27,7 +27,7 @@ exports.MuiPaper = {
         },
         outlined({ theme }) {
             return {
-                border: `1px solid ${theme.palette.grey[300]}`,
+                border: `1px solid ${theme.palette.components.border.default}`,
             };
         },
     },

package/node/components/theme/components/MuiStepConnector.js

@@ -7,7 +7,10 @@ exports.MuiStepConnector = {
             return { top: theme.microSpacing(5) };
         },
         lineHorizontal({ theme }) {
-            return { borderTopWidth: 2, borderColor: theme.palette.grey[300] };
+            return {
+                borderTopWidth: 2,
+                borderColor: theme.palette.components.border.default,
+            };
         },
     },
 };

package/node/components/theme/components/components.js

@@ -10,12 +10,14 @@ const MuiDialog_1 = require("./MuiDialog");
 const MuiDialogActions_1 = require("./MuiDialogActions");
 const MuiDialogContent_1 = require("./MuiDialogContent");
 const MuiDialogTitle_1 = require("./MuiDialogTitle");
+const MuiDivider_1 = require("./MuiDivider");
 const MuiDrawer_1 = require("./MuiDrawer");
 const MuiFormControlLabel_1 = require("./MuiFormControlLabel");
 const MuiFormHelperText_1 = require("./MuiFormHelperText");
 const MuiFormLabel_1 = require("./MuiFormLabel");
 const MuiInputLabel_1 = require("./MuiInputLabel");
 const MuiLinearProgress_1 = require("./MuiLinearProgress");
+const MuiListItem_1 = require("./MuiListItem");
 const MuiListItemButton_1 = require("./MuiListItemButton");
 const MuiListItemText_1 = require("./MuiListItemText");
 const MuiListSubheader_1 = require("./MuiListSubheader");
@@ -52,6 +54,7 @@ const getComponents = () => {
         MuiAlert: MuiAlert_1.MuiAlert,
         MuiButton: MuiButton_1.MuiButton,
         MuiButtonBase: MuiButtonBase_1.MuiButtonBase,
+        MuiDivider: MuiDivider_1.MuiDivider,
         MuiTypography: MuiTypography_1.MuiTypography,
         MuiInputLabel: MuiInputLabel_1.MuiInputLabel,
         MuiOutlinedInput: MuiOutlinedInput_1.MuiOutlinedInput,
@@ -75,6 +78,7 @@ const getComponents = () => {
         MuiPaginationItem: MuiPaginationItem_1.MuiPaginationItem,
         MuiPaper: MuiPaper_1.MuiPaper,
         MuiCircularProgress: MuiCircularProgress_1.MuiCircularProgress,
+        MuiListItem: MuiListItem_1.MuiListItem,
         MuiListItemButton: MuiListItemButton_1.MuiListItemButton,
         MuiListItemText: MuiListItemText_1.MuiListItemText,
         MuiLinearProgress: MuiLinearProgress_1.MuiLinearProgress,

package/node/components/theme/palette/componentsColors/componentsColors.d.ts

@@ -3,5 +3,8 @@ export type ComponentsColors = {
     link: LinkColors;
     focused: string;
     disabled: string;
+    border: {
+        default: string;
+    };
 };
 export declare const componentsColors: ComponentsColors;

package/node/components/theme/palette/componentsColors/componentsColors.js

@@ -6,4 +6,7 @@ exports.componentsColors = {
     link: linkColors_1.linkColors,
     focused: '#70AEFF',
     disabled: '#F1F1F1',
+    border: {
+        default: '#C7C7C7',
+    },
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astral/ui",
-  "version": "4.55.4",
+  "version": "4.57.0",
   "browser": "./index.js",
   "main": "./node/index.js",
   "dependencies": {
@@ -33,6 +33,7 @@
   },
   "exports": {
     ".": {
+      "node": "./node/index.js",
       "module": "./index.js",
       "require": "./node/index.js",
       "types": "./index.d.ts",
@@ -40,6 +41,7 @@
       "import": "./index.js"
     },
     "./declarations": {
+      "node": "./node/declarations.js",
       "module": "./declarations.js",
       "require": "./node/declarations.js",
       "types": "./declarations.d.ts",
@@ -47,6 +49,7 @@
       "import": "./declarations.js"
     },
     "./server": {
+      "node": "./node/server/index.js",
       "module": "./server/index.js",
       "require": "./node/server/index.js",
       "types": "./server/index.d.ts",
@@ -54,6 +57,7 @@
       "import": "./server/index.js"
     },
     "./components/PdfViewer": {
+      "node": "./node/components/PdfViewer/index.js",
       "module": "./components/PdfViewer/index.js",
       "require": "./node/components/PdfViewer/index.js",
       "types": "./components/PdfViewer/index.d.ts",
@@ -61,6 +65,7 @@
       "import": "./components/PdfViewer/index.js"
     },
     "./components/JsonViewer": {
+      "node": "./node/components/JsonViewer/index.js",
       "module": "./components/JsonViewer/index.js",
       "require": "./node/components/JsonViewer/index.js",
       "types": "./components/JsonViewer/index.d.ts",
@@ -68,6 +73,7 @@
       "import": "./components/JsonViewer/index.js"
     },
     "./components/Notification": {
+      "node": "./node/components/Notification/index.js",
       "module": "./components/Notification/index.js",
       "require": "./node/components/Notification/index.js",
       "types": "./components/Notification/index.d.ts",
@@ -75,6 +81,7 @@
       "import": "./components/Notification/index.js"
     },
     "./components/LegacyNotification": {
+      "node": "./node/components/LegacyNotification/index.js",
       "module": "./components/LegacyNotification/index.js",
       "require": "./node/components/LegacyNotification/index.js",
       "types": "./components/LegacyNotification/index.d.ts",
@@ -82,6 +89,7 @@
       "import": "./components/LegacyNotification/index.js"
     },
     "./components/Banner": {
+      "node": "./node/components/Banner/index.js",
       "module": "./components/Banner/index.js",
       "require": "./node/components/Banner/index.js",
       "types": "./components/Banner/index.d.ts",
@@ -89,6 +97,7 @@
       "import": "./components/Banner/index.js"
     },
     "./components/unstable/ResizingDataGrid": {
+      "node": "./node/components/ResizingDataGrid/index.js",
       "module": "./components/ResizingDataGrid/index.js",
       "require": "./node/components/ResizingDataGrid/index.js",
       "types": "./components/ResizingDataGrid/index.d.ts",
@@ -96,6 +105,7 @@
       "import": "./components/ResizingDataGrid/index.js"
     },
     "./components/unstable/ResizingDataGridInfinite": {
+      "node": "./node/components/ResizingDataGridInfinite/index.js",
       "module": "./components/ResizingDataGridInfinite/index.js",
       "require": "./node/components/ResizingDataGridInfinite/index.js",
       "types": "./components/ResizingDataGridInfinite/index.d.ts",
@@ -103,6 +113,7 @@
       "import": "./components/ResizingDataGridInfinite/index.js"
     },
     "./components/InfiniteTreeList": {
+      "node": "./node/components/InfiniteTreeList/index.js",
       "module": "./components/InfiniteTreeList/index.js",
       "require": "./node/components/InfiniteTreeList/index.js",
       "types": "./components/InfiniteTreeList/index.d.ts",
@@ -110,6 +121,7 @@
       "import": "./components/InfiniteTreeList/index.js"
     },
     "./components/RedesignBanner": {
+      "node": "./node/components/RedesignBanner/index.js",
       "module": "./components/RedesignBanner/index.js",
       "require": "./node/components/RedesignBanner/index.js",
       "types": "./components/RedesignBanner/index.d.ts",
@@ -117,6 +129,7 @@
       "import": "./components/RedesignBanner/index.js"
     },
     "./components/TreeAsyncAutocomplete": {
+      "node": "./node/components/TreeAsyncAutocomplete/index.js",
       "module": "./components/TreeAsyncAutocomplete/index.js",
       "require": "./node/components/TreeAsyncAutocomplete/index.js",
       "types": "./components/TreeAsyncAutocomplete/index.d.ts",
@@ -124,6 +137,7 @@
       "import": "./components/TreeAsyncAutocomplete/index.js"
     },
     "./components/TreeLikeAsyncAutocomplete": {
+      "node": "./node/components/TreeLikeAsyncAutocomplete/index.js",
       "module": "./components/TreeLikeAsyncAutocomplete/index.js",
       "require": "./node/components/TreeLikeAsyncAutocomplete/index.js",
       "types": "./components/TreeLikeAsyncAutocomplete/index.d.ts",
@@ -131,6 +145,7 @@
       "import": "./components/TreeLikeAsyncAutocomplete/index.js"
     },
     "./components/CardGridInfinite": {
+      "node": "./node/components/CardGridInfinite/index.js",
       "module": "./components/CardGridInfinite/index.js",
       "require": "./node/components/CardGridInfinite/index.js",
       "types": "./components/CardGridInfinite/index.d.ts",
@@ -138,6 +153,7 @@
       "import": "./components/CardGridInfinite/index.js"
     },
     "./*": {
+      "node": "./node/components/*/public.js",
       "module": "./components/*/public.js",
       "require": "./node/components/*/public.js",
       "types": "./components/*/public.d.ts",
@@ -145,6 +161,7 @@
       "import": "./components/*/public.js"
     },
     "./hook-form/*": {
+      "node": "./node/hook-form/*/public.js",
       "module": "./hook-form/*/public.js",
       "require": "./node/hook-form/*/public.js",
       "types": "./hook-form/*/public.d.ts",
@@ -152,6 +169,7 @@
       "import": "./hook-form/*/public.js"
     },
     "./icons/*": {
+      "node": "./node/icons/*/public.js",
       "module": "./icons/*/public.js",
       "require": "./node/icons/*/public.js",
       "types": "./icons/*/public.d.ts",
@@ -159,6 +177,7 @@
       "import": "./icons/*/public.js"
     },
     "./constants/*": {
+      "node": "./node/constants/*/public.js",
       "module": "./constants/*/public.js",
       "require": "./node/constants/*/public.js",
       "types": "./constants/*/public.d.ts",

package/components/DataGrid/useLogic/hooks/useClassnames/index.d.ts

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

package/components/DataGrid/useLogic/hooks/useClassnames/index.js

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

package/components/DataGrid/useLogic/hooks/useClassnames/useClassnames.d.ts

@@ -1,12 +0,0 @@
-type UseClassnamesParams = {
-    isDataGridDisabled?: boolean;
-    dataGridClassName?: string;
-    hasPinnedColumns?: boolean;
-    isNoData?: boolean;
-};
-export declare const useClassnames: ({ isDataGridDisabled, dataGridClassName, hasPinnedColumns, isNoData, }: UseClassnamesParams) => {
-    pinnedSectionsClassname: string;
-    dataGridClassname: string;
-    bodyClassName: string;
-};
-export {};

package/components/DataGrid/useLogic/hooks/useClassnames/useClassnames.js

@@ -1,14 +0,0 @@
-import { classNames } from '../../../../utils/classNames';
-import { dataGridClassnames } from '../../../constants';
-export const useClassnames = ({ isDataGridDisabled, dataGridClassName, hasPinnedColumns, isNoData, }) => {
-    const pinnedSectionsClassname = classNames(dataGridClassnames.pinnedSections, {
-        [dataGridClassnames.disabled]: isDataGridDisabled,
-    });
-    const dataGridClassname = classNames(dataGridClassnames.root, dataGridClassName, {
-        [dataGridClassnames.dataGridHasPinnedSections]: hasPinnedColumns,
-    });
-    const bodyClassName = classNames(dataGridClassnames.body, {
-        [dataGridClassnames.bodyEmpty]: isNoData,
-    });
-    return { pinnedSectionsClassname, dataGridClassname, bodyClassName };
-};

package/node/components/DataGrid/useLogic/hooks/useClassnames/index.d.ts

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

package/node/components/DataGrid/useLogic/hooks/useClassnames/useClassnames.d.ts

@@ -1,12 +0,0 @@
-type UseClassnamesParams = {
-    isDataGridDisabled?: boolean;
-    dataGridClassName?: string;
-    hasPinnedColumns?: boolean;
-    isNoData?: boolean;
-};
-export declare const useClassnames: ({ isDataGridDisabled, dataGridClassName, hasPinnedColumns, isNoData, }: UseClassnamesParams) => {
-    pinnedSectionsClassname: string;
-    dataGridClassname: string;
-    bodyClassName: string;
-};
-export {};

package/node/components/DataGrid/useLogic/hooks/useClassnames/useClassnames.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useClassnames = void 0;
-const classNames_1 = require("../../../../utils/classNames");
-const constants_1 = require("../../../constants");
-const useClassnames = ({ isDataGridDisabled, dataGridClassName, hasPinnedColumns, isNoData, }) => {
-    const pinnedSectionsClassname = (0, classNames_1.classNames)(constants_1.dataGridClassnames.pinnedSections, {
-        [constants_1.dataGridClassnames.disabled]: isDataGridDisabled,
-    });
-    const dataGridClassname = (0, classNames_1.classNames)(constants_1.dataGridClassnames.root, dataGridClassName, {
-        [constants_1.dataGridClassnames.dataGridHasPinnedSections]: hasPinnedColumns,
-    });
-    const bodyClassName = (0, classNames_1.classNames)(constants_1.dataGridClassnames.body, {
-        [constants_1.dataGridClassnames.bodyEmpty]: isNoData,
-    });
-    return { pinnedSectionsClassname, dataGridClassname, bodyClassName };
-};
-exports.useClassnames = useClassnames;