@nethru/ui 2.1.6 → 2.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/base/PropertyTable.js +2 -1
- package/base/SearchTextField.js +20 -16
- package/base/assets/icons.js +36 -1
- package/base/datagrid/DataGrid.js +4 -2
- package/base/frame/AppBar.js +6 -2
- package/base/frame/Frame.js +4 -1
- package/base/frame/sidebar/Sidebar.js +14 -10
- package/base/frame/sidebar/SidebarContext.js +4 -1
- package/base/frame/sidebar/css/sidebar.module.css +5 -0
- package/base/index.js +1 -9
- package/base/styles/globalStyles.js +10 -8
- package/base/styles/mui/outlinedInput.js +1 -1
- package/package.json +1 -1
- package/base/deprecated/AppendableFormList.js +0 -56
- package/base/deprecated/FormLabel.js +0 -23
- package/base/deprecated/ListItem.js +0 -21
- package/base/deprecated/ListItemDivider.js +0 -15
- package/base/deprecated/ListItemGrid.js +0 -12
- package/base/deprecated/ListItemText.js +0 -44
- package/base/deprecated/Section.js +0 -22
- package/base/deprecated/TabbedSection.js +0 -37
- package/base/deprecated/Tabs.js +0 -38
package/base/PropertyTable.js
CHANGED
|
@@ -10,6 +10,7 @@ const PropertyTable = /*#__PURE__*/forwardRef(({
|
|
|
10
10
|
readOnly,
|
|
11
11
|
error = false,
|
|
12
12
|
helperText,
|
|
13
|
+
localText,
|
|
13
14
|
outerSx,
|
|
14
15
|
...props
|
|
15
16
|
}, ref) => {
|
|
@@ -58,7 +59,7 @@ const PropertyTable = /*#__PURE__*/forwardRef(({
|
|
|
58
59
|
localeText: {
|
|
59
60
|
...koKR.components.MuiDataGrid.defaultProps.localeText,
|
|
60
61
|
noRowsLabel: '항목이 없습니다.',
|
|
61
|
-
...
|
|
62
|
+
...localText
|
|
62
63
|
},
|
|
63
64
|
...props
|
|
64
65
|
}), helperText && /*#__PURE__*/_jsx(FormHelperText, {
|
package/base/SearchTextField.js
CHANGED
|
@@ -7,6 +7,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
7
7
|
const SearchTextField = /*#__PURE__*/forwardRef(({
|
|
8
8
|
value,
|
|
9
9
|
onClear,
|
|
10
|
+
slotProps,
|
|
10
11
|
...props
|
|
11
12
|
}, ref) => {
|
|
12
13
|
const styles = useMemo(() => ({
|
|
@@ -19,24 +20,27 @@ const SearchTextField = /*#__PURE__*/forwardRef(({
|
|
|
19
20
|
ref: ref,
|
|
20
21
|
value: value,
|
|
21
22
|
placeholder: "\uAC80\uC0C9...",
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
})
|
|
28
|
-
}),
|
|
29
|
-
endAdornment: /*#__PURE__*/_jsx(InputAdornment, {
|
|
30
|
-
position: "end",
|
|
31
|
-
children: /*#__PURE__*/_jsx(IconButton, {
|
|
32
|
-
onClick: onClear,
|
|
33
|
-
sx: styles,
|
|
34
|
-
children: /*#__PURE__*/_jsx(ClearIcon, {
|
|
23
|
+
slotProps: {
|
|
24
|
+
input: {
|
|
25
|
+
startAdornment: /*#__PURE__*/_jsx(InputAdornment, {
|
|
26
|
+
position: "start",
|
|
27
|
+
children: /*#__PURE__*/_jsx(SearchIcon, {
|
|
35
28
|
fontSize: "small"
|
|
36
29
|
})
|
|
37
|
-
})
|
|
38
|
-
|
|
39
|
-
|
|
30
|
+
}),
|
|
31
|
+
endAdornment: /*#__PURE__*/_jsx(InputAdornment, {
|
|
32
|
+
position: "end",
|
|
33
|
+
children: /*#__PURE__*/_jsx(IconButton, {
|
|
34
|
+
onClick: onClear,
|
|
35
|
+
sx: styles,
|
|
36
|
+
children: /*#__PURE__*/_jsx(ClearIcon, {
|
|
37
|
+
fontSize: "small"
|
|
38
|
+
})
|
|
39
|
+
})
|
|
40
|
+
}),
|
|
41
|
+
...slotProps?.input
|
|
42
|
+
},
|
|
43
|
+
...slotProps
|
|
40
44
|
},
|
|
41
45
|
...props
|
|
42
46
|
});
|
package/base/assets/icons.js
CHANGED
|
@@ -497,4 +497,39 @@ export const SplitLayoutIcon = createSvgIcon( /*#__PURE__*/_jsx("svg", {
|
|
|
497
497
|
d: "M14.9 6.8H16C16.6627 6.8 17.2 7.33726 17.2 8V16C17.2 16.6627 16.6627 17.2 16 17.2H14.9V6.8ZM13.1 6.8H8C7.33726 6.8 6.8 7.33726 6.8 8V16C6.8 16.6627 7.33726 17.2 8 17.2H13.1V6.8ZM5 8C5 6.34315 6.34315 5 8 5H16C17.6569 5 19 6.34315 19 8V16C19 17.6569 17.6569 19 16 19H8C6.34315 19 5 17.6569 5 16V8Z",
|
|
498
498
|
fill: "#7B7B7B"
|
|
499
499
|
})
|
|
500
|
-
}), 'SplitLayout');
|
|
500
|
+
}), 'SplitLayout');
|
|
501
|
+
export const CalendarIcon = createSvgIcon( /*#__PURE__*/_jsx("svg", {
|
|
502
|
+
width: "24",
|
|
503
|
+
height: "24",
|
|
504
|
+
viewBox: "0 0 24 24",
|
|
505
|
+
fill: "none",
|
|
506
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
507
|
+
children: /*#__PURE__*/_jsx("path", {
|
|
508
|
+
d: "M8 13.9403C7.75517 13.9403 7.5465 13.8541 7.374 13.6818C7.20167 13.5093 7.1155 13.3006 7.1155 13.0558C7.1155 12.811 7.20167 12.6023 7.374 12.4298C7.5465 12.2573 7.75517 12.1711 8 12.1711C8.24483 12.1711 8.4535 12.2573 8.626 12.4298C8.79833 12.6023 8.8845 12.811 8.8845 13.0558C8.8845 13.3006 8.79833 13.5093 8.626 13.6818C8.4535 13.8541 8.24483 13.9403 8 13.9403ZM12 13.9403C11.7552 13.9403 11.5465 13.8541 11.374 13.6818C11.2017 13.5093 11.1155 13.3006 11.1155 13.0558C11.1155 12.811 11.2017 12.6023 11.374 12.4298C11.5465 12.2573 11.7552 12.1711 12 12.1711C12.2448 12.1711 12.4535 12.2573 12.626 12.4298C12.7983 12.6023 12.8845 12.811 12.8845 13.0558C12.8845 13.3006 12.7983 13.5093 12.626 13.6818C12.4535 13.8541 12.2448 13.9403 12 13.9403ZM16 13.9403C15.7552 13.9403 15.5465 13.8541 15.374 13.6818C15.2017 13.5093 15.1155 13.3006 15.1155 13.0558C15.1155 12.811 15.2017 12.6023 15.374 12.4298C15.5465 12.2573 15.7552 12.1711 16 12.1711C16.2448 12.1711 16.4535 12.2573 16.626 12.4298C16.7983 12.6023 16.8845 12.811 16.8845 13.0558C16.8845 13.3006 16.7983 13.5093 16.626 13.6818C16.4535 13.8541 16.2448 13.9403 16 13.9403ZM5.30775 21.4981C4.80258 21.4981 4.375 21.3231 4.025 20.9731C3.675 20.6231 3.5 20.1955 3.5 19.6903V6.30581C3.5 5.80065 3.675 5.37306 4.025 5.02306C4.375 4.67306 4.80258 4.49806 5.30775 4.49806H6.69225V2.38281H8.23075V4.49806H15.8077V2.38281H17.3077V4.49806H18.6923C19.1974 4.49806 19.625 4.67306 19.975 5.02306C20.325 5.37306 20.5 5.80065 20.5 6.30581V19.6903C20.5 20.1955 20.325 20.6231 19.975 20.9731C19.625 21.3231 19.1974 21.4981 18.6923 21.4981H5.30775ZM5.30775 19.9981H18.6923C18.7692 19.9981 18.8398 19.966 18.9038 19.9018C18.9679 19.8378 19 19.7673 19 19.6903V10.3058H5V19.6903C5 19.7673 5.03208 19.8378 5.09625 19.9018C5.16025 19.966 5.23075 19.9981 5.30775 19.9981ZM5 8.80581H19V6.30581C19 6.22881 18.9679 6.15831 18.9038 6.09431C18.8398 6.03014 18.7692 5.99806 18.6923 5.99806H5.30775C5.23075 5.99806 5.16025 6.03014 5.09625 6.09431C5.03208 6.15831 5 6.22881 5 6.30581V8.80581Z",
|
|
509
|
+
fill: "#7B7B7B"
|
|
510
|
+
})
|
|
511
|
+
}), 'Calendar');
|
|
512
|
+
export const ClockIcon = createSvgIcon( /*#__PURE__*/_jsx("svg", {
|
|
513
|
+
width: "24",
|
|
514
|
+
height: "24",
|
|
515
|
+
viewBox: "0 0 24 24",
|
|
516
|
+
fill: "none",
|
|
517
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
518
|
+
children: /*#__PURE__*/_jsx("path", {
|
|
519
|
+
d: "M15.473 16.5192L16.527 15.4652L12.75 11.6882V6.99219H11.25V12.2959L15.473 16.5192ZM12.0017 21.4922C10.6877 21.4922 9.45267 21.2429 8.2965 20.7442C7.14033 20.2455 6.13467 19.5688 5.2795 18.7139C4.42433 17.8591 3.74725 16.8539 3.24825 15.6982C2.74942 14.5425 2.5 13.3078 2.5 11.9939C2.5 10.6799 2.74933 9.44485 3.248 8.28869C3.74667 7.13252 4.42342 6.12685 5.27825 5.27169C6.13308 4.41652 7.13833 3.73944 8.294 3.24044C9.44967 2.7416 10.6844 2.49219 11.9983 2.49219C13.3123 2.49219 14.5473 2.74152 15.7035 3.24019C16.8597 3.73885 17.8653 4.4156 18.7205 5.27044C19.5757 6.12527 20.2528 7.13052 20.7518 8.28619C21.2506 9.44185 21.5 10.6766 21.5 11.9904C21.5 13.3044 21.2507 14.5395 20.752 15.6957C20.2533 16.8519 19.5766 17.8575 18.7218 18.7127C17.8669 19.5679 16.8617 20.2449 15.706 20.7439C14.5503 21.2428 13.3156 21.4922 12.0017 21.4922ZM12 19.9922C14.2167 19.9922 16.1042 19.213 17.6625 17.6547C19.2208 16.0964 20 14.2089 20 11.9922C20 9.77552 19.2208 7.88802 17.6625 6.32969C16.1042 4.77135 14.2167 3.99219 12 3.99219C9.78333 3.99219 7.89583 4.77135 6.3375 6.32969C4.77917 7.88802 4 9.77552 4 11.9922C4 14.2089 4.77917 16.0964 6.3375 17.6547C7.89583 19.213 9.78333 19.9922 12 19.9922Z",
|
|
520
|
+
fill: "#7B7B7B"
|
|
521
|
+
})
|
|
522
|
+
}), 'Clock');
|
|
523
|
+
export const SimulationIcon = createSvgIcon( /*#__PURE__*/_jsx("svg", {
|
|
524
|
+
width: "20",
|
|
525
|
+
height: "20",
|
|
526
|
+
viewBox: "0 0 20 20",
|
|
527
|
+
fill: "none",
|
|
528
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
529
|
+
children: /*#__PURE__*/_jsx("path", {
|
|
530
|
+
fillRule: "evenodd",
|
|
531
|
+
clipRule: "evenodd",
|
|
532
|
+
d: "M9.3763 14.0516V16.3079L4.29609 13.364C4.25345 13.3373 4.22144 13.3053 4.20005 13.2679C4.17866 13.2304 4.16797 13.1903 4.16797 13.1477V7.34312L6.32332 8.59124L9.3763 10.3592V14.0516ZM9.3763 12.1079V14.0516L10.6263 13.3016V16.3079L15.7065 13.364C15.7491 13.3373 15.7812 13.3053 15.8026 13.2679C15.8239 13.2304 15.8346 13.1903 15.8346 13.1477V7.34312L13.6868 8.58691L12.4687 7.85608L15.1471 6.30791L10.1294 3.40562C10.0868 3.37895 10.0441 3.36562 10.0013 3.36562C9.95852 3.36562 9.91582 3.37895 9.87318 3.40562L4.85547 6.30791L6.32332 7.15635V8.59124L7.98999 9.55638V12.9397L9.3763 12.1079ZM10.6263 11.3579V13.3016V10.3592L13.6868 8.58691L12.0383 9.54149L10.8188 8.80977L12.4687 7.85608L10.0013 9.28228L6.32332 7.15635L7.98999 8.11971V9.55638L9.3763 10.3592V12.1079L10.6263 11.3579ZM10.8188 8.80977L10.0013 9.28228L7.98999 8.11971V7.11249L10.8188 8.80977ZM10.6263 11.3579V10.3592L12.0383 9.54149L12.846 10.0261L10.6263 11.3579ZM3.11672 13.9137C3.24922 14.1424 3.43408 14.325 3.6713 14.4617L9.24818 17.6717C9.48526 17.8085 9.7363 17.8769 10.0013 17.8769C10.2663 17.8769 10.5173 17.8085 10.7544 17.6717L16.3313 14.4617C16.5685 14.325 16.7534 14.1424 16.8859 13.9137C17.0184 13.685 17.0846 13.4339 17.0846 13.1604V6.83999C17.0846 6.56652 17.0184 6.31541 16.8859 6.08666C16.7534 5.85805 16.5685 5.67541 16.3313 5.53874L10.7544 2.32874C10.5173 2.19194 10.2663 2.12354 10.0013 2.12354C9.7363 2.12354 9.48526 2.19194 9.24818 2.32874L3.6713 5.53874C3.43408 5.67541 3.24922 5.85805 3.11672 6.08666C2.98422 6.31541 2.91797 6.56652 2.91797 6.83999V13.1604C2.91797 13.4339 2.98422 13.685 3.11672 13.9137Z",
|
|
533
|
+
fill: "white"
|
|
534
|
+
})
|
|
535
|
+
}), 'Simulation');
|
|
@@ -8,6 +8,8 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
8
8
|
const DataGrid = /*#__PURE__*/forwardRef(({
|
|
9
9
|
toolbarLeadingSlot,
|
|
10
10
|
hideToolbar = false,
|
|
11
|
+
localeText,
|
|
12
|
+
slots,
|
|
11
13
|
...props
|
|
12
14
|
}, ref) => {
|
|
13
15
|
const getRowHeight = useCallback(() => 'auto', []);
|
|
@@ -31,12 +33,12 @@ const DataGrid = /*#__PURE__*/forwardRef(({
|
|
|
31
33
|
localeText: {
|
|
32
34
|
...koKR.components.MuiDataGrid.defaultProps.localeText,
|
|
33
35
|
noRowsLabel: '항목이 없습니다.',
|
|
34
|
-
...
|
|
36
|
+
...localeText
|
|
35
37
|
},
|
|
36
38
|
slots: {
|
|
37
39
|
toolbar: hideToolbar ? null : Toolbar,
|
|
38
40
|
footer: Footer,
|
|
39
|
-
...
|
|
41
|
+
...slots
|
|
40
42
|
},
|
|
41
43
|
...props
|
|
42
44
|
});
|
package/base/frame/AppBar.js
CHANGED
|
@@ -14,6 +14,7 @@ const AppBar = /*#__PURE__*/forwardRef(({
|
|
|
14
14
|
...props
|
|
15
15
|
}, ref) => {
|
|
16
16
|
const {
|
|
17
|
+
sections,
|
|
17
18
|
states
|
|
18
19
|
} = useSidebarContext();
|
|
19
20
|
const styles = useMemo(() => ({
|
|
@@ -46,9 +47,12 @@ const AppBar = /*#__PURE__*/forwardRef(({
|
|
|
46
47
|
children: [children, !children && /*#__PURE__*/_jsx(Box, {}), avatarSlot]
|
|
47
48
|
})]
|
|
48
49
|
})
|
|
49
|
-
}), /*#__PURE__*/_jsx(Box, {
|
|
50
|
+
}), !isEmpty(sections) && /*#__PURE__*/_jsx(Box, {
|
|
50
51
|
sx: styles
|
|
51
52
|
})]
|
|
52
53
|
});
|
|
53
54
|
});
|
|
54
|
-
export default AppBar;
|
|
55
|
+
export default AppBar;
|
|
56
|
+
function isEmpty(list) {
|
|
57
|
+
return list && list.length === 0;
|
|
58
|
+
}
|
package/base/frame/Frame.js
CHANGED
|
@@ -21,7 +21,10 @@ const Frame = /*#__PURE__*/forwardRef(({
|
|
|
21
21
|
flexGrow: 1,
|
|
22
22
|
overflow: 'auto',
|
|
23
23
|
height: '100%',
|
|
24
|
-
backgroundColor: blueGrey.contentBg
|
|
24
|
+
backgroundColor: blueGrey.contentBg,
|
|
25
|
+
borderRadius: '8px 0px 0px 0px',
|
|
26
|
+
zIndex: `var(--contents-zindex)`,
|
|
27
|
+
boxShadow: '-10px 1px 8px -10px #65656533, 0px -10px 8px -10px #65656533'
|
|
25
28
|
}), []);
|
|
26
29
|
return /*#__PURE__*/_jsx(Box, {
|
|
27
30
|
ref: ref,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { forwardRef, useCallback, useEffect
|
|
1
|
+
import { forwardRef, useCallback, useEffect } from "react";
|
|
2
2
|
import { useLocation, useNavigate } from "react-router-dom";
|
|
3
3
|
import { Stack } from "@mui/material";
|
|
4
4
|
import { useSidebarContext } from "./SidebarContext";
|
|
@@ -7,11 +7,13 @@ import SecondaryMenu from "./SecondaryMenu";
|
|
|
7
7
|
import MenuToggler from "./MenuToggler";
|
|
8
8
|
import styles from './css/sidebar.module.css';
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
10
11
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
11
12
|
const Sidebar = /*#__PURE__*/forwardRef((props, ref) => {
|
|
12
|
-
const [sections, setSections] = useState();
|
|
13
13
|
const {
|
|
14
14
|
menu,
|
|
15
|
+
sections,
|
|
16
|
+
setSections,
|
|
15
17
|
states,
|
|
16
18
|
dispatch
|
|
17
19
|
} = useSidebarContext();
|
|
@@ -43,17 +45,19 @@ const Sidebar = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
43
45
|
}, [states]);
|
|
44
46
|
return /*#__PURE__*/_jsxs(Stack, {
|
|
45
47
|
ref: ref,
|
|
46
|
-
className: `${styles.container} ${closed
|
|
48
|
+
className: `${styles.container} ${closed ? styles.closed : styles.opened} ${isEmpty(sections) && styles.none}`,
|
|
47
49
|
children: [/*#__PURE__*/_jsx(PrimaryMenu, {
|
|
48
50
|
items: menu,
|
|
49
51
|
onClick: handleClick
|
|
50
|
-
}), /*#__PURE__*/
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
52
|
+
}), !isEmpty(sections) && /*#__PURE__*/_jsxs(_Fragment, {
|
|
53
|
+
children: [/*#__PURE__*/_jsx(SecondaryMenu, {
|
|
54
|
+
sections: sections || [],
|
|
55
|
+
closed: !isEmpty(sections) ? closed : true,
|
|
56
|
+
onClick: handleClick
|
|
57
|
+
}), /*#__PURE__*/_jsx(MenuToggler, {
|
|
58
|
+
closed: closed,
|
|
59
|
+
onClick: handleToggle
|
|
60
|
+
})]
|
|
57
61
|
})]
|
|
58
62
|
});
|
|
59
63
|
});
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { createContext, useContext, useReducer } from "react";
|
|
1
|
+
import { createContext, useContext, useReducer, useState } from "react";
|
|
2
2
|
import { produce } from "immer";
|
|
3
3
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
4
|
const SidebarContext = /*#__PURE__*/createContext();
|
|
@@ -8,9 +8,12 @@ export function SidebarContextProvider({
|
|
|
8
8
|
children
|
|
9
9
|
}) {
|
|
10
10
|
const [states, dispatch] = useReducer(reducer, initialStates);
|
|
11
|
+
const [sections, setSections] = useState();
|
|
11
12
|
return /*#__PURE__*/_jsx(SidebarContext.Provider, {
|
|
12
13
|
value: {
|
|
13
14
|
menu,
|
|
15
|
+
sections,
|
|
16
|
+
setSections,
|
|
14
17
|
icons,
|
|
15
18
|
states,
|
|
16
19
|
dispatch
|
|
@@ -13,6 +13,11 @@
|
|
|
13
13
|
width: calc(var(--primary-menu-width) + var(--secondary-menu-collapsed-width));
|
|
14
14
|
min-width: calc(var(--primary-menu-width) + var(--secondary-menu-collapsed-width));
|
|
15
15
|
}
|
|
16
|
+
.container.none {
|
|
17
|
+
width: calc(var(--primary-menu-width));
|
|
18
|
+
min-width: calc(var(--primary-menu-width));
|
|
19
|
+
z-index: var(--primary-menu-only-zindex);
|
|
20
|
+
}
|
|
16
21
|
|
|
17
22
|
|
|
18
23
|
.secondary {
|
package/base/index.js
CHANGED
|
@@ -41,13 +41,5 @@ export { default as Switch } from "./Switch";
|
|
|
41
41
|
export * from './frame/sidebar/SidebarContext';
|
|
42
42
|
export { default as Error } from "./error/Error";
|
|
43
43
|
export { default as HttpError } from "./error/HttpError";
|
|
44
|
-
export { default as AppendableFormList } from "./deprecated/AppendableFormList";
|
|
45
44
|
export { default as CircularProgress } from "./deprecated/CircularProgress";
|
|
46
|
-
export { default as
|
|
47
|
-
export { default as ListItem } from "./deprecated/ListItem";
|
|
48
|
-
export { default as ListItemDivider } from "./deprecated/ListItemDivider";
|
|
49
|
-
export { default as ListItemGrid } from "./deprecated/ListItemGrid";
|
|
50
|
-
export { default as ListItemText } from "./deprecated/ListItemText";
|
|
51
|
-
export { default as ShadowedSection } from "./deprecated/ShadowedSection";
|
|
52
|
-
export { default as TabbedSection } from "./deprecated/TabbedSection";
|
|
53
|
-
export { default as Tabs } from "./deprecated/Tabs";
|
|
45
|
+
export { default as ShadowedSection } from "./deprecated/ShadowedSection";
|
|
@@ -6,17 +6,19 @@ const globalStyles = {
|
|
|
6
6
|
'--frame-background-color': blueGrey.frameBg,
|
|
7
7
|
'--gnb-background-color': blueGrey.gnbBg,
|
|
8
8
|
'--gnb-height': '64px',
|
|
9
|
-
'--gnb-zindex':
|
|
10
|
-
'--sidebar-zindex':
|
|
9
|
+
'--gnb-zindex': 1103,
|
|
10
|
+
'--sidebar-zindex': 1102,
|
|
11
|
+
'--primary-menu-only-zindex': 1100,
|
|
11
12
|
'--primary-menu-width': '72px',
|
|
12
|
-
'--primary-menu-zindex':
|
|
13
|
+
'--primary-menu-zindex': 1104,
|
|
13
14
|
'--secondary-menu-width': '180px',
|
|
14
15
|
'--secondary-menu-collapsed-width': '30px',
|
|
15
|
-
'--secondary-menu-zindex':
|
|
16
|
-
'--secondary-menu-toggler-zindex':
|
|
17
|
-
'--aside-zindex':
|
|
18
|
-
'--aside-button-zindex':
|
|
19
|
-
'--divider-zindex':
|
|
16
|
+
'--secondary-menu-zindex': 1105,
|
|
17
|
+
'--secondary-menu-toggler-zindex': 1106,
|
|
18
|
+
'--aside-zindex': 1107,
|
|
19
|
+
'--aside-button-zindex': 1108,
|
|
20
|
+
'--divider-zindex': 1109,
|
|
21
|
+
'--contents-zindex': 1101
|
|
20
22
|
},
|
|
21
23
|
'html, body, #root': {
|
|
22
24
|
margin: 0,
|
package/package.json
CHANGED
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Button, IconButton, Stack, Tooltip, Typography } from "@mui/material";
|
|
3
|
-
import AddIcon from "@mui/icons-material/Add";
|
|
4
|
-
import DeleteIcon from "@mui/icons-material/Delete";
|
|
5
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
7
|
-
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
8
|
-
export default function AppendableFormList({
|
|
9
|
-
gap = 1,
|
|
10
|
-
forms,
|
|
11
|
-
renderForm,
|
|
12
|
-
addOns,
|
|
13
|
-
onAppend,
|
|
14
|
-
onRemove,
|
|
15
|
-
readOnly
|
|
16
|
-
}) {
|
|
17
|
-
return /*#__PURE__*/_jsxs(Stack, {
|
|
18
|
-
gap: gap,
|
|
19
|
-
children: [/*#__PURE__*/_jsxs(_Fragment, {
|
|
20
|
-
children: [forms.map((form, index) => /*#__PURE__*/_jsxs(Stack, {
|
|
21
|
-
direction: "row",
|
|
22
|
-
alignItems: "end",
|
|
23
|
-
gap: 2,
|
|
24
|
-
children: [renderForm(form, index), !readOnly && /*#__PURE__*/_jsx(Tooltip, {
|
|
25
|
-
title: "\uC0AD\uC81C",
|
|
26
|
-
children: /*#__PURE__*/_jsx(IconButton, {
|
|
27
|
-
onClick: _ => onRemove(index),
|
|
28
|
-
size: "small",
|
|
29
|
-
sx: {
|
|
30
|
-
ml: '-10px',
|
|
31
|
-
mb: '-5px'
|
|
32
|
-
},
|
|
33
|
-
children: /*#__PURE__*/_jsx(DeleteIcon, {
|
|
34
|
-
fontSize: "small"
|
|
35
|
-
})
|
|
36
|
-
})
|
|
37
|
-
})]
|
|
38
|
-
}, index)), forms.length === 0 && /*#__PURE__*/_jsx(Typography, {
|
|
39
|
-
variant: "body2",
|
|
40
|
-
sx: {
|
|
41
|
-
color: '#999'
|
|
42
|
-
},
|
|
43
|
-
children: "\uD56D\uBAA9\uC774 \uC5C6\uC2B5\uB2C8\uB2E4"
|
|
44
|
-
})]
|
|
45
|
-
}), !readOnly && /*#__PURE__*/_jsxs(Stack, {
|
|
46
|
-
direction: "row",
|
|
47
|
-
gap: 1,
|
|
48
|
-
children: [/*#__PURE__*/_jsx(Button, {
|
|
49
|
-
variant: "text",
|
|
50
|
-
startIcon: /*#__PURE__*/_jsx(AddIcon, {}),
|
|
51
|
-
onClick: onAppend,
|
|
52
|
-
children: "\uCD94\uAC00"
|
|
53
|
-
}), addOns]
|
|
54
|
-
})]
|
|
55
|
-
});
|
|
56
|
-
}
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import MuiFormLabel from "@mui/material/FormLabel";
|
|
3
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
|
-
export default function FormLabel({
|
|
5
|
-
value = false,
|
|
6
|
-
children,
|
|
7
|
-
sx,
|
|
8
|
-
...props
|
|
9
|
-
}) {
|
|
10
|
-
const styles = {
|
|
11
|
-
color: value ? 'rgba(0, 0, 0, 0.87)' : 'rgba(0, 0, 0, 0.6)',
|
|
12
|
-
fontSize: value ? 16 : 14,
|
|
13
|
-
fontWeight: value ? 600 : 400
|
|
14
|
-
};
|
|
15
|
-
return /*#__PURE__*/_jsx(MuiFormLabel, {
|
|
16
|
-
sx: {
|
|
17
|
-
...sx,
|
|
18
|
-
...styles
|
|
19
|
-
},
|
|
20
|
-
...props,
|
|
21
|
-
children: children
|
|
22
|
-
});
|
|
23
|
-
}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import MuiListItem from "@mui/material/ListItem";
|
|
2
|
-
import { Grid } from "@mui/material";
|
|
3
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
|
-
export default function ListItem({
|
|
6
|
-
grid,
|
|
7
|
-
spacing = 10,
|
|
8
|
-
verticalAlign = 'flex-start',
|
|
9
|
-
children,
|
|
10
|
-
...props
|
|
11
|
-
}) {
|
|
12
|
-
return /*#__PURE__*/_jsxs(MuiListItem, {
|
|
13
|
-
...props,
|
|
14
|
-
children: [grid && /*#__PURE__*/_jsx(Grid, {
|
|
15
|
-
container: true,
|
|
16
|
-
columnSpacing: spacing,
|
|
17
|
-
alignItems: verticalAlign,
|
|
18
|
-
children: children
|
|
19
|
-
}), !grid && children]
|
|
20
|
-
});
|
|
21
|
-
}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { Divider } from "@mui/material";
|
|
2
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
-
export default function ListItemDivider({
|
|
4
|
-
sx,
|
|
5
|
-
...props
|
|
6
|
-
}) {
|
|
7
|
-
return /*#__PURE__*/_jsx(Divider, {
|
|
8
|
-
sx: {
|
|
9
|
-
...sx,
|
|
10
|
-
mt: 3,
|
|
11
|
-
mb: 2
|
|
12
|
-
},
|
|
13
|
-
...props
|
|
14
|
-
});
|
|
15
|
-
}
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import { useState } from "react";
|
|
2
|
-
import { Box, Stack, Tooltip, Typography } from "@mui/material";
|
|
3
|
-
import MuiListItemText from "@mui/material/ListItemText";
|
|
4
|
-
import HelpIcon from "@mui/icons-material/Help";
|
|
5
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
7
|
-
export default function ListItemText({
|
|
8
|
-
primary,
|
|
9
|
-
secondary,
|
|
10
|
-
tooltip,
|
|
11
|
-
...props
|
|
12
|
-
}) {
|
|
13
|
-
const [hover, setHover] = useState(false);
|
|
14
|
-
return /*#__PURE__*/_jsx(MuiListItemText, {
|
|
15
|
-
primary: typeof primary === 'string' ? /*#__PURE__*/_jsx(Typography, {
|
|
16
|
-
fontSize: 17,
|
|
17
|
-
fontWeight: 600,
|
|
18
|
-
children: primary
|
|
19
|
-
}) : /*#__PURE__*/_jsx(Box, {
|
|
20
|
-
children: primary
|
|
21
|
-
}),
|
|
22
|
-
secondary: /*#__PURE__*/_jsxs(Stack, {
|
|
23
|
-
direction: "row",
|
|
24
|
-
spacing: 0.5,
|
|
25
|
-
children: [/*#__PURE__*/_jsx(Box, {
|
|
26
|
-
color: "rgba(0, 0, 0, 0.6)",
|
|
27
|
-
fontSize: 14,
|
|
28
|
-
children: secondary
|
|
29
|
-
}), /*#__PURE__*/_jsx(Tooltip, {
|
|
30
|
-
title: tooltip,
|
|
31
|
-
children: /*#__PURE__*/_jsx(HelpIcon, {
|
|
32
|
-
sx: {
|
|
33
|
-
fontSize: 18,
|
|
34
|
-
visibility: tooltip && hover ? 'visible' : 'hidden'
|
|
35
|
-
}
|
|
36
|
-
})
|
|
37
|
-
})]
|
|
38
|
-
}),
|
|
39
|
-
disableTypography: true,
|
|
40
|
-
onMouseEnter: _ => setHover(true),
|
|
41
|
-
onMouseLeave: _ => setHover(false),
|
|
42
|
-
...props
|
|
43
|
-
});
|
|
44
|
-
}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { Paper } from "@mui/material";
|
|
2
|
-
import { forwardRef } from "react";
|
|
3
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
|
-
const Section = /*#__PURE__*/forwardRef(({
|
|
5
|
-
children,
|
|
6
|
-
sx,
|
|
7
|
-
...props
|
|
8
|
-
}, ref) => {
|
|
9
|
-
return /*#__PURE__*/_jsx(Paper, {
|
|
10
|
-
ref: ref,
|
|
11
|
-
variant: "outlined",
|
|
12
|
-
square: false,
|
|
13
|
-
sx: {
|
|
14
|
-
marginTop: '20px',
|
|
15
|
-
padding: 3,
|
|
16
|
-
...sx
|
|
17
|
-
},
|
|
18
|
-
...props,
|
|
19
|
-
children: children
|
|
20
|
-
});
|
|
21
|
-
});
|
|
22
|
-
export default Section;
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import { Stack, Tab } from "@mui/material";
|
|
2
|
-
import Tabs from "./Tabs";
|
|
3
|
-
import Section from "./Section";
|
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
6
|
-
export default function TabbedSection({
|
|
7
|
-
orientation,
|
|
8
|
-
labels = [],
|
|
9
|
-
tabProps = {},
|
|
10
|
-
sectionProps = {},
|
|
11
|
-
children,
|
|
12
|
-
...props
|
|
13
|
-
}) {
|
|
14
|
-
const styles = {
|
|
15
|
-
mt: 0,
|
|
16
|
-
width: orientation === 'vertical' ? '100%' : 'unset'
|
|
17
|
-
};
|
|
18
|
-
return /*#__PURE__*/_jsxs(Stack, {
|
|
19
|
-
direction: orientation === 'vertical' ? 'row' : 'column',
|
|
20
|
-
children: [/*#__PURE__*/_jsx(Tabs, {
|
|
21
|
-
orientation: orientation,
|
|
22
|
-
...props,
|
|
23
|
-
children: labels.map((label, index) => /*#__PURE__*/_jsx(Tab, {
|
|
24
|
-
label: label,
|
|
25
|
-
wrapped: orientation === 'vertical',
|
|
26
|
-
...tabProps
|
|
27
|
-
}, index))
|
|
28
|
-
}), /*#__PURE__*/_jsx(Section, {
|
|
29
|
-
sx: {
|
|
30
|
-
...styles,
|
|
31
|
-
...sectionProps.sx
|
|
32
|
-
},
|
|
33
|
-
...sectionProps,
|
|
34
|
-
children: children
|
|
35
|
-
})]
|
|
36
|
-
});
|
|
37
|
-
}
|
package/base/deprecated/Tabs.js
DELETED
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import MuiTabs from "@mui/material/Tabs";
|
|
3
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
|
-
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
5
|
-
export default function Tabs({
|
|
6
|
-
orientation,
|
|
7
|
-
sx,
|
|
8
|
-
...props
|
|
9
|
-
}) {
|
|
10
|
-
const vertical = orientation === 'vertical';
|
|
11
|
-
const styles = {
|
|
12
|
-
ml: vertical ? 0 : 0.5,
|
|
13
|
-
mr: vertical ? 0 : 0.5,
|
|
14
|
-
mt: vertical ? 0.5 : 0,
|
|
15
|
-
mb: vertical ? 0.5 : 0,
|
|
16
|
-
'& .MuiButtonBase-root.MuiTab-root': {
|
|
17
|
-
fontSize: '15px'
|
|
18
|
-
},
|
|
19
|
-
'&.MuiTabs-root.MuiTabs-vertical': {
|
|
20
|
-
minWidth: '40px',
|
|
21
|
-
maxWidth: '40px'
|
|
22
|
-
},
|
|
23
|
-
'&.MuiTabs-root.MuiTabs-vertical .MuiButtonBase-root.MuiTab-root': {
|
|
24
|
-
minWidth: '40px',
|
|
25
|
-
maxWidth: '40px'
|
|
26
|
-
}
|
|
27
|
-
};
|
|
28
|
-
return /*#__PURE__*/_jsx(_Fragment, {
|
|
29
|
-
children: /*#__PURE__*/_jsx(MuiTabs, {
|
|
30
|
-
orientation: orientation,
|
|
31
|
-
sx: {
|
|
32
|
-
...styles,
|
|
33
|
-
...sx
|
|
34
|
-
},
|
|
35
|
-
...props
|
|
36
|
-
})
|
|
37
|
-
});
|
|
38
|
-
}
|