impaktapps-ui-builder 0.0.101-alpha.2 → 0.0.101-alpha.20

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 (29) hide show
  1. package/dist/impaktapps-ui-builder.es.js +760 -842
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +11 -11
  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 -56
  6. package/dist/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.d.ts +7 -8
  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/package.json +1 -1
  15. package/src/impaktapps-ui-builder/builder/build/uischema/apiSection.ts +111 -96
  16. package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts +13 -19
  17. package/src/impaktapps-ui-builder/builder/build/uischema/coreSection.ts +189 -110
  18. package/src/impaktapps-ui-builder/builder/build/uischema/eventSection.ts +37 -15
  19. package/src/impaktapps-ui-builder/builder/build/uischema/refresh.ts +44 -44
  20. package/src/impaktapps-ui-builder/builder/build/uischema/styleSection.ts +9 -13
  21. package/src/impaktapps-ui-builder/builder/build/uischema/tableSection.ts +40 -18
  22. package/src/impaktapps-ui-builder/builder/build/uischema/validationSections.ts +117 -48
  23. package/src/impaktapps-ui-builder/builder/build/uischema/valueTab.ts +113 -45
  24. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/schema.ts +19 -19
  25. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +272 -346
  26. package/src/impaktapps-ui-builder/builder/elements/UiSchema/PageMaster/uiSchema.ts +109 -241
  27. package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/uiSchema.ts +168 -115
  28. package/src/impaktapps-ui-builder/builder/services/component.ts +2 -2
  29. package/src/impaktapps-ui-builder/builder/services/event.ts +12 -12
package/dist/impaktapps-ui-builder.es.js CHANGED
@@ -47,7 +47,7 @@ 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
53
  heading: "Page",
@@ -128,6 +128,9 @@ const PageMasterUiSchema = (theme) => {
128
128
  "& .MuiTabs-indicator": {
129
129
  bottom: "6px"
130
130
  }
131
+ },
132
+ TabContainerStyle: {
133
+ marginTop: "-16px"
131
134
  }
132
135
  },
