@nethru/ui 2.1.2 → 2.1.4

package/base/AddableFormList.js

@@ -20,6 +20,22 @@ const AddableFormList = /*#__PURE__*/forwardRef(({
   ...props
 }, ref) => {
   const removable = useMemo(() => allowEmpty || forms.length > 1, [allowEmpty, forms.length]);
+  const rightMargins = useMemo(() => {
+    const margins = [25, 30];
+    const counts = forms.map((form, index) => {
+      let count = 0;
+      if (!readOnly) {
+        if (showRemoveButton && renderButton(form, index)[0]) count++;
+        if (showAddButton && renderButton(form, index)[1]) count++;
+      }
+      return count;
+    });
+    const max = Math.max(...counts);
+    return counts.map((count, index) => {
+      const diff = max - count;
+      if (diff === 2) return margins[0] + margins[1];else if (diff === 1) return margins[count];else return 0;
+    });
+  }, [showAddButton, showRemoveButton, renderButton, forms, readOnly]);
   return /*#__PURE__*/_jsx(Stack, {
     ref: ref,
     gap: gap,
@@ -34,6 +50,7 @@ const AddableFormList = /*#__PURE__*/forwardRef(({
           alignItems: "start",
           gap: 1,
           marginTop: `${margins[index > 0 ? 1 : 0]}px`,
+          marginRight: `${rightMargins[index]}px`,
           children: [showRemoveButton && renderButton(form, index)[0] && /*#__PURE__*/_jsx(Tooltip, {
             title: "\uC0AD\uC81C",
             children: /*#__PURE__*/_jsx(IconButton, {

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

@@ -3,6 +3,7 @@
     position: relative;
     background-color: var(--frame-background-color);
     transition: width .2s;
+    z-index: var(--sidebar-zindex);
 }
 .container.opened {
     width: calc(var(--primary-menu-width) + var(--secondary-menu-width));

package/base/styles/globalStyles.js

@@ -7,15 +7,16 @@ const globalStyles = {
     '--gnb-background-color': blueGrey.gnbBg,
     '--gnb-height': '64px',
     '--gnb-zindex': 1100,
+    '--sidebar-zindex': 1101,
     '--primary-menu-width': '72px',
-    '--primary-menu-zindex': 1101,
+    '--primary-menu-zindex': 1102,
     '--secondary-menu-width': '180px',
     '--secondary-menu-collapsed-width': '30px',
-    '--secondary-menu-zindex': 1102,
-    '--secondary-menu-toggler-zindex': 1103,
-    '--aside-zindex': 1104,
-    '--aside-button-zindex': 1105,
-    '--divider-zindex': 1106
+    '--secondary-menu-zindex': 1103,
+    '--secondary-menu-toggler-zindex': 1104,
+    '--aside-zindex': 1105,
+    '--aside-button-zindex': 1106,
+    '--divider-zindex': 1107
   },
   'html, body, #root': {
     margin: 0,

package/base/styles/mui/iconButton.js

@@ -2,6 +2,10 @@ import { grey } from "../../colors";
 import borderRadius from "../borderRadius";
 import typography from "../typography";
 export const styles = {
+  defaultProps: {
+    variant: 'normal',
+    disableRipple: true
+  },
   variants: [{
     props: {
       variant: 'normal'
@@ -40,9 +44,6 @@ export const styles = {
       }
     }
   }],
-  defaultProps: {
-    variant: 'normal'
-  },
   styleOverrides: {
     root: {
       fontFamily: typography.fontFamily,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nethru/ui",
-  "version": "2.1.2",
+  "version": "2.1.4",
   "main": "base/index.js",
   "files": [
     "/base"