impaktapps-ui-builder 0.0.101-alpha.8 → 0.0.101-alpha.81

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 (36) hide show
  1. package/dist/impaktapps-ui-builder.es.js +1106 -808
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +15 -15
  4. package/dist/impaktapps-ui-builder.umd.js.map +1 -1
  5. package/dist/src/impaktapps-ui-builder/builder/build/uischema/apiSection.d.ts +62 -59
  6. package/dist/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.d.ts +17 -21
  7. package/dist/src/impaktapps-ui-builder/builder/build/uischema/coreSection.d.ts +98 -95
  8. package/dist/src/impaktapps-ui-builder/builder/build/uischema/eventSection.d.ts +26 -33
  9. package/dist/src/impaktapps-ui-builder/builder/build/uischema/refresh.d.ts +52 -38
  10. package/dist/src/impaktapps-ui-builder/builder/build/uischema/styleSection.d.ts +7 -8
  11. package/dist/src/impaktapps-ui-builder/builder/build/uischema/tableSection.d.ts +29 -33
  12. package/dist/src/impaktapps-ui-builder/builder/build/uischema/validationSections.d.ts +56 -37
  13. package/dist/src/impaktapps-ui-builder/builder/build/uischema/valueTab.d.ts +56 -36
  14. package/dist/src/impaktapps-ui-builder/builder/elements/UiSchema/event/schema.d.ts +6 -0
  15. package/dist/src/impaktapps-ui-builder/builder/services/event.d.ts +6 -0
  16. package/package.json +1 -1
  17. package/src/impaktapps-ui-builder/builder/build/buildText.ts +21 -18
  18. package/src/impaktapps-ui-builder/builder/build/buildUiSchema.ts +14 -10
  19. package/src/impaktapps-ui-builder/builder/build/uischema/apiSection.ts +111 -96
  20. package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts +101 -95
  21. package/src/impaktapps-ui-builder/builder/build/uischema/coreSection.ts +189 -110
  22. package/src/impaktapps-ui-builder/builder/build/uischema/eventSection.ts +39 -17
  23. package/src/impaktapps-ui-builder/builder/build/uischema/refresh.ts +44 -44
  24. package/src/impaktapps-ui-builder/builder/build/uischema/styleSection.ts +9 -13
  25. package/src/impaktapps-ui-builder/builder/build/uischema/tableSection.ts +40 -18
  26. package/src/impaktapps-ui-builder/builder/build/uischema/validationSections.ts +117 -48
  27. package/src/impaktapps-ui-builder/builder/build/uischema/valueTab.ts +113 -45
  28. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/schema.ts +23 -23
  29. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +108 -48
  30. package/src/impaktapps-ui-builder/builder/elements/UiSchema/PageMaster/uiSchema.ts +19 -20
  31. package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/schema.ts +15 -12
  32. package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/uiSchema.ts +182 -294
  33. package/src/impaktapps-ui-builder/builder/services/component.ts +144 -32
  34. package/src/impaktapps-ui-builder/builder/services/event.ts +167 -65
  35. package/src/impaktapps-ui-builder/runtime/services/events.ts +8 -1
  36. package/src/impaktapps-ui-builder/runtime/services/service.ts +5 -4
