impaktapps-ui-builder 0.0.101-alpha.1 → 0.0.101-alpha.10

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 (8) hide show
  1. package/dist/impaktapps-ui-builder.es.js +245 -401
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +9 -9
  4. package/dist/impaktapps-ui-builder.umd.js.map +1 -1
  5. package/package.json +1 -1
  6. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +255 -338
  7. package/src/impaktapps-ui-builder/builder/elements/UiSchema/PageMaster/uiSchema.ts +201 -292
  8. package/src/impaktapps-ui-builder/builder/services/component.ts +2 -2
package/dist/impaktapps-ui-builder.es.js CHANGED
@@ -47,18 +47,18 @@ const PageMasterSchema = {
47
47
  required: ["template", "name", "label"]
48
48
  };
49
49
  const PageMasterUiSchema = (theme) => {
50
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
50
+ var _a;
51
51
  const uiSchema = {
52
52
  type: "HorizontalLayout",
53
- heading: "Page Master",
53
+ heading: "Page",
54
54
  elements: [
55
55
  {
56
56
  type: "WrapperLayout",
57
57
  config: {
58
- main: {},
59
- wrapperStyle: {
60
- marginLeft: theme.spacing(2),
61
- backgroundColor: theme.palette.background.default
58
+ main: {
59
+ label: "Basic Details",
60
+ isAccordion: true,
61
+ gap: "8px"
62
62
  }
63
63
  },
64
64
  elements: [
@@ -69,9 +69,9 @@ const PageMasterUiSchema = (theme) => {
69
69
  widget: "InputField"
70
70
  },
71
71
  config: {
72
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
72
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
73
73
  main: {
74
- label: "Name",
74
+ label: "Page Name",
75
75
  options: [],
76
76
  color: "secondary",
77
77
  errorMessage: "Name should be start with 'page_'",
@@ -80,26 +80,6 @@ const PageMasterUiSchema = (theme) => {
80
80
  }
81
81
  }
82
82
  },
83
- {
84
- type: "Control",
85
- scope: "#/properties/template",
86
- options: {
87
- widget: "SelectInputField"
88
- },
89
- config: {
90
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
91
- main: {
92
- label: "Template",
93
- options: [
94
- { const: "template1", title: "template1" },
95
- { const: "template2", title: "template2" },
96
- { const: "template3", title: "template3" }
97
- ],
98
- color: "secondary",
99
- required: true
100
- }
101
- }
102
- },
103
83
  {
104
84
  type: "Control",
105
85
  scope: "#/properties/label",
@@ -107,9 +87,9 @@ const PageMasterUiSchema = (theme) => {
107
87
  widget: "InputField"
108
88
  },
109
89
  config: {
110
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
90
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
111
91
  main: {
112
- label: "Label",
92
+ label: "Page Heading",
113
93
  options: [],
114
94
  color: "secondary",
115
95
  required: true
@@ -120,7 +100,7 @@ const PageMasterUiSchema = (theme) => {
120
100
  type: "Control",
121
101
  scope: "#/properties/EmptyBox",
122
102
  config: {
123
- layout: { xs: 6, sm: 6, md: 0, lg: 0 }
103
+ layout: { xs: 0, sm: 0, md: 4, lg: 6 }
124
104
  },
125
105
  options: {
126
106
  widget: "EmptyBox"
@@ -131,11 +111,27 @@ const PageMasterUiSchema = (theme) => {
131
111
  {
132
112
  type: "TabLayout",
133
113
  config: {
114
+ layout: 12,
134
115
  main: {
135
- tabLabels: ["Components", "Events"],
136
- divider: true
116
+ tabLabels: ["Page Components", "Page Events"]
117
+ },
118
+ style: {
119
+ TabPanelStyle: {
120
+ padding: 0
121
+ }
137
122
  },
138
- defaultStyle: true
123
+ TabsStyle: {
124
+ borderTop: `1px solid ${theme.palette.common.black}29`,
125
+ marginBottom: "3px",
126
+ paddingBottom: "4px",
127
+ boxShadow: "0px 3px 4px #afafaf80",
128
+ "& .MuiTabs-indicator": {
129
+ bottom: "6px"
130
+ }
131
+ },
132
+ TabContainerStyle: {
133
+ marginTop: "-16px"
134
+ }
139
135
  },
140
136
  elements: [
141
137
  {
@@ -159,12 +155,18 @@ const PageMasterUiSchema = (theme) => {
159
155
  main: {
160
156
  onClick: "onAddClickHandler",
161
157
  size: "small",
162
- icon: "AddIcon",
163
- iconLabel: "Add New",
158
+ icon: "TableAddIcon",
159
+ iconLabel: "Add",
164
160
  styleDefault: true
165
161
  },
166
162
  style: {
167
- mt: "6px"
163
+ mt: "6px",
164
+ color: "inherit",
165
+ fill: "inherit",
166
+ "&:hover": {
167
+ color: "inherit",
168
+ fill: "inherit"
169
+ }
168
170
  }
169
171
  }
170
172
  }
@@ -180,12 +182,18 @@ const PageMasterUiSchema = (theme) => {
180
182
  main: {
181
183
  onClick: "copyPasteElement",
182
184
  size: "small",
183
- icon: "PasteIcon",
185
+ icon: "TablePaste",
184
186
  iconLabel: "Paste",
185
187
  styleDefault: true
186
188
  },
187
189
  style: {
188
- mt: "6px"
190
+ mt: "6px",
191
+ color: "inherit",
192
+ fill: "inherit",
193
+ "&:hover": {
194
+ color: "inherit",
195
+ fill: "inherit"
196
+ }
189
197
  }
190
198
  }
191
199
  }
@@ -200,16 +208,21 @@ const PageMasterUiSchema = (theme) => {
200
208
  elements: [
201
209
  {
202
210
  accessorKey: "name",
203
- header: "Name"
211
+ header: "Name",
212
+ size: 300,
213
+ type: "string"
204
214
  },
205
215
  {
206
216
  accessorKey: "type",
207
- header: "Type"
217
+ header: "Type",
218
+ size: 300,
219
+ type: "string"
208
220
  },
209
221
  {
210
222
  header: "Edit",
211
223
  field: "Reject_Records",
212
- flex: 1,
224
+ size: 150,
225
+ type: "action",
213
226
  widget: {
214
227
  type: "Control",
215
228
  scope: "#/properties/RejectButton",
@@ -218,13 +231,15 @@ const PageMasterUiSchema = (theme) => {
218
231
  },
219
232
  config: {
220
233
  main: {
221
- icon: "EditIcon",
222
- color: "primary",
234
+ icon: "TableEditIcon",
223
235
  onClick: "Edit_Components",
224
236
  tooltipMessage: "Edit This Record"
225
237
  },
226
238
  style: {
227
- color: theme.palette.primary.main
239
+ fill: theme.palette.primary.main,
240
+ "& :hover": {
241
+ fill: theme.palette.primary.dark
242
+ }
228
243
  }
229
244
  }
230
245
  }
@@ -232,7 +247,8 @@ const PageMasterUiSchema = (theme) => {
232
247
  {
233
248
  header: "Delete",
234
249
  field: "Reject_Records",
235
- flex: 1,
250
+ size: 150,
251
+ type: "action",
236
252
  widget: {
237
253
  type: "Control",
238
254
  scope: "#/properties/RejectButton",
@@ -241,10 +257,15 @@ const PageMasterUiSchema = (theme) => {
241
257
  },
242
258
  config: {
243
259
  main: {
244
- icon: "RejectIcon",
245
- color: "error",
260
+ icon: "Bin",
246
261
  onClick: "deletePopUpComponent",
247
262
  tooltipMessage: "Reject This Record"
263
+ },
264
+ style: {
265
+ fill: theme.palette.primary.main,
266
+ "& :hover": {
267
+ fill: theme.palette.primary.dark
268
+ }
248
269
  }
249
270
  }
250
271
  }
@@ -291,12 +312,18 @@ const PageMasterUiSchema = (theme) => {
291
312
  main: {
292
313
  onClick: "eventAddHandler",
293
314
  size: "small",
294
- icon: "AddIcon",
295
- iconLabel: "Add New",
315
+ icon: "TableAddIcon",
316
+ iconLabel: "Add",
296
317
  styleDefault: true
297
318
  },
298
319
  style: {
299
- mt: "6px"
320
+ mt: "6px",
321
+ color: "inherit",
322
+ fill: "inherit",
323
+ "&:hover": {
324
+ color: "inherit",
325
+ fill: "inherit"
326
+ }
300
327
  }
301
328
  }
302
329
  }
@@ -312,12 +339,18 @@ const PageMasterUiSchema = (theme) => {
312
339
  main: {
313
340
  onClick: "copyPasteElement",
314
341
  size: "small",
315
- icon: "PasteIcon",
342
+ icon: "TablePaste",
316
343
  iconLabel: "Paste",
317
344
  styleDefault: true
318
345
  },
319
346
  style: {
320
- mt: "6px"
347
+ mt: "6px",
348
+ color: "inherit",
349
+ fill: "inherit",
350
+ "&:hover": {
351
+ color: "inherit",
352
+ fill: "inherit"
353
+ }
321
354
  }
322
355
  }
323
356
  }
@@ -332,15 +365,21 @@ const PageMasterUiSchema = (theme) => {
332
365
  elements: [
333
366
  {
334
367
  accessorKey: "eventType",
335
- header: "Event Type"
368
+ header: "Event Type",
369
+ size: 300,
370
+ type: "string"
336
371
  },
337
372
  {
338
373
  accessorKey: "Handler",
339
- header: "Handler"
374
+ header: "Handler",
375
+ size: 300,
376
+ type: "string"
340
377
  },
341
378
  {
342
379
  accessorKey: "Edit_Approve_Records",
343
380
  header: "Edit Widget",
381
+ type: "action",
382
+ size: 150,
344
383
  widget: {
345
384
  type: "Control",
346
385
  scope: "#/properties/Edit_Records",
@@ -349,14 +388,16 @@ const PageMasterUiSchema = (theme) => {
349
388
  },
350
389
  config: {
351
390
  main: {
352
- color: "info",
353
391
  size: "small",
354
- icon: "EditIcon",
392
+ icon: "TableEditIcon",
355
393
  tooltipMessage: "Edit This Record",
356
394
  onClick: "editEvent"
357
395
  },
358
396
  style: {
359
- color: theme.palette.primary.main
397
+ fill: theme.palette.primary.main,
398
+ "& :hover": {
399
+ fill: theme.palette.primary.dark
400
+ }
360
401
  }
361
402
  }
362
403
  }
@@ -372,10 +413,15 @@ const PageMasterUiSchema = (theme) => {
372
413
  },
373
414
  config: {
374
415
  main: {
375
- icon: "RejectIcon",
376
- color: "error",
416
+ icon: "Bin",
377
417
  tooltipMessage: "Reject This Record",
378
418
  onClick: "deletePopUpEvent"
419
+ },
420
+ style: {
421
+ fill: theme.palette.primary.main,
422
+ "& :hover": {
423
+ fill: theme.palette.primary.dark
424
+ }
379
425
  }
380
426
  }
381
427
  }
@@ -404,79 +450,49 @@ const PageMasterUiSchema = (theme) => {
404
450
  ]
405
451
  },
406
452
  {
407
- type: "HorizontalLayout",
453
+ scope: "#/properties/Remarks Container",
454
+ type: "WrapperLayout",
408
455
  config: {
409
- layout: { xs: 12, sm: 9 }
456
+ layout: 12,
457
+ main: {
458
+ divider: false,
459
+ rowSpacing: 0,
460
+ gap: 0
461
+ },
462
+ componentsBoxStyle: {
463
+ padding: "8px 8px 8px 24px"
464
+ }
410
465
  },
411
466
  elements: [
412
467
  {
413
468
  type: "Control",
414
- scope: "#/properties/RemoveItemButton",
469
+ scope: "#/properties/btn",
415
470
  options: {
416
- widget: "IconButton"
417
- },
418
- config: {
419
- layout: { xs: 1, sm: 1 },
420
- main: {
421
- onClick: "RemoveItemButton",
422
- size: "large",
423
- icon: "RejectIcon",
424
- styleDefault: true
425
- },
426
- style: {
427
- marginLeft: "-5px"
428
- }
429
- }
430
- },
431
- {
432
- type: "Control",
433
- scope: "#/properties/copiedElementDetails",
434
- options: {
435
- widget: "Box"
471
+ widget: "Button"
436
472
  },
437
473
  config: {
438
- layout: { xs: 6, sm: 6 },
474
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
439
475
  main: {
440
- heading: "No element copied"
441
- },
442
- style: {
443
- color: "#535557",
444
- marginLeft: "-30px",
445
- fontSize: "12px",
446
- marginTop: "4px"
476
+ name: "Save",
477
+ variant: "contained",
478
+ type: "text",
479
+ onClick: "saveHandler",
480
+ size: "medium"
447
481
  }
448
482
  }
449
483
  },
450
484
  {
451
485
  type: "Control",
452
486
  scope: "#/properties/EmptyBox",
487
+ config: {
488
+ layout: { xs: 8, sm: 9.5, md: 10, lg: 10.5 }
489
+ },
453
490
  options: {
454
491
  widget: "EmptyBox"
455
- },
456
- config: {
457
- layout: { xs: 1, sm: 5 }
458
492
  }
459
493
  }
460
494
  ]
461
495
  },
462
- {
463
- type: "Control",
464
- scope: "#/properties/btn",
465
- options: {
466
- widget: "Button"
467
- },
468
- config: {
469
- layout: { xs: 4, sm: 2 },
470
- main: {
471
- name: "Save",
472
- startIcon: "ApproveIcon",
473
- variant: "contained",
474
- type: "text",
475
- onClick: "saveHandler",
476
- size: "medium"
477
- }
478
- }
479
- },
480
496
  {
481
497
  type: "Control",
482
498
  scope: "#/properties/popUpPageMasterComponent",
@@ -740,7 +756,7 @@ const PageMasterUiSchema = (theme) => {
740
756
  style: {
741
757
  flexDirection: "row",
742
758
  position: "absolute",
743
- bottom: 0,
759
+ bottom: 10,
744
760
  height: "fit-content",
745
761
  overflow: "hidden",
746
762
  zIndex: 1e3,
@@ -759,78 +775,19 @@ const PageMasterUiSchema = (theme) => {
759
775
  heading: "Copywriter@ACT21.IO"
760
776
  },
761
777
  style: {
762
- color: ((_b = (_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text) == null ? void 0 : _b.disabled) || "#AFAFAF",
778
+ color: ((_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text.disabled) || "#AFAFAF",
763
779
  fontSize: "11px",
764
780
  textAlign: "center",
765
- lineHeight: 2,
781
+ lineHeight: 0,
766
782
  width: "fit-content",
767
783
  left: "50%",
768
784
  position: "relative",
769
- margin: 0,
785
+ margin: "revert",
770
786
  flexGrow: 1,
771
787
  height: 0,
772
788
  transform: "translate(-50%, 0%)"
773
789
  }
774
790
  }
775
- },
776
- {
777
- type: "Control",
778
- scope: "#/properties/FooterBackIcon",
779
- options: {
780
- widget: "Box"
781
- },
782
- config: {
783
- main: {
784
- iconName: "PrevIcon",
785
- onClick: "backHandler",
786
- width: "fit-content"
787
- },
788
- style: {
789
- fill: (_d = (_c = theme == null ? void 0 : theme.palette) == null ? void 0 : _c.primary) == null ? void 0 : _d.main,
790
- width: 20,
791
- height: 0,
792
- top: 0,
793
- right: { xs: "12px", sm: "84px" },
794
- position: "absolute",
795
- fontSize: "12px",
796
- cursor: "pointer",
797
- ":hover": {
798
- fill: (_f = (_e = theme == null ? void 0 : theme.palette) == null ? void 0 : _e.primary) == null ? void 0 : _f.dark
799
- },
800
- marginRight: "20px"
801
- }
802
- }
803
- },
804
- {
805
- type: "Control",
806
- scope: "#/properties/FooterBackHandlerText",
807
- options: {
808
- widget: "Box"
809
- },
810
- config: {
811
- main: {
812
- heading: "Previous Page",
813
- onClick: "backHandler"
814
- },
815
- style: {
816
- display: { xs: "none", sm: "flex" },
817
- textAlign: "left",
818
- lineHeight: 1,
819
- height: 0,
820
- width: "fit-content",
821
- color: (_h = (_g = theme == null ? void 0 : theme.palette) == null ? void 0 : _g.primary) == null ? void 0 : _h.main,
822
- fontSize: "12px",
823
- cursor: "pointer",
824
- marginLeft: "2px",
825
- top: 3,
826
- right: "12px",
827
- position: "absolute",
828
- ":hover": {
829
- color: (_j = (_i = theme == null ? void 0 : theme.palette) == null ? void 0 : _i.primary) == null ? void 0 : _j.dark
830
- },
831
- marginRight: "4px"
832
- }
833
- }
834
791
  }
835
792
  ]
836
793
  }
@@ -6618,42 +6575,41 @@ const ComponentSchema = {
6618
6575
  required: ["name"]
6619
6576
  };
6620
6577
  const componentBasicUiSchema = (theme) => {
6621
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
6578
+ var _a;
6622
6579
  const uiSchema = {
6623
6580
  type: "HorizontalLayout",
6624
- heading: "Component",
6581
+ heading: "Page-Component",
6625
6582
  elements: [
6626
- {
6627
- type: "Control",
6628
- scope: "#/properties/pageName",
6629
- options: {
6630
- widget: "Box"
6631
- },
6632
- config: {
6633
- layout: 12,
6634
- main: {
6635
- heading: " "
6636
- },
6637
- style: {
6638
- marginLeft: theme.spacing(3),
6639
- width: "auto",
6640
- fontSize: "12px",
6641
- color: "gray"
6642
- }
6643
- }
6644
- },
6645
6583
  {
6646
6584
  type: "TabLayout",
6647
6585
  config: {
6648
6586
  main: {
6649
6587
  tabLabels: ["Core"],
6650
- defaultStyle: true,
6651
6588
  id: `component`
6589
+ },
6590
+ style: {
6591
+ TabPanelStyle: {
6592
+ padding: 0
6593
+ }
6594
+ },
6595
+ TabsStyle: {
6596
+ marginBottom: "3px",
6597
+ paddingBottom: "4px",
6598
+ boxShadow: "0px 3px 4px #afafaf80",
6599
+ "& .MuiTabs-indicator": {
6600
+ bottom: "6px"
6601
+ }
6652
6602
  }
6653
6603
  },
6654
6604
  elements: [
6655
6605
  {
6656
- type: "HorizontalLayout",
6606
+ type: "WrapperLayout",
6607
+ config: {
6608
+ main: {
6609
+ label: "",
6610
+ gap: "8px"
6611
+ }
6612
+ },
6657
6613
  elements: [
6658
6614
  {
6659
6615
  type: "Control",
@@ -6662,12 +6618,22 @@ const componentBasicUiSchema = (theme) => {
6662
6618
  widget: "SelectInputField"
6663
6619
  },
6664
6620
  config: {
6665
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6621
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
6666
6622
  main: {
6667
6623
  label: "Type"
6668
6624
  }
6669
6625
  }
6670
6626
  },
6627
+ {
6628
+ type: "Control",
6629
+ scope: "#/properties/proc",
6630
+ config: {
6631
+ layout: { xs: 6, sm: 0, md: 0, lg: 0 }
6632
+ },
6633
+ options: {
6634
+ widget: "EmptyBox"
6635
+ }
6636
+ },
6671
6637
  {
6672
6638
  type: "Control",
6673
6639
  scope: "#/properties/name",
@@ -6675,9 +6641,9 @@ const componentBasicUiSchema = (theme) => {
6675
6641
  widget: "InputField"
6676
6642
  },
6677
6643
  config: {
6678
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6644
+ layout: { xs: 12, sm: 6, md: 4, lg: 3 },
6679
6645
  main: {
6680
- label: "Name",
6646
+ label: "Component ID",
6681
6647
  options: [],
6682
6648
  color: "secondary",
6683
6649
  required: true
@@ -6691,7 +6657,7 @@ const componentBasicUiSchema = (theme) => {
6691
6657
  widget: "InputField"
6692
6658
  },
6693
6659
  config: {
6694
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6660
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
6695
6661
  main: {
6696
6662
  label: "Label",
6697
6663
  options: [],
@@ -6700,34 +6666,11 @@ const componentBasicUiSchema = (theme) => {
6700
6666
  }
6701
6667
  }
6702
6668
  },
6703
- {
6704
- type: "Control",
6705
- scope: "#/properties/columnFormat",
6706
- options: {
6707
- widget: "SelectInputField"
6708
- },
6709
- config: {
6710
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6711
- main: {
6712
- label: "Column Format"
6713
- }
6714
- }
6715
- },
6716
6669
  {
6717
6670
  type: "Control",
6718
6671
  scope: "#/properties/proc",
6719
6672
  config: {
6720
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6721
- },
6722
- options: {
6723
- widget: "EmptyBox"
6724
- }
6725
- },
6726
- {
6727
- type: "Control",
6728
- scope: "#/properties/proc",
6729
- config: {
6730
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6673
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 }
6731
6674
  },
6732
6675
  options: {
6733
6676
  widget: "EmptyBox"
@@ -6736,114 +6679,72 @@ const componentBasicUiSchema = (theme) => {
6736
6679
  {
6737
6680
  type: "Control",
6738
6681
  scope: "#/properties/layout",
6739
- layout: 12,
6740
6682
  options: {
6741
- detail: {
6742
- type: "HorizontalLayout",
6743
- elements: [
6744
- {
6745
- type: "Control",
6746
- scope: "#/properties/key",
6747
- options: {
6748
- widget: "SelectInputField"
6749
- },
6750
- config: {
6751
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6752
- main: {
6753
- label: "Screen Size"
6754
- }
6755
- }
6756
- },
6757
- {
6758
- type: "Control",
6759
- scope: "#/properties/value",
6760
- options: {
6761
- widget: "InputField"
6762
- },
6763
- config: {
6764
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6765
- main: {
6766
- label: "Value",
6767
- type: "number",
6768
- helperText: "Number should be in range of 0 to 12",
6769
- errorMessage: "Number Can't be greater than 12 and can't be less than 0."
6770
- }
6771
- }
6772
- },
6773
- {
6774
- type: "Control",
6775
- scope: "#/properties/proc",
6776
- config: {
6777
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6778
- },
6779
- options: {
6780
- widget: "EmptyBox"
6781
- }
6683
+ widget: "Array"
6684
+ },
6685
+ config: {
6686
+ layout: 12,
6687
+ main: {
6688
+ label: "Layout",
6689
+ childElementLabel: "Layout"
6690
+ },
6691
+ style: {
6692
+ marginLeft: "-24px",
6693
+ marginBottom: "24px !important",
6694
+ labelStyle: {
6695
+ marginLeft: "24px"
6696
+ },
6697
+ detailsStyle: {
6698
+ marginLeft: "24px"
6699
+ }
6700
+ }
6701
+ },
6702
+ elements: [
6703
+ {
6704
+ type: "Control",
6705
+ scope: "#/properties/key",
6706
+ options: {
6707
+ widget: "SelectInputField"
6708
+ },
6709
+ config: {
6710
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6711
+ main: {
6712
+ label: "Screen Size"
6782
6713
  }
6783
- ]
6714
+ }
6715
+ },
6716
+ {
6717
+ type: "Control",
6718
+ scope: "#/properties/value",
6719
+ options: {
6720
+ widget: "InputField"
6721
+ },
6722
+ config: {
6723
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6724
+ main: {
6725
+ label: "Value",
6726
+ type: "number",
6727
+ helperText: "Number should be in range of 0 to 12",
6728
+ errorMessage: "Number Can't be greater than 12 and can't be less than 0."
6729
+ }
6730
+ }
6731
+ },
6732
+ {
6733
+ type: "Control",
6734
+ scope: "#/properties/proc",
6735
+ config: {
6736
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6737
+ },
6738
+ options: {
6739
+ widget: "EmptyBox"
6740
+ }
6784
6741
  }
6785
- }
6742
+ ]
6786
6743
  }
6787
6744
  ]
6788
6745
  }
6789
6746
  ]
6790
6747
  },
6791
- {
6792
- type: "HorizontalLayout",
6793
- config: {
6794
- layout: { xs: 12, sm: 6 }
6795
- },
6796
- elements: [
6797
- {
6798
- type: "Control",
6799
- scope: "#/properties/RemoveItemButton",
6800
- options: {
6801
- widget: "IconButton"
6802
- },
6803
- config: {
6804
- layout: { xs: 1, sm: 1 },
6805
- main: {
6806
- onClick: "RemoveItemButton",
6807
- size: "large",
6808
- icon: "RejectIcon",
6809
- styleDefault: true
6810
- },
6811
- style: {
6812
- marginLeft: "-10px"
6813
- }
6814
- }
6815
- },
6816
- {
6817
- type: "Control",
6818
- scope: "#/properties/copiedElementDetails",
6819
- options: {
6820
- widget: "Box"
6821
- },
6822
- config: {
6823
- layout: { xs: 6, sm: 6 },
6824
- main: {
6825
- heading: "No element copied"
6826
- },
6827
- style: {
6828
- color: "#535557",
6829
- marginLeft: "-10px",
6830
- fontSize: "12px",
6831
- marginTop: "4px"
6832
- }
6833
- }
6834
- },
6835
- {
6836
- type: "Control",
6837
- scope: "#/properties/EmptyBox",
6838
- options: {
6839
- widget: "EmptyBox"
6840
- },
6841
- config: {
6842
- layout: { xs: 1, sm: 5 }
6843
- }
6844
- }
6845
- ]
6846
- },
6847
6748
  {
6848
6749
  type: "Control",
6849
6750
  scope: "#/properties/btn",
@@ -6851,10 +6752,9 @@ const componentBasicUiSchema = (theme) => {
6851
6752
  widget: "Button"
6852
6753
  },
6853
6754
  config: {
6854
- layout: { xs: 4, sm: 2 },
6755
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
6855
6756
  main: {
6856
6757
  name: "Ok",
6857
- startIcon: "ApproveIcon",
6858
6758
  variant: "contained",
6859
6759
  type: "text",
6860
6760
  onClick: "okHandler",
@@ -6869,10 +6769,9 @@ const componentBasicUiSchema = (theme) => {
6869
6769
  widget: "Button"
6870
6770
  },
6871
6771
  config: {
6872
- layout: { xs: 4, sm: 2 },
6772
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
6873
6773
  main: {
6874
6774
  name: "Save & Exit",
6875
- startIcon: "ApproveIcon",
6876
6775
  variant: "contained",
6877
6776
  type: "text",
6878
6777
  onClick: "saveHandler",
@@ -6880,6 +6779,16 @@ const componentBasicUiSchema = (theme) => {
6880
6779
  }
6881
6780
  }
6882
6781
  },
6782
+ {
6783
+ type: "Control",
6784
+ scope: "#/properties/EmptyBox",
6785
+ config: {
6786
+ layout: { xs: 4, sm: 7, md: 8, lg: 9 }
6787
+ },
6788
+ options: {
6789
+ widget: "EmptyBox"
6790
+ }
6791
+ },
6883
6792
  {
6884
6793
  type: "Control",
6885
6794
  scope: "#/properties/popUpComponentSection",
@@ -6938,9 +6847,7 @@ const componentBasicUiSchema = (theme) => {
6938
6847
  layout: 6,
6939
6848
  main: {
6940
6849
  name: "No",
6941
- startIcon: "ApproveIcon",
6942
6850
  variant: "contained",
6943
- color: "info",
6944
6851
  type: "text",
6945
6852
  onClick: "deletePopUpComponent",
6946
6853
  size: "large"
@@ -6974,7 +6881,6 @@ const componentBasicUiSchema = (theme) => {
6974
6881
  layout: 6,
6975
6882
  main: {
6976
6883
  name: "Yes",
6977
- startIcon: "ApproveIcon",
6978
6884
  variant: "contained",
6979
6885
  color: "error",
6980
6886
  type: "text",
@@ -7061,9 +6967,7 @@ const componentBasicUiSchema = (theme) => {
7061
6967
  layout: 6,
7062
6968
  main: {
7063
6969
  name: "No",
7064
- startIcon: "ApproveIcon",
7065
6970
  variant: "contained",
7066
- color: "info",
7067
6971
  type: "text",
7068
6972
  onClick: "deletePopUpEvent",
7069
6973
  size: "large"
@@ -7097,7 +7001,6 @@ const componentBasicUiSchema = (theme) => {
7097
7001
  layout: 6,
7098
7002
  main: {
7099
7003
  name: "Yes",
7100
- startIcon: "ApproveIcon",
7101
7004
  variant: "contained",
7102
7005
  color: "error",
7103
7006
  type: "text",
@@ -7143,7 +7046,7 @@ const componentBasicUiSchema = (theme) => {
7143
7046
  style: {
7144
7047
  flexDirection: "row",
7145
7048
  position: "absolute",
7146
- bottom: 0,
7049
+ bottom: 10,
7147
7050
  height: "fit-content",
7148
7051
  overflow: "hidden",
7149
7052
  zIndex: 1e3,
@@ -7162,78 +7065,19 @@ const componentBasicUiSchema = (theme) => {
7162
7065
  heading: "Copywriter@ACT21.IO"
7163
7066
  },
7164
7067
  style: {
7165
- color: ((_b = (_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text) == null ? void 0 : _b.disabled) || "#AFAFAF",
7068
+ color: ((_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text.disabled) || "#AFAFAF",
7166
7069
  fontSize: "11px",
7167
7070
  textAlign: "center",
7168
- lineHeight: 2,
7071
+ lineHeight: 0,
7169
7072
  width: "fit-content",
7170
7073
  left: "50%",
7171
7074
  position: "relative",
7172
- margin: 0,
7075
+ margin: "revert",
7173
7076
  flexGrow: 1,
7174
7077
  height: 0,
7175
7078
  transform: "translate(-50%, 0%)"
7176
7079
  }
7177
7080
  }
7178
- },
7179
- {
7180
- type: "Control",
7181
- scope: "#/properties/FooterBackIcon",
7182
- options: {
7183
- widget: "Box"
7184
- },
7185
- config: {
7186
- main: {
7187
- iconName: "PrevIcon",
7188
- onClick: "backHandler",
7189
- width: "fit-content"
7190
- },
7191
- style: {
7192
- fill: (_d = (_c = theme == null ? void 0 : theme.palette) == null ? void 0 : _c.primary) == null ? void 0 : _d.main,
7193
- width: 20,
7194
- height: 0,
7195
- top: 0,
7196
- right: { xs: "12px", sm: "84px" },
7197
- position: "absolute",
7198
- fontSize: "12px",
7199
- cursor: "pointer",
7200
- ":hover": {
7201
- fill: (_f = (_e = theme == null ? void 0 : theme.palette) == null ? void 0 : _e.primary) == null ? void 0 : _f.dark
7202
- },
7203
- marginRight: "20px"
7204
- }
7205
- }
7206
- },
7207
- {
7208
- type: "Control",
7209
- scope: "#/properties/FooterBackHandlerText",
7210
- options: {
7211
- widget: "Box"
7212
- },
7213
- config: {
7214
- main: {
7215
- heading: "Previous Page",
7216
- onClick: "backHandler"
7217
- },
7218
- style: {
7219
- display: { xs: "none", sm: "flex" },
7220
- textAlign: "left",
7221
- lineHeight: 1,
7222
- height: 0,
7223
- width: "fit-content",
7224
- color: (_h = (_g = theme == null ? void 0 : theme.palette) == null ? void 0 : _g.primary) == null ? void 0 : _h.main,
7225
- fontSize: "12px",
7226
- cursor: "pointer",
7227
- marginLeft: "2px",
7228
- top: 3,
7229
- right: "12px",
7230
- position: "absolute",
7231
- ":hover": {
7232
- color: (_j = (_i = theme == null ? void 0 : theme.palette) == null ? void 0 : _i.primary) == null ? void 0 : _j.dark
7233
- },
7234
- marginRight: "4px"
7235
- }
7236
- }
7237
7081
  }
7238
7082
  ]
7239
7083
  }
@@ -8448,8 +8292,8 @@ function refreshPage(type, store2) {
8448
8292
  Validation: ValidationSection
8449
8293
  };
8450
8294
  const elements = (_a = sectionLabels[type]) == null ? void 0 : _a.map((e) => sectionUiSchema[e]);
8451
- UiSchema.elements[1].config.main.tabLabels = sectionLabels[type] || ["Core", "Style", "Event", "Validation"];
8452
- UiSchema.elements[1].elements = elements || [CoreSection, StyleSection, EventSection(store2.theme.myTheme), ValidationSection];
8295
+ UiSchema.elements[0].config.main.tabLabels = sectionLabels[type] || ["Core", "Style", "Event", "Validation"];
8296
+ UiSchema.elements[0].elements = elements || [CoreSection, StyleSection, EventSection(store2.theme.myTheme), ValidationSection];
8453
8297
  }
8454
8298
  if (sessionStorage.getItem("copiedConfig")) {
8455
8299
  this.ElementPathSetter(UiSchema);