@nethru/ui 2.0.13 → 2.0.15

package/base/Alert.js

@@ -12,11 +12,11 @@ const Alert = /*#__PURE__*/forwardRef(({
     ref: ref,
     ...props,
     children: [/*#__PURE__*/_jsx(Box, {
-      whiteSpace: "pre",
+      whiteSpace: "pre-wrap",
       children: unescape(children)
     }), subcontent && /*#__PURE__*/_jsx(Box, {
       className: "MuiAlert-subcontent",
-      whiteSpace: "pre",
+      whiteSpace: "pre-wrap",
       children: unescape(subcontent)
     })]
   });

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/HelpTooltipIcon.js

@@ -10,6 +10,7 @@ const HelpTooltipIcon = /*#__PURE__*/forwardRef(({
   return /*#__PURE__*/_jsx(Tooltip, {
     ref: ref,
     title: tooltip,
+    ...props,
     children: /*#__PURE__*/_jsx(IconButton, {
       size: "small",
       onClick: onClick,

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'
       },
@@ -145,5 +143,6 @@ const asideStyles = {
   flexGrow: 1,
   backgroundColor: blueGrey.frameBg,
   padding: '6px 16px 6px 10px',
+  overflowX: 'hidden',
   zIndex: 'var(--aside-zindex)'
 };

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.13",
+  "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",