package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/uiSchema.ts CHANGED
@@ -3,41 +3,39 @@ import { getSelectField } from "../../../build/uischema/buildPropertiesSection";
3
3
  export const EventUiSchema: any = (theme) => {
4
4
  const uiSchema = {
5
5
  type: "HorizontalLayout",
6
- heading: "Component",
6
+ heading: "Page-Events",
7
7
  elements: [
8
8
  {
9
- type: "Control",
10
- scope: "#/properties/pageName",
11
-
12
- options: {
13
- widget: "Box",
14
- },
9
+ type: "TabLayout",
15
10
  config: {
16
- layout: 12,
17
11
  main: {
18
- heading: " ",
12
+ tabLabels: ["Core", "Response Events"],
13
+ id: "event"
19
14
  },
20
15
  style: {
21
- marginLeft: theme.spacing(3),
22
- width:"auto",
23
- fontSize:"12px",
24
- color:"gray",
16
+ TabPanelStyle: {
17
+ padding: 0,
18
+ }
25
19
  },
26
- },
27
- },
28
- {
29
- type: "TabLayout",
30
- config: {
31
- main: {
32
- tabLabels: ["Core", "Response Event"],
33
- defaultStyle: true,
34
- id: "event"
20
+ TabsStyle: {
21
+ marginBottom: "3px",
22
+ paddingBottom: "4px",
23
+ boxShadow: "0px 3px 4px #afafaf80",
24
+ "& .MuiTabs-indicator": {
25
+ bottom: "6px",
26
+ }
35
27
  },
36
28
  },
37
29
 
38
30
  elements: [
39
31
  {
40
- type: "HorizontalLayout",
32
+ type: "WrapperLayout",
33
+ config: {
34
+ main: {
35
+ label: " ",
36
+ gap: "8px"
37
+ },
38
+ },
41
39
  elements: [
42
40
  {
43
41
  type: "Control",
@@ -47,9 +45,9 @@ export const EventUiSchema: any = (theme) => {
47
45
  widget: "SelectInputField",
48
46
  },
49
47
  config: {
50
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
48
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
51
49
  main: {
52
- label: "Event Type",
50
+ label: "Event's Type",
53
51
  type: "text",
54
52
 
55
53
  },
@@ -57,7 +55,7 @@ export const EventUiSchema: any = (theme) => {
57
55
  },
58
56
  getSelectField("Handler", "Handler", [
59
57
  { label: "Custom", value: "custom" },
60
- { label: "Api", value: "api" },
58
+ { label: "API", value: "api" },
61
59
  { label: "Inbuilt Function", value: "inBuiltFunction" },
62
60
  { label: "Refresh", value: "refresh" },
63
61
  ]),
@@ -68,7 +66,7 @@ export const EventUiSchema: any = (theme) => {
68
66
  widget: "EmptyBox",
69
67
  },
70
68
  config: {
71
- layout: { xs: 0, sm: 4, md: 4, lg: 4 },
69
+ layout: { xs: 0, sm: 0, md: 4, lg: 6 },
72
70
  },
73
71
  },
74
72
  ],
@@ -93,15 +91,20 @@ export const EventUiSchema: any = (theme) => {
93
91
  },
94
92
  config: {
95
93
  main: {
96
- // color: "info",
97
94
  onClick: "addEvent",
98
95
  size: "small",
99
- icon: "AddIcon",
100
- iconLabel: "Add New",
96
+ icon: "TableAddIcon",
97
+ iconLabel: "Add",
101
98
  styleDefault: true,
102
99
  },
103
100
  style: {
104
101
  mt: "6px",
102
+ color: "inherit",
103
+ fill: "inherit",
104
+ "&:hover": {
105
+ color: "inherit",
106
+ fill: "inherit",
107
+ }
105
108
  },
106
109
  },
107
110
  }
@@ -117,15 +120,20 @@ export const EventUiSchema: any = (theme) => {
117
120
  },
118
121
  config: {
119
122
  main: {
120
- // color: "info",
121
123
  onClick: "copyPasteElement",
122
124
  size: "small",
123
- icon: "PasteIcon",
125
+ icon: "TablePaste",
124
126
  iconLabel: "Paste",
125
127
  styleDefault: true,
126
128
  },
127
129
  style: {
128
130
  mt: "6px",
131
+ color: "inherit",
132
+ fill: "inherit",
133
+ "&:hover": {
134
+ color: "inherit",
135
+ fill: "inherit",
136
+ }
129
137
  },
130
138
  },
131
139
  }
@@ -142,15 +150,21 @@ export const EventUiSchema: any = (theme) => {
142
150
 
143
151
  {
144
152
  accessorKey: "eventType",
145
- header: "Event Type",
153
+ header: "Event's Type",
154
+ size: 300,
155
+ type: "string"
146
156
  },
147
157
  {
148
158
  accessorKey: "Handler",
149
159
  header: "Handler",
160
+ size: 200,
161
+ type: "string"
150
162
  },
151
163
  {
152
164
  accessorKey: "Edit_Approve_Records",
153
- header: "Edit Widget",
165
+ header: "Edit",
166
+ type: "action",
167
+ size: 150,
154
168
  widget: {
155
169
  type: "Control",
156
170
  scope: "#/properties/Edit_Records",
@@ -159,14 +173,16 @@ export const EventUiSchema: any = (theme) => {
159
173
  },
160
174
  config: {
161
175
  main: {
162
- color: "info",
163
176
  size: "small",
164
- icon: "EditIcon",
177
+ icon: "TableEditIcon",
165
178
  tooltipMessage: "Edit This Record",
166
179
  onClick: "editEvent",
167
180
  },
168
181
  style: {
169
- color: theme.palette.primary.main,
182
+ fill: theme.palette.primary.main,
183
+ "& :hover": {
184
+ fill: theme.palette.primary.dark,
185
+ },
170
186
  },
171
187
  },
172
188
  },
@@ -174,6 +190,8 @@ export const EventUiSchema: any = (theme) => {
174
190
  {
175
191
  accessorKey: "Reject_Records",
176
192
  header: "Delete",
193
+ type: "action",
194
+ size: 150,
177
195
  widget: {
178
196
  type: "Control",
179
197
  scope: "#/properties/RejectButton",
@@ -182,11 +200,16 @@ export const EventUiSchema: any = (theme) => {
182
200
  },
183
201
  config: {
184
202
  main: {
185
- icon: "RejectIcon",
186
- color: "error",
203
+ icon: "Bin",
187
204
  tooltipMessage: "Reject This Record",
188
205
  onClick: "deletePopUpEvent",
189
206
  },
207
+ style: {
208
+ fill: theme.palette.primary.main,
209
+ "& :hover": {
210
+ fill: theme.palette.primary.dark,
211
+ },
212
+ },
190
213
  },
191
214
  },
192
215
  },
@@ -194,7 +217,8 @@ export const EventUiSchema: any = (theme) => {
194
217
  {
195
218
  header: "Copy",
196
219
  field: "Copy_Event",
197
- flex: 1,
220
+ type: "action",
221
+ size: 150,
198
222
  widget: {
199
223
  type: "Control",
200
224
  scope: "#/properties/Copy_Event",
@@ -204,7 +228,6 @@ export const EventUiSchema: any = (theme) => {
204
228
  config: {
205
229
  main: {
206
230
  icon: "FileCopyIcon",
207
- // color: "error",
208
231
  onClick: "copyPasteElement",
209
232
  styleDefault: true,
210
233
  },
@@ -216,108 +239,118 @@ export const EventUiSchema: any = (theme) => {
216
239
  }
217
240
  ],
218
241
  },
219
- {
220
- type: "HorizontalLayout",
221
- config: {
222
- layout:{xs:12,sm: 6}
223
- },
224
- elements: [
242
+ // {
243
+ // type: "HorizontalLayout",
244
+ // config: {
245
+ // layout:{xs:12,sm: 6}
246
+ // },
247
+ // elements: [
248
+ // {
249
+ // type: "Control",
250
+ // scope: "#/properties/RemoveItemButton",
251
+ // options: {
252
+ // widget: "IconButton",
253
+ // },
254
+ // config: {
255
+ // layout: { xs: 1, sm: 1 },
256
+ // main: {
257
+ // onClick: "RemoveItemButton",
258
+ // size: "large",
259
+ // icon: "RejectIcon",
260
+ // styleDefault: true,
261
+ // },
262
+ // style:{
263
+ // marginLeft: "-10px"
264
+ // }
265
+ // },
266
+ // },
267
+ // {
268
+ // type: "Control",
269
+ // scope: "#/properties/copiedElementDetails",
270
+
271
+ // options: {
272
+ // widget: "Box",
273
+ // },
274
+ // config: {
275
+ // layout: { xs: 6, sm: 6 },
276
+ // main: {
277
+ // heading: "No element copied",
278
+ // },
279
+ // style: {
280
+ // color: "#535557",
281
+ // marginLeft: "-10px",
282
+ // fontSize: "12px",
283
+ // marginTop: "4px"
284
+ // },
285
+ // },
286
+ // },
287
+ // {
288
+ // type: "Control",
289
+ // scope: "#/properties/EmptyBox",
290
+ // options: {
291
+ // widget: "EmptyBox",
292
+ // },
293
+ // config: {
294
+ // layout: { xs: 1, sm: 5 },
295
+ // },
296
+ // },
297
+ // ]
298
+ // },
299
+ {
300
+ type: "WrapperLayout",
301
+ config: {
302
+ main: {
303
+ gap: "8px"
304
+ }
305
+ },
306
+ elements: [
225
307
  {
226
308
  type: "Control",
227
- scope: "#/properties/RemoveItemButton",
309
+ scope: "#/properties/btn",
228
310
  options: {
229
- widget: "IconButton",
311
+ widget: "Button",
230
312
  },
313
+
231
314
  config: {
232
- layout: { xs: 1, sm: 1 },
315
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
233
316
  main: {
234
- onClick: "RemoveItemButton",
235
- size: "large",
236
- icon: "RejectIcon",
237
- styleDefault: true,
317
+ name: "Ok",
318
+ variant: "contained",
319
+ type: "text",
320
+ onClick: "okHandler",
321
+ size: "medium",
238
322
  },
239
- style:{
240
- marginLeft: "-10px"
241
- }
242
323
  },
243
324
  },
244
325
  {
245
326
  type: "Control",
246
- scope: "#/properties/copiedElementDetails",
247
-
327
+ scope: "#/properties/btnSubmit",
248
328
  options: {
249
- widget: "Box",
329
+ widget: "Button",
250
330
  },
331
+
251
332
  config: {
252
- layout: { xs: 6, sm: 6 },
333
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
253
334
  main: {
254
- heading: "No element copied",
255
- },
256
- style: {
257
- color: "#535557",
258
- marginLeft: "-10px",
259
- fontSize: "12px",
260
- marginTop: "4px"
335
+ name: "Save & Exit",
336
+ variant: "contained",
337
+ type: "text",
338
+ onClick: "saveHandler",
339
+ size: "medium",
261
340
  },
262
341
  },
263
342
  },
264
343
  {
265
344
  type: "Control",
266
345
  scope: "#/properties/EmptyBox",
346
+ config: {
347
+ layout: { xs: 4, sm:7, md: 8, lg: 9 },
348
+ },
267
349
  options: {
268
350
  widget: "EmptyBox",
269
351
  },
270
- config: {
271
- layout: { xs: 1, sm: 5 },
272
- },
273
- },
274
- ]
275
- },
276
- {
277
- type: "Control",
278
- scope: "#/properties/btn",
279
- options: {
280
- widget: "Button",
281
- },
282
-
283
- config: {
284
- layout: { xs: 4, sm: 2 },
285
- main: {
286
- name: "Ok",
287
- startIcon: "ApproveIcon",
288
- variant: "contained",
289
- // color: "info",
290
- type: "text",
291
- onClick: "okHandler",
292
- size: "medium",
293
- },
294
- style: {
295
- float: "right",
296
- },
297
- },
298
- },
299
- {
300
- type: "Control",
301
- scope: "#/properties/btnSubmit",
302
- options: {
303
- widget: "Button",
304
- },
305
-
306
- config: {
307
- layout: { xs: 4, sm: 2 },
308
- main: {
309
- name: "Save & Exit",
310
- startIcon: "ApproveIcon",
311
- variant: "contained",
312
- // color: "info",
313
- type: "text",
314
- onClick: "saveHandler",
315
- size: "medium",
316
- },
317
- style: {
318
- float: "right",
319
352
  },
320
- },
353
+ ],
321
354
  },
322
355
  {
323
356
  type: "Control",
@@ -352,12 +385,12 @@ export const EventUiSchema: any = (theme) => {
352
385
  heading: "Are you sure you want to delete ?",
353
386
  },
354
387
  style:{
355
- marginTop: "-20px",
356
388
  fontSize: "20px",
357
389
  "&.MuiTypography-root": {
358
- padding: "10px 30px 20px 30px",
390
+ padding: "0px 20px",
359
391
  textAlign: "center",
360
- lineHeight: "1"
392
+ lineHeight: "1",
393
+ marginBottom: theme.spacing(5)
361
394
  }
362
395
  }
363
396
  },
@@ -382,13 +415,13 @@ export const EventUiSchema: any = (theme) => {
382
415
  name: "No",
383
416
  startIcon: "ApproveIcon",
384
417
  variant: "contained",
385
- color: "info",
386
418
  type: "text",
387
419
  onClick: "deletePopUpEvent",
388
420
  size: "large",
389
421
  },
390
422
  style: {
391
423
  position: "absolute",
424
+ padding: "10px 0px",
392
425
  bottom: 0,
393
426
  left: 0,
394
427
  width: "50%",
@@ -416,7 +449,6 @@ export const EventUiSchema: any = (theme) => {
416
449
  layout: 6,
417
450
  main: {
418
451
  name: "Yes",
419
- startIcon: "ApproveIcon",
420
452
  variant: "contained",
421
453
  color: "error",
422
454
  type: "text",
@@ -425,6 +457,7 @@ export const EventUiSchema: any = (theme) => {
425
457
  },
426
458
  style: {
427
459
  position: "absolute",
460
+ padding: "10px 0px",
428
461
  bottom: 0,
429
462
  right: 0,
430
463
  width: "50%",
@@ -445,6 +478,28 @@ export const EventUiSchema: any = (theme) => {
445
478
  },
446
479
  ]
447
480
  },
481
+ {
482
+ type: "Control",
483
+ scope: "#/properties/pageName",
484
+
485
+ options: {
486
+ widget: "Breadcrumb",
487
+ },
488
+ config: {
489
+ layout: 12,
490
+ main: {
491
+ },
492
+ style: {
493
+ paddingLeft: theme.spacing(3),
494
+ color:theme.palette.grey[600],
495
+ fontSize:"10px",
496
+ position: "fixed",
497
+ bottom: "24px",
498
+ borderBottom: `1px solid ${theme.palette.common.black}29`,
499
+ borderTop: `1px solid ${theme.palette.common.black}29`,
500
+ },
501
+ },
502
+ },
448
503
  {
449
504
  type: "Control",
450
505
  scope: "#/properties/notify",
@@ -453,112 +508,6 @@ export const EventUiSchema: any = (theme) => {
453
508
  },
454
509
  layout: 6,
455
510
  },
456
- // {
457
- // type: "HorizontalLayout",
458
- // config: {
459
- // main: {
460
- // direction: 'row'
461
- // },
462
- // style: {
463
- // flexDirection: "row",
464
- // position: "absolute",
465
- // bottom: 0,
466
- // marginBottom: '-8px',
467
- // height: 'fit-content',
468
- // overflow: 'hidden',
469
- // zIndex: 1000,
470
- // width: 'inherit'
471
- // }
472
- // },
473
- // elements: [
474
- // {
475
-
476
- // type: "Control",
477
- // scope: "#/properties/FooterText",
478
- // options: {
479
- // widget: "Box",
480
- // },
481
- // config: {
482
- // main: {
483
- // heading: "Copywriter@ACT21.IO"
484
- // },
485
- // style: {
486
- // color: theme?.palette?.text.disabled || "#AFAFAF",
487
- // fontSize: '12px',
488
- // textAlign: 'center',
489
- // lineHeight: 2,
490
- // width: 'fit-content',
491
- // left: '50%',
492
- // position: 'relative',
493
- // margin: 0,
494
- // flexGrow: 1,
495
- // height: 0,
496
- // transform: "translate(-50%,0%)"
497
- // }
498
- // },
499
- // },
500
- // {
501
- // type: "Control",
502
- // scope: "#/properties/backIcon",
503
- // options: {
504
- // widget: "Box",
505
- // },
506
- // config: {
507
- // main: {
508
- // iconName: 'PrevIcon',
509
- // onClick: "backHandler",
510
- // width: 'fit-content',
511
- // },
512
- // style: {
513
- // fill: theme.palette.primary.main,
514
- // width: 20,
515
- // height: 0,
516
- // margin: 0,
517
- // top: 0,
518
- // right: {xs: '12px', sm: '84px'},
519
- // position: 'absolute',
520
- // fontSize: '12px',
521
- // cursor: 'pointer',
522
- // ':hover': {
523
- // fill: theme.palette.primary.dark,
524
- // }
525
- // }
526
- // }
527
- // },
528
- // {
529
- // type: "Control",
530
- // scope: "#/properties/text",
531
-
532
- // options: {
533
- // widget: "Box",
534
- // },
535
- // config: {
536
- // main: {
537
- // heading: "Previous Page",
538
- // onClick: "backHandler"
539
- // },
540
- // style: {
541
- // display: {xs: 'none', sm: "flex"},
542
- // textAlign: 'left',
543
- // lineHeight: 1,
544
- // height: 0,
545
- // width: 'fit-content',
546
- // color: theme.palette.primary.main,
547
- // fontSize: "12px",
548
- // cursor: 'pointer',
549
- // marginLeft: '2px',
550
- // marginRight: 0,
551
- // top: 3,
552
- // right: '12px',
553
- // position: 'absolute',
554
- // ':hover': {
555
- // color: theme.palette.primary.dark,
556
- // }
557
- // }
558
- // },
559
- // },
560
- // ]
561
- // }
562
511
  {
563
512
  type: "HorizontalLayout",
564
513
  config: {
@@ -568,7 +517,7 @@ export const EventUiSchema: any = (theme) => {
568
517
  style: {
569
518
  flexDirection: "row",
570
519
  position: "absolute",
571
- bottom: 0,
520
+ bottom: 10,
572
521
  height: "fit-content",
573
522
  overflow: "hidden",
574
523
  zIndex: 1000,
@@ -587,81 +536,20 @@ export const EventUiSchema: any = (theme) => {
587
536
  heading: "Copywriter@ACT21.IO",
588
537
  },
589
538
  style: {
590
- color: theme?.palette?.text?.disabled || "#AFAFAF",
539
+ color: theme?.palette?.text.disabled || "#AFAFAF",
591
540
  fontSize: "11px",
592
541
  textAlign: "center",
593
- lineHeight: 2,
542
+ lineHeight: 0,
594
543
  width: "fit-content",
595
544
  left: "50%",
596
545
  position: "relative",
597
- margin: 0,
546
+ margin: "revert",
598
547
  flexGrow: 1,
599
548
  height: 0,
600
549
  transform: "translate(-50%, 0%)",
601
550
  },
602
551
  },
603
552
  },
604
- {
605
- type: "Control",
606
- scope: "#/properties/FooterBackIcon",
607
- options: {
608
- widget: "Box",
609
- },
610
- config: {
611
- main: {
612
- iconName: "PrevIcon",
613
- onClick: "backHandler",
614
- width: "fit-content",
615
- },
616
- style: {
617
- fill: theme?.palette?.primary?.main,
618
- width: 20,
619
- height: 0,
620
- // margin: 0,
621
- top: 0,
622
- right: { xs: "12px", sm: "84px" },
623
- position: "absolute",
624
- fontSize: "12px",
625
- cursor: "pointer",
626
- ":hover": {
627
- fill: theme?.palette?.primary?.dark,
628
- },
629
- marginRight: "20px",
630
- },
631
- },
632
- },
633
- {
634
- type: "Control",
635
- scope: "#/properties/FooterBackHandlerText",
636
- options: {
637
- widget: "Box",
638
- },
639
- config: {
640
- main: {
641
- heading: "Previous Page",
642
- onClick: "backHandler",
643
- },
644
- style: {
645
- display: { xs: "none", sm: "flex" },
646
- textAlign: "left",
647
- lineHeight: 1,
648
- height: 0,
649
- width: "fit-content",
650
- color: theme?.palette?.primary?.main,
651
- fontSize: "12px",
652
- cursor: "pointer",
653
- marginLeft: "2px",
654
-
655
- top: 3,
656
- right: "12px",
657
- position: "absolute",
658
- ":hover": {
659
- color: theme?.palette?.primary?.dark,
660
- },
661
- marginRight: "4px",
662
- },
663
- },
664
- },
665
553
  ],
666
554
  }
667
555
  ],