@astral/ui 4.55.4 → 4.56.0

package/node/components/PageLayoutSection/styles.js

@@ -7,7 +7,7 @@ exports.Section = styled_1.styled.section `
     margin: ${({ theme }) => theme.spacing(0, 4)};
 
     background-color: ${({ theme }) => theme.palette.background.default};
-    border: 1px solid ${({ theme }) => theme.palette.grey[300]};
+    border: 1px solid ${({ theme }) => theme.palette.components.border.default};
     border-radius: ${({ theme }) => theme.shape.medium};
   }
 `;

package/node/components/PagePinnableAside/styles.js

@@ -34,7 +34,7 @@ exports.Aside = (0, styled_1.styled)('aside', {
     margin: ${({ theme }) => theme.spacing(0, 4, 4)};
 
     background-color: ${({ theme }) => theme.palette.background.default};
-    border: 1px solid ${({ theme }) => theme.palette.grey[300]};
+    border: 1px solid ${({ theme }) => theme.palette.components.border.default};
     border-radius: ${({ theme }) => theme.shape.medium};
   }
 `;
@@ -50,8 +50,8 @@ exports.Dummy = (0, styled_1.styled)('div', {
   width: 40px;
   height: 100%;
 
-  border-top: 1px solid ${({ theme }) => theme.palette.grey[300]};
-  border-left: 1px solid ${({ theme }) => theme.palette.grey[300]};
+  border-top: 1px solid ${({ theme }) => theme.palette.components.border.default};
+  border-left: 1px solid ${({ theme }) => theme.palette.components.border.default};
 
   ${({ $isPinned }) => $isPinned && 'display: none;'}
 `;
@@ -80,8 +80,8 @@ exports.Content = (0, styled_1.styled)('div', {
   height: 100%;
 
   background-color: ${({ theme }) => theme.palette.background.default};
-  border-top: 1px solid ${({ theme }) => theme.palette.grey[300]};
-  border-left: 1px solid ${({ theme }) => theme.palette.grey[300]};
+  border-top: 1px solid ${({ theme }) => theme.palette.components.border.default};
+  border-left: 1px solid ${({ theme }) => theme.palette.components.border.default};
 
   transition: ${({ theme }) => {
     return theme.transitions.create(['transform'], {
@@ -129,7 +129,7 @@ exports.Footer = styled_1.styled.footer `
   margin-top: auto;
 
   background-color: ${({ theme }) => theme.palette.background.default};
-  border-top: 1px solid ${({ theme }) => theme.palette.grey[300]};
+  border-top: 1px solid ${({ theme }) => theme.palette.components.border.default};
 
   ${({ theme }) => theme.breakpoints.down('sm')} {
     display: none;

package/node/components/PdfViewer/PdfPage/styles.js

@@ -26,12 +26,12 @@ exports.Wrapper = styled_1.styled.div `
   }
 
   ${({ theme }) => theme.breakpoints.down('sm')} {
-    border-top: ${({ $isViewerLite, theme }) => ($isViewerLite ? 'unset' : `1px solid ${theme.palette.grey[300]}`)};
+    border-top: ${({ $isViewerLite, theme }) => ($isViewerLite ? 'unset' : `1px solid ${theme.palette.components.border.default}`)};
     border-radius: ${({ $isViewerLite }) => !$isViewerLite && 0};
     box-shadow: ${({ $isViewerLite }) => !$isViewerLite && 'none'};
     
     &:last-child {
-      border-bottom: ${({ $isViewerLite, theme }) => ($isViewerLite ? 'unset' : `1px solid ${theme.palette.grey[300]}`)};
+      border-bottom: ${({ $isViewerLite, theme }) => ($isViewerLite ? 'unset' : `1px solid ${theme.palette.components.border.default}`)};
     }
   }
 `;

package/node/components/Radio/styles.js

@@ -8,7 +8,7 @@ const getOutlineColor = ({ theme, isHover, isDisabled, isError, isChecked, }) =>
     if (isDisabled) {
         return isChecked
             ? theme.palette.components.disabled
-            : theme.palette.grey[300];
+            : theme.palette.components.border.default;
     }
     if (isError) {
         return isHover ? theme.palette.error[700] : theme.palette.error[800];
@@ -16,7 +16,9 @@ const getOutlineColor = ({ theme, isHover, isDisabled, isError, isChecked, }) =>
     if (isChecked) {
         return isHover ? theme.palette.primary[700] : theme.palette.primary[800];
     }
-    return isHover ? theme.palette.grey[900] : theme.palette.grey[300];
+    return isHover
+        ? theme.palette.grey[900]
+        : theme.palette.components.border.default;
 };
 const getFillColor = ({ theme, isHover, isDisabled, isError, isChecked, }) => {
     if (isDisabled) {

package/node/components/RadioCard/styles.js

@@ -15,10 +15,14 @@ exports.Wrapper = styled_1.styled.label `
 
   background-color: ${({ theme }) => theme.palette.background.default};
   border-right: 1px solid
-    ${({ $isError, theme }) => $isError ? theme.palette.error[700] : theme.palette.grey[300]};
-  border-bottom: 1px solid ${({ theme }) => theme.palette.grey[300]};
+    ${({ $isError, theme }) => $isError
+    ? theme.palette.error[700]
+    : theme.palette.components.border.default};
+  border-bottom: 1px solid ${({ theme }) => theme.palette.components.border.default};
   border-left: 1px solid
-    ${({ $isError, theme }) => $isError ? theme.palette.error[700] : theme.palette.grey[300]};
+    ${({ $isError, theme }) => $isError
+    ? theme.palette.error[700]
+    : theme.palette.components.border.default};
 
   ${({ $isDisabled, theme }) => $isDisabled &&
     `
@@ -29,14 +33,18 @@ exports.Wrapper = styled_1.styled.label `
 
   &:first-of-type {
     border-top: 1px solid
-      ${({ $isError, theme }) => $isError ? theme.palette.error[700] : theme.palette.grey[300]};
+      ${({ $isError, theme }) => $isError
+    ? theme.palette.error[700]
+    : theme.palette.components.border.default};
     border-top-left-radius: ${({ theme }) => theme.shape.medium};
     border-top-right-radius: ${({ theme }) => theme.shape.medium};
   }
 
   &:last-of-type {
     border-bottom: 1px solid
-      ${({ $isError, theme }) => $isError ? theme.palette.error[700] : theme.palette.grey[300]};
+      ${({ $isError, theme }) => $isError
+    ? theme.palette.error[700]
+    : theme.palette.components.border.default};
     border-bottom-right-radius: ${({ theme }) => theme.shape.medium};
     border-bottom-left-radius: ${({ theme }) => theme.shape.medium};
   }

package/node/components/SideDialogActions/styles.js

@@ -18,7 +18,7 @@ exports.StyledDialogActions = (0, styled_1.styled)(DialogActions_1.DialogActions
 
     width: 100%;
 
-    border-bottom: 1px solid ${({ theme }) => theme.palette.grey[300]};
+    border-bottom: 1px solid ${({ theme }) => theme.palette.components.border.default};
   }
 
   ${({ theme }) => theme.breakpoints.down('sm')} {

package/node/components/SideDialogHeader/styles.js

@@ -18,7 +18,7 @@ exports.StyledDialogHeader = (0, styled_1.styled)(DialogHeader_1.DialogHeader) `
 
     width: 100%;
 
-    border-bottom: 1px solid ${({ theme }) => theme.palette.grey[300]};
+    border-bottom: 1px solid ${({ theme }) => theme.palette.components.border.default};
   }
 
   ${({ theme }) => theme.breakpoints.down('sm')} {

package/node/components/SideDialogTitle/styles.js

@@ -18,6 +18,6 @@ exports.StyledDialogTitle = (0, styled_1.styled)(DialogTitle_1.DialogTitle) `
 
     width: 100%;
 
-    border-bottom: 1px solid ${({ theme }) => theme.palette.grey[300]};
+    border-bottom: 1px solid ${({ theme }) => theme.palette.components.border.default};
   }
 `;

package/node/components/Stepper/styles.js

@@ -24,14 +24,14 @@ exports.StyledStepper = (0, styled_1.styled)(Stepper_1.default) `
     min-height: 22px;
     margin-left: 9px;
 
-    border-color: ${({ theme }) => theme.palette.grey[300]};
+    border-color: ${({ theme }) => theme.palette.components.border.default};
     border-left-width: 2px;
   }
 
   .${StepConnector_1.stepConnectorClasses.lineVertical} {
     min-height: 14px;
 
-    border-color: ${({ theme }) => theme.palette.grey[300]};
+    border-color: ${({ theme }) => theme.palette.components.border.default};
     border-left-width: 2px;
   }
 

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/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.56.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",