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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/impaktapps-ui-builder.es.js +119 -180
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +5 -5
  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/PageMaster/uiSchema.ts +186 -295
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,25 @@ 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"]
137
117
  },
138
- defaultStyle: true
118
+ style: {
119
+ marginTop: "-16px",
120
+ TabPanelStyle: {
121
+ padding: 0
122
+ }
123
+ },
124
+ TabsStyle: {
125
+ borderTop: `1px solid ${theme.palette.common.black}29`,
126
+ marginBottom: "3px",
127
+ paddingBottom: "4px",
128
+ boxShadow: "0px 3px 4px #afafaf80",
129
+ "& .MuiTabs-indicator": {
130
+ bottom: "6px"
131
+ }
132
+ }
139
133
  },
140
134
  elements: [
141
135
  {
@@ -159,12 +153,18 @@ const PageMasterUiSchema = (theme) => {
159
153
  main: {
160
154
  onClick: "onAddClickHandler",
161
155
  size: "small",
162
- icon: "AddIcon",
163
- iconLabel: "Add New",
156
+ icon: "TableAddIcon",
157
+ iconLabel: "Add",
164
158
  styleDefault: true
165
159
  },
166
160
  style: {
167
- mt: "6px"
161
+ mt: "6px",
162
+ color: "inherit",
163
+ fill: "inherit",
164
+ "&:hover": {
165
+ color: "inherit",
166
+ fill: "inherit"
167
+ }
168
168
  }
169
169
  }
170
170
  }
@@ -180,12 +180,18 @@ const PageMasterUiSchema = (theme) => {
180
180
  main: {
181
181
  onClick: "copyPasteElement",
182
182
  size: "small",
183
- icon: "PasteIcon",
183
+ icon: "TablePasteIcon",
184
184
  iconLabel: "Paste",
185
185
  styleDefault: true
186
186
  },
187
187
  style: {
188
- mt: "6px"
188
+ mt: "6px",
189
+ color: "inherit",
190
+ fill: "inherit",
191
+ "&:hover": {
192
+ color: "inherit",
193
+ fill: "inherit"
194
+ }
189
195
  }
190
196
  }
191
197
  }