133
136
  elements: [
@@ -179,7 +182,7 @@ const PageMasterUiSchema = (theme) => {
179
182
  main: {
180
183
  onClick: "copyPasteElement",
181
184
  size: "small",
182
- icon: "PasteIcon",
185
+ icon: "TablePaste",
183
186
  iconLabel: "Paste",
184
187
  styleDefault: true
185
188
  },
@@ -336,12 +339,18 @@ const PageMasterUiSchema = (theme) => {
336
339
  main: {
337
340
  onClick: "copyPasteElement",
338
341
  size: "small",
339
- icon: "PasteIcon",
342
+ icon: "TablePaste",
340
343
  iconLabel: "Paste",
341
344
  styleDefault: true
342
345
  },
343
346
  style: {
344
- mt: "6px"
347
+ mt: "6px",
348
+ color: "inherit",
349
+ fill: "inherit",
350
+ "&:hover": {
351
+ color: "inherit",
352
+ fill: "inherit"
353
+ }
345
354
  }
346
355
  }
347
356
  }
@@ -363,7 +372,7 @@ const PageMasterUiSchema = (theme) => {
363
372
  {
364
373
  accessorKey: "Handler",
365
374
  header: "Handler",
366
- size: 300,
375
+ size: 200,
367
376
  type: "string"
368
377
  },
369
378
  {
@@ -396,6 +405,8 @@ const PageMasterUiSchema = (theme) => {
396
405
  {
397
406
  accessorKey: "Reject_Records",
398
407
  header: "Delete",
408
+ type: "action",
409
+ size: 150,
399
410
  widget: {
400
411
  type: "Control",
401
412
  scope: "#/properties/RejectButton",
@@ -420,7 +431,8 @@ const PageMasterUiSchema = (theme) => {
420
431
  {
421
432
  header: "Copy",
422
433
  field: "Copy_Event",
423
- flex: 1,
434
+ type: "action",
435
+ size: 150,
424
436
  widget: {
425
437
  type: "Control",
426
438
  scope: "#/properties/Copy_Event",
@@ -441,79 +453,49 @@ const PageMasterUiSchema = (theme) => {
441
453
  ]
442
454
  },
443
455
  {
444
- type: "HorizontalLayout",
456
+ scope: "#/properties/Remarks Container",
457
+ type: "WrapperLayout",
445
458
  config: {
446
- layout: { xs: 12, sm: 9 }
459
+ layout: 12,
460
+ main: {
461
+ divider: false,
462
+ rowSpacing: 0,
463
+ gap: 0
464
+ },
465
+ componentsBoxStyle: {
466
+ padding: "8px 8px 8px 24px"
467
+ }
447
468
  },
448
469
  elements: [
449
470
  {
450
471
  type: "Control",
451
- scope: "#/properties/RemoveItemButton",
452
- options: {
453
- widget: "IconButton"
454
- },
455
- config: {
456
- layout: { xs: 1, sm: 1 },
457
- main: {
458
- onClick: "RemoveItemButton",
459
- size: "large",
460
- icon: "RejectIcon",
461
- styleDefault: true
462
- },
463
- style: {
464
- marginLeft: "-5px"
465
- }
466
- }
467
- },
468
- {
469
- type: "Control",
470
- scope: "#/properties/copiedElementDetails",
472
+ scope: "#/properties/btn",
471
473
  options: {
472
- widget: "Box"
474
+ widget: "Button"
473
475
  },
474
476
  config: {
475
- layout: { xs: 6, sm: 6 },
477
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
476
478
  main: {
477
- heading: "No element copied"
478
- },
479
- style: {
480
- color: "#535557",
481
- marginLeft: "-30px",
482
- fontSize: "12px",
483
- marginTop: "4px"
479
+ name: "Save",
480
+ variant: "contained",
481
+ type: "text",
482
+ onClick: "saveHandler",
483
+ size: "medium"
484
484
  }
485
485
  }
486
486
  },
487
487
  {
488
488
  type: "Control",
489
489
  scope: "#/properties/EmptyBox",
490
+ config: {
491
+ layout: { xs: 8, sm: 9.5, md: 10, lg: 10.5 }
492
+ },
490
493
  options: {
491
494
  widget: "EmptyBox"
492
- },
493
- config: {
494
- layout: { xs: 1, sm: 5 }
495
495
  }
496
496
  }
497
497
  ]
498
498
  },
499
- {
500
- type: "Control",
501
- scope: "#/properties/btn",
502
- options: {
503
- widget: "Button"
504
- },
505
- config: {
506
- layout: { xs: 4, sm: 2 },
507
- main: {
508
- name: "Save",
509
- startIcon: "ApproveIcon",
510
- variant: "contained",
511
- type: "text",
512
- onClick: "saveHandler",
513
- size: "medium"
514
- }
515
- }
516
- },
517
499
  {
518
500
  type: "Control",
519
501
  scope: "#/properties/popUpPageMasterComponent",
@@ -777,7 +759,7 @@ const PageMasterUiSchema = (theme) => {
777
759
  style: {
778
760
  flexDirection: "row",
779
761
  position: "absolute",
780
- bottom: 0,
762
+ bottom: 10,
781
763
  height: "fit-content",
782
764
  overflow: "hidden",
783
765
  zIndex: 1e3,
@@ -796,78 +778,19 @@ const PageMasterUiSchema = (theme) => {
796
778
  heading: "Copywriter@ACT21.IO"
797
779
  },
798
780
  style: {
799
- color: ((_b = (_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text) == null ? void 0 : _b.disabled) || "#AFAFAF",
781
+ color: ((_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text.disabled) || "#AFAFAF",
800
782
  fontSize: "11px",
801
783
  textAlign: "center",
802
- lineHeight: 2,
784
+ lineHeight: 0,
803
785
  width: "fit-content",
804
786
  left: "50%",
805
787
  position: "relative",
806
- margin: 0,
788
+ margin: "revert",
807
789
  flexGrow: 1,
808
790
  height: 0,
809
791
  transform: "translate(-50%, 0%)"
810
792
  }
811
793
  }
812
- },
813
- {
814
- type: "Control",
815
- scope: "#/properties/FooterBackIcon",
816
- options: {
817
- widget: "Box"
818
- },
819
- config: {
820
- main: {
821
- iconName: "PrevIcon",
822
- onClick: "backHandler",
823
- width: "fit-content"
824
- },
825
- style: {
826
- fill: (_d = (_c = theme == null ? void 0 : theme.palette) == null ? void 0 : _c.primary) == null ? void 0 : _d.main,
827
- width: 20,
828
- height: 0,
829
- top: 0,
830
- right: { xs: "12px", sm: "84px" },
831
- position: "absolute",
832
- fontSize: "12px",
833
- cursor: "pointer",
834
- ":hover": {
835
- fill: (_f = (_e = theme == null ? void 0 : theme.palette) == null ? void 0 : _e.primary) == null ? void 0 : _f.dark
836
- },
837
- marginRight: "20px"
838
- }
839
- }
840
- },
841
- {
842
- type: "Control",
843
- scope: "#/properties/FooterBackHandlerText",
844
- options: {
845
- widget: "Box"
846
- },
847
- config: {
848
- main: {
849
- heading: "Previous Page",
850
- onClick: "backHandler"
851
- },
852
- style: {
853
- display: { xs: "none", sm: "flex" },
854
- textAlign: "left",
855
- lineHeight: 1,
856
- height: 0,
857
- width: "fit-content",
858
- color: (_h = (_g = theme == null ? void 0 : theme.palette) == null ? void 0 : _g.primary) == null ? void 0 : _h.main,
859
- fontSize: "12px",
860
- cursor: "pointer",
861
- marginLeft: "2px",
862
- top: 3,
863
- right: "12px",
864
- position: "absolute",
865
- ":hover": {
866
- color: (_j = (_i = theme == null ? void 0 : theme.palette) == null ? void 0 : _i.primary) == null ? void 0 : _j.dark
867
- },
868
- marginRight: "4px"
869
- }
870
- }
871
794
  }
872
795
  ]
873
796
  }
@@ -6320,44 +6243,44 @@ const ComponentSchema = {
6320
6243
  properties: {
6321
6244
  type: {
6322
6245
  oneOf: [
6323
- { title: "AadharcardText", const: "AadharcardText" },
6246
+ { title: "Masked Aadhaar", const: "AadharcardText" },
6324
6247
  { title: "Array", const: "Array" },
6325
6248
  { title: "Button", const: "Button" },
6326
- { title: "Card", const: "card" },
6327
- { title: "CheckBox", const: "CheckBox" },
6249
+ { title: "Data Card", const: "card" },
6250
+ { title: "Check Box", const: "CheckBox" },
6328
6251
  { title: "Container", const: "WrapperSection" },
6329
- { title: "DataGrid", const: "DataGrid" },
6252
+ { title: "Data Grid", const: "DataGrid" },
6330
6253
  { title: "Date", const: "Date" },
6331
- { title: "DateTime", const: "DateTime" },
6332
- { title: "Download File", const: "DownloadFile" },
6254
+ { title: "Time Stamp", const: "DateTime" },
6255
+ { title: "Download", const: "DownloadFile" },
6333
6256
  { title: "Empty Box", const: "EmptyBox" },
6334
- { title: "File", const: "FileInput" },
6257
+ { title: "File Handler", const: "FileInput" },
6335
6258
  { title: "Graph", const: "Graph" },
6336
6259
  { title: "Input Slider", const: "InputSlider" },
6337
6260
  { title: "Label", const: "Box" },
6338
6261
  { title: "LeaderBoard", const: "LeaderBoard" },
6339
- { title: "MultipleSelect", const: "MultipleSelect" },
6340
- { title: "PanCardText", const: "PanCardText" },
6341
- { title: "Popup Container", const: "PopUp" },
6342
- { title: "ProgressBar", const: "ProgressBar" },
6343
- { title: "ProgressBar Card", const: "ProgressBarCard" },
6344
- { title: "Select", const: "Select" },
6262
+ { title: "Multi-Select Dropdown", const: "MultipleSelect" },
6263
+ { title: "Pan Card Masked", const: "PanCardText" },
6264
+ { title: "Pop Up", const: "PopUp" },
6265
+ { title: "Progress Bar", const: "ProgressBar" },
6266
+ { title: "Progress Bar Card", const: "ProgressBarCard" },
6267
+ { title: "Dropdown", const: "Select" },
6345
6268
  { title: "Slider", const: "Slider" },
6346
- { title: "SpeedoMeter", const: "SpeedoMeter" },
6269
+ { title: "Speedometer", const: "SpeedoMeter" },
6347
6270
  { title: "Stepper Container", const: "Stepper" },
6348
6271
  { title: "Radio", const: "Radio" },
6349
6272
  { title: "Rank", const: "Rank" },
6350
6273
  { title: "Rank Card", const: "RankCard" },
6351
- { title: "Runner Boy Progress Bar", const: "RunnerBoyProgressBar" },
6274
+ { title: "Runner Boy", const: "RunnerBoyProgressBar" },
6352
6275
  { title: "Table", const: "Table" },
6353
6276
  { title: "Tabs", const: "TabSection" },
6354
6277
  { title: "Text", const: "Text" },
6355
6278
  { title: "Text Area", const: "TextArea" },
6356
6279
  { title: "Timer", const: "Timer" },
6357
- { title: "Upload File", const: "UploadFile" },
6358
- { title: "TreeMap", const: "TreeMap" },
6359
- { title: "ColumnGroup", const: "ColumnGroup" },
6360
- { title: "Thought of the Day", const: "Thought" },
6280
+ { title: "Upload", const: "UploadFile" },
6281
+ { title: "Tree ", const: "TreeMap" },
6282
+ { title: "Column Group", const: "ColumnGroup" },
6283
+ { title: "Thought of the day", const: "Thought" },
6361
6284
  { title: "Pdf Viewer", const: "PdfViewer" }
6362
6285
  ]
6363
6286
  },
@@ -6655,42 +6578,41 @@ const ComponentSchema = {
6655
6578
  required: ["name"]
6656
6579
  };
6657
6580
  const componentBasicUiSchema = (theme) => {
6658
- var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
6581
+ var _a;
6659
6582
  const uiSchema = {
6660
6583
  type: "HorizontalLayout",
6661
- heading: "Component",
6584
+ heading: "Page-Component",
6662
6585
  elements: [
6663
- {
6664
- type: "Control",
6665
- scope: "#/properties/pageName",
6666
- options: {
6667
- widget: "Box"
6668
- },
6669
- config: {
6670
- layout: 12,
6671
- main: {
6672
- heading: " "
6673
- },
6674
- style: {
6675
- marginLeft: theme.spacing(3),
6676
- width: "auto",
6677
- fontSize: "12px",
6678
- color: "gray"
6679
- }
6680
- }
6681
- },
6682
6586
  {
6683
6587
  type: "TabLayout",
6684
6588
  config: {
6685
6589
  main: {
6686
6590
  tabLabels: ["Core"],
6687
- defaultStyle: true,
6688
6591
  id: `component`
6592
+ },
6593
+ style: {
6594
+ TabPanelStyle: {
6595
+ padding: 0
6596
+ }
6597
+ },
6598
+ TabsStyle: {
6599
+ marginBottom: "3px",
6600
+ paddingBottom: "4px",
6601
+ boxShadow: "0px 3px 4px #afafaf80",
6602
+ "& .MuiTabs-indicator": {
6603
+ bottom: "6px"
6604
+ }
6689
6605
  }
6690
6606
  },
6691
6607
  elements: [
6692
6608
  {
6693
- type: "HorizontalLayout",
6609
+ type: "WrapperLayout",
6610
+ config: {
6611
+ main: {
6612
+ label: " ",
6613
+ gap: "8px"
6614
+ }
6615
+ },
6694
6616
  elements: [
6695
6617
  {
6696
6618
  type: "Control",
@@ -6699,12 +6621,22 @@ const componentBasicUiSchema = (theme) => {
6699
6621
  widget: "SelectInputField"
6700
6622
  },
6701
6623
  config: {
6702
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6624
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
6703
6625
  main: {
6704
6626
  label: "Type"
6705
6627
  }
6706
6628
  }
6707
6629
  },
6630
+ {
6631
+ type: "Control",
6632
+ scope: "#/properties/proc",
6633
+ config: {
6634
+ layout: { xs: 6, sm: 0, md: 0, lg: 0 }
6635
+ },
6636
+ options: {
6637
+ widget: "EmptyBox"
6638
+ }
6639
+ },
6708
6640
  {
6709
6641
  type: "Control",
6710
6642
  scope: "#/properties/name",
@@ -6712,11 +6644,9 @@ const componentBasicUiSchema = (theme) => {
6712
6644
  widget: "InputField"
6713
6645
  },
6714
6646
  config: {
6715
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6647
+ layout: { xs: 12, sm: 6, md: 4, lg: 3 },
6716
6648
  main: {
6717
- label: "Name",
6718
- options: [],
6719
- color: "secondary",
6649
+ label: "Component ID",
6720
6650
  required: true
6721
6651
  }
6722
6652
  }
@@ -6728,7 +6658,7 @@ const componentBasicUiSchema = (theme) => {
6728
6658
  widget: "InputField"
6729
6659
  },
6730
6660
  config: {
6731
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6661
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
6732
6662
  main: {
6733
6663
  label: "Label",
6734
6664
  options: [],
@@ -6737,34 +6667,11 @@ const componentBasicUiSchema = (theme) => {
6737
6667
  }
6738
6668
  }
6739
6669
  },
6740
- {
6741
- type: "Control",
6742
- scope: "#/properties/columnFormat",
6743
- options: {
6744
- widget: "SelectInputField"
6745
- },
6746
- config: {
6747
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6748
- main: {
6749
- label: "Column Format"
6750
- }
6751
- }
6752
- },
6753
- {
6754
- type: "Control",
6755
- scope: "#/properties/proc",
6756
- config: {
6757
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6758
- },
6759
- options: {
6760
- widget: "EmptyBox"
6761
- }
6762
- },
6763
6670
  {
6764
6671
  type: "Control",
6765
6672
  scope: "#/properties/proc",
6766
6673
  config: {
6767
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6674
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 }
6768
6675
  },
6769
6676
  options: {
6770
6677
  widget: "EmptyBox"
@@ -6773,163 +6680,139 @@ const componentBasicUiSchema = (theme) => {
6773
6680
  {
6774
6681
  type: "Control",
6775
6682
  scope: "#/properties/layout",
6776
- layout: 12,
6777
6683
  options: {
6778
- detail: {
6779
- type: "HorizontalLayout",
6780
- elements: [
6781
- {
6782
- type: "Control",
6783
- scope: "#/properties/key",
6784
- options: {
6785
- widget: "SelectInputField"
6786
- },
6787
- config: {
6788
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6789
- main: {
6790
- label: "Screen Size"
6791
- }
6792
- }
6793
- },
6794
- {
6795
- type: "Control",
6796
- scope: "#/properties/value",
6797
- options: {
6798
- widget: "InputField"
6799
- },
6800
- config: {
6801
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6802
- main: {
6803
- label: "Value",
6804
- type: "number",
6805
- helperText: "Number should be in range of 0 to 12",
6806
- errorMessage: "Number Can't be greater than 12 and can't be less than 0."
6807
- }
6808
- }
6809
- },
6810
- {
6811
- type: "Control",
6812
- scope: "#/properties/proc",
6813
- config: {
6814
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6815
- },
6816
- options: {
6817
- widget: "EmptyBox"
6818
- }
6684
+ widget: "Array"
6685
+ },
6686
+ config: {
6687
+ layout: 12,
6688
+ main: {
6689
+ label: "Layout",
6690
+ childElementLabel: "Layout"
6691
+ },
6692
+ style: {
6693
+ marginLeft: "-24px",
6694
+ marginBottom: "24px !important",
6695
+ labelStyle: {
6696
+ marginLeft: "24px"
6697
+ },
6698
+ detailsStyle: {
6699
+ marginLeft: "24px"
6700
+ }
6701
+ }
6702
+ },
6703
+ elements: [
6704
+ {
6705
+ type: "Control",
6706
+ scope: "#/properties/key",
6707
+ options: {
6708
+ widget: "SelectInputField"
6709
+ },
6710
+ config: {
6711
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6712
+ main: {
6713
+ label: "Screen Size"
6714
+ }
6715
+ }
6716
+ },
6717
+ {
6718
+ type: "Control",
6719
+ scope: "#/properties/value",
6720
+ options: {
6721
+ widget: "InputField"
6722
+ },
6723
+ config: {
6724
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6725
+ main: {
6726
+ label: "Value",
6727
+ type: "number",
6728
+ helperText: "Number should be in range of 0 to 12",
6729
+ errorMessage: "Number Can't be greater than 12 and can't be less than 0."
6819
6730
  }
6820
- ]
6731
+ }
6732
+ },
6733
+ {
6734
+ type: "Control",
6735
+ scope: "#/properties/proc",
6736
+ config: {
6737
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6738
+ },
6739
+ options: {
6740
+ widget: "EmptyBox"
6741
+ }
6821
6742
  }
6822
- }
6743
+ ]
6823
6744
  }
6824
6745
  ]
6825
6746
  }
6826
6747
  ]
6827
6748
  },
6828
6749
  {
6829
- type: "HorizontalLayout",
6750
+ type: "WrapperLayout",
6830
6751
  config: {
6831
- layout: { xs: 12, sm: 6 }
6752
+ main: {
6753
+ gap: "8px"
6754
+ }
6832
6755
  },
6833
6756
  elements: [
6834
6757
  {
6835
6758
  type: "Control",
6836
- scope: "#/properties/RemoveItemButton",
6759
+ scope: "#/properties/btn",
6837
6760
  options: {
6838
- widget: "IconButton"
6761
+ widget: "Button"
6839
6762
  },
6840
6763
  config: {
6841
- layout: { xs: 1, sm: 1 },
6764
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
6842
6765
  main: {
6843
- onClick: "RemoveItemButton",
6844
- size: "large",
6845
- icon: "RejectIcon",
6846
- styleDefault: true
6847
- },
6848
- style: {
6849
- marginLeft: "-10px"
6766
+ name: "Ok",
6767
+ variant: "contained",
6768
+ type: "text",
6769
+ onClick: "okHandler",
6770
+ size: "medium"
6850
6771
  }
6851
6772
  }
6852
6773
  },
6853
6774
  {
6854
6775
  type: "Control",
6855
- scope: "#/properties/copiedElementDetails",
6776
+ scope: "#/properties/btnSubmit",
6856
6777
  options: {
6857
- widget: "Box"
6778
+ widget: "Button"
6858
6779
  },
6859
6780
  config: {
6860
- layout: { xs: 6, sm: 6 },
6781
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
6861
6782
  main: {
6862
- heading: "No element copied"
6863
- },
6864
- style: {
6865
- color: "#535557",
6866
- marginLeft: "-10px",
6867
- fontSize: "12px",
6868
- marginTop: "4px"
6783
+ name: "Save & Exit",
6784
+ variant: "contained",
6785
+ type: "text",
6786
+ onClick: "saveHandler",
6787
+ size: "medium"
6869
6788
  }
6870
6789
  }
6871
6790
  },
6872
6791
  {
6873
6792
  type: "Control",
6874
6793
  scope: "#/properties/EmptyBox",
6794
+ config: {
6795
+ layout: { xs: 4, sm: 7, md: 8, lg: 9 }
6796
+ },
6875
6797
  options: {
6876
6798
  widget: "EmptyBox"
6877
- },
6878
- config: {
6879
- layout: { xs: 1, sm: 5 }
6880
6799
  }
6881
6800
  }
6882
6801
  ]
6883
6802
  },
6884
6803
  {
6885
6804
  type: "Control",
6886
- scope: "#/properties/btn",
6805
+ scope: "#/properties/popUpComponentSection",
6887
6806
  options: {
6888
- widget: "Button"
6807
+ widget: "PopUp"
6889
6808
  },
6890
6809
  config: {
6891
- layout: { xs: 4, sm: 2 },
6892
- main: {
6893
- name: "Ok",
6894
- startIcon: "ApproveIcon",
6895
- variant: "contained",
6896
- type: "text",
6897
- onClick: "okHandler",
6898
- size: "medium"
6899
- }
6900
- }
6901
- },
6902
- {
6903
- type: "Control",
6904
- scope: "#/properties/btnSubmit",
6905
- options: {
6906
- widget: "Button"
6907
- },
6908
- config: {
6909
- layout: { xs: 4, sm: 2 },
6910
- main: {
6911
- name: "Save & Exit",
6912
- startIcon: "ApproveIcon",
6913
- variant: "contained",
6914
- type: "text",
6915
- onClick: "saveHandler",
6916
- size: "medium"
6917
- }
6918
- }
6919
- },
6920
- {
6921
- type: "Control",
6922
- scope: "#/properties/popUpComponentSection",
6923
- options: {
6924
- widget: "PopUp"
6925
- },
6926
- config: {
6927
- layout: {
6928
- xs: 12,
6929
- sm: 12,
6930
- md: 12,
6931
- lg: 12
6932
- },
6810
+ layout: {
6811
+ xs: 12,
6812
+ sm: 12,
6813
+ md: 12,
6814
+ lg: 12
6815
+ },
6933
6816
  main: {
6934
6817
  title: "WARNING!"
6935
6818
  },
@@ -6975,9 +6858,7 @@ const componentBasicUiSchema = (theme) => {
6975
6858
  layout: 6,
6976
6859
  main: {
6977
6860
  name: "No",
6978
- startIcon: "ApproveIcon",
6979
6861
  variant: "contained",
6980
- color: "info",
6981
6862
  type: "text",
6982
6863
  onClick: "deletePopUpComponent",
6983
6864
  size: "large"
@@ -7011,7 +6892,6 @@ const componentBasicUiSchema = (theme) => {
7011
6892
  layout: 6,
7012
6893
  main: {
7013
6894
  name: "Yes",
7014
- startIcon: "ApproveIcon",
7015
6895
  variant: "contained",
7016
6896
  color: "error",
7017
6897
  type: "text",
@@ -7098,9 +6978,7 @@ const componentBasicUiSchema = (theme) => {
7098
6978
  layout: 6,
7099
6979
  main: {
7100
6980
  name: "No",
7101
- startIcon: "ApproveIcon",
7102
6981
  variant: "contained",
7103
- color: "info",
7104
6982
  type: "text",
7105
6983
  onClick: "deletePopUpEvent",
7106
6984
  size: "large"
@@ -7134,7 +7012,6 @@ const componentBasicUiSchema = (theme) => {
7134
7012
  layout: 6,
7135
7013
  main: {
7136
7014
  name: "Yes",
7137
- startIcon: "ApproveIcon",
7138
7015
  variant: "contained",
7139
7016
  color: "error",
7140
7017
  type: "text",
@@ -7180,7 +7057,7 @@ const componentBasicUiSchema = (theme) => {
7180
7057
  style: {
7181
7058
  flexDirection: "row",
7182
7059
  position: "absolute",
7183
- bottom: 0,
7060
+ bottom: 10,
7184
7061
  height: "fit-content",
7185
7062
  overflow: "hidden",
7186
7063
  zIndex: 1e3,
@@ -7199,78 +7076,19 @@ const componentBasicUiSchema = (theme) => {
7199
7076
  heading: "Copywriter@ACT21.IO"
7200
7077
  },
7201
7078
  style: {
7202
- color: ((_b = (_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text) == null ? void 0 : _b.disabled) || "#AFAFAF",
7079
+ color: ((_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text.disabled) || "#AFAFAF",
7203
7080
  fontSize: "11px",
7204
7081
  textAlign: "center",
7205
- lineHeight: 2,
7082
+ lineHeight: 0,
7206
7083
  width: "fit-content",
7207
7084
  left: "50%",
7208
7085
  position: "relative",
7209
- margin: 0,
7086
+ margin: "revert",
7210
7087
  flexGrow: 1,
7211
7088
  height: 0,
7212
7089
  transform: "translate(-50%, 0%)"
7213
7090
  }
7214
7091
  }
7215
- },
7216
- {
7217
- type: "Control",
7218
- scope: "#/properties/FooterBackIcon",
7219
- options: {
7220
- widget: "Box"
7221
- },
7222
- config: {
7223
- main: {
7224
- iconName: "PrevIcon",
7225
- onClick: "backHandler",
7226
- width: "fit-content"
7227
- },
7228
- style: {
7229
- fill: (_d = (_c = theme == null ? void 0 : theme.palette) == null ? void 0 : _c.primary) == null ? void 0 : _d.main,
7230
- width: 20,
7231
- height: 0,
7232
- top: 0,
7233
- right: { xs: "12px", sm: "84px" },
7234
- position: "absolute",
7235
- fontSize: "12px",
7236
- cursor: "pointer",
7237
- ":hover": {
7238
- fill: (_f = (_e = theme == null ? void 0 : theme.palette) == null ? void 0 : _e.primary) == null ? void 0 : _f.dark
7239
- },
7240
- marginRight: "20px"
7241
- }
7242
- }
7243
- },
7244
- {
7245
- type: "Control",
7246
- scope: "#/properties/FooterBackHandlerText",
7247
- options: {
7248
- widget: "Box"
7249
- },
7250
- config: {
7251
- main: {
7252
- heading: "Previous Page",
7253
- onClick: "backHandler"
7254
- },
7255
- style: {
7256
- display: { xs: "none", sm: "flex" },
7257
- textAlign: "left",
7258
- lineHeight: 1,
7259
- height: 0,
7260
- width: "fit-content",
7261
- color: (_h = (_g = theme == null ? void 0 : theme.palette) == null ? void 0 : _g.primary) == null ? void 0 : _h.main,
7262
- fontSize: "12px",
7263
- cursor: "pointer",
7264
- marginLeft: "2px",
7265
- top: 3,
7266
- right: "12px",
7267
- position: "absolute",
7268
- ":hover": {
7269
- color: (_j = (_i = theme == null ? void 0 : theme.palette) == null ? void 0 : _i.primary) == null ? void 0 : _j.dark
7270
- },
7271
- marginRight: "4px"
7272
- }
7273
- }
7274
7092
  }
7275
7093
  ]
7276
7094
  }
@@ -7279,7 +7097,13 @@ const componentBasicUiSchema = (theme) => {
7279
7097
  return uiSchema;
7280
7098
  };
7281
7099
  const CoreSection = {
7282
- type: "HorizontalLayout",
7100
+ type: "WrapperLayout",
7101
+ config: {
7102
+ main: {
7103
+ label: " ",
7104
+ gap: "8px"
7105
+ }
7106
+ },
7283
7107
  elements: [
7284
7108
  {
7285
7109
  type: "Control",
@@ -7288,7 +7112,7 @@ const CoreSection = {
7288
7112
  widget: "SelectInputField"
7289
7113
  },
7290
7114
  config: {
7291
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7115
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
7292
7116
  main: {
7293
7117
  label: "Type",
7294
7118
  type: "text"
@@ -7297,40 +7121,39 @@ const CoreSection = {
7297
7121
  },
7298
7122
  {
7299
7123
  type: "Control",
7300
- scope: "#/properties/name",
7301
- options: {
7302
- widget: "InputField"
7303
- },
7124
+ scope: "#/properties/proc",
7304
7125
  config: {
7305
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7306
- main: {
7307
- label: "Name"
7308
- }
7126
+ layout: { xs: 6, sm: 0, md: 0, lg: 0 }
7127
+ },
7128
+ options: {
7129
+ widget: "EmptyBox"
7309
7130
  }
7310
7131
  },
7311
7132
  {
7312
7133
  type: "Control",
7313
- scope: "#/properties/label",
7134
+ scope: "#/properties/name",
7314
7135
  options: {
7315
7136
  widget: "InputField"
7316
7137
  },
7317
7138
  config: {
7318
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7139
+ layout: { xs: 12, sm: 6, md: 4, lg: 3 },
7319
7140
  main: {
7320
- label: "Label"
7141
+ label: "Component ID",
7142
+ required: true
7321
7143
  }
7322
7144
  }
7323
7145
  },
7324
7146
  {
7325
7147
  type: "Control",
7326
- scope: "#/properties/columnFormat",
7148
+ scope: "#/properties/label",
7327
7149
  options: {
7328
- widget: "SelectInputField"
7150
+ widget: "InputField"
7329
7151
  },
7330
7152
  config: {
7331
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7153
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
7332
7154
  main: {
7333
- label: "Column Format"
7155
+ label: "Label",
7156
+ required: true
7334
7157
  }
7335
7158
  }
7336
7159
  },
@@ -7338,17 +7161,7 @@ const CoreSection = {
7338
7161
  type: "Control",
7339
7162
  scope: "#/properties/proc",
7340
7163
  config: {
7341
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
7342
- },
7343
- options: {
7344
- widget: "EmptyBox"
7345
- }
7346
- },
7347
- {
7348
- type: "Control",
7349
- scope: "#/properties/proc",
7350
- config: {
7351
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
7164
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 }
7352
7165
  },
7353
7166
  options: {
7354
7167
  widget: "EmptyBox"
@@ -7357,54 +7170,67 @@ const CoreSection = {
7357
7170
  {
7358
7171
  type: "Control",
7359
7172
  scope: "#/properties/layout",
7360
- layout: 12,
7361
7173
  options: {
7362
- "elementLabelProp": "key",
7363
- detail: {
7364
- type: "HorizontalLayout",
7365
- elements: [
7366
- {
7367
- type: "Control",
7368
- scope: "#/properties/key",
7369
- options: {
7370
- widget: "SelectInputField"
7371
- },
7372
- config: {
7373
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7374
- main: {
7375
- label: "Screen Size"
7376
- }
7377
- }
7378
- },
7379
- {
7380
- type: "Control",
7381
- scope: "#/properties/value",
7382
- options: {
7383
- widget: "InputField"
7384
- },
7385
- config: {
7386
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7387
- main: {
7388
- label: "Value",
7389
- type: "number",
7390
- helperText: "Number should be in range of 0 to 12",
7391
- errorMessage: "Number Can't be greater than 12 and can't be less than 0."
7392
- }
7393
- }
7394
- },
7395
- {
7396
- type: "Control",
7397
- scope: "#/properties/proc",
7398
- config: {
7399
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
7400
- },
7401
- options: {
7402
- widget: "EmptyBox"
7403
- }
7174
+ widget: "Array"
7175
+ },
7176
+ config: {
7177
+ layout: 12,
7178
+ main: {
7179
+ label: "Layout",
7180
+ childElementLabel: "Layout"
7181
+ },
7182
+ style: {
7183
+ marginLeft: "-24px",
7184
+ marginBottom: "24px !important",
7185
+ labelStyle: {
7186
+ marginLeft: "24px"
7187
+ },
7188
+ detailsStyle: {
7189
+ marginLeft: "24px"
7190
+ }
7191
+ }
7192
+ },
7193
+ elements: [
7194
+ {
7195
+ type: "Control",
7196
+ scope: "#/properties/key",
7197
+ options: {
7198
+ widget: "SelectInputField"
7199
+ },
7200
+ config: {
7201
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7202
+ main: {
7203
+ label: "Screen Size"
7404
7204
  }
7405
- ]
7205
+ }
7206
+ },
7207
+ {
7208
+ type: "Control",
7209
+ scope: "#/properties/value",
7210
+ options: {
7211
+ widget: "InputField"
7212
+ },
7213
+ config: {
7214
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7215
+ main: {
7216
+ label: "Value",
7217
+ type: "number",
7218
+ helperText: "Number should be in range of 0 to 12",
7219
+ errorMessage: "Number Can't be greater than 12 and can't be less than 0."
7220
+ }
7221
+ }
7222
+ },
7223
+ {
7224
+ type: "Control",
7225
+ scope: "#/properties/proc",
7226
+ config: {
7227
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
7228
+ },
7229
+ options: {
7230
+ widget: "EmptyBox"
7231
+ }
7406
7232
  }
7407
- }
7233
+ ]
7408
7234
  }
7409
7235
  ]
7410
7236
  };
@@ -7431,15 +7257,20 @@ const EventSection = (theme) => {
7431
7257
  },
7432
7258
  config: {
7433
7259
  main: {
7434
- color: "info",
7435
7260
  onClick: "eventAddHandler",
7436
7261
  size: "small",
7437
- icon: "AddIcon",
7438
- iconLabel: "Add New",
7262
+ icon: "TableAddIcon",
7263
+ iconLabel: "Add",
7439
7264
  styleDefault: true
7440
7265
  },
7441
7266
  style: {
7442
- mt: "6px"
7267
+ mt: "6px",
7268
+ color: "inherit",
7269
+ fill: "inherit",
7270
+ "&:hover": {
7271
+ color: "inherit",
7272
+ fill: "inherit"
7273
+ }
7443
7274
  }
7444
7275
  }
7445
7276
  }
@@ -7455,12 +7286,18 @@ const EventSection = (theme) => {
7455
7286
  main: {
7456
7287
  onClick: "copyPasteElement",
7457
7288
  size: "small",
7458
- icon: "PasteIcon",
7289
+ icon: "TablePaste",
7459
7290
  iconLabel: "Paste",
7460
7291
  styleDefault: true
7461
7292
  },
7462
7293
  style: {
7463
- mt: "6px"
7294
+ mt: "6px",
7295
+ color: "inherit",
7296
+ fill: "inherit",
7297
+ "&:hover": {
7298
+ color: "inherit",
7299
+ fill: "inherit"
7300
+ }
7464
7301
  }
7465
7302
  }
7466
7303
  }
@@ -7475,15 +7312,21 @@ const EventSection = (theme) => {
7475
7312
  elements: [
7476
7313
  {
7477
7314
  accessorKey: "eventType",
7478
- header: "Event Type"
7315
+ header: "Event Type",
7316
+ type: "string",
7317
+ size: 300
7479
7318
  },
7480
7319
  {
7481
7320
  accessorKey: "Handler",
7482
- header: "Handler"
7321
+ header: "Handler",
7322
+ type: "string",
7323
+ size: 200
7483
7324
  },
7484
7325
  {
7485
7326
  accessorKey: "Edit_Approve_Records",
7486
7327
  header: "Edit Widget",
7328
+ size: 150,
7329
+ type: "action",
7487
7330
  widget: {
7488
7331
  type: "Control",
7489
7332
  scope: "#/properties/Edit_Records",
@@ -7492,14 +7335,16 @@ const EventSection = (theme) => {
7492
7335
  },
7493
7336
  config: {
7494
7337
  main: {
7495
- color: "info",
7496
7338
  size: "small",
7497
- icon: "EditIcon",
7339
+ icon: "TableEditIcon",
7498
7340
  tooltipMessage: "Edit This Record",
7499
7341
  onClick: "eventEditHandler"
7500
7342
  },
7501
7343
  style: {
7502
- color: theme.palette.primary.main
7344
+ fill: theme.palette.primary.main,
7345
+ "& :hover": {
7346
+ fill: theme.palette.primary.dark
7347
+ }
7503
7348
  }
7504
7349
  }
7505
7350
  }
@@ -7507,6 +7352,8 @@ const EventSection = (theme) => {
7507
7352
  {
7508
7353
  accessorKey: "Reject_Records",
7509
7354
  header: "Delete",
7355
+ size: 150,
7356
+ type: "action",
7510
7357
  widget: {
7511
7358
  type: "Control",
7512
7359
  scope: "#/properties/RejectButton",
@@ -7516,10 +7363,15 @@ const EventSection = (theme) => {
7516
7363
  },
7517
7364
  config: {
7518
7365
  main: {
7519
- icon: "RejectIcon",
7520
- color: "error",
7366
+ icon: "Bin",
7521
7367
  tooltipMessage: "Reject This Record",
7522
7368
  onClick: "deletePopUpEvent"
7369
+ },
7370
+ style: {
7371
+ fill: theme.palette.primary.main,
7372
+ "& :hover": {
7373
+ fill: theme.palette.primary.dark
7374
+ }
7523
7375
  }
7524
7376
  }
7525
7377
  }
@@ -7527,7 +7379,8 @@ const EventSection = (theme) => {
7527
7379
  {
7528
7380
  header: "Copy",
7529
7381
  field: "Copy_Event",
7530
- flex: 1,
7382
+ size: 150,
7383
+ type: "action",
7531
7384
  widget: {
7532
7385
  type: "Control",
7533
7386
  scope: "#/properties/Copy_Event",
@@ -7669,7 +7522,7 @@ const getInputField = (scope, label) => {
7669
7522
  widget: "InputField"
7670
7523
  },
7671
7524
  config: {
7672
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7525
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
7673
7526
  main: {
7674
7527
  label
7675
7528
  }
@@ -7684,7 +7537,7 @@ const getRadioInputField = (scope, label, options) => {
7684
7537
  widget: "RadioInputField"
7685
7538
  },
7686
7539
  config: {
7687
- layout: { xs: 12, sm: 6, md: 4, lg: 4 },
7540
+ layout: { xs: 12, sm: 6, md: 4, lg: 3 },
7688
7541
  main: {
7689
7542
  label,
7690
7543
  options
@@ -7724,14 +7577,7 @@ const getTextArea = (scope, heading, hideButton, layout) => {
7724
7577
  config: {
7725
7578
  layout: layout || 12,
7726
7579
  style: {
7727
- containerStyle: {
7728
- borderRadius: "20px"
7729
- },
7730
- headerContainerStyle: {},
7731
- textAreaStyle: {
7732
- borderRadius: "20px",
7733
- padding: "20px"
7734
- }
7580
+ "& .MuiFormLabel-root:not(.MuiInputLabel-shrink)": {}
7735
7581
  },
7736
7582
  main: {
7737
7583
  heading,
@@ -7750,7 +7596,7 @@ const getSelectField = (scope, label, options) => {
7750
7596
  widget: "SelectInputField"
7751
7597
  },
7752
7598
  config: {
7753
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7599
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
7754
7600
  main: {
7755
7601
  label,
7756
7602
  type: "text"
@@ -7766,7 +7612,7 @@ const getMultiSelectField = (scope, label) => {
7766
7612
  widget: "MultipleSelect"
7767
7613
  },
7768
7614
  config: {
7769
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7615
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
7770
7616
  main: {
7771
7617
  multiple: true,
7772
7618
  label,
@@ -7775,12 +7621,18 @@ const getMultiSelectField = (scope, label) => {
7775
7621
  }
7776
7622
  };
7777
7623
  };
7778
- const GraphSection = {
7624
+ const BaseSection = {
7779
7625
  type: "WrapperLayout",
7626
+ config: {
7627
+ main: {
7628
+ label: " ",
7629
+ gap: "8px"
7630
+ }
7631
+ },
7780
7632
  elements: []
7781
7633
  };
7782
7634
  const buildPropertiesSection = function(type) {
7783
- let uiSchema = _.cloneDeep(GraphSection);
7635
+ let uiSchema = _.cloneDeep(BaseSection);
7784
7636
  switch (type) {
7785
7637
  case "TreeMap":
7786
7638
  uiSchema.elements = [
@@ -8005,7 +7857,13 @@ const buildPropertiesSection = function(type) {
8005
7857
  return uiSchema;
8006
7858
  };
8007
7859
  const StyleSection = {
8008
- type: "HorizontalLayout",
7860
+ type: "WrapperLayout",
7861
+ config: {
7862
+ main: {
7863
+ label: " ",
7864
+ gap: "8px"
7865
+ }
7866
+ },
8009
7867
  elements: [
8010
7868
  {
8011
7869
  type: "Control",
@@ -8021,14 +7879,7 @@ const StyleSection = {
8021
7879
  lg: 12
8022
7880
  },
8023
7881
  style: {
8024
- containerStyle: {
8025
- borderRadius: "20px"
8026
- },
8027
- headerContainerStyle: {},
8028
- textAreaStyle: {
8029
- borderRadius: "20px",
8030
- padding: "20px"
8031
- }
7882
+ "& .MuiFormLabel-root:not(.MuiInputLabel-shrink)": {}
8032
7883
  },
8033
7884
  main: {
8034
7885
  heading: "JSON Style",
@@ -8062,15 +7913,20 @@ const TableSection = (theme) => {
8062
7913
  },
8063
7914
  config: {
8064
7915
  main: {
8065
- color: "info",
8066
7916
  onClick: "widgetAddClickHandler",
8067
7917
  size: "small",
8068
- icon: "AddIcon",
8069
- iconLabel: "Add New",
7918
+ icon: "TableAddIcon",
7919
+ iconLabel: "Add",
8070
7920
  styleDefault: true
8071
7921
  },
8072
7922
  style: {
8073
- mt: "6px"
7923
+ mt: "6px",
7924
+ color: "inherit",
7925
+ fill: "inherit",
7926
+ "&:hover": {
7927
+ color: "inherit",
7928
+ fill: "inherit"
7929
+ }
8074
7930
  }
8075
7931
  }
8076
7932
  }
@@ -8086,12 +7942,18 @@ const TableSection = (theme) => {
8086
7942
  main: {
8087
7943
  onClick: "copyPasteElement",
8088
7944
  size: "small",
8089
- icon: "PasteIcon",
7945
+ icon: "TablePaste",
8090
7946
  iconLabel: "Paste",
8091
7947
  styleDefault: true
8092
7948
  },
8093
7949
  style: {
8094
- mt: "6px"
7950
+ mt: "6px",
7951
+ color: "inherit",
7952
+ fill: "inherit",
7953
+ "&:hover": {
7954
+ color: "inherit",
7955
+ fill: "inherit"
7956
+ }
8095
7957
  }
8096
7958
  }
8097
7959
  }
@@ -8106,16 +7968,21 @@ const TableSection = (theme) => {
8106
7968
  elements: [
8107
7969
  {
8108
7970
  accessorKey: "name",
8109
- header: "Name"
7971
+ header: "Name",
7972
+ type: "string",
7973
+ size: 300
8110
7974
  },
8111
7975
  {
8112
7976
  accessorKey: "type",
8113
- header: "Type"
7977
+ header: "Type",
7978
+ type: "string",
7979
+ size: 200
8114
7980
  },
8115
7981
  {
8116
7982
  header: "Edit Record",
8117
7983
  field: "Reject_Records",
8118
- flex: 1,
7984
+ size: 150,
7985
+ type: "action",
8119
7986
  widget: {
8120
7987
  type: "Control",
8121
7988
  scope: "#/properties/RejectButton",
@@ -8124,13 +7991,16 @@ const TableSection = (theme) => {
8124
7991
  },
8125
7992
  config: {
8126
7993
  main: {
8127
- icon: "EditIcon",
8128
- color: "primary",
7994
+ icon: "TableEditIcon",
7995
+ size: "small",
8129
7996
  onClick: "editComponents",
8130
7997
  tooltipMessage: "Reject This Record"
8131
7998
  },
8132
7999
  style: {
8133
- color: theme.palette.primary.main
8000
+ fill: theme.palette.primary.main,
8001
+ "& :hover": {
8002
+ fill: theme.palette.primary.dark
8003
+ }
8134
8004
  }
8135
8005
  }
8136
8006
  }
@@ -8138,7 +8008,8 @@ const TableSection = (theme) => {
8138
8008
  {
8139
8009
  header: "Delete",
8140
8010
  field: "Reject_Records",
8141
- flex: 1,
8011
+ size: 150,
8012
+ type: "action",
8142
8013
  widget: {
8143
8014
  type: "Control",
8144
8015
  scope: "#/properties/RejectButton",
@@ -8147,10 +8018,15 @@ const TableSection = (theme) => {
8147
8018
  },
8148
8019
  config: {
8149
8020
  main: {
8150
- icon: "RejectIcon",
8151
- color: "error",
8021
+ icon: "Bin",
8152
8022
  onClick: "deletePopUpComponent",
8153
8023
  tooltipMessage: "Reject This Record"
8024
+ },
8025
+ style: {
8026
+ fill: theme.palette.primary.main,
8027
+ "& :hover": {
8028
+ fill: theme.palette.primary.dark
8029
+ }
8154
8030
  }
8155
8031
  }
8156
8032
  }
@@ -8158,7 +8034,8 @@ const TableSection = (theme) => {
8158
8034
  {
8159
8035
  header: "Copy",
8160
8036
  field: "Copy_Component",
8161
- flex: 1,
8037
+ size: 150,
8038
+ type: "action",
8162
8039
  widget: {
8163
8040
  type: "Control",
8164
8041
  scope: "#/properties/Copy_Component",
@@ -8182,109 +8059,148 @@ const TableSection = (theme) => {
8182
8059
  return uiSchema;
8183
8060
  };
8184
8061
  const ValueTab = {
8185
- type: "HorizontalLayout",
8062
+ type: "WrapperLayout",
8063
+ config: {
8064
+ main: {
8065
+ label: " ",
8066
+ gap: "8px"
8067
+ }
8068
+ },
8186
8069
  elements: [
8187
8070
  {
8188
8071
  type: "Control",
8189
8072
  scope: "#/properties/value",
8190
- layout: 12,
8191
8073
  options: {
8192
- detail: {
8193
- type: "HorizontalLayout",
8194
- elements: [
8195
- {
8196
- type: "Control",
8197
- scope: "#/properties/label",
8198
- options: {
8199
- widget: "InputField"
8200
- },
8201
- config: {
8202
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8203
- main: {
8204
- label: "Label"
8205
- }
8206
- }
8207
- },
8208
- {
8209
- type: "Control",
8210
- scope: "#/properties/value",
8211
- options: {
8212
- widget: "InputField"
8213
- },
8214
- config: {
8215
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8216
- main: {
8217
- label: "Value"
8218
- }
8219
- }
8220
- },
8221
- {
8222
- type: "Control",
8223
- scope: "#/properties/emptyBox",
8224
- options: {
8225
- widget: "EmptyBox"
8226
- },
8227
- config: {
8228
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
8229
- }
8074
+ widget: "Array"
8075
+ },
8076
+ config: {
8077
+ layout: 12,
8078
+ main: {
8079
+ label: "Value",
8080
+ childElementLabel: "Value"
8081
+ },
8082
+ style: {
8083
+ marginLeft: "-24px",
8084
+ marginBottom: "24px !important",
8085
+ labelStyle: {
8086
+ marginLeft: "24px"
8087
+ },
8088
+ detailsStyle: {
8089
+ marginLeft: "24px"
8090
+ }
8091
+ }
8092
+ },
8093
+ elements: [
8094
+ {
8095
+ type: "Control",
8096
+ scope: "#/properties/label",
8097
+ options: {
8098
+ widget: "InputField"
8099
+ },
8100
+ config: {
8101
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8102
+ main: {
8103
+ label: "Label"
8230
8104
  }
8231
- ]
8105
+ }
8106
+ },
8107
+ {
8108
+ type: "Control",
8109
+ scope: "#/properties/value",
8110
+ options: {
8111
+ widget: "InputField"
8112
+ },
8113
+ config: {
8114
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8115
+ main: {
8116
+ label: "Value"
8117
+ }
8118
+ }
8119
+ },
8120
+ {
8121
+ type: "Control",
8122
+ scope: "#/properties/emptyBox",
8123
+ options: {
8124
+ widget: "EmptyBox"
8125
+ },
8126
+ config: {
8127
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
8128
+ }
8232
8129
  }
8233
- }
8130
+ ]
8234
8131
  }
8235
8132
  ]
8236
8133
  };
8237
8134
  const ValidationSection = {
8238
- type: "HorizontalLayout",
8135
+ type: "WrapperLayout",
8136
+ config: {
8137
+ main: {
8138
+ label: " ",
8139
+ gap: "8px"
8140
+ }
8141
+ },
8239
8142
  elements: [
8240
8143
  {
8241
8144
  type: "Control",
8242
8145
  scope: "#/properties/validation",
8243
- layout: 11.5,
8244
8146
  options: {
8245
- "elementLabelProp": "validationType",
8246
- detail: {
8247
- type: "HorizontalLayout",
8248
- elements: [
8249
- {
8250
- type: "Control",
8251
- scope: "#/properties/validationType",
8252
- options: {
8253
- widget: "SelectInputField"
8254
- },
8255
- config: {
8256
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8257
- main: {
8258
- label: "Validation Type"
8259
- }
8260
- }
8261
- },
8262
- {
8263
- type: "Control",
8264
- scope: "#/properties/validationValue",
8265
- options: {
8266
- widget: "InputField"
8267
- },
8268
- config: {
8269
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8270
- main: {
8271
- label: "Validation Value"
8272
- }
8273
- }
8274
- },
8275
- {
8276
- type: "Control",
8277
- scope: "#/properties/emptyBox",
8278
- options: {
8279
- widget: "EmptyBox"
8280
- },
8281
- config: {
8282
- layout: { xs: 0, sm: 0, md: 4 }
8283
- }
8147
+ widget: "Array"
8148
+ },
8149
+ config: {
8150
+ layout: 12,
8151
+ main: {
8152
+ label: "Validation",
8153
+ childElementLabel: "Validation"
8154
+ },
8155
+ style: {
8156
+ marginLeft: "-24px",
8157
+ marginBottom: "24px !important",
8158
+ labelStyle: {
8159
+ marginLeft: "24px"
8160
+ },
8161
+ detailsStyle: {
8162
+ marginLeft: "24px"
8163
+ }
8164
+ }
8165
+ },
8166
+ elements: [
8167
+ {
8168
+ type: "Control",
8169
+ scope: "#/properties/validationType",
8170
+ options: {
8171
+ widget: "SelectInputField"
8172
+ },
8173
+ config: {
8174
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8175
+ main: {
8176
+ label: "Validation Type"
8284
8177
  }
8285
- ]
8178
+ }
8179
+ },
8180
+ {
8181
+ type: "Control",
8182
+ scope: "#/properties/validationValue",
8183
+ options: {
8184
+ widget: "InputField"
8185
+ },
8186
+ config: {
8187
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8188
+ main: {
8189
+ label: "Validation Value"
8190
+ }
8191
+ }
8192
+ },
8193
+ {
8194
+ type: "Control",
8195
+ scope: "#/properties/emptyBox",
8196
+ options: {
8197
+ widget: "EmptyBox"
8198
+ },
8199
+ config: {
8200
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
8201
+ }
8286
8202
  }
8287
- }
8203
+ ]
8288
8204
  }
8289
8205
  ]
8290
8206
  };
@@ -8485,8 +8401,8 @@ function refreshPage(type, store2) {
8485
8401
  Validation: ValidationSection
8486
8402
  };
8487
8403
  const elements = (_a = sectionLabels[type]) == null ? void 0 : _a.map((e) => sectionUiSchema[e]);
8488
- UiSchema.elements[1].config.main.tabLabels = sectionLabels[type] || ["Core", "Style", "Event", "Validation"];
8489
- UiSchema.elements[1].elements = elements || [CoreSection, StyleSection, EventSection(store2.theme.myTheme), ValidationSection];
8404
+ UiSchema.elements[0].config.main.tabLabels = sectionLabels[type] || ["Core", "Style", "Event", "Validation"];
8405
+ UiSchema.elements[0].elements = elements || [CoreSection, StyleSection, EventSection(store2.theme.myTheme), ValidationSection];
8490
8406
  }
8491
8407
  if (sessionStorage.getItem("copiedConfig")) {
8492
8408
  this.ElementPathSetter(UiSchema);
@@ -8892,39 +8808,38 @@ const EventUiSchema = (theme) => {
8892
8808
  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
8893
8809
  const uiSchema = {
8894
8810
  type: "HorizontalLayout",
8895
- heading: "Component",
8811
+ heading: "Page-Event",
8896
8812
  elements: [
8897
- {
8898
- type: "Control",
8899
- scope: "#/properties/pageName",
8900
- options: {
8901
- widget: "Box"
8902
- },
8903
- config: {
8904
- layout: 12,
8905
- main: {
8906
- heading: " "
8907
- },
8908
- style: {
8909
- marginLeft: theme.spacing(3),
8910
- width: "auto",
8911
- fontSize: "12px",
8912
- color: "gray"
8913
- }
8914
- }
8915
- },
8916
8813
  {
8917
8814
  type: "TabLayout",
8918
8815
  config: {
8919
8816
  main: {
8920
- tabLabels: ["Core", "Response Event"],
8921
- defaultStyle: true,
8817
+ tabLabels: ["Core", "Response Events"],
8922
8818
  id: "event"
8819
+ },
8820
+ style: {
8821
+ TabPanelStyle: {
8822
+ padding: 0
8823
+ }
8824
+ },
8825
+ TabsStyle: {
8826
+ marginBottom: "3px",
8827
+ paddingBottom: "4px",
8828
+ boxShadow: "0px 3px 4px #afafaf80",
8829
+ "& .MuiTabs-indicator": {
8830
+ bottom: "6px"
8831
+ }
8923
8832
  }
8924
8833
  },
8925
8834
  elements: [
8926
8835
  {
8927
- type: "HorizontalLayout",
8836
+ type: "WrapperLayout",
8837
+ config: {
8838
+ main: {
8839
+ label: " ",
8840
+ gap: "8px"
8841
+ }
8842
+ },
8928
8843
  elements: [
8929
8844
  {
8930
8845
  type: "Control",
@@ -8933,9 +8848,9 @@ const EventUiSchema = (theme) => {
8933
8848
  widget: "SelectInputField"
8934
8849
  },
8935
8850
  config: {
8936
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8851
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
8937
8852
  main: {
8938
- label: "Event Type",
8853
+ label: "Event's Type",
8939
8854
  type: "text"
8940
8855
  }
8941
8856
  }
@@ -8948,7 +8863,7 @@ const EventUiSchema = (theme) => {
8948
8863
  widget: "EmptyBox"
8949
8864
  },
8950
8865
  config: {
8951
- layout: { xs: 0, sm: 4, md: 4, lg: 4 }
8866
+ layout: { xs: 0, sm: 0, md: 4, lg: 6 }
8952
8867
  }
8953
8868
  }
8954
8869
  ]
@@ -8974,12 +8889,18 @@ const EventUiSchema = (theme) => {
8974
8889
  main: {
8975
8890
  onClick: "addEvent",
8976
8891
  size: "small",
8977
- icon: "AddIcon",
8978
- iconLabel: "Add New",
8892
+ icon: "TableAddIcon",
8893
+ iconLabel: "Add",
8979
8894
  styleDefault: true
8980
8895
  },
8981
8896
  style: {
8982
- mt: "6px"
8897
+ mt: "6px",
8898
+ color: "inherit",
8899
+ fill: "inherit",
8900
+ "&:hover": {
8901
+ color: "inherit",
8902
+ fill: "inherit"
8903
+ }
8983
8904
  }
8984
8905
  }
8985
8906
  }
@@ -8995,12 +8916,18 @@ const EventUiSchema = (theme) => {
8995
8916
  main: {
8996
8917
  onClick: "copyPasteElement",
8997
8918
  size: "small",
8998
- icon: "PasteIcon",
8919
+ icon: "TablePaste",
8999
8920
  iconLabel: "Paste",
9000
8921
  styleDefault: true
9001
8922
  },
9002
8923
  style: {
9003
- mt: "6px"
8924
+ mt: "6px",
8925
+ color: "inherit",
8926
+ fill: "inherit",
8927
+ "&:hover": {
8928
+ color: "inherit",
8929
+ fill: "inherit"
8930
+ }
9004
8931
  }
9005
8932
  }
9006
8933
  }
@@ -9015,15 +8942,21 @@ const EventUiSchema = (theme) => {
9015
8942
  elements: [
9016
8943
  {
9017
8944
  accessorKey: "eventType",
9018
- header: "Event Type"
8945
+ header: "Event Type",
8946
+ size: 300,
8947
+ type: "string"
9019
8948
  },
9020
8949
  {
9021
8950
  accessorKey: "Handler",
9022
- header: "Handler"
8951
+ header: "Handler",
8952
+ size: 200,
8953
+ type: "string"
9023
8954
  },
9024
8955
  {
9025
8956
  accessorKey: "Edit_Approve_Records",
9026
8957
  header: "Edit Widget",
8958
+ type: "action",
8959
+ size: 150,
9027
8960
  widget: {
9028
8961
  type: "Control",
9029
8962
  scope: "#/properties/Edit_Records",
@@ -9032,14 +8965,16 @@ const EventUiSchema = (theme) => {
9032
8965
  },
9033
8966
  config: {
9034
8967
  main: {
9035
- color: "info",
9036
8968
  size: "small",
9037
- icon: "EditIcon",
8969
+ icon: "TableEditIcon",
9038
8970
  tooltipMessage: "Edit This Record",
9039
8971
  onClick: "editEvent"
9040
8972
  },
9041
8973
  style: {
9042
- color: theme.palette.primary.main
8974
+ fill: theme.palette.primary.main,
8975
+ "& :hover": {
8976
+ fill: theme.palette.primary.dark
8977
+ }
9043
8978
  }
9044
8979
  }
9045
8980
  }
@@ -9047,6 +8982,8 @@ const EventUiSchema = (theme) => {
9047
8982
  {
9048
8983
  accessorKey: "Reject_Records",
9049
8984
  header: "Delete",
8985
+ type: "action",
8986
+ size: 150,
9050
8987
  widget: {
9051
8988
  type: "Control",
9052
8989
  scope: "#/properties/RejectButton",
@@ -9055,10 +8992,15 @@ const EventUiSchema = (theme) => {
9055
8992
  },
9056
8993
  config: {
9057
8994
  main: {
9058
- icon: "RejectIcon",
9059
- color: "error",
8995
+ icon: "Bin",
9060
8996
  tooltipMessage: "Reject This Record",
9061
8997
  onClick: "deletePopUpEvent"
8998
+ },
8999
+ style: {
9000
+ fill: theme.palette.primary.main,
9001
+ "& :hover": {
9002
+ fill: theme.palette.primary.dark
9003
+ }
9062
9004
  }
9063
9005
  }
9064
9006
  }
@@ -9066,7 +9008,8 @@ const EventUiSchema = (theme) => {
9066
9008
  {
9067
9009
  header: "Copy",
9068
9010
  field: "Copy_Event",
9069
- flex: 1,
9011
+ type: "action",
9012
+ size: 150,
9070
9013
  widget: {
9071
9014
  type: "Control",
9072
9015
  scope: "#/properties/Copy_Event",
@@ -9087,103 +9030,59 @@ const EventUiSchema = (theme) => {
9087
9030
  ]
9088
9031
  },
9089
9032
  {
9090
- type: "HorizontalLayout",
9033
+ type: "WrapperLayout",
9091
9034
  config: {
9092
- layout: { xs: 12, sm: 6 }
9035
+ main: {
9036
+ gap: "8px"
9037
+ }
9093
9038
  },
9094
9039
  elements: [
9095
9040
  {
9096
9041
  type: "Control",
9097
- scope: "#/properties/RemoveItemButton",
9042
+ scope: "#/properties/btn",
9098
9043
  options: {
9099
- widget: "IconButton"
9044
+ widget: "Button"
9100
9045
  },
9101
9046
  config: {
9102
- layout: { xs: 1, sm: 1 },
9047
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
9103
9048
  main: {
9104
- onClick: "RemoveItemButton",
9105
- size: "large",
9106
- icon: "RejectIcon",
9107
- styleDefault: true
9108
- },
9109
- style: {
9110
- marginLeft: "-10px"
9049
+ name: "Ok",
9050
+ variant: "contained",
9051
+ type: "text",
9052
+ onClick: "okHandler",
9053
+ size: "medium"
9111
9054
  }
9112
9055
  }
9113
9056
  },
9114
9057
  {
9115
9058
  type: "Control",
9116
- scope: "#/properties/copiedElementDetails",
9059
+ scope: "#/properties/btnSubmit",
9117
9060
  options: {
9118
- widget: "Box"
9061
+ widget: "Button"
9119
9062
  },
9120
9063
  config: {
9121
- layout: { xs: 6, sm: 6 },
9064
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
9122
9065
  main: {
9123
- heading: "No element copied"
9124
- },
9125
- style: {
9126
- color: "#535557",
9127
- marginLeft: "-10px",
9128
- fontSize: "12px",
9129
- marginTop: "4px"
9066
+ name: "Save & Exit",
9067
+ variant: "contained",
9068
+ type: "text",
9069
+ onClick: "saveHandler",
9070
+ size: "medium"
9130
9071
  }
9131
9072
  }
9132
9073
  },
9133
9074
  {
9134
9075
  type: "Control",
9135
9076
  scope: "#/properties/EmptyBox",
9077
+ config: {
9078
+ layout: { xs: 4, sm: 7, md: 8, lg: 9 }
9079
+ },
9136
9080
  options: {
9137
9081
  widget: "EmptyBox"
9138
- },
9139
- config: {
9140
- layout: { xs: 1, sm: 5 }
9141
9082
  }
9142
9083
  }
9143
9084
  ]
9144
9085
  },
9145
- {
9146
- type: "Control",
9147
- scope: "#/properties/btn",
9148
- options: {
9149
- widget: "Button"
9150
- },
9151
- config: {
9152
- layout: { xs: 4, sm: 2 },
9153
- main: {
9154
- name: "Ok",
9155
- startIcon: "ApproveIcon",
9156
- variant: "contained",
9157
- type: "text",
9158
- onClick: "okHandler",
9159
- size: "medium"
9160
- },
9161
- style: {
9162
- float: "right"
9163
- }
9164
- }
9165
- },
9166
- {
9167
- type: "Control",
9168
- scope: "#/properties/btnSubmit",
9169
- options: {
9170
- widget: "Button"
9171
- },
9172
- config: {
9173
- layout: { xs: 4, sm: 2 },
9174
- main: {
9175
- name: "Save & Exit",
9176
- startIcon: "ApproveIcon",
9177
- variant: "contained",
9178
- type: "text",
9179
- onClick: "saveHandler",
9180
- size: "medium"
9181
- },
9182
- style: {
9183
- float: "right"
9184
- }
9185
- }
9186
- },
9187
9086
  {
9188
9087
  type: "Control",
9189
9088
  scope: "#/properties/popUpEvent",
@@ -9432,7 +9331,7 @@ const APISection = {
9432
9331
  widget: "SelectInputField"
9433
9332
  },
9434
9333
  config: {
9435
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9334
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
9436
9335
  main: {
9437
9336
  label: "Method",
9438
9337
  type: "text"
@@ -9446,7 +9345,7 @@ const APISection = {
9446
9345
  widget: "InputField"
9447
9346
  },
9448
9347
  config: {
9449
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9348
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
9450
9349
  main: {
9451
9350
  label: "Path",
9452
9351
  type: "text",
@@ -9462,116 +9361,132 @@ const APISection = {
9462
9361
  widget: "EmptyBox"
9463
9362
  },
9464
9363
  config: {
9465
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
9364
+ layout: { xs: 0, sm: 0, md: 4, lg: 6 }
9466
9365
  }
9467
9366
  },
9468
9367
  {
9469
9368
  type: "Control",
9470
- scope: "#/properties/emptyBox",
9369
+ scope: "#/properties/headers",
9471
9370
  options: {
9472
- widget: "EmptyBox"
9371
+ widget: "Array"
9473
9372
  },
9474
9373
  config: {
9475
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
9476
- }
9477
- },
9478
- {
9479
- type: "Control",
9480
- scope: "#/properties/headers",
9481
- layout: 11.5,
9482
- options: {
9483
- "elementLabelProp": "key",
9484
- detail: {
9485
- type: "HorizontalLayout",
9486
- elements: [
9487
- {
9488
- type: "Control",
9489
- scope: "#/properties/key",
9490
- options: {
9491
- widget: "InputField"
9492
- },
9493
- config: {
9494
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9495
- main: {
9496
- label: "Key"
9497
- }
9498
- }
9499
- },
9500
- {
9501
- type: "Control",
9502
- scope: "#/properties/value",
9503
- options: {
9504
- widget: "InputField"
9505
- },
9506
- config: {
9507
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9508
- main: {
9509
- label: "Value"
9510
- }
9511
- }
9512
- },
9513
- {
9514
- type: "Control",
9515
- scope: "#/properties/emptyBox",
9516
- options: {
9517
- widget: "EmptyBox"
9518
- },
9519
- config: {
9520
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
9521
- }
9374
+ layout: 12,
9375
+ main: {
9376
+ label: "Headers",
9377
+ childElementLabel: "Headers"
9378
+ },
9379
+ style: {
9380
+ marginLeft: "-24px",
9381
+ marginBottom: "24px !important",
9382
+ labelStyle: {
9383
+ marginLeft: "24px"
9384
+ },
9385
+ detailsStyle: {
9386
+ marginLeft: "24px"
9387
+ }
9388
+ }
9389
+ },
9390
+ elements: [
9391
+ {
9392
+ type: "Control",
9393
+ scope: "#/properties/key",
9394
+ options: {
9395
+ widget: "InputField"
9396
+ },
9397
+ config: {
9398
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9399
+ main: {
9400
+ label: "Key"
9522
9401
  }
9523
- ]
9402
+ }
9403
+ },
9404
+ {
9405
+ type: "Control",
9406
+ scope: "#/properties/value",
9407
+ options: {
9408
+ widget: "InputField"
9409
+ },
9410
+ config: {
9411
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9412
+ main: {
9413
+ label: "Value"
9414
+ }
9415
+ }
9416
+ },
9417
+ {
9418
+ type: "Control",
9419
+ scope: "#/properties/emptyBox",
9420
+ options: {
9421
+ widget: "EmptyBox"
9422
+ },
9423
+ config: {
9424
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
9425
+ }
9524
9426
  }
9525
- }
9427
+ ]
9526
9428
  },
9527
9429
  {
9528
9430
  type: "Control",
9529
9431
  scope: "#/properties/body",
9530
- layout: 11.5,
9531
9432
  options: {
9532
- "elementLabelProp": "key",
9533
- detail: {
9534
- type: "HorizontalLayout",
9535
- elements: [
9536
- {
9537
- type: "Control",
9538
- scope: "#/properties/key",
9539
- options: {
9540
- widget: "InputField"
9541
- },
9542
- config: {
9543
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9544
- main: {
9545
- label: "Key"
9546
- }
9547
- }
9548
- },
9549
- {
9550
- type: "Control",
9551
- scope: "#/properties/value",
9552
- options: {
9553
- widget: "InputField"
9554
- },
9555
- config: {
9556
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9557
- main: {
9558
- label: "Value"
9559
- }
9560
- }
9561
- },
9562
- {
9563
- type: "Control",
9564
- scope: "#/properties/emptyBox",
9565
- options: {
9566
- widget: "EmptyBox"
9567
- },
9568
- config: {
9569
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
9570
- }
9433
+ widget: "Array"
9434
+ },
9435
+ config: {
9436
+ layout: 12,
9437
+ main: {
9438
+ label: "Body",
9439
+ childElementLabel: "Body"
9440
+ },
9441
+ style: {
9442
+ marginLeft: "-24px",
9443
+ marginBottom: "24px !important",
9444
+ labelStyle: {
9445
+ marginLeft: "24px"
9446
+ },
9447
+ detailsStyle: {
9448
+ marginLeft: "24px"
9449
+ }
9450
+ }
9451
+ },
9452
+ elements: [
9453
+ {
9454
+ type: "Control",
9455
+ scope: "#/properties/key",
9456
+ options: {
9457
+ widget: "InputField"
9458
+ },
9459
+ config: {
9460
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9461
+ main: {
9462
+ label: "Key"
9571
9463
  }
9572
- ]
9464
+ }
9465
+ },
9466
+ {
9467
+ type: "Control",
9468
+ scope: "#/properties/value",
9469
+ options: {
9470
+ widget: "InputField"
9471
+ },
9472
+ config: {
9473
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9474
+ main: {
9475
+ label: "Value"
9476
+ }
9477
+ }
9478
+ },
9479
+ {
9480
+ type: "Control",
9481
+ scope: "#/properties/emptyBox",
9482
+ options: {
9483
+ widget: "EmptyBox"
9484
+ },
9485
+ config: {
9486
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
9487
+ }
9573
9488
  }
9574
- }
9489
+ ]
9575
9490
  },
9576
9491
  getTextArea("apiBody", "Transformer", true, 12)
9577
9492
  ]
@@ -9582,49 +9497,52 @@ const refreshSectionUiSchema = {
9582
9497
  {
9583
9498
  type: "Control",
9584
9499
  scope: "#/properties/refreshElements",
9585
- layout: 11.5,
9586
9500
  options: {
9587
- detail: {
9588
- type: "HorizontalLayout",
9589
- elements: [
9590
- {
9591
- type: "Control",
9592
- scope: "#/properties/value",
9593
- options: {
9594
- widget: "InputField"
9595
- },
9596
- config: {
9597
- layout: { xs: 12, sm: 6, md: 4, lg: 4 },
9598
- main: {
9599
- label: "Value"
9600
- }
9601
- }
9602
- },
9603
- {
9604
- type: "Control",
9605
- scope: "#/properties/emptyBox",
9606
- options: {
9607
- widget: "EmptyBox"
9608
- },
9609
- config: {
9610
- layout: { xs: 0, sm: 6, md: 4, lg: 4 },
9611
- main: {}
9612
- }
9613
- },
9614
- {
9615
- type: "Control",
9616
- scope: "#/properties/emptyBox",
9617
- options: {
9618
- widget: "EmptyBox"
9619
- },
9620
- config: {
9621
- layout: { xs: 0, sm: 0, md: 4, lg: 4 },
9622
- main: {}
9623
- }
9501
+ widget: "Array"
9502
+ },
9503
+ config: {
9504
+ layout: 12,
9505
+ main: {
9506
+ label: "Refresh Elements",
9507
+ childElementLabel: "Refresh Elements"
9508
+ },
9509
+ style: {
9510
+ marginLeft: "-24px",
9511
+ marginBottom: "24px !important",
9512
+ labelStyle: {
9513
+ marginLeft: "24px"
9514
+ },
9515
+ detailsStyle: {
9516
+ marginLeft: "24px"
9517
+ }
9518
+ }
9519
+ },
9520
+ elements: [
9521
+ {
9522
+ type: "Control",
9523
+ scope: "#/properties/value",
9524
+ options: {
9525
+ widget: "InputField"
9526
+ },
9527
+ config: {
9528
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
9529
+ main: {
9530
+ label: "Value"
9624
9531
  }
9625
- ]
9532
+ }
9533
+ },
9534
+ {
9535
+ type: "Control",
9536
+ scope: "#/properties/emptyBox",
9537
+ options: {
9538
+ widget: "EmptyBox"
9539
+ },
9540
+ config: {
9541
+ layout: { xs: 6, sm: 6, md: 8, lg: 8 },
9542
+ main: {}
9543
+ }
9626
9544
  }
9627
- }
9545
+ ]
9628
9546
  }
9629
9547
  ]
9630
9548
  };
@@ -9654,44 +9572,44 @@ var event = (store2, dynamicData2, submitHandler, service2, functionsName) => {
9654
9572
  const schema2 = _.cloneDeep(EventSchema);
9655
9573
  if (handlerType) {
9656
9574
  if (handlerType === "custom") {
9657
- uiSchema.elements[1].elements[0].elements[2] = getRadioInputField("isSync", "Run in Sync", ["Yes", "No"]);
9658
- uiSchema.elements[1].elements[0].elements[3] = {
9575
+ uiSchema.elements[0].elements[0].elements[2] = getRadioInputField("isSync", "Run in Sync", ["Yes", "No"]);
9576
+ uiSchema.elements[0].elements[0].elements[3] = {
9659
9577
  type: "Control",
9660
9578
  scope: "#/properties/emptyBox",
9661
9579
  options: {
9662
9580
  widget: "EmptyBox"
9663
9581
  },
9664
9582
  config: {
9665
- layout: { xs: 0, sm: 6, md: 0, lg: 0 },
9583
+ layout: { xs: 0, sm: 6, md: 0, lg: 3 },
9666
9584
  main: {},
9667
9585
  style: {}
9668
9586
  }
9669
9587
  };
9670
- uiSchema.elements[1].elements[0].elements[4] = getTextArea("eventCode", "Write Custom Code", false);
9588
+ uiSchema.elements[0].elements[0].elements[4] = getTextArea("eventCode", "Write Custom Code", false);
9671
9589
  schema2.required = ["eventType", "Handler", "eventCode"];
9672
9590
  } else if (handlerType === "api") {
9673
- uiSchema.elements[1].elements[0].elements[2] = emptyBox;
9674
- uiSchema.elements[1].elements[0].elements[3] = APISection;
9591
+ uiSchema.elements[0].elements[0].elements[2] = emptyBox;
9592
+ uiSchema.elements[0].elements[0].elements[3] = APISection;
9675
9593
  schema2.required = ["eventType", "Handler", "method", "path"];
9676
9594
  } else if (handlerType === "inBuiltFunction") {
9677
- uiSchema.elements[1].elements[0].elements[2] = getSelectField("inBuiltFunctionType", "Function Name");
9678
- uiSchema.elements[1].elements[0].elements[3] = {
9595
+ uiSchema.elements[0].elements[0].elements[2] = getSelectField("inBuiltFunctionType", "Function Name");
9596
+ uiSchema.elements[0].elements[0].elements[3] = {
9679
9597
  type: "Control",
9680
9598
  scope: "#/properties/emptyBox",
9681
9599
  options: {
9682
9600
  widget: "EmptyBox"
9683
9601
  },
9684
9602
  config: {
9685
- layout: { xs: 6, sm: 6, md: 0, lg: 0 },
9603
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 },
9686
9604
  main: {},
9687
9605
  style: {}
9688
9606
  }
9689
9607
  };
9690
- uiSchema.elements[1].elements[0].elements[4] = getTextArea("funcParametersCode", "Write Custom Code for Functions Parameter", true);
9608
+ uiSchema.elements[0].elements[0].elements[4] = getTextArea("funcParametersCode", "Write Custom Code for Functions Parameter", true);
9691
9609
  schema2.required = ["eventType", "Handler", "inBuiltFunctionType"];
9692
9610
  } else if (handlerType === "refresh") {
9693
- uiSchema.elements[1].elements[0].elements[2] = emptyBox;
9694
- uiSchema.elements[1].elements[0].elements[3] = refreshSectionUiSchema;
9611
+ uiSchema.elements[0].elements[0].elements[2] = emptyBox;
9612
+ uiSchema.elements[0].elements[0].elements[3] = refreshSectionUiSchema;
9695
9613
  schema2.properties.refreshElements.required = ["value"];
9696
9614
  schema2.properties.refreshElements.items.required = ["value"];
9697
9615
  schema2.required = ["eventType", "Handler", "refreshElements"];