@pdg/react-admin-layout 1.0.49 → 1.0.51

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.
Files changed (6) hide show
  1. package/README.md +1 -1
  2. package/dist/@common/index.d.ts +1 -0
  3. package/dist/@common/useChanged.d.ts +1 -0
  4. package/dist/index.esm.js +895 -284
  5. package/dist/index.js +895 -284
  6. package/package.json +13 -9
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- 'use strict';var material=require('@mui/material'),React=require('react'),reactRouter=require('react-router'),iconsMaterial=require('@mui/icons-material'),SimpleBar=require('simplebar-react');function insertStyle(css) {
1
+ 'use strict';var material=require('@mui/material'),React=require('react'),compilerRuntime=require('react/compiler-runtime'),reactRouter=require('react-router'),iconsMaterial=require('@mui/icons-material'),SimpleBar=require('simplebar-react');function insertStyle(css) {
2
2
  if (typeof window === 'undefined')
3
3
  return;
4
4
  const style = document.createElement('style');
@@ -6,313 +6,924 @@
6
6
  style.innerHTML = css;
7
7
  document.head.appendChild(style);
8
8
  return css;
9
- }insertStyle(".simplebar-track.simplebar-vertical{width:8px !important}.simplebar-track.simplebar-vertical .simplebar-scrollbar.simplebar-visible:before{opacity:.3 !important}.MuiButtonBase-root.MuiButton-root.MuiButton-outlined{padding:5px 15px 4px}.MuiButtonBase-root.MuiButton-root.MuiButton-outlined.MuiButton-sizeLarge{padding:7px 21px 6px}.MuiButtonBase-root.MuiButton-root.MuiButton-outlined.MuiButton-sizeSmall{padding:3px 9px 2px}.MuiButtonBase-root.MuiButton-root.MuiButton-contained{padding:6px 16px 5px}.MuiButtonBase-root.MuiButton-root.MuiButton-contained.MuiButton-sizeLarge{padding:8px 22px 7px}.MuiButtonBase-root.MuiButton-root.MuiButton-contained.MuiButton-sizeSmall{padding:4px 10px 3px}.MuiButtonBase-root.MuiButton-root.MuiButton-text{padding:6px 8px 5px}.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-sizeLarge{padding:8px 11px 7px}.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-sizeSmall{padding:4px 5px 3px}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,main,input,button,textarea,pre,select,a{font-family:\"Pretendard\",\"Apple Gothic\",\"Dotum\",sans-serif;margin:0;padding:0;border:0;vertical-align:top;box-sizing:border-box;word-break:keep-all;line-height:unset}*:before,*:after{box-sizing:border-box}");const CardLayout = ({ children, backgroundColor = '#eff3f8' }) => {
10
- return (React.createElement(material.Grid, { container: true, direction: 'column', alignItems: 'center', justifyContent: 'center', bgcolor: backgroundColor, minHeight: '100vh' },
11
- React.createElement(material.Grid, null, children)));
12
- };const StyledExpandMore = material.styled(iconsMaterial.ExpandMore) `
13
- margin-top: auto;
14
- margin-bottom: auto;
15
- @keyframes open {
16
- 0% {
17
- transform: rotate(0deg);
18
- }
19
- 100% {
20
- transform: rotate(180deg);
9
+ }insertStyle(".simplebar-track.simplebar-vertical{width:8px !important}.simplebar-track.simplebar-vertical .simplebar-scrollbar.simplebar-visible:before{opacity:.3 !important}.MuiButtonBase-root.MuiButton-root.MuiButton-outlined{padding:5px 15px 4px}.MuiButtonBase-root.MuiButton-root.MuiButton-outlined.MuiButton-sizeLarge{padding:7px 21px 6px}.MuiButtonBase-root.MuiButton-root.MuiButton-outlined.MuiButton-sizeSmall{padding:3px 9px 2px}.MuiButtonBase-root.MuiButton-root.MuiButton-contained{padding:6px 16px 5px}.MuiButtonBase-root.MuiButton-root.MuiButton-contained.MuiButton-sizeLarge{padding:8px 22px 7px}.MuiButtonBase-root.MuiButton-root.MuiButton-contained.MuiButton-sizeSmall{padding:4px 10px 3px}.MuiButtonBase-root.MuiButton-root.MuiButton-text{padding:6px 8px 5px}.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-sizeLarge{padding:8px 11px 7px}.MuiButtonBase-root.MuiButton-root.MuiButton-text.MuiButton-sizeSmall{padding:4px 5px 3px}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,main,input,button,textarea,pre,select,a{font-family:\"Pretendard\",\"Apple Gothic\",\"Dotum\",sans-serif;margin:0;padding:0;border:0;vertical-align:top;box-sizing:border-box;word-break:keep-all;line-height:unset}*:before,*:after{box-sizing:border-box}");var CardLayout = function CardLayout(_ref) {
10
+ var children = _ref.children,
11
+ _ref$backgroundColor = _ref.backgroundColor,
12
+ backgroundColor = _ref$backgroundColor === void 0 ? '#eff3f8' : _ref$backgroundColor;
13
+ return /*#__PURE__*/React.createElement(material.Grid, {
14
+ container: true,
15
+ direction: 'column',
16
+ alignItems: 'center',
17
+ justifyContent: 'center',
18
+ bgcolor: backgroundColor,
19
+ minHeight: '100vh'
20
+ }, /*#__PURE__*/React.createElement(material.Grid, null, children));
21
+ };function _arrayLikeToArray(r, a) {
22
+ (null == a || a > r.length) && (a = r.length);
23
+ for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
24
+ return n;
25
+ }
26
+ function _arrayWithHoles(r) {
27
+ if (Array.isArray(r)) return r;
28
+ }
29
+ function _defineProperty(e, r, t) {
30
+ return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
31
+ value: t,
32
+ enumerable: true,
33
+ configurable: true,
34
+ writable: true
35
+ }) : e[r] = t, e;
36
+ }
37
+ function _iterableToArrayLimit(r, l) {
38
+ var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
39
+ if (null != t) {
40
+ var e,
41
+ n,
42
+ i,
43
+ u,
44
+ a = [],
45
+ f = true,
46
+ o = false;
47
+ try {
48
+ if (i = (t = t.call(r)).next, 0 === l) ; else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
49
+ } catch (r) {
50
+ o = true, n = r;
51
+ } finally {
52
+ try {
53
+ if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
54
+ } finally {
55
+ if (o) throw n;
56
+ }
21
57
  }
58
+ return a;
22
59
  }
23
- @keyframes close {
24
- 0% {
25
- transform: rotate(180deg);
26
- }
27
- 100% {
28
- transform: rotate(0deg);
60
+ }
61
+ function _nonIterableRest() {
62
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
63
+ }
64
+ function _slicedToArray(r, e) {
65
+ return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest();
66
+ }
67
+ function _taggedTemplateLiteral(e, t) {
68
+ return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, {
69
+ raw: {
70
+ value: Object.freeze(t)
29
71
  }
72
+ }));
73
+ }
74
+ function _toPrimitive(t, r) {
75
+ if ("object" != typeof t || !t) return t;
76
+ var e = t[Symbol.toPrimitive];
77
+ if (void 0 !== e) {
78
+ var i = e.call(t, r);
79
+ if ("object" != typeof i) return i;
80
+ throw new TypeError("@@toPrimitive must return a primitive value.");
81
+ }
82
+ return ("string" === r ? String : Number)(t);
83
+ }
84
+ function _toPropertyKey(t) {
85
+ var i = _toPrimitive(t, "string");
86
+ return "symbol" == typeof i ? i : i + "";
87
+ }
88
+ function _unsupportedIterableToArray(r, a) {
89
+ if (r) {
90
+ if ("string" == typeof r) return _arrayLikeToArray(r, a);
91
+ var t = {}.toString.call(r).slice(8, -1);
92
+ return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
93
+ }
94
+ }var _templateObject$4, _templateObject2$2;
95
+ var StyledExpandMore = material.styled(iconsMaterial.ExpandMore)(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral(["\n margin-top: auto;\n margin-bottom: auto;\n @keyframes open {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(180deg);\n }\n }\n @keyframes close {\n 0% {\n transform: rotate(180deg);\n }\n 100% {\n transform: rotate(0deg);\n }\n }\n"])));
96
+ var StyledListItemIcon = material.styled(material.ListItemIcon)(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteral(["\n min-width: 30px;\n"])));var useChanged = function useChanged(value, callback) {
97
+ var _React$useState = React.useState(value),
98
+ _React$useState2 = _slicedToArray(_React$useState, 2),
99
+ _value = _React$useState2[0],
100
+ _setValue = _React$useState2[1];
101
+ if (value !== _value) {
102
+ _setValue(value);
103
+ callback();
30
104
  }
31
- `;
32
- const StyledListItemIcon = material.styled(material.ListItemIcon) `
33
- min-width: 30px;
34
- `;const SideMenuListItem = ({ info, badgeVariant, expandedBackgroundColor }) => {
35
- /********************************************************************************************************************
36
- * Use
37
- * ******************************************************************************************************************/
38
- const location = reactRouter.useLocation();
39
- const navigate = reactRouter.useNavigate();
40
- /********************************************************************************************************************
41
- * State
42
- * ******************************************************************************************************************/
43
- const [isExpandable, setIsExpandable] = React.useState(false);
44
- const [isExpand, setIsExpand] = React.useState(false);
45
- /********************************************************************************************************************
46
- * Effect
47
- * ******************************************************************************************************************/
48
- React.useEffect(() => {
49
- setIsExpandable(!!info.items && info.items.length > 0);
50
- if (info.items && info.items.find((info) => location.pathname === info.uri)) {
51
- setIsExpand(true);
105
+ };var _SideMenuListItem = function SideMenuListItem(t0) {
106
+ var $ = compilerRuntime.c(70);
107
+ var info = t0.info,
108
+ badgeVariant = t0.badgeVariant,
109
+ expandedBackgroundColor = t0.expandedBackgroundColor;
110
+ var location = reactRouter.useLocation();
111
+ var navigate = reactRouter.useNavigate();
112
+ var _useState = React.useState(false),
113
+ _useState2 = _slicedToArray(_useState, 2),
114
+ isExpandable = _useState2[0],
115
+ setIsExpandable = _useState2[1];
116
+ var _useState3 = React.useState(false),
117
+ _useState4 = _slicedToArray(_useState3, 2),
118
+ isExpand = _useState4[0],
119
+ setIsExpand = _useState4[1];
120
+ var t1;
121
+ if ($[0] !== info.items || $[1] !== location.pathname) {
122
+ t1 = function t1() {
123
+ setIsExpandable(!!info.items && info.items.length > 0);
124
+ if (info.items && info.items.find(function (info_0) {
125
+ return location.pathname === info_0.uri;
126
+ })) {
127
+ setIsExpand(true);
128
+ }
129
+ };
130
+ $[0] = info.items;
131
+ $[1] = location.pathname;
132
+ $[2] = t1;
133
+ } else {
134
+ t1 = $[2];
135
+ }
136
+ useChanged(info, t1);
137
+ var t2;
138
+ if ($[3] !== info.items || $[4] !== info.uri || $[5] !== isExpand || $[6] !== isExpandable || $[7] !== location.pathname) {
139
+ t2 = function t2() {
140
+ if (isExpandable && isExpand != null) {
141
+ if (info.uri !== location.pathname) {
142
+ if (info.items && !info.items.find(function (info_1) {
143
+ return location.pathname === info_1.uri;
144
+ })) {
145
+ if (isExpand) {
146
+ setIsExpand(false);
147
+ }
148
+ }
149
+ }
150
+ }
151
+ if (isExpandable && !isExpand) {
152
+ if (info.items && info.items.find(function (info_2) {
153
+ return location.pathname === info_2.uri;
154
+ })) {
155
+ setIsExpand(true);
52
156
  }
53
- // eslint-disable-next-line react-hooks/exhaustive-deps
54
- }, [info]);
55
- React.useEffect(() => {
56
- if (isExpandable && isExpand != null) {
57
- if (info.uri !== location.pathname) {
58
- if (info.items && !info.items.find((info) => location.pathname === info.uri)) {
59
- if (isExpand) {
60
- setIsExpand(false);
61
- }
157
+ }
158
+ };
159
+ $[3] = info.items;
160
+ $[4] = info.uri;
161
+ $[5] = isExpand;
162
+ $[6] = isExpandable;
163
+ $[7] = location.pathname;
164
+ $[8] = t2;
165
+ } else {
166
+ t2 = $[8];
167
+ }
168
+ useChanged(location.pathname, t2);
169
+ var t3;
170
+ if ($[9] !== badgeVariant || $[10] !== expandedBackgroundColor || $[11] !== info.badge || $[12] !== info.badgeVariant || $[13] !== info.depth || $[14] !== info.icon || $[15] !== info.items || $[16] !== info.name || $[17] !== info.uri || $[18] !== isExpand || $[19] !== isExpandable || $[20] !== location.pathname || $[21] !== navigate) {
171
+ var t4;
172
+ if ($[23] !== badgeVariant || $[24] !== expandedBackgroundColor || $[25] !== info.badge || $[26] !== info.badgeVariant || $[27] !== info.depth || $[28] !== info.icon || $[29] !== info.name || $[30] !== info.uri || $[31] !== isExpand || $[32] !== isExpandable || $[33] !== location.pathname || $[34] !== navigate) {
173
+ var _t;
174
+ if ($[36] !== info.uri || $[37] !== isExpandable || $[38] !== navigate) {
175
+ _t = isExpandable ? function () {
176
+ return setIsExpand(_temp$2);
177
+ } : function () {
178
+ return info.uri && navigate(info.uri);
179
+ };
180
+ $[36] = info.uri;
181
+ $[37] = isExpandable;
182
+ $[38] = navigate;
183
+ $[39] = _t;
184
+ } else {
185
+ _t = $[39];
186
+ }
187
+ var t6 = isExpandable ? false : info.uri === location.pathname;
188
+ var t7 = isExpandable && isExpand ? expandedBackgroundColor : undefined;
189
+ var t8;
190
+ if ($[40] !== t7) {
191
+ t8 = {
192
+ backgroundColor: t7
193
+ };
194
+ $[40] = t7;
195
+ $[41] = t8;
196
+ } else {
197
+ t8 = $[41];
198
+ }
199
+ var t9;
200
+ if ($[42] !== _t || $[43] !== t6 || $[44] !== t8) {
201
+ t9 = {
202
+ onClick: _t,
203
+ selected: t6,
204
+ style: t8
205
+ };
206
+ $[42] = _t;
207
+ $[43] = t6;
208
+ $[44] = t8;
209
+ $[45] = t9;
210
+ } else {
211
+ t9 = $[45];
212
+ }
213
+ var t10;
214
+ if ($[46] !== info.icon) {
215
+ t10 = /*#__PURE__*/React.createElement(StyledListItemIcon, null, info.icon && /*#__PURE__*/React.createElement(material.Icon, {
216
+ fontSize: "small"
217
+ }, info.icon));
218
+ $[46] = info.icon;
219
+ $[47] = t10;
220
+ } else {
221
+ t10 = $[47];
222
+ }
223
+ var t11;
224
+ if ($[48] !== badgeVariant || $[49] !== info.badge || $[50] !== info.badgeVariant || $[51] !== info.depth || $[52] !== info.name) {
225
+ var _t2 = info.depth === 1 ? 600 : undefined;
226
+ var t13;
227
+ if ($[54] !== _t2) {
228
+ t13 = {
229
+ slotProps: {
230
+ primary: {
231
+ style: {
232
+ fontWeight: _t2
62
233
  }
234
+ }
63
235
  }
236
+ };
237
+ $[54] = _t2;
238
+ $[55] = t13;
239
+ } else {
240
+ t13 = $[55];
64
241
  }
65
- if (isExpandable && !isExpand) {
66
- if (info.items && info.items.find((info) => location.pathname === info.uri)) {
67
- setIsExpand(true);
242
+ var t14;
243
+ if ($[56] !== badgeVariant || $[57] !== info.badge || $[58] !== info.badgeVariant || $[59] !== info.name) {
244
+ t14 = info.badge ? /*#__PURE__*/React.createElement(material.Badge, {
245
+ badgeContent: info.badge,
246
+ color: "error",
247
+ variant: badgeVariant !== undefined ? badgeVariant : info.badgeVariant,
248
+ anchorOrigin: {
249
+ horizontal: "left",
250
+ vertical: "top"
251
+ },
252
+ slotProps: {
253
+ badge: {
254
+ style: {
255
+ left: "100%",
256
+ top: "50%",
257
+ transform: "scale(.8) translate(10px, -50%)"
258
+ }
259
+ }
68
260
  }
261
+ }, /*#__PURE__*/React.createElement("div", null, info.name)) : info.name;
262
+ $[56] = badgeVariant;
263
+ $[57] = info.badge;
264
+ $[58] = info.badgeVariant;
265
+ $[59] = info.name;
266
+ $[60] = t14;
267
+ } else {
268
+ t14 = $[60];
269
+ }
270
+ t11 = /*#__PURE__*/React.createElement(material.ListItemText, t13, t14);
271
+ $[48] = badgeVariant;
272
+ $[49] = info.badge;
273
+ $[50] = info.badgeVariant;
274
+ $[51] = info.depth;
275
+ $[52] = info.name;
276
+ $[53] = t11;
277
+ } else {
278
+ t11 = $[53];
279
+ }
280
+ var t12;
281
+ if ($[61] !== isExpand || $[62] !== isExpandable) {
282
+ t12 = isExpandable && /*#__PURE__*/React.createElement(StyledExpandMore, {
283
+ sx: {
284
+ animation: "".concat(isExpand ? "open" : "close", " 0.1s linear"),
285
+ transform: "rotate(".concat(isExpand ? 180 : 0, "deg)")
286
+ }
287
+ });
288
+ $[61] = isExpand;
289
+ $[62] = isExpandable;
290
+ $[63] = t12;
291
+ } else {
292
+ t12 = $[63];
293
+ }
294
+ t4 = /*#__PURE__*/React.createElement(material.ListItemButton, t9, t10, t11, t12);
295
+ $[23] = badgeVariant;
296
+ $[24] = expandedBackgroundColor;
297
+ $[25] = info.badge;
298
+ $[26] = info.badgeVariant;
299
+ $[27] = info.depth;
300
+ $[28] = info.icon;
301
+ $[29] = info.name;
302
+ $[30] = info.uri;
303
+ $[31] = isExpand;
304
+ $[32] = isExpandable;
305
+ $[33] = location.pathname;
306
+ $[34] = navigate;
307
+ $[35] = t4;
308
+ } else {
309
+ t4 = $[35];
310
+ }
311
+ var t5;
312
+ if ($[64] !== badgeVariant || $[65] !== expandedBackgroundColor || $[66] !== info.items || $[67] !== isExpand || $[68] !== isExpandable) {
313
+ t5 = isExpandable && /*#__PURE__*/React.createElement(material.Collapse, {
314
+ "in": isExpand,
315
+ style: {
316
+ backgroundColor: isExpand ? expandedBackgroundColor : undefined
69
317
  }
70
- // eslint-disable-next-line react-hooks/exhaustive-deps
71
- }, [location]);
72
- /********************************************************************************************************************
73
- * Render
74
- * ******************************************************************************************************************/
75
- return (React.createElement(React.Fragment, null,
76
- React.createElement(material.ListItemButton, { onClick: isExpandable ? () => setIsExpand((old) => !old) : () => info.uri && navigate(info.uri), selected: isExpandable ? false : info.uri === location.pathname, style: {
77
- backgroundColor: isExpandable && isExpand ? expandedBackgroundColor : undefined,
78
- } },
79
- React.createElement(StyledListItemIcon, null, info.icon && React.createElement(material.Icon, { fontSize: 'small' }, info.icon)),
80
- React.createElement(material.ListItemText, { primaryTypographyProps: { style: { fontWeight: info.depth === 1 ? 600 : undefined } } }, info.badge ? (React.createElement(material.Badge, { badgeContent: info.badge, color: 'error', variant: badgeVariant !== undefined ? badgeVariant : info.badgeVariant, anchorOrigin: { horizontal: 'left', vertical: 'top' }, slotProps: {
81
- badge: { style: { left: '100%', top: '50%', transform: 'scale(.8) translate(10px, -50%)' } },
82
- } },
83
- React.createElement("div", null, info.name))) : (info.name)),
84
- isExpandable && (React.createElement(StyledExpandMore, { sx: {
85
- animation: `${isExpand ? 'open' : 'close'} 0.1s linear`,
86
- transform: `rotate(${isExpand ? 180 : 0}deg)`,
87
- } }))),
88
- isExpandable && (React.createElement(material.Collapse, { in: isExpand, style: { backgroundColor: isExpand ? expandedBackgroundColor : undefined } }, info.items &&
89
- info.items.map((subInfo, idx) => React.createElement(SideMenuListItem, { key: idx, badgeVariant: badgeVariant, info: subInfo }))))));
90
- };const StyledList = material.styled(material.List) `
91
- padding: 0;
92
- `;const SideMenuList = ({ list, badgeVariant }) => {
93
- /********************************************************************************************************************
94
- * Use
95
- * ******************************************************************************************************************/
96
- const theme = material.useTheme();
97
- /********************************************************************************************************************
98
- * Variable
99
- * ******************************************************************************************************************/
100
- const finalList = list.map((item) => (Object.assign(Object.assign({}, item), { icon: item.icon
101
- ? item.icon.replace(/[A-Z]/g, (letter, idx) => `${idx > 0 ? '_' : ''}${letter.toLowerCase()}`)
102
- : undefined })));
103
- const expandedBackgroundColor = material.alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity / 2);
104
- /********************************************************************************************************************
105
- * Render
106
- * ******************************************************************************************************************/
107
- return (React.createElement(StyledList, null, finalList.map((info, idx) => (React.createElement(SideMenuListItem, { key: idx, info: info, badgeVariant: badgeVariant, expandedBackgroundColor: expandedBackgroundColor })))));
318
+ }, info.items && info.items.map(function (subInfo, idx) {
319
+ return /*#__PURE__*/React.createElement(_SideMenuListItem, {
320
+ key: idx,
321
+ badgeVariant: badgeVariant,
322
+ info: subInfo
323
+ });
324
+ }));
325
+ $[64] = badgeVariant;
326
+ $[65] = expandedBackgroundColor;
327
+ $[66] = info.items;
328
+ $[67] = isExpand;
329
+ $[68] = isExpandable;
330
+ $[69] = t5;
331
+ } else {
332
+ t5 = $[69];
333
+ }
334
+ t3 = /*#__PURE__*/React.createElement(React.Fragment, null, t4, t5);
335
+ $[9] = badgeVariant;
336
+ $[10] = expandedBackgroundColor;
337
+ $[11] = info.badge;
338
+ $[12] = info.badgeVariant;
339
+ $[13] = info.depth;
340
+ $[14] = info.icon;
341
+ $[15] = info.items;
342
+ $[16] = info.name;
343
+ $[17] = info.uri;
344
+ $[18] = isExpand;
345
+ $[19] = isExpandable;
346
+ $[20] = location.pathname;
347
+ $[21] = navigate;
348
+ $[22] = t3;
349
+ } else {
350
+ t3 = $[22];
351
+ }
352
+ return t3;
108
353
  };
109
- var SideMenuList$1 = React.memo(SideMenuList);const StyledSimpleBar = material.styled(SimpleBar) `
110
- max-height: 100%;
111
- `;
112
- const StyledLogoContainerBox = material.styled(material.Box)(({ theme }) => theme.unstable_sx({
354
+ function _temp$2(old) {
355
+ return !old;
356
+ }var _templateObject$3;
357
+ var StyledList = material.styled(material.List)(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral(["\n padding: 0;\n"])));var SideMenuList = function SideMenuList(t0) {
358
+ var $ = compilerRuntime.c(5);
359
+ var list = t0.list,
360
+ badgeVariant = t0.badgeVariant;
361
+ var theme = material.useTheme();
362
+ var t1;
363
+ if ($[0] !== badgeVariant || $[1] !== list || $[2] !== theme.palette.action.selectedOpacity || $[3] !== theme.palette.primary.main) {
364
+ var finalList = list.map(_temp2);
365
+ var expandedBackgroundColor = material.alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity / 2);
366
+ t1 = /*#__PURE__*/React.createElement(StyledList, null, finalList.map(function (info, idx_0) {
367
+ return /*#__PURE__*/React.createElement(_SideMenuListItem, {
368
+ key: idx_0,
369
+ info: info,
370
+ badgeVariant: badgeVariant,
371
+ expandedBackgroundColor: expandedBackgroundColor
372
+ });
373
+ }));
374
+ $[0] = badgeVariant;
375
+ $[1] = list;
376
+ $[2] = theme.palette.action.selectedOpacity;
377
+ $[3] = theme.palette.primary.main;
378
+ $[4] = t1;
379
+ } else {
380
+ t1 = $[4];
381
+ }
382
+ return t1;
383
+ };
384
+ var SideMenuList$1 = /*#__PURE__*/React.memo(SideMenuList);
385
+ function _temp$1(letter, idx) {
386
+ return "".concat(idx > 0 ? "_" : "").concat(letter.toLowerCase());
387
+ }
388
+ function _temp2(item) {
389
+ return Object.assign(Object.assign({}, item), {
390
+ icon: item.icon ? item.icon.replace(/[A-Z]/g, _temp$1) : undefined
391
+ });
392
+ }var _templateObject$2;
393
+ var StyledSimpleBar = material.styled(SimpleBar)(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral(["\n max-height: 100%;\n"])));
394
+ var StyledLogoContainerBox = material.styled(material.Box)(function (_ref) {
395
+ var theme = _ref.theme;
396
+ return theme.unstable_sx({
113
397
  borderBottom: 'thin solid #f5f5f5',
114
- color: 'text.primary',
115
- }));const SideMenu = ({ logo, badgeVariant, list }) => {
116
- return (React.createElement(StyledSimpleBar, null,
117
- React.createElement(StyledLogoContainerBox, null,
118
- React.createElement(material.Toolbar, null, logo)),
119
- list && React.createElement(SideMenuList$1, { badgeVariant: badgeVariant, list: list })));
398
+ color: 'text.primary'
399
+ });
400
+ });var SideMenu = function SideMenu(_ref) {
401
+ var logo = _ref.logo,
402
+ badgeVariant = _ref.badgeVariant,
403
+ list = _ref.list;
404
+ return /*#__PURE__*/React.createElement(StyledSimpleBar, null, /*#__PURE__*/React.createElement(StyledLogoContainerBox, null, /*#__PURE__*/React.createElement(material.Toolbar, null, logo)), list && /*#__PURE__*/React.createElement(SideMenuList$1, {
405
+ badgeVariant: badgeVariant,
406
+ list: list
407
+ }));
120
408
  };
121
- var SideMenu$1 = React.memo(SideMenu);const StyledContainerBox$1 = material.styled(material.Box) `
122
- position: relative;
123
- `;
124
- const StyledHeadContainerBox = material.styled(material.Box)(({ theme }) => theme.unstable_sx({
125
- display: { xs: 'none', sm: 'flex' },
409
+ var SideMenu$1 = /*#__PURE__*/React.memo(SideMenu);var _templateObject$1, _templateObject2$1, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
410
+ var StyledContainerBox$1 = material.styled(material.Box)(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral(["\n position: relative;\n"])));
411
+ var StyledHeadContainerBox = material.styled(material.Box)(function (_ref) {
412
+ var theme = _ref.theme;
413
+ return theme.unstable_sx({
414
+ display: {
415
+ xs: 'none',
416
+ sm: 'flex'
417
+ },
126
418
  alignItems: 'center',
127
- opacity: 0.5,
128
- }));
129
- const StyledHeadIconContainerBox = material.styled(material.Box) `
130
- margin-right: 0.25rem;
131
- line-height: 0;
132
- `;
133
- const StyledHeadIcon = material.styled(material.Icon) `
134
- font-size: 1rem;
135
- `;
136
- const StyledHeadTitleTypography = material.styled(material.Typography) `
137
- font-size: 0.7rem;
138
- `;
139
- const StyledTitleContainerDiv = material.styled('div') `
140
- display: flex;
141
- align-items: center;
142
- font-size: 1rem;
143
- `;
144
- const StyledTitleIconContainerDiv = material.styled('div') `
145
- flex-shrink: 0;
146
- display: inline-flex;
147
- margin-right: 0.3rem;
148
- `;const Title = ({ title, icon, headTitle, headIcon }) => {
149
- /********************************************************************************************************************
150
- * Variable
151
- * ******************************************************************************************************************/
152
- const finalHeadIcon = headIcon
153
- ? headIcon.replace(/[A-Z]/g, (letter, idx) => `${idx > 0 ? '_' : ''}${letter.toLowerCase()}`)
154
- : undefined;
155
- const finalIcon = icon
156
- ? icon.replace(/[A-Z]/g, (letter, idx) => `${idx > 0 ? '_' : ''}${letter.toLowerCase()}`)
157
- : undefined;
158
- /********************************************************************************************************************
159
- * Render
160
- * ******************************************************************************************************************/
161
- return (React.createElement(StyledContainerBox$1, null,
162
- headTitle && (React.createElement(StyledHeadContainerBox, null,
163
- finalHeadIcon && (React.createElement(StyledHeadIconContainerBox, null,
164
- React.createElement(StyledHeadIcon, null, finalHeadIcon))),
165
- React.createElement(StyledHeadTitleTypography, null, headTitle))),
166
- React.createElement(StyledTitleContainerDiv, null,
167
- finalIcon && (React.createElement(StyledTitleIconContainerDiv, null,
168
- React.createElement(material.Icon, { fontSize: 'small' }, finalIcon))),
169
- React.createElement("div", null, title))));
419
+ opacity: 0.5
420
+ });
421
+ });
422
+ var StyledHeadIconContainerBox = material.styled(material.Box)(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral(["\n margin-right: 0.25rem;\n line-height: 0;\n"])));
423
+ var StyledHeadIcon = material.styled(material.Icon)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n font-size: 1rem;\n"])));
424
+ var StyledHeadTitleTypography = material.styled(material.Typography)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n font-size: 0.7rem;\n"])));
425
+ var StyledTitleContainerDiv = material.styled('div')(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n font-size: 1rem;\n"])));
426
+ var StyledTitleIconContainerDiv = material.styled('div')(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n flex-shrink: 0;\n display: inline-flex;\n margin-right: 0.3rem;\n"])));var Title = function Title(_ref) {
427
+ var title = _ref.title,
428
+ icon = _ref.icon,
429
+ headTitle = _ref.headTitle,
430
+ headIcon = _ref.headIcon;
431
+ /********************************************************************************************************************
432
+ * Variable
433
+ * ******************************************************************************************************************/
434
+ var finalHeadIcon = headIcon ? headIcon.replace(/[A-Z]/g, function (letter, idx) {
435
+ return "".concat(idx > 0 ? '_' : '').concat(letter.toLowerCase());
436
+ }) : undefined;
437
+ var finalIcon = icon ? icon.replace(/[A-Z]/g, function (letter, idx) {
438
+ return "".concat(idx > 0 ? '_' : '').concat(letter.toLowerCase());
439
+ }) : undefined;
440
+ /********************************************************************************************************************
441
+ * Render
442
+ * ******************************************************************************************************************/
443
+ return /*#__PURE__*/React.createElement(StyledContainerBox$1, null, headTitle && (/*#__PURE__*/React.createElement(StyledHeadContainerBox, null, finalHeadIcon && (/*#__PURE__*/React.createElement(StyledHeadIconContainerBox, null, /*#__PURE__*/React.createElement(StyledHeadIcon, null, finalHeadIcon))), /*#__PURE__*/React.createElement(StyledHeadTitleTypography, null, headTitle))), /*#__PURE__*/React.createElement(StyledTitleContainerDiv, null, finalIcon && (/*#__PURE__*/React.createElement(StyledTitleIconContainerDiv, null, /*#__PURE__*/React.createElement(material.Icon, {
444
+ fontSize: 'small'
445
+ }, finalIcon))), /*#__PURE__*/React.createElement("div", null, title)));
170
446
  };
171
- var Title$1 = React.memo(Title);const SIDE_MENU_WIDTH = 220;
172
- const SCREENS = ['xs', 'sm', 'md', 'lg', 'xl'];
173
- const _getNextScreen = (screen) => {
174
- if (screen === 'xs')
175
- return 'sm';
176
- else if (screen === 'sm')
177
- return 'md';
178
- else if (screen === 'md')
179
- return 'lg';
180
- else
181
- return 'xl';
447
+ var Title$1 = /*#__PURE__*/React.memo(Title);var _templateObject, _templateObject2;
448
+ var SIDE_MENU_WIDTH = 220;
449
+ var SCREENS = ['xs', 'sm', 'md', 'lg', 'xl'];
450
+ var _getNextScreen = function _getNextScreen(screen) {
451
+ if (screen === 'xs') return 'sm';else if (screen === 'sm') return 'md';else if (screen === 'md') return 'lg';else return 'xl';
182
452
  };
183
- const DefaultLayout = ({ children, logo, badgeVariant, menu, menuHideScreen = 'sm', appBarControl }) => {
184
- /********************************************************************************************************************
185
- * Use
186
- * ******************************************************************************************************************/
187
- const location = reactRouter.useLocation();
188
- /********************************************************************************************************************
189
- * State
190
- * ******************************************************************************************************************/
191
- const [isMobileOpen, setIsMobileOpen] = React.useState(false);
192
- const [menuTitles, setMenuTitles] = React.useState({});
193
- /********************************************************************************************************************
194
- * Effect
195
- * ******************************************************************************************************************/
196
- React.useEffect(() => {
197
- const menuTitles = {};
198
- if (menu) {
199
- menu.forEach((info) => {
200
- if ((info.uri == null || info.uri === '') && info.items && info.items.length > 0) {
201
- info.items.map((subInfo) => {
202
- menuTitles[subInfo.uri] = { name: subInfo.name, parentName: info.name, parentIcon: info.icon };
203
- });
204
- }
205
- else if (info.uri) {
206
- menuTitles[info.uri] = { name: info.name, icon: info.icon };
207
- }
453
+ var DefaultLayout = function DefaultLayout(t0) {
454
+ var $ = compilerRuntime.c(95);
455
+ var children = t0.children,
456
+ logo = t0.logo,
457
+ badgeVariant = t0.badgeVariant,
458
+ menu = t0.menu,
459
+ t1 = t0.menuHideScreen,
460
+ appBarControl = t0.appBarControl;
461
+ var menuHideScreen = t1 === undefined ? "sm" : t1;
462
+ var location = reactRouter.useLocation();
463
+ var _useState = React.useState(false),
464
+ _useState2 = _slicedToArray(_useState, 2),
465
+ isMobileOpen = _useState2[0],
466
+ setIsMobileOpen = _useState2[1];
467
+ var t2;
468
+ if ($[0] === Symbol["for"]("react.memo_cache_sentinel")) {
469
+ t2 = {};
470
+ $[0] = t2;
471
+ } else {
472
+ t2 = $[0];
473
+ }
474
+ var _useState3 = React.useState(t2),
475
+ _useState4 = _slicedToArray(_useState3, 2),
476
+ menuTitles = _useState4[0],
477
+ setMenuTitles = _useState4[1];
478
+ var t3;
479
+ if ($[1] === Symbol["for"]("react.memo_cache_sentinel")) {
480
+ t3 = function t3() {
481
+ setIsMobileOpen(false);
482
+ };
483
+ $[1] = t3;
484
+ } else {
485
+ t3 = $[1];
486
+ }
487
+ useChanged(location.pathname, t3);
488
+ var t4;
489
+ if ($[2] !== menu) {
490
+ t4 = function t4() {
491
+ var menuTitles_0 = {};
492
+ if (menu) {
493
+ menu.forEach(function (info) {
494
+ if ((info.uri == null || info.uri === "") && info.items && info.items.length > 0) {
495
+ info.items.map(function (subInfo) {
496
+ menuTitles_0[subInfo.uri] = {
497
+ name: subInfo.name,
498
+ parentName: info.name,
499
+ parentIcon: info.icon
500
+ };
208
501
  });
209
- }
210
- setMenuTitles(menuTitles);
211
- }, [menu]);
212
- React.useEffect(() => {
213
- setIsMobileOpen(false);
214
- }, [location]);
215
- /********************************************************************************************************************
216
- * Function
217
- * ******************************************************************************************************************/
218
- const toggleIsMobileOpen = React.useCallback(() => {
219
- setIsMobileOpen((isMobileOpen) => !isMobileOpen);
220
- }, []);
221
- /********************************************************************************************************************
222
- * Memo
223
- * ******************************************************************************************************************/
224
- const sideMenuTemporaryDrawerSx = React.useMemo(() => {
225
- let found = false;
226
- return {
227
- display: SCREENS.reduce((res, screen) => {
228
- if (screen === menuHideScreen) {
229
- found = true;
230
- res[screen] = 'block';
231
- }
232
- else {
233
- res[screen] = found ? 'none' : 'block';
234
- }
235
- return res;
236
- }, {}),
237
- };
238
- }, [menuHideScreen]);
239
- const sideMenuPermanentDrawerSx = React.useMemo(() => {
240
- let found = false;
241
- return {
242
- display: SCREENS.reduce((res, screen) => {
243
- if (screen === menuHideScreen) {
244
- found = true;
245
- res[screen] = 'none';
246
- }
247
- else {
248
- res[screen] = found ? 'block' : 'none';
249
- }
250
- return res;
251
- }, {}),
252
- };
253
- }, [menuHideScreen]);
254
- /********************************************************************************************************************
255
- * Variable
256
- * ******************************************************************************************************************/
257
- const nextMenuScreen = _getNextScreen(menuHideScreen);
258
- const appBarSx = {
259
- width: { [nextMenuScreen]: `calc(100% - ${SIDE_MENU_WIDTH}px)` },
260
- ml: { [nextMenuScreen]: `${SIDE_MENU_WIDTH}px` },
502
+ } else {
503
+ if (info.uri) {
504
+ menuTitles_0[info.uri] = {
505
+ name: info.name,
506
+ icon: info.icon
507
+ };
508
+ }
509
+ }
510
+ });
511
+ }
512
+ setMenuTitles(menuTitles_0);
513
+ };
514
+ $[2] = menu;
515
+ $[3] = t4;
516
+ } else {
517
+ t4 = $[3];
518
+ }
519
+ useChanged(menu, t4);
520
+ var t5;
521
+ if ($[4] === Symbol["for"]("react.memo_cache_sentinel")) {
522
+ t5 = function t5() {
523
+ setIsMobileOpen(_temp);
261
524
  };
262
- const appBarIconButtonSx = { mr: 2, display: { [nextMenuScreen]: 'none' } };
263
- const sideMenuContainerBoxSx = {
264
- width: { [nextMenuScreen]: SIDE_MENU_WIDTH },
265
- flexShrink: { [nextMenuScreen]: 0 },
525
+ $[4] = t5;
526
+ } else {
527
+ t5 = $[4];
528
+ }
529
+ var toggleIsMobileOpen = t5;
530
+ var t6;
531
+ if ($[5] !== menuHideScreen) {
532
+ t6 = SCREENS.reduce(function (acc, screen) {
533
+ if (screen === menuHideScreen) {
534
+ acc.found = true;
535
+ acc.display[screen] = "block";
536
+ } else {
537
+ acc.display[screen] = acc.found ? "none" : "block";
538
+ }
539
+ return acc;
540
+ }, {
541
+ found: false,
542
+ display: {}
543
+ });
544
+ $[5] = menuHideScreen;
545
+ $[6] = t6;
546
+ } else {
547
+ t6 = $[6];
548
+ }
549
+ var t7;
550
+ if ($[7] !== t6.display) {
551
+ t7 = {
552
+ display: t6.display
266
553
  };
267
- const mainBoxSx = {
268
- width: { [nextMenuScreen]: `calc(100% - ${SIDE_MENU_WIDTH}px)` },
269
- flexGrow: 1,
270
- p: 2,
271
- display: 'flex',
272
- flexDirection: 'column',
273
- minHeight: '100vh',
554
+ $[7] = t6.display;
555
+ $[8] = t7;
556
+ } else {
557
+ t7 = $[8];
558
+ }
559
+ var sideMenuTemporaryDrawerSx = t7;
560
+ var t8;
561
+ if ($[9] !== menuHideScreen) {
562
+ t8 = SCREENS.reduce(function (acc_0, screen_0) {
563
+ if (screen_0 === menuHideScreen) {
564
+ acc_0.found = true;
565
+ acc_0.display[screen_0] = "none";
566
+ } else {
567
+ acc_0.display[screen_0] = acc_0.found ? "block" : "none";
568
+ }
569
+ return acc_0;
570
+ }, {
571
+ found: false,
572
+ display: {}
573
+ });
574
+ $[9] = menuHideScreen;
575
+ $[10] = t8;
576
+ } else {
577
+ t8 = $[10];
578
+ }
579
+ var t9;
580
+ if ($[11] !== t8.display) {
581
+ t9 = {
582
+ display: t8.display
583
+ };
584
+ $[11] = t8.display;
585
+ $[12] = t9;
586
+ } else {
587
+ t9 = $[12];
588
+ }
589
+ var sideMenuPermanentDrawerSx = t9;
590
+ var nextMenuScreen = _getNextScreen(menuHideScreen);
591
+ var t10;
592
+ if ($[13] !== nextMenuScreen) {
593
+ t10 = {
594
+ width: _defineProperty({}, nextMenuScreen, "calc(100% - ".concat(SIDE_MENU_WIDTH, "px)")),
595
+ ml: _defineProperty({}, nextMenuScreen, "".concat(SIDE_MENU_WIDTH, "px"))
274
596
  };
275
- const titleData = menuTitles[location.pathname];
276
- /********************************************************************************************************************
277
- * Render
278
- * ******************************************************************************************************************/
279
- return (React.createElement(StyledContainerBox, null,
280
- React.createElement(StyledAppBar, { position: 'fixed', elevation: 0, sx: appBarSx },
281
- React.createElement(material.Toolbar, null,
282
- React.createElement(material.IconButton, { color: 'inherit', "aria-label": 'open drawer', edge: 'start', onClick: toggleIsMobileOpen, sx: appBarIconButtonSx },
283
- React.createElement(iconsMaterial.Menu, null)),
284
- React.createElement(material.Typography, { variant: 'h6', noWrap: true, component: 'div', sx: { flexGrow: 1 } }, titleData && (React.createElement(Title$1, { title: titleData.name, icon: titleData.icon, headTitle: titleData.parentName, headIcon: titleData.parentIcon }))),
285
- appBarControl)),
286
- React.createElement(material.Box, { component: 'nav', "aria-label": 'mailbox folders', sx: sideMenuContainerBoxSx },
287
- React.createElement(StyledSideMenuTemporaryDrawer, { variant: 'temporary', open: isMobileOpen, onClose: toggleIsMobileOpen, sx: sideMenuTemporaryDrawerSx, ModalProps: {
288
- keepMounted: true, // Better open performance on mobile.
289
- } }, menu && React.createElement(SideMenu$1, { logo: logo, badgeVariant: badgeVariant, list: menu })),
290
- React.createElement(StyledSideMenuPermanentDrawer, { variant: 'permanent', open: true, sx: sideMenuPermanentDrawerSx }, menu && React.createElement(SideMenu$1, { logo: logo, badgeVariant: badgeVariant, list: menu }))),
291
- React.createElement(material.Box, { component: 'main', sx: mainBoxSx },
292
- React.createElement(material.Toolbar, null),
293
- React.createElement(StyledMainContentDiv, null, children))));
597
+ $[13] = nextMenuScreen;
598
+ $[14] = t10;
599
+ } else {
600
+ t10 = $[14];
601
+ }
602
+ var appBarSx = t10;
603
+ var t11;
604
+ if ($[15] !== nextMenuScreen) {
605
+ t11 = {
606
+ mr: 2,
607
+ display: _defineProperty({}, nextMenuScreen, "none")
608
+ };
609
+ $[15] = nextMenuScreen;
610
+ $[16] = t11;
611
+ } else {
612
+ t11 = $[16];
613
+ }
614
+ var appBarIconButtonSx = t11;
615
+ var t12;
616
+ if ($[17] !== nextMenuScreen) {
617
+ t12 = {
618
+ width: _defineProperty({}, nextMenuScreen, SIDE_MENU_WIDTH),
619
+ flexShrink: _defineProperty({}, nextMenuScreen, 0)
620
+ };
621
+ $[17] = nextMenuScreen;
622
+ $[18] = t12;
623
+ } else {
624
+ t12 = $[18];
625
+ }
626
+ var sideMenuContainerBoxSx = t12;
627
+ var t13;
628
+ if ($[19] !== nextMenuScreen) {
629
+ t13 = {
630
+ width: _defineProperty({}, nextMenuScreen, "calc(100% - ".concat(SIDE_MENU_WIDTH, "px)")),
631
+ flexGrow: 1,
632
+ p: 2,
633
+ display: "flex",
634
+ flexDirection: "column",
635
+ minHeight: "100vh"
636
+ };
637
+ $[19] = nextMenuScreen;
638
+ $[20] = t13;
639
+ } else {
640
+ t13 = $[20];
641
+ }
642
+ var mainBoxSx = t13;
643
+ var titleData = menuTitles[location.pathname];
644
+ var t14;
645
+ if ($[21] !== appBarControl || $[22] !== appBarIconButtonSx || $[23] !== appBarSx || $[24] !== badgeVariant || $[25] !== children || $[26] !== isMobileOpen || $[27] !== logo || $[28] !== mainBoxSx || $[29] !== menu || $[30] !== sideMenuContainerBoxSx || $[31] !== sideMenuPermanentDrawerSx || $[32] !== sideMenuTemporaryDrawerSx || $[33] !== titleData) {
646
+ var t15;
647
+ if ($[35] !== appBarControl || $[36] !== appBarIconButtonSx || $[37] !== appBarSx || $[38] !== titleData) {
648
+ var _t;
649
+ if ($[40] !== appBarSx) {
650
+ _t = {
651
+ position: "fixed",
652
+ elevation: 0,
653
+ sx: appBarSx
654
+ };
655
+ $[40] = appBarSx;
656
+ $[41] = _t;
657
+ } else {
658
+ _t = $[41];
659
+ }
660
+ var _t2;
661
+ if ($[42] !== appBarControl || $[43] !== appBarIconButtonSx || $[44] !== titleData) {
662
+ var t18;
663
+ if ($[46] !== appBarIconButtonSx) {
664
+ var _t3;
665
+ if ($[48] === Symbol["for"]("react.memo_cache_sentinel")) {
666
+ _t3 = /*#__PURE__*/React.createElement(iconsMaterial.Menu, null);
667
+ $[48] = _t3;
668
+ } else {
669
+ _t3 = $[48];
670
+ }
671
+ t18 = /*#__PURE__*/React.createElement(material.IconButton, {
672
+ color: "inherit",
673
+ "aria-label": "open drawer",
674
+ edge: "start",
675
+ onClick: toggleIsMobileOpen,
676
+ sx: appBarIconButtonSx
677
+ }, _t3);
678
+ $[46] = appBarIconButtonSx;
679
+ $[47] = t18;
680
+ } else {
681
+ t18 = $[47];
682
+ }
683
+ var t19;
684
+ if ($[49] !== titleData) {
685
+ var t20;
686
+ if ($[51] === Symbol["for"]("react.memo_cache_sentinel")) {
687
+ t20 = {
688
+ variant: "h6",
689
+ noWrap: true,
690
+ component: "div",
691
+ sx: {
692
+ flexGrow: 1
693
+ }
694
+ };
695
+ $[51] = t20;
696
+ } else {
697
+ t20 = $[51];
698
+ }
699
+ t19 = /*#__PURE__*/React.createElement(material.Typography, t20, titleData && /*#__PURE__*/React.createElement(Title$1, {
700
+ title: titleData.name,
701
+ icon: titleData.icon,
702
+ headTitle: titleData.parentName,
703
+ headIcon: titleData.parentIcon
704
+ }));
705
+ $[49] = titleData;
706
+ $[50] = t19;
707
+ } else {
708
+ t19 = $[50];
709
+ }
710
+ _t2 = /*#__PURE__*/React.createElement(material.Toolbar, null, t18, t19, appBarControl);
711
+ $[42] = appBarControl;
712
+ $[43] = appBarIconButtonSx;
713
+ $[44] = titleData;
714
+ $[45] = _t2;
715
+ } else {
716
+ _t2 = $[45];
717
+ }
718
+ t15 = /*#__PURE__*/React.createElement(StyledAppBar, _t, _t2);
719
+ $[35] = appBarControl;
720
+ $[36] = appBarIconButtonSx;
721
+ $[37] = appBarSx;
722
+ $[38] = titleData;
723
+ $[39] = t15;
724
+ } else {
725
+ t15 = $[39];
726
+ }
727
+ var t16;
728
+ if ($[52] !== badgeVariant || $[53] !== isMobileOpen || $[54] !== logo || $[55] !== menu || $[56] !== sideMenuContainerBoxSx || $[57] !== sideMenuPermanentDrawerSx || $[58] !== sideMenuTemporaryDrawerSx) {
729
+ var _t4;
730
+ if ($[60] !== sideMenuContainerBoxSx) {
731
+ _t4 = {
732
+ component: "nav",
733
+ "aria-label": "mailbox folders",
734
+ sx: sideMenuContainerBoxSx
735
+ };
736
+ $[60] = sideMenuContainerBoxSx;
737
+ $[61] = _t4;
738
+ } else {
739
+ _t4 = $[61];
740
+ }
741
+ var _t5;
742
+ if ($[62] !== badgeVariant || $[63] !== isMobileOpen || $[64] !== logo || $[65] !== menu || $[66] !== sideMenuTemporaryDrawerSx) {
743
+ var _t6;
744
+ if ($[68] === Symbol["for"]("react.memo_cache_sentinel")) {
745
+ _t6 = {
746
+ keepMounted: true
747
+ };
748
+ $[68] = _t6;
749
+ } else {
750
+ _t6 = $[68];
751
+ }
752
+ var _t7;
753
+ if ($[69] !== isMobileOpen || $[70] !== sideMenuTemporaryDrawerSx) {
754
+ _t7 = {
755
+ variant: "temporary",
756
+ open: isMobileOpen,
757
+ onClose: toggleIsMobileOpen,
758
+ sx: sideMenuTemporaryDrawerSx,
759
+ ModalProps: _t6
760
+ };
761
+ $[69] = isMobileOpen;
762
+ $[70] = sideMenuTemporaryDrawerSx;
763
+ $[71] = _t7;
764
+ } else {
765
+ _t7 = $[71];
766
+ }
767
+ var t21;
768
+ if ($[72] !== badgeVariant || $[73] !== logo || $[74] !== menu) {
769
+ t21 = menu && /*#__PURE__*/React.createElement(SideMenu$1, {
770
+ logo: logo,
771
+ badgeVariant: badgeVariant,
772
+ list: menu
773
+ });
774
+ $[72] = badgeVariant;
775
+ $[73] = logo;
776
+ $[74] = menu;
777
+ $[75] = t21;
778
+ } else {
779
+ t21 = $[75];
780
+ }
781
+ _t5 = /*#__PURE__*/React.createElement(StyledSideMenuTemporaryDrawer, _t7, t21);
782
+ $[62] = badgeVariant;
783
+ $[63] = isMobileOpen;
784
+ $[64] = logo;
785
+ $[65] = menu;
786
+ $[66] = sideMenuTemporaryDrawerSx;
787
+ $[67] = _t5;
788
+ } else {
789
+ _t5 = $[67];
790
+ }
791
+ var _t8;
792
+ if ($[76] !== badgeVariant || $[77] !== logo || $[78] !== menu || $[79] !== sideMenuPermanentDrawerSx) {
793
+ var _t9;
794
+ if ($[81] !== sideMenuPermanentDrawerSx) {
795
+ _t9 = {
796
+ variant: "permanent",
797
+ open: true,
798
+ sx: sideMenuPermanentDrawerSx
799
+ };
800
+ $[81] = sideMenuPermanentDrawerSx;
801
+ $[82] = _t9;
802
+ } else {
803
+ _t9 = $[82];
804
+ }
805
+ var _t0;
806
+ if ($[83] !== badgeVariant || $[84] !== logo || $[85] !== menu) {
807
+ _t0 = menu && /*#__PURE__*/React.createElement(SideMenu$1, {
808
+ logo: logo,
809
+ badgeVariant: badgeVariant,
810
+ list: menu
811
+ });
812
+ $[83] = badgeVariant;
813
+ $[84] = logo;
814
+ $[85] = menu;
815
+ $[86] = _t0;
816
+ } else {
817
+ _t0 = $[86];
818
+ }
819
+ _t8 = /*#__PURE__*/React.createElement(StyledSideMenuPermanentDrawer, _t9, _t0);
820
+ $[76] = badgeVariant;
821
+ $[77] = logo;
822
+ $[78] = menu;
823
+ $[79] = sideMenuPermanentDrawerSx;
824
+ $[80] = _t8;
825
+ } else {
826
+ _t8 = $[80];
827
+ }
828
+ t16 = /*#__PURE__*/React.createElement(material.Box, _t4, _t5, _t8);
829
+ $[52] = badgeVariant;
830
+ $[53] = isMobileOpen;
831
+ $[54] = logo;
832
+ $[55] = menu;
833
+ $[56] = sideMenuContainerBoxSx;
834
+ $[57] = sideMenuPermanentDrawerSx;
835
+ $[58] = sideMenuTemporaryDrawerSx;
836
+ $[59] = t16;
837
+ } else {
838
+ t16 = $[59];
839
+ }
840
+ var t17;
841
+ if ($[87] !== children || $[88] !== mainBoxSx) {
842
+ var _t1;
843
+ if ($[90] !== mainBoxSx) {
844
+ _t1 = {
845
+ component: "main",
846
+ sx: mainBoxSx
847
+ };
848
+ $[90] = mainBoxSx;
849
+ $[91] = _t1;
850
+ } else {
851
+ _t1 = $[91];
852
+ }
853
+ var _t10;
854
+ if ($[92] === Symbol["for"]("react.memo_cache_sentinel")) {
855
+ _t10 = /*#__PURE__*/React.createElement(material.Toolbar, null);
856
+ $[92] = _t10;
857
+ } else {
858
+ _t10 = $[92];
859
+ }
860
+ var _t11;
861
+ if ($[93] !== children) {
862
+ _t11 = /*#__PURE__*/React.createElement(StyledMainContentDiv, null, children);
863
+ $[93] = children;
864
+ $[94] = _t11;
865
+ } else {
866
+ _t11 = $[94];
867
+ }
868
+ t17 = /*#__PURE__*/React.createElement(material.Box, _t1, _t10, _t11);
869
+ $[87] = children;
870
+ $[88] = mainBoxSx;
871
+ $[89] = t17;
872
+ } else {
873
+ t17 = $[89];
874
+ }
875
+ t14 = /*#__PURE__*/React.createElement(StyledContainerBox, null, t15, t16, t17);
876
+ $[21] = appBarControl;
877
+ $[22] = appBarIconButtonSx;
878
+ $[23] = appBarSx;
879
+ $[24] = badgeVariant;
880
+ $[25] = children;
881
+ $[26] = isMobileOpen;
882
+ $[27] = logo;
883
+ $[28] = mainBoxSx;
884
+ $[29] = menu;
885
+ $[30] = sideMenuContainerBoxSx;
886
+ $[31] = sideMenuPermanentDrawerSx;
887
+ $[32] = sideMenuTemporaryDrawerSx;
888
+ $[33] = titleData;
889
+ $[34] = t14;
890
+ } else {
891
+ t14 = $[34];
892
+ }
893
+ return t14;
294
894
  };
295
895
  /********************************************************************************************************************
296
896
  * Styled Components
297
897
  * ******************************************************************************************************************/
298
- const StyledContainerBox = material.styled(material.Box) `
299
- display: flex;
300
- height: 100%;
301
- `;
302
- const StyledAppBar = material.styled(material.AppBar)(({ theme }) => theme.unstable_sx({
898
+ var StyledContainerBox = material.styled(material.Box)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n height: 100%;\n"])));
899
+ var StyledAppBar = material.styled(material.AppBar)(function (_ref) {
900
+ var theme = _ref.theme;
901
+ return theme.unstable_sx({
303
902
  backdropFilter: 'blur(20px)',
304
903
  backgroundColor: 'rgba(255, 255, 255, 0.7)',
305
904
  color: 'text.primary',
306
- borderBottom: 'thin solid #f5f5f5',
307
- }));
308
- const StyledSideMenuTemporaryDrawer = material.styled(material.Drawer)(({ theme }) => theme.unstable_sx({
309
- '& .MuiDrawer-paper': { boxSizing: 'border-box', width: SIDE_MENU_WIDTH },
310
- }));
311
- const StyledSideMenuPermanentDrawer = material.styled(material.Drawer)(({ theme }) => theme.unstable_sx({
312
- '& .MuiDrawer-paper': { boxSizing: 'border-box', width: SIDE_MENU_WIDTH },
313
- }));
314
- const StyledMainContentDiv = material.styled('div') `
315
- display: flex;
316
- flex-direction: column;
317
- flex: 1;
318
- `;exports.CardLayout=CardLayout;exports.DefaultLayout=DefaultLayout;
905
+ borderBottom: 'thin solid #f5f5f5'
906
+ });
907
+ });
908
+ var StyledSideMenuTemporaryDrawer = material.styled(material.Drawer)(function (_ref2) {
909
+ var theme = _ref2.theme;
910
+ return theme.unstable_sx({
911
+ '& .MuiDrawer-paper': {
912
+ boxSizing: 'border-box',
913
+ width: SIDE_MENU_WIDTH
914
+ }
915
+ });
916
+ });
917
+ var StyledSideMenuPermanentDrawer = material.styled(material.Drawer)(function (_ref3) {
918
+ var theme = _ref3.theme;
919
+ return theme.unstable_sx({
920
+ '& .MuiDrawer-paper': {
921
+ boxSizing: 'border-box',
922
+ width: SIDE_MENU_WIDTH
923
+ }
924
+ });
925
+ });
926
+ var StyledMainContentDiv = material.styled('div')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n flex: 1;\n"])));
927
+ function _temp(isMobileOpen_0) {
928
+ return !isMobileOpen_0;
929
+ }exports.CardLayout=CardLayout;exports.DefaultLayout=DefaultLayout;