@nethru/ui 2.0.14 → 2.0.15

package/base/ColumnedSection.js

@@ -1,5 +1,5 @@
 import { forwardRef, useMemo } from "react";
-import { Box, Grid } from "@mui/material";
+import { Box, Grid2 } from "@mui/material";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const ColumnedSection = /*#__PURE__*/forwardRef(({
@@ -26,15 +26,14 @@ const ColumnedSection = /*#__PURE__*/forwardRef(({
       md: point
     };
   }, [columns, breakpoints]);
-  return /*#__PURE__*/_jsx(Grid, {
+  return /*#__PURE__*/_jsx(Grid2, {
     ref: ref,
     container: true,
     spacing: spacing,
     alignItems: "stretch",
     ...props,
-    children: contents.map((content, index) => /*#__PURE__*/_jsxs(Grid, {
-      item: true,
-      ...arrangedBreakpoints,
+    children: contents.map((content, index) => /*#__PURE__*/_jsxs(Grid2, {
+      size: arrangedBreakpoints,
       children: [labels[index], /*#__PURE__*/_jsx(Box, {
         className: showBox ? 'MuiGrid-box' : undefined,
         children: content

package/base/PropertyTable.js

@@ -1,6 +1,7 @@
 import { forwardRef, useCallback, useMemo, useState } from "react";
 import { Box, FormHelperText } from "@mui/material";
-import { DataGridPro, koKR } from "@mui/x-data-grid-pro";
+import { DataGridPro } from "@mui/x-data-grid-pro";
+import { koKR } from "@mui/x-data-grid-pro/locales";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const PropertyTable = /*#__PURE__*/forwardRef(({

package/base/datagrid/DataGrid.js

@@ -1,5 +1,6 @@
 import { forwardRef, useCallback } from "react";
-import { DataGridPro as MuiDataGridPro, GridToolbarQuickFilter, koKR } from "@mui/x-data-grid-pro";
+import { DataGridPro as MuiDataGridPro, GridToolbarQuickFilter } from "@mui/x-data-grid-pro";
+import { koKR } from "@mui/x-data-grid-pro/locales";
 import { Box, Stack } from "@mui/material";
 import Footer from "./Footer";
 import { jsx as _jsx } from "react/jsx-runtime";

package/base/frame/SplitLayout.js

@@ -1,5 +1,5 @@
 import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { Box, Grid, IconButton, Stack, Tooltip } from '@mui/material';
+import { Box, Grid2, IconButton, Stack, Tooltip } from '@mui/material';
 import { blueGrey, grey } from "../colors";
 import { SplitLayoutIcon } from "../assets/icons";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -75,7 +75,7 @@ const SplitLayout = /*#__PURE__*/forwardRef(({
     if (!aside) setAsidePortion(0);else if (asidePortion === 0) setAsidePortion(defaultAsidePortion);
     // eslint-disable-next-line
   }, [aside]);
-  return /*#__PURE__*/_jsxs(Grid, {
+  return /*#__PURE__*/_jsxs(Grid2, {
     container: true,
     ref: containerRef,
     columns: 100,
@@ -85,17 +85,15 @@ const SplitLayout = /*#__PURE__*/forwardRef(({
       ...sx
     },
     ...props,
-    children: [/*#__PURE__*/_jsxs(Grid, {
-      item: true,
+    children: [/*#__PURE__*/_jsxs(Grid2, {
       component: "section",
-      xs: 100 - asidePortion,
+      size: 100 - asidePortion,
       sx: sectionStyles,
       children: [children, footer]
-    }), aside && /*#__PURE__*/_jsxs(Grid, {
+    }), aside && /*#__PURE__*/_jsxs(Grid2, {
       ref: asideRef,
-      item: true,
       component: "aside",
-      xs: asidePortion,
+      size: asidePortion,
       sx: {
         position: 'relative'
       },

package/base/frame/sidebar/css/sidebar.module.css

@@ -6,6 +6,7 @@
 }
 .container.opened {
     width: calc(var(--primary-menu-width) + var(--secondary-menu-width));
+    min-width: calc(var(--primary-menu-width) + var(--secondary-menu-width));
 }
 .container.closed {
     width: calc(var(--primary-menu-width) + var(--secondary-menu-collapsed-width));

package/base/styles/createTheme.js

@@ -41,6 +41,7 @@ import * as dialogTitle from "./mui/dialogTitle";
 import * as dialogActions from "./mui/dialogActions";
 import * as dialogContent from "./mui/dialogContent";
 import * as grid from "./mui/grid";
+import * as grid2 from "./mui/grid2";
 import * as appBar from "./mui/appBar";
 import * as avatar from "./mui/avatar";
 export default function createTheme() {
@@ -92,6 +93,7 @@ export default function createTheme() {
       MuiDialogActions: dialogActions.styles,
       MuiDialogContent: dialogContent.styles,
       MuiGrid: grid.styles,
+      MuiGrid2: grid2.styles,
       MuiAppBar: appBar.styles,
       MuiAvatar: avatar.styles
     }

package/base/styles/mui/grid2.js

@@ -0,0 +1,18 @@
+import { grey } from "../../colors";
+import borderRadius from "../borderRadius";
+export const styles = {
+  defaultProps: {
+    columnSpacing: 5
+  },
+  styleOverrides: {
+    root: {
+      '.MuiGrid-box': {
+        // height: 'calc(100% - 32px)',
+        backgroundColor: grey[50],
+        border: `1px solid ${grey[300]}`,
+        padding: '16px !important',
+        borderRadius: `${borderRadius[2]}px`
+      }
+    }
+  }
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nethru/ui",
-  "version": "2.0.14",
+  "version": "2.0.15",
   "main": "base/index.js",
   "files": [
     "/base"
@@ -8,22 +8,21 @@
   "dependencies": {
     "@codemirror/lang-javascript": "^6.2.1",
     "@codemirror/lang-json": "^6.0.1",
-    "@emotion/react": "^11.11.4",
-    "@emotion/styled": "^11.11.5",
+    "@emotion/react": "^11.13.3",
+    "@emotion/styled": "^11.13.0",
     "@fontsource/roboto": "^5.0.8",
-    "@mui/icons-material": "^5.14.18",
-    "@mui/material": "^5.15.21",
-    "@mui/styled-engine-sc": "^6.0.0-alpha.18",
-    "@mui/x-data-grid-pro": "^6.20.3",
-    "@mui/x-date-pickers-pro": "^7.8.0",
-    "@mui/x-license": "^7.2.0",
-    "@mui/x-tree-view": "^6.17.0",
-    "@nethru/ui": "^1.0.19",
+    "@mui/icons-material": "^6.0.1",
+    "@mui/material": "^6.0.1",
+    "@mui/styled-engine-sc": "^6.0.1",
+    "@mui/x-data-grid-pro": "^7.15.0",
+    "@mui/x-date-pickers-pro": "^7.15.0",
+    "@mui/x-license": "^7.15.0",
+    "@mui/x-tree-view": "^7.15.0",
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
     "@uiw/react-codemirror": "^4.21.21",
-    "dayjs": "^1.11.11",
+    "dayjs": "^1.11.13",
     "days": "^1.1.1",
     "immer": "^10.0.3",
     "react": "^18.2.0",