@m4l/styles 0.0.19 → 0.0.21

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 (31) hide show
  1. package/index.js +19 -19
  2. package/package.json +1 -1
  3. package/theme/{defaultThemeOptions.d67fe64c.js → defaultThemeOptions.81e20130.js} +5 -5
  4. package/theme/index.38ad102a.js +7 -0
  5. package/theme/overrides/M4LExtendedComponents/M4LAppBar.d.ts +237 -67
  6. package/theme/overrides/M4LExtendedComponents/M4LAreasAdmin.d.ts +1151 -336
  7. package/theme/overrides/M4LExtendedComponents/M4LAreasViewer.d.ts +116 -63
  8. package/theme/overrides/M4LExtendedComponents/M4LCommonActions.d.ts +1 -0
  9. package/theme/overrides/M4LExtendedComponents/M4LDynamicFilter.d.ts +245 -8
  10. package/theme/overrides/M4LExtendedComponents/M4LSideBar.d.ts +46 -12
  11. package/theme/overrides/M4LExtendedComponents/M4LTab.d.ts +8 -4
  12. package/theme/overrides/M4LExtendedComponents/{index.bd713d88.js → index.9ecb9eb5.js} +524 -289
  13. package/theme/overrides/M4LRHFComponents/M4LRHFAutocomplete.d.ts +17 -3
  14. package/theme/overrides/M4LRHFComponents/{index.1406e2ed.js → index.e3118e8b.js} +25 -11
  15. package/theme/overrides/MUIComponents/Button.d.ts +3 -1
  16. package/theme/overrides/MUIComponents/Input.d.ts +16 -3
  17. package/theme/overrides/MUIComponents/Tabs.d.ts +2 -0
  18. package/theme/overrides/MUIComponents/{index.e3d060c3.js → index.25926753.js} +50 -32
  19. package/theme/overrides/{index.6b7aec0f.js → index.05460ef6.js} +3 -3
  20. package/theme/{palette.95c4f9c8.js → palette.ad96498c.js} +114 -114
  21. package/theme/palette.d.ts +6 -6
  22. package/theme/{shadows.354bbb03.js → shadows.c56e8ae9.js} +1 -1
  23. package/theme/{typography.61f909b7.js → typography.39389e10.js} +4 -4
  24. package/types/types.d.ts +1 -1
  25. package/utils/getColorPresets.82f91ceb.js +70 -0
  26. package/utils/getColorPresets.d.ts +1 -1
  27. package/utils/getColorState.0e5b3a7c.js +172 -0
  28. package/utils/getColorState.d.ts +1 -0
  29. package/theme/index.efa44d2d.js +0 -7
  30. package/utils/getColorPresets.d73f30ad.js +0 -70
  31. package/utils/getColorState.bde51cf7.js +0 -159