@@ -200,16 +206,21 @@ const PageMasterUiSchema = (theme) => {
200
206
  elements: [
201
207
  {
202
208
  accessorKey: "name",
203
- header: "Name"
209
+ header: "Name",
210
+ size: 300,
211
+ type: "string"
204
212
  },
205
213
  {
206
214
  accessorKey: "type",
207
- header: "Type"
215
+ header: "Type",
216
+ size: 300,
217
+ type: "string"
208
218
  },
209
219
  {
210
220
  header: "Edit",
211
221
  field: "Reject_Records",
212
- flex: 1,
222
+ size: 150,
223
+ type: "action",
213
224
  widget: {
214
225
  type: "Control",
215
226
  scope: "#/properties/RejectButton",
@@ -218,13 +229,15 @@ const PageMasterUiSchema = (theme) => {
218
229
  },
219
230
  config: {
220
231
  main: {
221
- icon: "EditIcon",
222
- color: "primary",
232
+ icon: "TableEditIcon",
223
233
  onClick: "Edit_Components",
224
234
  tooltipMessage: "Edit This Record"
225
235
  },
226
236
  style: {
227
- color: theme.palette.primary.main
237
+ fill: theme.palette.primary.main,
238
+ "& :hover": {
239
+ fill: theme.palette.primary.dark
240
+ }
228
241
  }
229
242
  }
230
243
  }
@@ -232,7 +245,8 @@ const PageMasterUiSchema = (theme) => {
232
245
  {
233
246
  header: "Delete",
234
247
  field: "Reject_Records",
235
- flex: 1,
248
+ size: 150,
249
+ type: "action",
236
250
  widget: {
237
251
  type: "Control",
238
252
  scope: "#/properties/RejectButton",
@@ -241,10 +255,15 @@ const PageMasterUiSchema = (theme) => {
241
255
  },
242
256
  config: {
243
257
  main: {
244
- icon: "RejectIcon",
245
- color: "error",
258
+ icon: "Bin",
246
259
  onClick: "deletePopUpComponent",
247
260
  tooltipMessage: "Reject This Record"
261
+ },
262
+ style: {
263
+ fill: theme.palette.primary.main,
264
+ "& :hover": {
265
+ fill: theme.palette.primary.dark
266
+ }
248
267
  }
249
268
  }
250
269
  }
@@ -291,12 +310,18 @@ const PageMasterUiSchema = (theme) => {
291
310
  main: {
292
311
  onClick: "eventAddHandler",
293
312
  size: "small",
294
- icon: "AddIcon",
295
- iconLabel: "Add New",
313
+ icon: "TableAddIcon",
314
+ iconLabel: "Add",
296
315
  styleDefault: true
297
316
  },
298
317
  style: {
299
- mt: "6px"
318
+ mt: "6px",
319
+ color: "inherit",
320
+ fill: "inherit",
321
+ "&:hover": {
322
+ color: "inherit",
323
+ fill: "inherit"
324
+ }
300
325
  }
301
326
  }
302
327
  }
@@ -312,12 +337,18 @@ const PageMasterUiSchema = (theme) => {
312
337
  main: {
313
338
  onClick: "copyPasteElement",
314
339
  size: "small",
315
- icon: "PasteIcon",
340
+ icon: "TablePasteIcon",
316
341
  iconLabel: "Paste",
317
342
  styleDefault: true
318
343
  },
319
344
  style: {
320
- mt: "6px"
345
+ mt: "6px",
346
+ color: "inherit",
347
+ fill: "inherit",
348
+ "&:hover": {
349
+ color: "inherit",
350
+ fill: "inherit"
351
+ }
321
352
  }
322
353
  }
323
354
  }
@@ -332,15 +363,21 @@ const PageMasterUiSchema = (theme) => {
332
363
  elements: [
333
364
  {
334
365
  accessorKey: "eventType",
335
- header: "Event Type"
366
+ header: "Event Type",
367
+ size: 300,
368
+ type: "string"
336
369
  },
337
370
  {
338
371
  accessorKey: "Handler",
339
- header: "Handler"
372
+ header: "Handler",
373
+ size: 300,
374
+ type: "string"
340
375
  },
341
376
  {
342
377
  accessorKey: "Edit_Approve_Records",
343
378
  header: "Edit Widget",
379
+ type: "action",
380
+ size: 150,
344
381
  widget: {
345
382
  type: "Control",
346
383
  scope: "#/properties/Edit_Records",
@@ -349,14 +386,16 @@ const PageMasterUiSchema = (theme) => {
349
386
  },
350
387
  config: {
351
388
  main: {
352
- color: "info",
353
389
  size: "small",
354
- icon: "EditIcon",
390
+ icon: "TableEditIcon",
355
391
  tooltipMessage: "Edit This Record",
356
392
  onClick: "editEvent"
357
393
  },
358
394
  style: {
359
- color: theme.palette.primary.main
395
+ fill: theme.palette.primary.main,
396
+ "& :hover": {
397
+ fill: theme.palette.primary.dark
398
+ }
360
399
  }
361
400
  }
362
401
  }
@@ -372,10 +411,15 @@ const PageMasterUiSchema = (theme) => {
372
411
  },
373
412
  config: {
374
413
  main: {
375
- icon: "RejectIcon",
376
- color: "error",
414
+ icon: "Bin",
377
415
  tooltipMessage: "Reject This Record",
378
416
  onClick: "deletePopUpEvent"
417
+ },
418
+ style: {
419
+ fill: theme.palette.primary.main,
420
+ "& :hover": {
421
+ fill: theme.palette.primary.dark
422
+ }
379
423
  }
380
424
  }
381
425
  }
@@ -403,62 +447,6 @@ const PageMasterUiSchema = (theme) => {
403
447
  }
404
448
  ]
405
449
  },
406
- {
407
- type: "HorizontalLayout",
408
- config: {
409
- layout: { xs: 12, sm: 9 }
410
- },
411
- elements: [
412
- {
413
- type: "Control",
414
- scope: "#/properties/RemoveItemButton",
415
- 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"
436
- },
437
- config: {
438
- layout: { xs: 6, sm: 6 },
439
- main: {
440
- heading: "No element copied"
441
- },
442
- style: {
443
- color: "#535557",
444
- marginLeft: "-30px",
445
- fontSize: "12px",
446
- marginTop: "4px"
447
- }
448
- }
449
- },
450
- {
451
- type: "Control",
452
- scope: "#/properties/EmptyBox",
453
- options: {
454
- widget: "EmptyBox"
455
- },
456
- config: {
457
- layout: { xs: 1, sm: 5 }
458
- }
459
- }
460
- ]
461
- },
462
450
  {
463
451
  type: "Control",
464
452
  scope: "#/properties/btn",
@@ -466,7 +454,7 @@ const PageMasterUiSchema = (theme) => {
466
454
  widget: "Button"
467
455
  },
468
456
  config: {
469
- layout: { xs: 4, sm: 2 },
457
+ layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
470
458
  main: {
471
459
  name: "Save",
472
460
  startIcon: "ApproveIcon",
@@ -477,6 +465,16 @@ const PageMasterUiSchema = (theme) => {
477
465
  }
478
466
  }
479
467
  },
468
+ {
469
+ type: "Control",
470
+ scope: "#/properties/EmptyBox",
471
+ config: {
472
+ layout: { xs: 8, sm: 9.5, md: 10, lg: 10.5 }
473
+ },
474
+ options: {
475
+ widget: "EmptyBox"
476
+ }
477
+ },
480
478
  {
481
479
  type: "Control",
482
480
  scope: "#/properties/popUpPageMasterComponent",
@@ -740,7 +738,7 @@ const PageMasterUiSchema = (theme) => {
740
738
  style: {
741
739
  flexDirection: "row",
742
740
  position: "absolute",
743
- bottom: 0,
741
+ bottom: 10,
744
742
  height: "fit-content",
745
743
  overflow: "hidden",
746
744
  zIndex: 1e3,
@@ -759,78 +757,19 @@ const PageMasterUiSchema = (theme) => {
759
757
  heading: "Copywriter@ACT21.IO"
760
758
  },
761
759
  style: {
762
- color: ((_b = (_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text) == null ? void 0 : _b.disabled) || "#AFAFAF",
760
+ color: ((_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text.disabled) || "#AFAFAF",
763
761
  fontSize: "11px",
764
762
  textAlign: "center",
765
- lineHeight: 2,
763
+ lineHeight: 0,
766
764
  width: "fit-content",
767
765
  left: "50%",
768
766
  position: "relative",
769
- margin: 0,
767
+ margin: "revert",
770
768
  flexGrow: 1,
771
769
  height: 0,
772
770
  transform: "translate(-50%, 0%)"
773
771
  }
774
772
  }
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
773
  }
835
774
  ]
836
775
  }