package/theme/overrides/M4LExtendedComponents/{index.bd713d88.js → index.9ecb9eb5.js} RENAMED
@@ -10,13 +10,28 @@ const i = (o) => ({
10
10
  padding: "0px",
11
11
  border: "1px solid",
12
12
  borderColor: o.palette.background.background,
13
+ overflow: "hidden",
14
+ [o.breakpoints.down("sm")]: {
15
+ gap: "0px"
16
+ },
13
17
  "& .M4LDynamicFilter-containerFistRow": {
14
18
  height: "32px",
15
19
  width: "100%",
20
+ [o.breakpoints.down("sm")]: {
21
+ height: "fit-content",
22
+ background: o.palette.background.neutral,
23
+ display: "flex",
24
+ flexDirection: "row",
25
+ alignItems: "center",
26
+ justifyContent: "center"
27
+ },
16
28
  "& .M4LDynamicFilter-containerInputFilter": {
17
29
  width: "100%",
18
30
  alignItems: "center",
19
- maxWidth: "100%"
31
+ maxWidth: "100%",
32
+ [o.breakpoints.down("sm")]: {
33
+ height: "44px"
34
+ }
20
35
  }
21
36
  },
22
37
  "&.M4LDynamicFilter-isInvalid": {
@@ -27,7 +42,11 @@ const i = (o) => ({
27
42
  flexDirection: "row",
28
43
  gap: "4px",
29
44
  backgroundColor: o.palette.background.neutral,
30
- padding: "4px"
45
+ padding: "4px",
46
+ [o.breakpoints.down("sm")]: {
47
+ gap: "12px",
48
+ padding: "8px"
49
+ }
31
50
  },
32
51
  "& .M4LDynamicFilter-containerInputFilter": {
33
52
  display: "flex",
@@ -61,7 +80,11 @@ const i = (o) => ({
61
80
  },
62
81
  "& .M4LDynamicFilter-wrapperApplyedFilters": {
63
82
  borderLeft: "none",
64
- height: "29px"
83
+ height: "29px",
84
+ [o.breakpoints.down("sm")]: {
85
+ height: "100%",
86
+ padding: "4px 8px 4px 8px"
87
+ }
65
88
  },
66
89
  "& .M4LDynamicFilter-containerApplyedFilters": {
67
90
  padding: "2px"
@@ -89,14 +112,29 @@ const i = (o) => ({
89
112
  styleOverrides: {
90
113
  "&.M4LDynamicFilter-popoverMenuFields": {
91
114
  "& .M4LDynamicFilter-popoverMenuFieldsPaper": {
92
- "& .M4LDynamicFilter-classespopoverLabelMemuItem": {
93
- ...o.typography.body,
94
- color: o.palette.text.secondary
95
- },
96
- "& .M4LDynamicFilter-popoverMenuFieldsItem:hover": {
97
- ...o.typography.body,
98
- color: o.palette.state.hover,
99
- background: o.palette.state.default
115
+ display: "flex",
116
+ flexDirection: "column",
117
+ padding: "4px",
118
+ gap: "4px",
119
+ borderRadius: "6px",
120
+ borderTop: "1.5px solid",
121
+ borderColor: o.palette.state.borderTop,
122
+ "& .M4LDynamicFilter-popoverMenuFieldsItem": {
123
+ paddingLeft: "8px",
124
+ paddingRight: "12px",
125
+ borderRadius: "4px",
126
+ "& .M4LDynamicFilter-classespopoverLabelMemuItem": {
127
+ ...o.typography.body,
128
+ color: o.palette.text.primary
129
+ },
130
+ "& .M4LDynamicFilter-popoverMenuFieldsItem:hover": {
131
+ ...o.typography.body,
132
+ color: o.palette.state.hover,
133
+ background: o.palette.state.default,
134
+ borderRadius: "4px",
135
+ padding: "4px 12px 4px 8px",
136
+ boxShadow: o.customShadows.z2
137
+ }
100
138
  }
101
139
  }
102
140
  }
@@ -108,22 +146,24 @@ const i = (o) => ({
108
146
  width: "auto",
109
147
  "& .M4LDynamicFilter-popoverFilterPaper": {
110
148
  padding: "0px",
111
- width: "200px",
149
+ minWidth: "220px",
112
150
  "& .M4LPopover-arrowStyle": {
113
151
  background: "none"
114
152
  },
115
153
  "& .M4LRHFormProvider-root": {
116
154
  gap: "0px",
117
- widht: "100%",
155
+ widht: "max-content",
118
156
  minWidht: "220px",
119
157
  "& .M4LDynamicFilter-popoverFilterHeader": {
120
158
  background: o.palette.state.default,
121
159
  display: "flex",
122
- gap: "4px",
123
- padding: "8px",
160
+ gap: "8px",
161
+ padding: "6px 8px 6px 8px",
124
162
  borderRadius: "4px",
125
- boxShadow: o.customShadows.z2,
163
+ boxShadow: o.customShadows.z1,
126
164
  borderBottom: "0px",
165
+ borderTop: "1.5px solid",
166
+ borderColor: o.palette.state.borderTop,
127
167
  "& .MuiTypography-root": {
128
168
  ...o.typography.bodyDens,
129
169
  color: o.palette.text.primary
@@ -141,11 +181,11 @@ const i = (o) => ({
141
181
  gap: "8px"
142
182
  }
143
183
  },
144
- "& .M4LCommonActions-wrapperActions": {
184
+ "& .M4LCommonActions-root": {
145
185
  display: "flex",
146
186
  flexDirection: "row",
147
187
  gap: "12px",
148
- padding: "20px 8px 12px 0px",
188
+ padding: "20px 8px 8px 0px",
149
189
  ".M4LButton-root": {
150
190
  width: "fit-content"
151
191
  }
@@ -239,10 +279,10 @@ const i = (o) => ({
239
279
  minHeight: "26px"
240
280
  },
241
281
  ".M4LIconButton-sizeMedium&::before": {
242
- width: "30px",
243
- height: "30px",
244
- minWidth: "30px",
245
- minHeight: "30px"
282
+ width: "38px",
283
+ height: "38px",
284
+ minWidth: "38px",
285
+ minHeight: "38px"
246
286
  },
247
287
  "&.M4LIconButton-sizeExtraSmall": {
248
288
  width: "20px",
@@ -257,10 +297,10 @@ const i = (o) => ({
257
297
  minHeight: "24px"
258
298
  },
259
299
  "&.M4LIconButton-sizeMedium": {
260
- width: "28px",
261
- height: "28px",
262
- minWidth: "28px",
263
- minHeight: "28px"
300
+ width: "36px",
301
+ height: "36px",
302
+ minWidth: "36px",
303
+ minHeight: "36px"
264
304
  },
265
305
  "& .MuiIconButton-root": {
266
306
  position: "static",
@@ -941,7 +981,7 @@ const i = (o) => ({
941
981
  }
942
982
  }
943
983
  }
944
- }), L = (o) => ({
984
+ }), y = (o) => ({
945
985
  M4LSideBar: {
946
986
  styleOverrides: {
947
987
  "&.M4LSideBar-root": {
@@ -951,6 +991,13 @@ const i = (o) => ({
951
991
  paddingLeft: "14px",
952
992
  paddingBottom: "14px",
953
993
  boxShadow: o.customShadows.z3,
994
+ "&.M4LSideBar-collapsed": {
995
+ "& .M4LImage-root": {
996
+ minWidth: "44px !important",
997
+ minHeight: "44px !important",
998
+ background: "red"
999
+ }
1000
+ },
954
1001
  [o.breakpoints.down("sm")]: {
955
1002
  width: "0px",
956
1003
  height: "0px",
@@ -959,21 +1006,19 @@ const i = (o) => ({
959
1006
  "& .M4LSideBar-wrapperSideBar": {
960
1007
  height: "100%",
961
1008
  "& .M4LSideBar-containerSideBarLogo": {
962
- marginRight: "14px",
1009
+ display: "flex",
1010
+ justifyContent: "flex-start",
963
1011
  "& .M4LSideBar-containerLogo": {
964
- height: "128px",
965
1012
  display: "flex",
966
- flexDirection: "column",
967
1013
  justifyContent: "center",
968
1014
  alignItems: "center",
969
1015
  fitContent: "100%",
970
1016
  boxSizing: "contentBox",
971
1017
  paddingTop: "24px",
972
1018
  paddingBottom: "28px",
973
- gap: "12px",
1019
+ gap: "24px",
974
1020
  "& .M4LTypography-root": {
975
1021
  display: "flex",
976
- justifyContent: "center",
977
1022
  width: "100%",
978
1023
  "& .MuiTypography-root": {
979
1024
  with: "100%",
@@ -1023,7 +1068,7 @@ const i = (o) => ({
1023
1068
  borderRadius: "4px 0px 0px 4px",
1024
1069
  justifyContent: "center",
1025
1070
  flexDirection: "column",
1026
- gap: "8px",
1071
+ padding: "0px 0px 8px 0px",
1027
1072
  "& .M4LSideBar-navItemMainRoot": {
1028
1073
  backgroundColor: "transparent",
1029
1074
  "&:hover": {
@@ -1094,14 +1139,20 @@ const i = (o) => ({
1094
1139
  },
1095
1140
  "& .M4LSideBar-navListSubItemRoot": {
1096
1141
  "& .M4LSideBar-navSubItemContentRoot ": {
1142
+ width: "100%",
1143
+ height: "36px",
1144
+ borderRadius: "4px",
1145
+ gap: "8px",
1097
1146
  "&.M4LSideBar-subItemCollapseActive": {
1098
- backgroundColor: o.palette.state.active12
1147
+ backgroundColor: o.palette.state.active12,
1148
+ gap: "8px"
1099
1149
  },
1100
1150
  "&.M4LSideBar-subItemActive": {
1101
1151
  "& .M4LSideBar-navSubItemContentBullet": {
1102
1152
  height: "14px",
1103
- borderRadius: "10px",
1104
- backgroundColor: o.palette.state.focus
1153
+ borderRadius: "4px",
1154
+ backgroundColor: o.palette.state.focus,
1155
+ gap: "8px"
1105
1156
  }
1106
1157
  },
1107
1158
  "&:hover": {
@@ -1110,7 +1161,7 @@ const i = (o) => ({
1110
1161
  },
1111
1162
  "& .M4LSideBar-navSubItemContentRoot": {
1112
1163
  gap: "12px",
1113
- margin: "0px 0px 1px 0px",
1164
+ margin: "0px 0px 8px 0px",
1114
1165
  padding: "16px",
1115
1166
  "& .M4LSideBar-navSubItemContentBullet": {
1116
1167
  minWidth: "5px",
@@ -1133,7 +1184,7 @@ const i = (o) => ({
1133
1184
  }
1134
1185
  },
1135
1186
  "& .MuiCollapse-root": {
1136
- marginLeft: "28px"
1187
+ marginLeft: "18px"
1137
1188
  }
1138
1189
  }
1139
1190
  },
@@ -1179,9 +1230,9 @@ const i = (o) => ({
1179
1230
  styleOverrides: {
1180
1231
  "&.M4LSideBar-popover": {
1181
1232
  "& .M4LSideBar-navListSubItemRoot": {
1182
- "& .M4LSideBar-navSubItemContentRoot ": {
1233
+ "& .M4LSideBar-navSubItemContentRoot": {
1183
1234
  gap: "12px",
1184
- margin: "0px 0px 1px 0px",
1235
+ margin: "0px 0px 8px 0px",
1185
1236
  padding: "16px",
1186
1237
  "&.M4LSideBar-subItemCollapseActive": {
1187
1238
  backgroundColor: o.palette.state.active12
@@ -1292,7 +1343,7 @@ const i = (o) => ({
1292
1343
  borderRadius: "4px 0px 0px 4px",
1293
1344
  justifyContent: "center",
1294
1345
  flexDirection: "column",
1295
- gap: "8px",
1346
+ padding: "0px 0px 8px 0px",
1296
1347
  "& .M4LSideBar-navItemMainRoot": {
1297
1348
  backgroundColor: "transparent",
1298
1349
  "&:hover": {
@@ -1397,7 +1448,7 @@ const i = (o) => ({
1397
1448
  }
1398
1449
  },
1399
1450
  "& .MuiCollapse-root": {
1400
- marginLeft: "28px"
1451
+ marginLeft: "12px"
1401
1452
  }
1402
1453
  }
1403
1454
  },
@@ -1430,160 +1481,252 @@ const i = (o) => ({
1430
1481
  }
1431
1482
  }
1432
1483
  }
1433
- }), y = (o) => ({
1484
+ }), L = (o) => ({
1434
1485
  M4LAreasAdmin: {
1435
1486
  styleOverrides: {
1436
1487
  "&.M4LAreasAdmin-root": {
1437
1488
  flex: 1,
1489
+ display: "flex",
1490
+ flexDirection: "row",
1438
1491
  overflow: "auto",
1439
1492
  height: "auto",
1440
1493
  borderRadius: "6px",
1441
- paddingRight: "4px",
1494
+ paddingRight: "6px",
1442
1495
  alignItems: "center",
1443
1496
  background: o.palette.background.default,
1444
1497
  boxShadow: o.customShadows.z2,
1498
+ justifyContent: "space-between",
1499
+ width: "fit-content",
1500
+ maxWidth: "fit-content",
1501
+ gap: "8px",
1502
+ borderTop: "1.5px solid",
1503
+ borderColor: o.palette.state.borderTop,
1445
1504
  [o.breakpoints.down("sm")]: {
1446
- height: "auto"
1505
+ height: "auto",
1506
+ background: "none",
1507
+ width: "100%",
1508
+ maxWidth: "100%"
1447
1509
  },
1448
- "& .M4LAreasAdmin-areasAddButton": {
1449
- backgroundColor: `${o.palette.state.active}!important`,
1450
- "& .M4LIcon-icon": {
1451
- backgroundColor: `${o.palette.patronus?.marbleLight[10]}!important`
1452
- }
1510
+ "*::-webkit-scrollbar": {
1511
+ width: "8px",
1512
+ maxWidth: "12px",
1513
+ height: "6px",
1514
+ background: o.palette.state.default,
1515
+ position: "absolute",
1516
+ zIndex: "10000"
1453
1517
  },
1454
- "& .M4LAreasAdmin-areaIconLayer": {
1455
- background: o.palette.background.neutral,
1456
- boxShadow: o.customShadows.z2,
1457
- display: "flex",
1458
- justifyContent: "center",
1459
- width: "36px",
1460
- height: "36px",
1461
- [o.breakpoints.down("sm")]: {
1462
- height: "36px",
1463
- width: "36px"
1464
- },
1465
- "& .M4LIcon-root": {
1466
- width: "36px"
1467
- }
1518
+ "*::-webkit-scrollbar-thumb": {
1519
+ background: o.palette.text.disabled,
1520
+ position: "absolute",
1521
+ borderRadius: "4px",
1522
+ zIndex: "10000"
1468
1523
  },
1469
- "& .M4LAreasAdmin-areaContainerChips": {
1524
+ "& .M4LAreasAdmin-areaContainerChipsIcon": {
1470
1525
  display: "flex",
1526
+ flexDirection: "row",
1527
+ width: "100%",
1471
1528
  overflow: "auto",
1472
- gap: "8px",
1473
- padding: "4px 8px 4px 8px",
1474
- width: "70%",
1475
- height: "auto",
1476
- alignItems: "center",
1477
- "& .M4LAreasAdmin-areaChipMobileRoot": {
1478
- display: "flex",
1479
- overflow: "hidden",
1480
- width: "100%",
1481
- backgroundColor: o.palette.state.active,
1482
- borderRadius: "4px",
1483
- "& .M4LAreasAdmin-areaChipRoot ": {
1484
- margin: "0px",
1485
- borderRadius: "4px 0px 0px 4px",
1486
- overflow: "hidden",
1487
- width: "100%"
1488
- }
1489
- },
1490
- "& .M4LAreasAdmin-areaChipMobileIconContainer": {
1529
+ height: "36px",
1530
+ borderRight: "1px solid",
1531
+ borderColor: o.palette.state.overdefoult,
1532
+ "& .M4LAreasAdmin-areaIconLayer": {
1533
+ background: o.palette.background.neutral,
1534
+ boxShadow: o.customShadows.z2,
1491
1535
  display: "flex",
1492
- alignItems: "center",
1493
- borderRadius: "0px 4px 4px 0px",
1494
- background: o.palette.state.active,
1495
- ...o.typography.body,
1496
- color: o.palette.text.primary,
1497
- "& .M4LIconButton-root": {
1498
- backgroundColor: `${o.palette.state.active}!important`,
1499
- borderLeft: "1px solid",
1500
- borderColor: o.palette.patronus?.marbleLight[10],
1501
- borderRadius: "0px",
1502
- "& .M4LIcon-icon": {
1503
- backgroundColor: `${o.palette.patronus?.marbleLight[10]}!important`
1504
- }
1536
+ justifyContent: "center",
1537
+ width: "36px",
1538
+ height: "36px",
1539
+ [o.breakpoints.down("sm")]: {
1540
+ height: "36px",
1541
+ width: "36px"
1542
+ },
1543
+ "& .M4LIcon-root": {
1544
+ width: "36px",
1545
+ height: "100%"
1505
1546
  }
1506
1547
  },
1507
- "& .MuiBox-root": {
1508
- display: "flex",
1509
- alignItems: "center",
1510
- height: "100%"
1511
- },
1512
- "& .simplebar-content": {
1513
- display: "flex",
1514
- alignItems: "center"
1515
- },
1516
- "& .M4LAreasAdmin-areaChipRoot ": {
1548
+ "& .M4LAreasAdmin-areaContainerChips": {
1517
1549
  display: "flex",
1518
- boxShadow: o.customShadows.z1,
1519
- borderRadius: "4px 4px 4px 4px",
1520
- marginRight: "8px",
1521
- height: "auto",
1522
- width: "auto",
1550
+ overflow: "auto",
1523
1551
  gap: "8px",
1524
- paddingLeft: "8px",
1552
+ padding: "0",
1553
+ width: "fit-content",
1554
+ height: "auto",
1525
1555
  alignItems: "center",
1526
- borderTop: "1px solid",
1527
- borderColor: o.palette.state.default,
1528
- background: o.palette.state.default,
1529
- "& .M4LAreasAdmin-areaContainerChipEditButton": {
1530
- display: "flex"
1531
- },
1532
- [o.breakpoints.down("sm")]: {
1533
- height: "auto"
1534
- },
1535
- "&.M4LAreasAdmin-selected": {
1536
- background: o.palette.state.active,
1537
- ...o.typography.body,
1538
- color: o.palette.text.primary,
1539
- "& .M4LAreasAdmin-areaChipTitle": {
1540
- backgroundColor: "transparent",
1541
- border: "none",
1542
- textWrap: "nowrap",
1543
- width: "auto",
1556
+ "& .M4LAreasAdmin-areaContainerContentChips": {
1557
+ display: "flex",
1558
+ flexDirection: "row",
1559
+ width: "fit-content",
1560
+ justifyContent: "space-between",
1561
+ [o.breakpoints.down("sm")]: {
1562
+ justifyContent: "space-between",
1563
+ width: "100%"
1564
+ },
1565
+ "& .css-jjtu05": {
1566
+ "& .css-16ugaun": {},
1567
+ "& .simplebar-wrapper": {
1568
+ width: "fit-content",
1569
+ maxWidth: "100%",
1570
+ "& .simplebar-height-auto-observer-wrapper": {
1571
+ width: "fit-content",
1572
+ maxWidth: "100%",
1573
+ overflow: "auto"
1574
+ },
1575
+ "& .simplebar-mask": {
1576
+ "& .simplebar-offset": {
1577
+ "& .simplebar-content-wrapper": {
1578
+ width: "fit-content",
1579
+ maxWidth: "100%",
1580
+ overflow: "auto",
1581
+ "& .simplebar-content": {
1582
+ width: "fit-content",
1583
+ overflow: "auto",
1584
+ gap: "4px"
1585
+ }
1586
+ }
1587
+ }
1588
+ }
1589
+ }
1590
+ },
1591
+ "& .simplebar-content-wrapper": {
1592
+ width: "fit-content",
1593
+ "& .M4LAreasAdmin-areaChipRoot ": {
1594
+ margin: "0px",
1595
+ borderRadius: "4px",
1596
+ overflow: "hidden",
1597
+ width: "fit-content"
1598
+ }
1599
+ },
1600
+ "& .M4LAreasAdmin-areaChipMobileRoot": {
1544
1601
  display: "flex",
1545
- alignItems: "center",
1546
- color: o.palette.patronus?.marbleLight[10],
1547
- ...o.typography.action,
1548
- [o.breakpoints.down("sm")]: {
1549
- display: "inline",
1550
- fontSize: "14px",
1551
- textOverflow: "ellipsis",
1602
+ overflow: "hidden",
1603
+ width: "100%",
1604
+ backgroundColor: o.palette.state.active,
1605
+ borderRadius: "4px",
1606
+ "& .M4LAreasAdmin-areaChipRoot ": {
1607
+ margin: "0px",
1608
+ borderRadius: "4px 0px 0px 4px",
1552
1609
  overflow: "hidden",
1553
- whiteSpace: "nowrap",
1554
- flex: "1"
1610
+ width: "100%"
1555
1611
  }
1556
1612
  },
1557
- "& .M4LIconButton-root": {
1558
- "& .M4LIcon-icon": {
1559
- backgroundColor: `${o.palette.patronus?.marbleLight[10]}!important`
1613
+ "& .M4LAreasAdmin-areaChipMobileIconContainer": {
1614
+ display: "flex",
1615
+ width: "fit-content",
1616
+ alignItems: "center",
1617
+ borderRadius: "0px 4px 4px 0px",
1618
+ background: o.palette.state.active,
1619
+ ...o.typography.body,
1620
+ color: o.palette.text.primary,
1621
+ "& .M4LIconButton-root": {
1622
+ backgroundColor: `${o.palette.state.active}!important`,
1623
+ borderLeft: "1px solid",
1624
+ borderColor: o.palette.patronus?.marbleLight[10],
1625
+ borderRadius: "0px",
1626
+ "& .M4LIcon-icon": {
1627
+ backgroundColor: `${o.palette.patronus?.marbleLight[10]}!important`
1628
+ }
1629
+ }
1630
+ },
1631
+ "& .MuiBox-root": {
1632
+ display: "flex",
1633
+ alignItems: "center",
1634
+ height: "100%"
1635
+ },
1636
+ "& .simplebar-content": {
1637
+ display: "flex",
1638
+ alignItems: "center"
1639
+ },
1640
+ "& .M4LAreasAdmin-areaChipRoot ": {
1641
+ display: "flex",
1642
+ boxShadow: o.customShadows.z1,
1643
+ borderRadius: "4px 4px 4px 4px",
1644
+ marginRight: "8px",
1645
+ height: "22px",
1646
+ width: "fit-content",
1647
+ gap: "8px",
1648
+ paddingLeft: "8px",
1649
+ alignItems: "center",
1650
+ border: "1px solid",
1651
+ borderColor: o.palette.state.default,
1652
+ background: o.palette.state.default,
1653
+ "& .M4LAreasAdmin-areaContainerChipEditButton": {
1654
+ display: "flex",
1655
+ width: "fit-content"
1656
+ },
1657
+ [o.breakpoints.down("sm")]: {
1658
+ height: "auto"
1659
+ },
1660
+ "&.M4LAreasAdmin-selected": {
1661
+ background: o.palette.state.active,
1662
+ ...o.typography.body,
1663
+ color: o.palette.text.primary,
1664
+ height: "22px",
1665
+ [o.breakpoints.down("sm")]: {
1666
+ height: "auto"
1667
+ },
1668
+ "& .M4LAreasAdmin-areaChipTitle": {
1669
+ backgroundColor: "transparent",
1670
+ border: "none",
1671
+ textWrap: "nowrap",
1672
+ width: "auto",
1673
+ display: "flex",
1674
+ alignItems: "center",
1675
+ color: o.palette.patronus?.marbleLight[10],
1676
+ ...o.typography.action,
1677
+ [o.breakpoints.down("sm")]: {
1678
+ display: "inline",
1679
+ fontSize: "14px",
1680
+ textOverflow: "ellipsis",
1681
+ overflow: "hidden",
1682
+ whiteSpace: "nowrap",
1683
+ flex: "1"
1684
+ }
1685
+ },
1686
+ "& .M4LIconButton-root": {
1687
+ "& .M4LIcon-icon": {
1688
+ backgroundColor: `${o.palette.patronus?.marbleLight[10]}!important`
1689
+ }
1690
+ }
1691
+ },
1692
+ "& .M4LAreasAdmin-areaChipTitle": {
1693
+ backgroundColor: "transparent",
1694
+ border: "none",
1695
+ textWrap: "nowrap",
1696
+ width: "auto",
1697
+ display: "flex",
1698
+ alignItems: "center",
1699
+ color: o.palette.text.secondary,
1700
+ ...o.typography.body
1701
+ },
1702
+ "& .M4LIconButton-root": {
1703
+ display: "flex",
1704
+ justifyContent: "center",
1705
+ width: "20px",
1706
+ height: "20px",
1707
+ "&.M4LIconButton-variantPrimary": {
1708
+ background: o.palette.state.active
1709
+ }
1560
1710
  }
1561
- }
1562
- },
1563
- "& .M4LAreasAdmin-areaChipTitle": {
1564
- backgroundColor: "transparent",
1565
- border: "none",
1566
- textWrap: "nowrap",
1567
- width: "auto",
1568
- display: "flex",
1569
- alignItems: "center",
1570
- color: o.palette.text.secondary,
1571
- ...o.typography.body
1572
- },
1573
- "& .M4LIconButton-root": {
1574
- display: "flex",
1575
- justifyContent: "center",
1576
- width: "20px",
1577
- height: "20px",
1578
- "&.M4LIconButton-variantPrimary": {
1579
- background: o.palette.state.active
1580
1711
  }
1581
1712
  }
1582
1713
  }
1583
1714
  },
1715
+ "& .M4LAreasAdmin-areasAddButton": {
1716
+ backgroundColor: `${o.palette.state.active}!important`,
1717
+ "& .M4LIcon-icon": {
1718
+ backgroundColor: `${o.palette.patronus?.marbleLight[10]}!important`
1719
+ }
1720
+ },
1584
1721
  "&.M4LAreasAdmin-isMobile": {
1722
+ overflow: "hidden",
1723
+ boxShadow: "none",
1724
+ width: "100%",
1585
1725
  "& .M4LAreasAdmin-areaContainerChips": {
1586
- width: "100%"
1726
+ width: "100%",
1727
+ overflow: "hidden",
1728
+ background: "none",
1729
+ boxShadow: "none"
1587
1730
  }
1588
1731
  }
1589
1732
  }
@@ -1593,7 +1736,7 @@ const i = (o) => ({
1593
1736
  styleOverrides: {
1594
1737
  "&.M4LAreasAdmin-areaEditPopover": {
1595
1738
  "& .MuiPaper-root": {
1596
- width: "200px"
1739
+ width: "100%"
1597
1740
  }
1598
1741
  }
1599
1742
  }
@@ -1619,7 +1762,7 @@ const i = (o) => ({
1619
1762
  }
1620
1763
  }
1621
1764
  }
1622
- }), f = (o) => ({
1765
+ }), w = (o) => ({
1623
1766
  M4LAreasViewer: {
1624
1767
  styleOverrides: {
1625
1768
  "&.M4LAreasViewer-root": {
@@ -1640,6 +1783,10 @@ const i = (o) => ({
1640
1783
  "& .react-resizable-handle": {
1641
1784
  backgroundColor: "transparent"
1642
1785
  },
1786
+ "&.react-colapsed": {
1787
+ border: "1px solid",
1788
+ borderColor: o.palette.state.borderDefault
1789
+ },
1643
1790
  "& .M4LAreasViewer-windowRootContainer": {
1644
1791
  display: "flex",
1645
1792
  flexDirection: "column",
@@ -1726,7 +1873,7 @@ const i = (o) => ({
1726
1873
  }
1727
1874
  },
1728
1875
  "&.M4LAreasViewer-error": {
1729
- background: o.palette.patronus?.candyRed[10],
1876
+ background: o.palette.patronus?.desertBeige[10],
1730
1877
  "& .M4LAreasViewer-windowToastyButtonsContainer": {
1731
1878
  background: o.palette.error.main,
1732
1879
  "& .M4LIcon-icon": {
@@ -1798,7 +1945,7 @@ const i = (o) => ({
1798
1945
  },
1799
1946
  "& .M4LAreasViewer-windowContent": {
1800
1947
  margin: "8px",
1801
- background: o.palette.background.default,
1948
+ background: "none",
1802
1949
  borderRadius: "4px",
1803
1950
  display: "flex",
1804
1951
  flexDirection: "column",
@@ -1819,8 +1966,8 @@ const i = (o) => ({
1819
1966
  padding: "4px 4px 4px 8px",
1820
1967
  justifyContent: "end",
1821
1968
  minHeight: "36px",
1822
- borderBottom: "1px solid",
1823
- borderColor: o.palette.divider,
1969
+ borderTop: "1px solid",
1970
+ borderColor: o.palette.state.borderTop,
1824
1971
  overflow: "hidden",
1825
1972
  cursor: "move",
1826
1973
  height: "36px",
@@ -1832,56 +1979,27 @@ const i = (o) => ({
1832
1979
  }
1833
1980
  }
1834
1981
  }
1835
- }
1836
- },
1837
- "& .M4LAreasViewer-panelWindowsRoot": {
1838
- background: o.palette.background.neutral,
1839
- boxShadow: o.customShadows.z2,
1840
- borderRadius: "4px",
1841
- display: "flex",
1842
- alignItems: "center",
1843
- margin: "4px",
1844
- padding: "4px",
1845
- gap: "8px",
1846
- "& .M4LAreasViewer-panelWindowsButtonContainer": {
1847
- borderRadius: "2px",
1848
- background: o.palette.background.default,
1849
- boxShadow: o.customShadows.z2,
1850
- "&.M4LAreasViewer-selected": {
1851
- background: o.palette.state.active12,
1852
- boxShadow: `inset 1px 2px 3px 0 ${e(o.palette.patronus?.ashBlak[50] || "", 0.9)}`
1853
- }
1854
- }
1855
- },
1856
- "& .M4LAreasViewer-windowPopupRoot": {
1857
- boxShadow: o.customShadows.z3,
1858
- "& .M4LIcon-root.custom-handle": {
1859
- "& .M4LIcon-icon": {
1860
- backgroundColor: o.palette.state.skeleton.default,
1861
- width: "11px",
1862
- height: "11px",
1863
- minWidth: "11px",
1864
- minHeight: "11px",
1865
- boxShadow: o.customShadows.z1,
1866
- border: "1px solid",
1867
- borderColor: o.palette.opacity.cool[24]
1868
- }
1869
1982
  },
1870
- "& .M4LAreasViewer-windowRoot": {
1983
+ "& .M4LAreasViewer-windowPopupRoot": {
1984
+ boxShadow: o.customShadows.z3,
1871
1985
  padding: "4px",
1872
1986
  background: o.palette.state.default,
1873
1987
  borderRadius: "4px",
1874
1988
  border: "1px solid",
1875
1989
  borderColor: o.palette.state.default,
1876
1990
  backdropFilter: "blur(8px)",
1877
- "&:not(.M4LAreasViewer-loading)": {
1878
- "& .M4LinearProgressIndeterminate-root": {
1879
- opacity: 0
1991
+ "& .M4LIcon-root.custom-handle": {
1992
+ "& .M4LIcon-icon": {
1993
+ backgroundColor: o.palette.state.skeleton.default,
1994
+ width: "11px",
1995
+ height: "11px",
1996
+ minWidth: "11px",
1997
+ minHeight: "11px",
1998
+ boxShadow: o.customShadows.z1,
1999
+ border: "1px solid",
2000
+ borderColor: o.palette.opacity.cool[24]
1880
2001
  }
1881
2002
  },
1882
- "& > .react-resizable-handle": {
1883
- backgroundColor: "transparent"
1884
- },
1885
2003
  "& .M4LAreasViewer-windowRootContainer": {
1886
2004
  background: o.palette.background.background,
1887
2005
  borderRadius: "4px",
@@ -1889,34 +2007,108 @@ const i = (o) => ({
1889
2007
  height: "28px",
1890
2008
  minHeight: "28px",
1891
2009
  boxShadow: "none",
1892
- background: o.palette.background.neutral,
2010
+ background: o.palette.state.default,
2011
+ "& .M4LIcon-root": {
2012
+ "& .M4LIcon-icon": {
2013
+ backgroundColor: o.palette.text.secondary
2014
+ }
2015
+ },
1893
2016
  "& .M4LTypography-root .MuiTypography-root": {
1894
2017
  ...o.typography.body,
1895
2018
  color: o.palette.text.secondary
1896
2019
  }
1897
2020
  }
1898
2021
  },
2022
+ "& .M4LAreasViewer-windowRoot": {
2023
+ padding: "4px",
2024
+ background: o.palette.state.default,
2025
+ borderRadius: "4px",
2026
+ border: "1px solid",
2027
+ borderColor: o.palette.state.default,
2028
+ backdropFilter: "blur(8px)",
2029
+ "&:not(.M4LAreasViewer-loading)": {
2030
+ "& .M4LinearProgressIndeterminate-root": {
2031
+ opacity: 0
2032
+ }
2033
+ },
2034
+ "& > .react-resizable-handle": {
2035
+ backgroundColor: "transparent"
2036
+ },
2037
+ "&.M4LAreasViewer-selectedWindow": {
2038
+ border: "1px solid",
2039
+ borderColor: o.palette.state.active12,
2040
+ background: o.palette.state.active12,
2041
+ boxShadow: o.customShadows.z3,
2042
+ padding: "4px",
2043
+ "& .M4LAreasViewer-windowRootContainer": {
2044
+ "& .M4LAreasViewer-windowHeader": {
2045
+ background: o.palette.background.neutral,
2046
+ height: "28px",
2047
+ borderRadius: "4px",
2048
+ boxShadow: o.customShadows.z1,
2049
+ borderTop: "2px solid",
2050
+ borderColor: o.palette.state.default,
2051
+ "& .M4LIcon-root": {
2052
+ "& .M4LIcon-icon": {
2053
+ backgroundColor: o.palette.text.primary
2054
+ }
2055
+ },
2056
+ "& .M4LTypography-root .MuiTypography-root": {
2057
+ ...o.typography.body,
2058
+ color: o.palette.text.primary
2059
+ }
2060
+ }
2061
+ }
2062
+ }
2063
+ },
1899
2064
  "&.M4LAreasViewer-selectedWindow": {
1900
2065
  border: "1px solid",
1901
- borderColor: o.palette.state.active12,
2066
+ borderColor: o.palette.state.active,
1902
2067
  background: o.palette.state.active12,
1903
2068
  boxShadow: o.customShadows.z3,
1904
- padding: "4px",
1905
- "& .M4LAreasViewer-windowHeader": {
1906
- background: o.palette.background.neutral,
1907
- height: "28px",
1908
- borderRadius: "4px",
1909
- boxShadow: o.customShadows.z1,
1910
- borderTop: "2px solid",
1911
- borderColor: o.palette.state.default,
1912
- "& .M4LTypography-root .MuiTypography-root": {
1913
- ...o.typography.body,
1914
- color: o.palette.text.primary
2069
+ padding: "6px",
2070
+ "& .M4LAreasViewer-windowRootContainer": {
2071
+ boxShadow: o.customShadows.z2,
2072
+ "& .M4LAreasViewer-windowHeader": {
2073
+ background: o.palette.state.skeleton,
2074
+ height: "28px",
2075
+ borderRadius: "4px",
2076
+ boxShadow: o.customShadows.z1,
2077
+ borderTop: "1.5px solid",
2078
+ borderColor: o.palette.state.borderTop,
2079
+ "& .M4LIcon-root": {
2080
+ "& .M4LIcon-icon": {
2081
+ backgroundColor: o.palette.text.primary
2082
+ }
2083
+ },
2084
+ "& .M4LTypography-root .MuiTypography-root": {
2085
+ ...o.typography.body,
2086
+ color: o.palette.text.primary
2087
+ }
1915
2088
  }
1916
2089
  }
1917
2090
  }
1918
2091
  }
1919
2092
  },
2093
+ "& .M4LAreasViewer-panelWindowsRoot": {
2094
+ background: o.palette.background.neutral,
2095
+ boxShadow: o.customShadows.z2,
2096
+ borderRadius: "4px",
2097
+ display: "flex",
2098
+ alignItems: "center",
2099
+ margin: "4px",
2100
+ padding: "4px",
2101
+ gap: "8px",
2102
+ "& .M4LAreasViewer-panelWindowsButtonContainer": {
2103
+ borderRadius: "2px",
2104
+ background: o.palette.background.default,
2105
+ boxShadow: o.customShadows.z2,
2106
+ "&.M4LAreasViewer-selected": {
2107
+ background: o.palette.state.active12,
2108
+ boxShadow: `inset 1px 2px 3px 0 ${e(o.palette.patronus?.ashBlak[50] || "", 0.9)}`
2109
+ }
2110
+ }
2111
+ },
1920
2112
  "& .M4LAreasViewer-areasLoadingErrorRoot": {
1921
2113
  display: "flex",
1922
2114
  flexDirection: "column",
@@ -1976,23 +2168,14 @@ const i = (o) => ({
1976
2168
  },
1977
2169
  M4LAreasViewerModal: {
1978
2170
  styleOverrides: {
1979
- "&.M4LAreasViewer-windowModalRoot": {
2171
+ "&.M4LAreasViewer-windowModalRoot .M4LAreasViewer-windowRoot": {
1980
2172
  borderRadius: "4px",
1981
2173
  boxShadow: o.customShadows.z4,
1982
- "& .M4LAreasViewer-windowRoot": {
1983
- borderRadius: "4px"
1984
- },
1985
- "& .M4LIcon-root.custom-handle": {
1986
- "& .M4LIcon-icon": {
1987
- backgroundColor: o.palette.state.skeleton.default,
1988
- width: "11px",
1989
- height: "11px",
1990
- minWidth: "11px",
1991
- minHeight: "11px",
1992
- boxShadow: o.customShadows.z1,
1993
- border: "1px solid",
1994
- borderColor: o.palette.opacity.cool[24]
1995
- }
2174
+ background: o.palette.background.background,
2175
+ "& .M4LAreasViewer-windowContent": {
2176
+ borderRadius: "4px",
2177
+ boxShadow: o.customShadows.z4,
2178
+ background: o.palette.background.neutral
1996
2179
  },
1997
2180
  "& .M4LAreasViewer-areasLoadingErrorRoot": {
1998
2181
  display: "flex",
@@ -2063,7 +2246,9 @@ const i = (o) => ({
2063
2246
  display: "flex",
2064
2247
  flexDirection: "column",
2065
2248
  height: "100%",
2066
- background: o.palette.background.neutral,
2249
+ background: o.palette.background.background,
2250
+ borderRadius: "4px",
2251
+ boxShadow: o.customShadows.z4,
2067
2252
  "& .M4LAreasViewer-windowHeader": {
2068
2253
  cursor: "all-scroll",
2069
2254
  display: "flex",
@@ -2085,7 +2270,7 @@ const i = (o) => ({
2085
2270
  },
2086
2271
  "& .M4LAreasViewer-windowContent": {
2087
2272
  margin: "0 8px 8px 8px",
2088
- background: o.palette.background.default,
2273
+ background: o.palette.background.background,
2089
2274
  borderRadius: "4px",
2090
2275
  display: "flex",
2091
2276
  flexDirection: "column",
@@ -2095,28 +2280,44 @@ const i = (o) => ({
2095
2280
  height: "100%"
2096
2281
  }
2097
2282
  }
2283
+ },
2284
+ "& .M4LIcon-root.custom-handle": {
2285
+ "& .M4LIcon-icon": {
2286
+ backgroundColor: o.palette.state.skeleton.default,
2287
+ width: "11px",
2288
+ height: "11px",
2289
+ minWidth: "11px",
2290
+ minHeight: "11px",
2291
+ boxShadow: o.customShadows.z2,
2292
+ border: "1px solid",
2293
+ borderColor: o.palette.state.overdefoult
2294
+ }
2098
2295
  }
2099
2296
  }
2100
2297
  }
2101
- }), w = (o) => ({
2298
+ }), f = (o) => ({
2102
2299
  M4LAppBar: {
2103
2300
  styleOverrides: {
2104
2301
  "&.M4LAppBar-root": {
2105
- test: "root",
2106
2302
  display: "flex",
2107
- width: "100%",
2303
+ width: "auto",
2108
2304
  overflow: "hidden",
2109
- height: "48px",
2305
+ height: "52px",
2110
2306
  alignItems: "center",
2111
2307
  borderRadius: "6px",
2112
- padding: "8px",
2113
- borderTop: "1px solid",
2114
- borderColor: o.palette.state.default,
2308
+ padding: "4px 8px 4px 8px",
2309
+ borderTop: "1.5px solid",
2310
+ borderColor: o.palette.state.borderTop,
2115
2311
  background: o.palette.background.neutral,
2116
2312
  boxShadow: o.customShadows.z2,
2313
+ justifyContent: "space-between",
2314
+ marginLeft: "4px",
2315
+ [o.breakpoints.down("sm")]: {
2316
+ width: "100%",
2317
+ marginLeft: "0"
2318
+ },
2117
2319
  "& .M4LAppBar-containerIconMenuToggle": {
2118
2320
  display: "flex",
2119
- justifyContent: "center",
2120
2321
  alingItems: "center",
2121
2322
  width: "52px",
2122
2323
  height: "52px",
@@ -2125,6 +2326,7 @@ const i = (o) => ({
2125
2326
  alignItems: "center",
2126
2327
  borderRadius: "4px",
2127
2328
  borderColor: o.palette.state.default,
2329
+ justifyContent: "space-between",
2128
2330
  "& .M4LAppBar-iconMenuToggle": {
2129
2331
  background: o.palette.background.default,
2130
2332
  boxShadow: o.customShadows.z2,
@@ -2133,43 +2335,70 @@ const i = (o) => ({
2133
2335
  width: "36px",
2134
2336
  height: "36px",
2135
2337
  minWidth: "36px",
2136
- minHeight: "36px"
2338
+ minHeight: "36px",
2339
+ [o.breakpoints.down("sm")]: {
2340
+ background: o.palette.background.default,
2341
+ boxShadow: o.customShadows.z2,
2342
+ borderTop: "1px solid",
2343
+ borderColor: o.palette.state.default,
2344
+ width: "36px",
2345
+ height: "36px",
2346
+ minWidth: "36px",
2347
+ minHeight: "36px"
2348
+ }
2137
2349
  }
2138
2350
  },
2139
- [o.breakpoints.down("sm")]: {
2140
- display: "flex",
2141
- alignItems: "center",
2142
- width: "100%",
2143
- borderTop: "1px solid",
2144
- borderColor: o.palette.state.default,
2145
- background: o.palette.background.neutral,
2146
- boxShadow: o.customShadows.z2,
2147
- paddingRight: "8px",
2148
- borderRadius: "6px"
2149
- },
2150
2351
  "& .M4LAppBar-containerChilds": {
2151
2352
  display: "flex",
2152
- width: "70%",
2153
- overflow: "visible",
2154
- alignItems: "center",
2155
- borderRadius: "4px",
2353
+ flexDirection: "row",
2354
+ gap: "12px",
2355
+ width: "100%",
2356
+ justifyContent: "space-between",
2156
2357
  [o.breakpoints.down("sm")]: {
2157
- width: "100%",
2358
+ display: "flex",
2158
2359
  alignItems: "center",
2159
- gap: "8px",
2160
- borderRadius: "4px 0px 0px 4px",
2161
- display: "flex"
2360
+ width: "100%",
2361
+ borderTop: "0",
2362
+ borderColor: "none",
2363
+ background: "none",
2364
+ boxShadow: "none",
2365
+ paddingRight: "0px",
2366
+ borderRadius: "6px",
2367
+ overflow: "hidden"
2162
2368
  },
2163
- "& .M4LAvatar-root": {
2164
- width: "36px",
2165
- height: "36px",
2166
- "& .MuiAvatar-root": {
2369
+ "& .M4LAppBar-containerChilds": {
2370
+ display: "flex",
2371
+ width: "100%",
2372
+ overflow: "visible",
2373
+ alignItems: "center",
2374
+ borderRadius: "4px",
2375
+ background: "none",
2376
+ boxShadow: "none",
2377
+ justifyContent: "space-between",
2378
+ [o.breakpoints.down("sm")]: {
2379
+ width: "100%",
2380
+ alignItems: "center",
2381
+ gap: "8px",
2382
+ borderRadius: "4px 0px 0px 4px",
2383
+ display: "flex",
2384
+ background: "none",
2385
+ boxShadow: "none",
2386
+ borderTop: "0px"
2387
+ },
2388
+ "& .M4LAvatar-root": {
2167
2389
  width: "36px",
2168
- height: "36px"
2390
+ height: "36px",
2391
+ "& .MuiAvatar-root": {
2392
+ width: "36px",
2393
+ height: "36px"
2394
+ }
2169
2395
  }
2170
2396
  }
2171
2397
  }
2172
2398
  }
2399
+ },
2400
+ "*css-1gn3ygk": {
2401
+ overflow: "hidden"
2173
2402
  }
2174
2403
  }
2175
2404
  }), v = (o) => ({
@@ -2177,8 +2406,8 @@ const i = (o) => ({
2177
2406
  styleOverrides: {
2178
2407
  "&.M4LAvatar-root": {
2179
2408
  "& .MuiAvatar-root": {
2180
- width: "32px",
2181
- height: "32px",
2409
+ width: "36px",
2410
+ height: "36px",
2182
2411
  borderRadius: "4px"
2183
2412
  },
2184
2413
  test: "root"
@@ -2384,11 +2613,12 @@ const i = (o) => ({
2384
2613
  M4LCommonActions: {
2385
2614
  styleOverrides: {
2386
2615
  "&.M4LCommonActions-root": {
2387
- padding: "14px",
2616
+ padding: "16px 0px 8px 0px",
2388
2617
  display: "flex",
2389
2618
  gap: "14px",
2390
2619
  justifyContent: "flex-end",
2391
- width: "100%"
2620
+ width: "100%",
2621
+ overflow: "visible"
2392
2622
  }
2393
2623
  }
2394
2624
  }
@@ -2458,6 +2688,7 @@ const i = (o) => ({
2458
2688
  M4LTab: {
2459
2689
  styleOverrides: {
2460
2690
  "&.M4LTab-root": {
2691
+ width: "fit-content",
2461
2692
  "& .MuiButtonBase-root": {
2462
2693
  borderRadius: "4px",
2463
2694
  display: "flex",
@@ -2469,8 +2700,9 @@ const i = (o) => ({
2469
2700
  minHeight: "fit-content",
2470
2701
  minWidth: "fit-content",
2471
2702
  gap: "8px",
2472
- ...o.typography.paragraph,
2473
- color: o.palette.text.primary,
2703
+ ...o.typography.body,
2704
+ color: o.palette.text.secondary,
2705
+ lineHeight: "none",
2474
2706
  "& .M4LIcon-root": {
2475
2707
  marginBottom: "0"
2476
2708
  }
@@ -2487,6 +2719,9 @@ const i = (o) => ({
2487
2719
  border: "1px solid",
2488
2720
  borderColor: o.palette.state.active12,
2489
2721
  boxShadow: o.customShadows.z2,
2722
+ ...o.typography.bodyDens,
2723
+ color: o.palette.text.primary,
2724
+ lineHeight: "none",
2490
2725
  "&::before": {
2491
2726
  content: '""',
2492
2727
  width: "3px",
@@ -2707,7 +2942,7 @@ const i = (o) => ({
2707
2942
  }
2708
2943
  }
2709
2944
  }
2710
- }), P = (o) => ({
2945
+ }), z = (o) => ({
2711
2946
  M4LModalDialog: {
2712
2947
  styleOverrides: {
2713
2948
  "&.M4LModal-root": {
@@ -2830,7 +3065,7 @@ const i = (o) => ({
2830
3065
  }
2831
3066
  }
2832
3067
  }
2833
- }), z = (o) => ({
3068
+ }), P = (o) => ({
2834
3069
  M4LPaperForm: {
2835
3070
  styleOverrides: {
2836
3071
  "&.M4LPaperForm-root": {
@@ -2889,8 +3124,8 @@ const i = (o) => ({
2889
3124
  margin: "4px 2px 2px 2px",
2890
3125
  marginTop: "0px",
2891
3126
  color: o.palette.text.primary,
2892
- borderTop: "1px solid",
2893
- borderColor: o.palette.background.background,
3127
+ borderTop: "1.5px solid",
3128
+ borderColor: o.palette.state.borderTop,
2894
3129
  ...o.typography.body
2895
3130
  }
2896
3131
  }
@@ -2908,8 +3143,8 @@ const i = (o) => ({
2908
3143
  export {
2909
3144
  m as A,
2910
3145
  D as B,
2911
- P as C,
2912
- z as D,
3146
+ z as C,
3147
+ P as D,
2913
3148
  V as E,
2914
3149
  b as M,
2915
3150
  i as a,
@@ -2925,10 +3160,10 @@ export {
2925
3160
  u as k,
2926
3161
  x as l,
2927
3162
  g as m,
2928
- L as n,
2929
- w as o,
2930
- y as p,
2931
- f as q,
3163
+ y as n,
3164
+ f as o,
3165
+ L as p,
3166
+ w as q,
2932
3167
  v as r,
2933
3168
  h as s,
2934
3169
  k as t,