impaktapps-ui-builder 0.0.382-alpha.10 → 0.0.382-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 (11) hide show
  1. package/dist/impaktapps-ui-builder.es.js +588 -622
  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/dist/src/impaktapps-ui-builder/builder/services/event.d.ts +1 -1
  6. package/package.json +1 -1
  7. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +264 -308
  8. package/src/impaktapps-ui-builder/builder/elements/UiSchema/PageMaster/uiSchema.ts +57 -38
  9. package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/uiSchema.ts +284 -381
  10. package/src/impaktapps-ui-builder/builder/services/component.ts +3 -3
  11. package/src/impaktapps-ui-builder/builder/services/event.ts +8 -8
package/dist/impaktapps-ui-builder.es.js CHANGED
@@ -43,48 +43,67 @@ const PageMasterUiSchema = (theme) => {
43
43
  heading: "Page Master",
44
44
  elements: [
45
45
  {
46
- type: "Control",
47
- scope: "#/properties/name",
48
- options: {
49
- widget: "InputField"
50
- },
46
+ type: "WrapperLayout",
51
47
  config: {
52
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
53
48
  main: {
54
- label: "Name",
55
- options: [],
56
- color: "secondary",
57
- errorMessage: "Name should be start with 'page_'",
58
- helperText: 'Name should be start with "page_"',
59
- required: true
60
- }
61
- }
62
- },
63
- {
64
- type: "Control",
65
- scope: "#/properties/label",
66
- options: {
67
- widget: "InputField"
49
+ label: "Page Template",
50
+ isAccordion: true
51
+ },
52
+ wrapperStyle: {
53
+ marginTop: "-6px",
54
+ marginBottom: "-8px"
55
+ },
56
+ componentsBoxStyle: {
57
+ marginLeft: "24px"
58
+ },
59
+ defaultStyle: true
68
60
  },
69
- config: {
70
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
71
- main: {
72
- label: "Label",
73
- options: [],
74
- color: "secondary",
75
- required: true
61
+ elements: [
62
+ {
63
+ type: "Control",
64
+ scope: "#/properties/name",
65
+ options: {
66
+ widget: "InputField"
67
+ },
68
+ config: {
69
+ layout: { xs: 11, sm: 4, md: 4, lg: 4 },
70
+ main: {
71
+ label: "Name",
72
+ options: [],
73
+ color: "secondary",
74
+ errorMessage: "Name should be start with 'page_'",
75
+ helperText: 'Name should be start with "page_"',
76
+ required: true
77
+ }
78
+ }
79
+ },
80
+ {
81
+ type: "Control",
82
+ scope: "#/properties/label",
83
+ options: {
84
+ widget: "InputField"
85
+ },
86
+ config: {
87
+ layout: { xs: 11, sm: 4, md: 4, lg: 4 },
88
+ main: {
89
+ label: "Label",
90
+ options: [],
91
+ color: "secondary",
92
+ required: true
93
+ }
94
+ }
95
+ },
96
+ {
97
+ type: "Control",
98
+ scope: "#/properties/emptyBox",
99
+ options: {
100
+ widget: "EmptyBox"
101
+ },
102
+ config: {
103
+ layout: { xs: 0, sm: 4 }
104
+ }
76
105
  }
77
- }
78
- },
79
- {
80
- type: "Control",
81
- scope: "#/properties/emptyBox",
82
- options: {
83
- widget: "EmptyBox"
84
- },
85
- config: {
86
- layout: { xs: 0, sm: 4 }
87
- }
106
+ ]
88
107
  },
89
108
  {
90
109
  type: "TabLayout",
@@ -6150,303 +6169,285 @@ const ComponentSchema = {
6150
6169
  },
6151
6170
  required: ["name"]
6152
6171
  };
6153
- const componentBasicUiSchema = (theme) => {
6154
- var _a;
6155
- const uiSchema = {
6156
- type: "HorizontalLayout",
6157
- heading: "Component",
6158
- elements: [
6159
- {
6160
- type: "TabLayout",
6161
- config: {
6162
- main: {
6163
- tabLabels: ["Core"],
6164
- defaultStyle: true,
6165
- id: `component`
6172
+ const componentBasicUiSchema = {
6173
+ type: "HorizontalLayout",
6174
+ elements: [
6175
+ {
6176
+ type: "WrapperLayout",
6177
+ config: {
6178
+ main: {
6179
+ rowSpacing: 1,
6180
+ header: true
6181
+ },
6182
+ defaultStyle: true
6183
+ },
6184
+ elements: [
6185
+ {
6186
+ type: "Control",
6187
+ scope: "#/properties/Component",
6188
+ options: {
6189
+ widget: "Box"
6190
+ },
6191
+ config: {
6192
+ layout: { xs: 12, sm: 12, md: 2 },
6193
+ main: {
6194
+ heading: "Component"
6195
+ },
6196
+ style: {
6197
+ "float": "left"
6198
+ }
6166
6199
  }
6167
6200
  },
6168
- elements: [
6169
- {
6170
- type: "HorizontalLayout",
6171
- elements: [
6172
- {
6173
- type: "Control",
6174
- scope: "#/properties/type",
6175
- options: {
6176
- widget: "SelectInputField"
6177
- },
6178
- config: {
6179
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
6180
- main: {
6181
- label: "Type"
6182
- }
6201
+ {
6202
+ type: "Control",
6203
+ scope: "#/properties/pageName",
6204
+ options: {
6205
+ widget: "Box"
6206
+ },
6207
+ config: {
6208
+ layout: { xs: 7, sm: 7, md: 9 },
6209
+ main: {
6210
+ heading: " "
6211
+ },
6212
+ style: {
6213
+ float: "right",
6214
+ width: "auto",
6215
+ fontSize: "12px",
6216
+ color: "gray",
6217
+ paddingTop: "10px"
6218
+ }
6219
+ }
6220
+ },
6221
+ {
6222
+ type: "Control",
6223
+ scope: "#/properties/Back_Button",
6224
+ options: {
6225
+ widget: "IconButton"
6226
+ },
6227
+ config: {
6228
+ layout: { xs: 2, sm: 2, md: 0.5 },
6229
+ main: {
6230
+ icon: "BackIcon",
6231
+ styleDefault: true,
6232
+ size: "small",
6233
+ onClick: "backHandler",
6234
+ tooltipMessage: "Back"
6235
+ },
6236
+ style: {
6237
+ float: "right"
6238
+ }
6239
+ }
6240
+ }
6241
+ ]
6242
+ },
6243
+ {
6244
+ type: "TabLayout",
6245
+ config: {
6246
+ main: {
6247
+ tabLabels: ["Core"],
6248
+ defaultStyle: true,
6249
+ id: `component`
6250
+ }
6251
+ },
6252
+ elements: [
6253
+ {
6254
+ type: "HorizontalLayout",
6255
+ elements: [
6256
+ {
6257
+ type: "Control",
6258
+ scope: "#/properties/type",
6259
+ options: {
6260
+ widget: "SelectInputField"
6261
+ },
6262
+ config: {
6263
+ layout: { xs: 12, sm: 12, md: 6, lg: 6 },
6264
+ main: {
6265
+ label: "Type"
6183
6266
  }
6267
+ }
6268
+ },
6269
+ {
6270
+ type: "Control",
6271
+ scope: "#/properties/name",
6272
+ options: {
6273
+ widget: "InputField"
6184
6274
  },
6185
- {
6186
- type: "Control",
6187
- scope: "#/properties/name",
6188
- options: {
6189
- widget: "InputField"
6275
+ config: {
6276
+ layout: {
6277
+ xs: 12,
6278
+ sm: 12,
6279
+ md: 6,
6280
+ lg: 6
6190
6281
  },
6191
- config: {
6192
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
6193
- main: {
6194
- label: "Name",
6195
- options: [],
6196
- color: "secondary",
6197
- required: true
6198
- }
6282
+ main: {
6283
+ label: "Name",
6284
+ options: [],
6285
+ color: "secondary",
6286
+ required: true
6199
6287
  }
6288
+ }
6289
+ },
6290
+ {
6291
+ type: "Control",
6292
+ scope: "#/properties/label",
6293
+ options: {
6294
+ widget: "InputField"
6200
6295
  },
6201
- {
6202
- type: "Control",
6203
- scope: "#/properties/label",
6204
- options: {
6205
- widget: "InputField"
6296
+ config: {
6297
+ layout: {
6298
+ xs: 12,
6299
+ sm: 12,
6300
+ md: 6,
6301
+ lg: 6
6206
6302
  },
6207
- config: {
6208
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
6209
- main: {
6210
- label: "Label",
6211
- options: [],
6212
- color: "secondary",
6213
- required: true
6214
- }
6303
+ main: {
6304
+ label: "Label",
6305
+ options: [],
6306
+ color: "secondary",
6307
+ required: true
6215
6308
  }
6309
+ }
6310
+ },
6311
+ {
6312
+ type: "Control",
6313
+ scope: "#/properties/proc",
6314
+ config: {
6315
+ layout: { xs: 11, sm: 11, md: 6, lg: 6 }
6216
6316
  },
6217
- {
6218
- type: "Control",
6219
- scope: "#/properties/layout",
6220
- layout: 12,
6221
- options: {
6222
- detail: {
6223
- type: "HorizontalLayout",
6224
- elements: [
6225
- {
6226
- type: "Control",
6227
- scope: "#/properties/key",
6228
- options: {
6229
- widget: "SelectInputField"
6230
- },
6231
- config: {
6232
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
6233
- main: {
6234
- label: "Screen Size"
6235
- }
6236
- }
6317
+ options: {
6318
+ widget: "EmptyBox"
6319
+ }
6320
+ },
6321
+ {
6322
+ type: "Control",
6323
+ scope: "#/properties/layout",
6324
+ layout: 11.5,
6325
+ options: {
6326
+ detail: {
6327
+ type: "HorizontalLayout",
6328
+ elements: [
6329
+ {
6330
+ type: "Control",
6331
+ scope: "#/properties/key",
6332
+ options: {
6333
+ widget: "SelectInputField"
6237
6334
  },
6238
- {
6239
- type: "Control",
6240
- scope: "#/properties/value",
6241
- options: {
6242
- widget: "InputField"
6335
+ config: {
6336
+ layout: {
6337
+ xs: 11,
6338
+ sm: 11,
6339
+ md: 5.5,
6340
+ lg: 5.5
6243
6341
  },
6244
- config: {
6245
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
6246
- main: {
6247
- label: "Value",
6248
- type: "number",
6249
- helperText: "Number should be in range of 0 to 12",
6250
- errorMessage: "Number Can't be greater than 12 and can't be less than 0."
6251
- }
6342
+ main: {
6343
+ label: "Screen Size"
6252
6344
  }
6345
+ }
6346
+ },
6347
+ {
6348
+ type: "Control",
6349
+ scope: "#/properties/value",
6350
+ options: {
6351
+ widget: "InputField"
6253
6352
  },
6254
- {
6255
- type: "Control",
6256
- scope: "#/properties/emptyBox",
6257
- options: {
6258
- widget: "EmptyBox"
6353
+ config: {
6354
+ layout: {
6355
+ xs: 11,
6356
+ sm: 11,
6357
+ md: 5.5,
6358
+ lg: 5.5
6259
6359
  },
6260
- config: {
6261
- layout: { xs: 0, sm: 4 }
6360
+ main: {
6361
+ label: "Value",
6362
+ type: "number",
6363
+ helperText: "Number should be in range of 0 to 12",
6364
+ errorMessage: "Number Can't be greater than 12 and can't be less than 0."
6262
6365
  }
6263
6366
  }
6264
- ]
6265
- }
6367
+ }
6368
+ ]
6266
6369
  }
6267
6370
  }
6268
- ]
6269
- }
6270
- ]
6271
- },
6272
- {
6273
- type: "Control",
6274
- scope: "#/properties/EmptyBox",
6275
- options: {
6276
- widget: "EmptyBox"
6277
- },
6278
- config: {
6279
- layout: { xs: 0, sm: 4, md: 4, lg: 4 }
6371
+ }
6372
+ ]
6280
6373
  }
6374
+ ]
6375
+ },
6376
+ {
6377
+ type: "Control",
6378
+ scope: "#/properties/proc",
6379
+ config: {
6380
+ layout: { xs: 11, sm: 11, md: 6, lg: 6 }
6281
6381
  },
6282
- {
6283
- type: "Control",
6284
- scope: "#/properties/EmptyBox",
6285
- options: {
6286
- widget: "EmptyBox"
6382
+ options: {
6383
+ widget: "EmptyBox"
6384
+ }
6385
+ },
6386
+ {
6387
+ type: "Control",
6388
+ scope: "#/properties/btn",
6389
+ options: {
6390
+ widget: "Button"
6391
+ },
6392
+ config: {
6393
+ layout: {
6394
+ xs: 11,
6395
+ sm: 11,
6396
+ md: 2.5,
6397
+ lg: 2.5
6287
6398
  },
6288
- config: {
6289
- layout: { xs: 0, sm: 4, md: 4, lg: 4 }
6399
+ main: {
6400
+ name: "Ok",
6401
+ startIcon: "ApproveIcon",
6402
+ variant: "contained",
6403
+ color: "info",
6404
+ type: "text",
6405
+ onClick: "okHandler",
6406
+ size: "small"
6407
+ },
6408
+ style: {
6409
+ marginBottom: "8px",
6410
+ float: "right"
6290
6411
  }
6412
+ }
6413
+ },
6414
+ {
6415
+ type: "Control",
6416
+ scope: "#/properties/btnSubmit",
6417
+ options: {
6418
+ widget: "Button"
6291
6419
  },
6292
- {
6293
- type: "Control",
6294
- scope: "#/properties/btn",
6295
- options: {
6296
- widget: "Button"
6420
+ config: {
6421
+ layout: {
6422
+ xs: 11,
6423
+ sm: 11,
6424
+ md: 2.5,
6425
+ lg: 2.5
6297
6426
  },
6298
- config: {
6299
- layout: 1.8,
6300
- main: {
6301
- name: "Ok",
6302
- startIcon: "ApproveIcon",
6303
- variant: "contained",
6304
- color: "info",
6305
- type: "text",
6306
- onClick: "okHandler",
6307
- size: "medium"
6308
- },
6309
- style: {
6310
- float: "right"
6311
- }
6312
- }
6313
- },
6314
- {
6315
- type: "Control",
6316
- scope: "#/properties/btnSubmit",
6317
- options: {
6318
- widget: "Button"
6427
+ main: {
6428
+ name: "Save & Exit",
6429
+ startIcon: "ApproveIcon",
6430
+ variant: "contained",
6431
+ color: "info",
6432
+ type: "text",
6433
+ onClick: "saveHandler",
6434
+ size: "small"
6319
6435
  },
6320
- config: {
6321
- layout: 1.8,
6322
- main: {
6323
- name: "Save & Exit",
6324
- startIcon: "ApproveIcon",
6325
- variant: "contained",
6326
- color: "info",
6327
- type: "text",
6328
- onClick: "saveHandler",
6329
- size: "medium"
6330
- },
6331
- style: {
6332
- float: "right"
6333
- }
6436
+ style: {
6437
+ marginBottom: "8px",
6438
+ float: "right"
6334
6439
  }
6335
- },
6336
- {
6337
- type: "Control",
6338
- scope: "#/properties/notify",
6339
- options: {
6340
- widget: "Notify"
6341
- },
6342
- layout: 6
6343
- },
6344
- {
6345
- type: "HorizontalLayout",
6346
- config: {
6347
- style: {
6348
- position: "fixed",
6349
- bottom: 5,
6350
- overflow: "visible",
6351
- margin: "0",
6352
- width: "100vw"
6353
- }
6354
- },
6355
- elements: [
6356
- {
6357
- type: "Control",
6358
- scope: "#/properties/EmptyBox",
6359
- options: {
6360
- widget: "EmptyBox"
6361
- },
6362
- config: {
6363
- layout: { xs: 0, sm: 4, md: 4, lg: 4 }
6364
- }
6365
- },
6366
- {
6367
- type: "Control",
6368
- scope: "#/properties/FooterText",
6369
- options: {
6370
- widget: "Box"
6371
- },
6372
- config: {
6373
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
6374
- main: {
6375
- heading: "Copywriter@ACT21.IO"
6376
- },
6377
- style: {
6378
- color: ((_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text.disabled) || "#AFAFAF",
6379
- fontSize: "12px"
6380
- }
6381
- }
6382
- },
6383
- {
6384
- type: "HorizontalLayout",
6385
- config: {
6386
- layout: { xs: 11, sm: 4, md: 4, lg: 4 }
6387
- },
6388
- elements: [
6389
- {
6390
- type: "Control",
6391
- scope: "#/properties/EmptyBox",
6392
- options: {
6393
- widget: "EmptyBox"
6394
- },
6395
- config: {
6396
- layout: 2
6397
- }
6398
- },
6399
- {
6400
- type: "Control",
6401
- scope: "#/properties/backIcon",
6402
- options: {
6403
- widget: "Box"
6404
- },
6405
- config: {
6406
- layout: 1,
6407
- main: {
6408
- iconName: "PrevIcon",
6409
- onClick: "backHandler"
6410
- },
6411
- style: {
6412
- fill: theme.palette.primary.dark,
6413
- width: 20,
6414
- height: 20,
6415
- display: "flex",
6416
- alignItems: "center",
6417
- justifyContent: "center",
6418
- marginRight: "-8px",
6419
- cursor: "pointer"
6420
- }
6421
- }
6422
- },
6423
- {
6424
- type: "Control",
6425
- scope: "#/properties/text",
6426
- options: {
6427
- widget: "Box"
6428
- },
6429
- config: {
6430
- layout: 9,
6431
- main: {
6432
- heading: "Previous Page",
6433
- onClick: "backHandler"
6434
- },
6435
- style: {
6436
- color: theme.palette.primary.dark,
6437
- fontSize: "12px",
6438
- cursor: "pointer",
6439
- marginLeft: "-6px"
6440
- }
6441
- }
6442
- }
6443
- ]
6444
- }
6445
- ]
6446
6440
  }
6447
- ]
6448
- };
6449
- return uiSchema;
6441
+ },
6442
+ {
6443
+ type: "Control",
6444
+ scope: "#/properties/notify",
6445
+ options: {
6446
+ widget: "Notify"
6447
+ },
6448
+ layout: 6
6449
+ }
6450
+ ]
6450
6451
  };
6451
6452
  const CoreSection = {
6452
6453
  type: "HorizontalLayout",
@@ -7487,7 +7488,7 @@ const sectionLabels = {
7487
7488
  };
7488
7489
  const refreshPage = (type, store2) => {
7489
7490
  var _a;
7490
- const UiSchema = _.cloneDeep(componentBasicUiSchema(store2.theme.myTheme));
7491
+ const UiSchema = _.cloneDeep(componentBasicUiSchema);
7491
7492
  if (type) {
7492
7493
  const sectionUiSchema = {
7493
7494
  Core: CoreSection,
@@ -7499,8 +7500,8 @@ const refreshPage = (type, store2) => {
7499
7500
  Validation: ValidationSection
7500
7501
  };
7501
7502
  const elements = (_a = sectionLabels[type]) == null ? void 0 : _a.map((e) => sectionUiSchema[e]);
7502
- UiSchema.elements[0].config.main.tabLabels = sectionLabels[type] || ["Core", "style", "Event", "Validation"];
7503
- UiSchema.elements[0].elements = elements || [CoreSection, StyleSection, EventSection, ValidationSection];
7503
+ UiSchema.elements[1].config.main.tabLabels = sectionLabels[type] || ["Core", "style", "Event", "Validation"];
7504
+ UiSchema.elements[1].elements = elements || [CoreSection, StyleSection, EventSection, ValidationSection];
7504
7505
  }
7505
7506
  store2.setUiSchema(UiSchema);
7506
7507
  };
@@ -7757,337 +7758,302 @@ const EventSchema = {
7757
7758
  },
7758
7759
  required: ["eventType", "Handler"]
7759
7760
  };
7760
- const EventUiSchema = (theme) => {
7761
- var _a;
7762
- const uiSchema = {
7763
- type: "HorizontalLayout",
7764
- heading: "Component",
7765
- elements: [
7766
- {
7767
- type: "TabLayout",
7768
- config: {
7769
- main: {
7770
- tabLabels: ["Core", "Response Event"],
7771
- defaultStyle: true,
7772
- id: "event"
7761
+ const EventUiSchema = {
7762
+ type: "HorizontalLayout",
7763
+ elements: [
7764
+ {
7765
+ type: "WrapperLayout",
7766
+ config: {
7767
+ main: {
7768
+ rowSpacing: 1,
7769
+ header: true
7770
+ },
7771
+ defaultStyle: true
7772
+ },
7773
+ elements: [
7774
+ {
7775
+ type: "Control",
7776
+ scope: "#/properties/Component",
7777
+ options: {
7778
+ widget: "Box"
7779
+ },
7780
+ config: {
7781
+ layout: { xs: 12, sm: 12, md: 2 },
7782
+ main: {
7783
+ heading: "Component"
7784
+ },
7785
+ style: {
7786
+ "float": "left"
7787
+ }
7773
7788
  }
7774
7789
  },
7775
- elements: [
7776
- {
7777
- type: "HorizontalLayout",
7778
- elements: [
7779
- {
7780
- type: "Control",
7781
- scope: `#/properties/eventType`,
7782
- options: {
7783
- widget: "SelectInputField"
7784
- },
7785
- config: {
7786
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
7787
- main: {
7788
- label: "Event Type",
7789
- type: "text"
7790
- }
7791
- }
7792
- },
7793
- {
7794
- type: "Control",
7795
- scope: `#/properties/Handler`,
7796
- options: {
7797
- widget: "SelectInputField"
7798
- },
7799
- config: {
7800
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
7801
- main: {
7802
- label: "Handler",
7803
- type: "text"
7804
- }
7805
- }
7790
+ {
7791
+ type: "Control",
7792
+ scope: "#/properties/pageName",
7793
+ options: {
7794
+ widget: "Box"
7795
+ },
7796
+ config: {
7797
+ layout: { xs: 7, sm: 7, md: 9 },
7798
+ main: {
7799
+ heading: " "
7800
+ },
7801
+ style: {
7802
+ float: "right",
7803
+ width: "auto",
7804
+ fontSize: "12px",
7805
+ color: "gray",
7806
+ paddingTop: "10px"
7807
+ }
7808
+ }
7809
+ },
7810
+ {
7811
+ type: "Control",
7812
+ scope: "#/properties/Back_Button",
7813
+ options: {
7814
+ widget: "IconButton"
7815
+ },
7816
+ config: {
7817
+ layout: { xs: 2, sm: 2, md: 0.5 },
7818
+ main: {
7819
+ icon: "BackIcon",
7820
+ styleDefault: true,
7821
+ size: "small",
7822
+ onClick: "backHandler",
7823
+ tooltipMessage: "Back"
7824
+ },
7825
+ style: {
7826
+ float: "right"
7827
+ }
7828
+ }
7829
+ }
7830
+ ]
7831
+ },
7832
+ {
7833
+ type: "TabLayout",
7834
+ config: {
7835
+ main: {
7836
+ tabLabels: ["Core", "Response Event"],
7837
+ defaultStyle: true,
7838
+ id: "event"
7839
+ }
7840
+ },
7841
+ elements: [
7842
+ {
7843
+ type: "HorizontalLayout",
7844
+ elements: [
7845
+ {
7846
+ type: "Control",
7847
+ scope: `#/properties/eventType`,
7848
+ options: {
7849
+ widget: "SelectInputField"
7806
7850
  },
7807
- {
7808
- type: "Control",
7809
- scope: "#/properties/emptyBox",
7810
- options: {
7811
- widget: "EmptyBox"
7812
- },
7813
- config: {
7814
- layout: { xs: 0, sm: 4 }
7851
+ config: {
7852
+ layout: { xs: 11, sm: 11, md: 5.5, lg: 5.5 },
7853
+ main: {
7854
+ label: "Event Type",
7855
+ type: "text"
7815
7856
  }
7816
7857
  }
7817
- ]
7818
- },
7819
- {
7820
- type: "Control",
7821
- scope: "#/properties/events",
7822
- options: {
7823
- widget: "Table"
7824
7858
  },
7825
- config: {
7826
- main: {
7827
- headerIcons: {
7828
- elements: [
7829
- {
7830
- widget: {
7831
- type: "Control",
7832
- scope: "#/properties/New_Record",
7833
- options: {
7834
- widget: "IconButton"
7835
- },
7836
- config: {
7837
- main: {
7838
- color: "info",
7839
- onClick: "addEvent",
7840
- size: "small",
7841
- icon: "AddIcon",
7842
- iconLabel: "Add New",
7843
- styleDefault: true
7844
- },
7845
- style: {
7846
- mt: "6px"
7847
- }
7848
- }
7849
- }
7850
- }
7851
- ]
7859
+ getSelectField("Handler", "Handler")
7860
+ ]
7861
+ },
7862
+ {
7863
+ type: "WrapperLayout",
7864
+ config: {
7865
+ main: {
7866
+ divider: true
7867
+ },
7868
+ wrapperStyle: {
7869
+ border: "1px solid gray"
7870
+ }
7871
+ },
7872
+ elements: [
7873
+ {
7874
+ type: "Control",
7875
+ scope: "#/properties/heading",
7876
+ options: {
7877
+ widget: "Box"
7878
+ },
7879
+ config: {
7880
+ layout: 8,
7881
+ main: {
7882
+ heading: "Response Event"
7852
7883
  },
7853
- disableAction: true,
7854
- disableSelection: true,
7855
- enableDrag: true
7884
+ style: {
7885
+ fontFamily: "Roboto",
7886
+ fontWeight: "500",
7887
+ paddingLeft: "-10px",
7888
+ fontSize: "20px"
7889
+ }
7856
7890
  }
7857
7891
  },
7858
- elements: [
7859
- {
7860
- accessorKey: "eventType",
7861
- header: "Event Type"
7892
+ {
7893
+ type: "Control",
7894
+ scope: "#/properties/AddButton",
7895
+ options: {
7896
+ widget: "IconButton"
7862
7897
  },
7863
- {
7864
- accessorKey: "Handler",
7865
- header: "Handler"
7898
+ config: {
7899
+ layout: 3,
7900
+ main: {
7901
+ icon: "AddIcon",
7902
+ styleDefault: true,
7903
+ size: "small",
7904
+ onClick: "addEvent",
7905
+ tooltipMessage: "Back"
7906
+ },
7907
+ style: {
7908
+ float: "right"
7909
+ }
7910
+ }
7911
+ },
7912
+ {
7913
+ type: "Control",
7914
+ scope: "#/properties/events",
7915
+ options: {
7916
+ widget: "Table"
7866
7917
  },
7867
- {
7868
- accessorKey: "Edit_Approve_Records",
7869
- header: "Edit Widget",
7870
- widget: {
7871
- type: "Control",
7872
- scope: "#/properties/Edit_Records",
7873
- options: {
7874
- widget: "IconButton"
7875
- },
7876
- config: {
7877
- main: {
7878
- color: "info",
7879
- size: "small",
7880
- icon: "EditIcon",
7881
- tooltipMessage: "Edit This Record",
7882
- onClick: "editEvent"
7918
+ config: {
7919
+ main: {
7920
+ disableAction: true,
7921
+ disableSelection: true,
7922
+ enableDrag: true
7923
+ }
7924
+ },
7925
+ elements: [
7926
+ {
7927
+ accessorKey: "eventType",
7928
+ header: "Event Type"
7929
+ },
7930
+ {
7931
+ accessorKey: "Handler",
7932
+ header: "Handler"
7933
+ },
7934
+ {
7935
+ accessorKey: "Edit_Approve_Records",
7936
+ header: "Edit Widget",
7937
+ widget: {
7938
+ type: "Control",
7939
+ scope: "#/properties/Edit_Records",
7940
+ options: {
7941
+ widget: "IconButton"
7883
7942
  },
7884
- style: {
7885
- color: "#3949ab"
7943
+ config: {
7944
+ main: {
7945
+ color: "info",
7946
+ size: "small",
7947
+ icon: "EditIcon",
7948
+ tooltipMessage: "Edit This Record",
7949
+ onClick: "editEvent"
7950
+ },
7951
+ style: {
7952
+ color: "#3949ab"
7953
+ }
7886
7954
  }
7887
7955
  }
7888
- }
7889
- },
7890
- {
7891
- accessorKey: "Reject_Records",
7892
- header: "Delete",
7893
- widget: {
7894
- type: "Control",
7895
- scope: "#/properties/RejectButton",
7896
- options: {
7897
- widget: "IconButton"
7898
- },
7899
- config: {
7900
- main: {
7901
- icon: "RejectIcon",
7902
- color: "error",
7903
- tooltipMessage: "Reject This Record",
7904
- onClick: "deleteEvent"
7956
+ },
7957
+ {
7958
+ accessorKey: "Reject_Records",
7959
+ header: "Delete",
7960
+ widget: {
7961
+ type: "Control",
7962
+ scope: "#/properties/RejectButton",
7963
+ options: {
7964
+ widget: "IconButton"
7965
+ },
7966
+ config: {
7967
+ main: {
7968
+ icon: "RejectIcon",
7969
+ color: "error",
7970
+ tooltipMessage: "Reject This Record",
7971
+ onClick: "deleteEvent"
7972
+ }
7905
7973
  }
7906
7974
  }
7907
7975
  }
7908
- }
7909
- ]
7910
- }
7911
- ]
7912
- },
7913
- {
7914
- type: "Control",
7915
- scope: "#/properties/EmptyBox",
7916
- options: {
7917
- widget: "EmptyBox"
7918
- },
7919
- config: {
7920
- layout: { xs: 0, sm: 4, md: 4, lg: 4 }
7976
+ ]
7977
+ }
7978
+ ]
7921
7979
  }
7980
+ ]
7981
+ },
7982
+ {
7983
+ type: "Control",
7984
+ scope: "#/properties/proc",
7985
+ config: {
7986
+ layout: { xs: 11, sm: 11, md: 6, lg: 6 }
7922
7987
  },
7923
- {
7924
- type: "Control",
7925
- scope: "#/properties/EmptyBox",
7926
- options: {
7927
- widget: "EmptyBox"
7928
- },
7929
- config: {
7930
- layout: { xs: 0, sm: 4, md: 4, lg: 4 }
7931
- }
7988
+ options: {
7989
+ widget: "EmptyBox"
7990
+ }
7991
+ },
7992
+ {
7993
+ type: "Control",
7994
+ scope: "#/properties/btn",
7995
+ options: {
7996
+ widget: "Button"
7932
7997
  },
7933
- {
7934
- type: "Control",
7935
- scope: "#/properties/btn",
7936
- options: {
7937
- widget: "Button"
7998
+ config: {
7999
+ layout: {
8000
+ xs: 11,
8001
+ sm: 11,
8002
+ md: 2.5,
8003
+ lg: 2.5
7938
8004
  },
7939
- config: {
7940
- layout: 1.8,
7941
- main: {
7942
- name: "Ok",
7943
- startIcon: "ApproveIcon",
7944
- variant: "contained",
7945
- color: "info",
7946
- type: "text",
7947
- onClick: "okHandler",
7948
- size: "medium"
7949
- },
7950
- style: {
7951
- float: "right"
7952
- }
7953
- }
7954
- },
7955
- {
7956
- type: "Control",
7957
- scope: "#/properties/btnSubmit",
7958
- options: {
7959
- widget: "Button"
8005
+ main: {
8006
+ name: "Ok",
8007
+ startIcon: "ApproveIcon",
8008
+ variant: "contained",
8009
+ color: "info",
8010
+ type: "text",
8011
+ onClick: "okHandler",
8012
+ size: "small"
7960
8013
  },
7961
- config: {
7962
- layout: 1.8,
7963
- main: {
7964
- name: "Save & Exit",
7965
- startIcon: "ApproveIcon",
7966
- variant: "contained",
7967
- color: "info",
7968
- type: "text",
7969
- onClick: "saveHandler",
7970
- size: "medium"
7971
- },
7972
- style: {
7973
- float: "right"
7974
- }
8014
+ style: {
8015
+ marginBottom: "8px",
8016
+ float: "right"
7975
8017
  }
8018
+ }
8019
+ },
8020
+ {
8021
+ type: "Control",
8022
+ scope: "#/properties/btnSubmit",
8023
+ options: {
8024
+ widget: "Button"
7976
8025
  },
7977
- {
7978
- type: "Control",
7979
- scope: "#/properties/notify",
7980
- options: {
7981
- widget: "Notify"
8026
+ config: {
8027
+ layout: {
8028
+ xs: 11,
8029
+ sm: 11,
8030
+ md: 2.5,
8031
+ lg: 2.5
7982
8032
  },
7983
- layout: 6
7984
- },
7985
- {
7986
- type: "HorizontalLayout",
7987
- config: {
7988
- style: {
7989
- position: "fixed",
7990
- bottom: 5,
7991
- overflow: "visible",
7992
- margin: "0",
7993
- width: "100vw"
7994
- }
8033
+ main: {
8034
+ name: "Save & Exit",
8035
+ startIcon: "ApproveIcon",
8036
+ variant: "contained",
8037
+ color: "info",
8038
+ type: "text",
8039
+ onClick: "saveHandler",
8040
+ size: "small"
7995
8041
  },
7996
- elements: [
7997
- {
7998
- type: "Control",
7999
- scope: "#/properties/EmptyBox",
8000
- options: {
8001
- widget: "EmptyBox"
8002
- },
8003
- config: {
8004
- layout: { xs: 0, sm: 4, md: 4, lg: 4 }
8005
- }
8006
- },
8007
- {
8008
- type: "Control",
8009
- scope: "#/properties/FooterText",
8010
- options: {
8011
- widget: "Box"
8012
- },
8013
- config: {
8014
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
8015
- main: {
8016
- heading: "Copywriter@ACT21.IO"
8017
- },
8018
- style: {
8019
- color: ((_a = theme == null ? void 0 : theme.palette) == null ? void 0 : _a.text.disabled) || "#AFAFAF",
8020
- fontSize: "12px"
8021
- }
8022
- }
8023
- },
8024
- {
8025
- type: "HorizontalLayout",
8026
- config: {
8027
- layout: { xs: 11, sm: 4, md: 4, lg: 4 }
8028
- },
8029
- elements: [
8030
- {
8031
- type: "Control",
8032
- scope: "#/properties/EmptyBox",
8033
- options: {
8034
- widget: "EmptyBox"
8035
- },
8036
- config: {
8037
- layout: 2
8038
- }
8039
- },
8040
- {
8041
- type: "Control",
8042
- scope: "#/properties/backIcon",
8043
- options: {
8044
- widget: "Box"
8045
- },
8046
- config: {
8047
- layout: 1,
8048
- main: {
8049
- iconName: "PrevIcon",
8050
- onClick: "backHandler"
8051
- },
8052
- style: {
8053
- fill: theme.palette.primary.dark,
8054
- width: 20,
8055
- height: 20,
8056
- display: "flex",
8057
- alignItems: "center",
8058
- justifyContent: "center",
8059
- marginRight: "-8px",
8060
- cursor: "pointer"
8061
- }
8062
- }
8063
- },
8064
- {
8065
- type: "Control",
8066
- scope: "#/properties/text",
8067
- options: {
8068
- widget: "Box"
8069
- },
8070
- config: {
8071
- layout: 9,
8072
- main: {
8073
- heading: "Previous Page",
8074
- onClick: "backHandler"
8075
- },
8076
- style: {
8077
- color: theme.palette.primary.dark,
8078
- fontSize: "12px",
8079
- cursor: "pointer",
8080
- marginLeft: "-6px"
8081
- }
8082
- }
8083
- }
8084
- ]
8085
- }
8086
- ]
8042
+ style: {
8043
+ marginBottom: "8px",
8044
+ float: "right"
8045
+ }
8087
8046
  }
8088
- ]
8089
- };
8090
- return uiSchema;
8047
+ },
8048
+ {
8049
+ type: "Control",
8050
+ scope: "#/properties/notify",
8051
+ options: {
8052
+ widget: "Notify"
8053
+ },
8054
+ layout: 6
8055
+ }
8056
+ ]
8091
8057
  };
8092
8058
  const APISection = {
8093
8059
  type: "HorizontalLayout",
@@ -8284,21 +8250,21 @@ var event = (store2, dynamicData2, submitHandler, service2) => {
8284
8250
  this.refreshPage(formdata.Handler, store2);
8285
8251
  },
8286
8252
  refreshPage: (handlerType, store22) => {
8287
- const uiSchema = _.cloneDeep(EventUiSchema(store22.theme.myTheme));
8253
+ const uiSchema = _.cloneDeep(EventUiSchema);
8288
8254
  const schema2 = _.cloneDeep(EventSchema);
8289
8255
  if (handlerType) {
8290
8256
  if (handlerType === "custom") {
8291
- uiSchema.elements[0].elements[0].elements[2] = getTextArea("eventCode", "Write Custom Code", false);
8257
+ uiSchema.elements[1].elements[0].elements[2] = getTextArea("eventCode", "Write Custom Code", false);
8292
8258
  schema2.required = ["eventType", "Handler", "eventCode"];
8293
8259
  } else if (handlerType === "api") {
8294
- uiSchema.elements[0].elements[0].elements[2] = APISection;
8260
+ uiSchema.elements[1].elements[0].elements[2] = APISection;
8295
8261
  schema2.required = ["eventType", "Handler", "method", "path"];
8296
8262
  } else if (handlerType === "inBuiltFunction") {
8297
- uiSchema.elements[0].elements[0].elements[2] = getSelectField("inBuiltFunctionType", "Function Name");
8298
- uiSchema.elements[0].elements[0].elements[3] = getTextArea("funcParametersCode", "Write Custom Code for Functions Parameter", true, { xs: 12, sm: 12, md: 6 });
8263
+ uiSchema.elements[1].elements[0].elements[2] = getSelectField("inBuiltFunctionType", "Function Name");
8264
+ uiSchema.elements[1].elements[0].elements[3] = getTextArea("funcParametersCode", "Write Custom Code for Functions Parameter", true, { xs: 12, sm: 12, md: 6 });
8299
8265
  schema2.required = ["eventType", "Handler", "inBuiltFunctionType"];
8300
8266
  } else if (handlerType === "refresh") {
8301
- uiSchema.elements[0].elements[0].elements[2] = refreshSectionUiSchema;
8267
+ uiSchema.elements[1].elements[0].elements[2] = refreshSectionUiSchema;
8302
8268
  schema2.properties.refreshElements.required = ["value"];
8303
8269
  schema2.properties.refreshElements.items.required = ["value"];
8304
8270
  schema2.required = ["eventType", "Handler", "refreshElements"];
@@ -8308,8 +8274,8 @@ var event = (store2, dynamicData2, submitHandler, service2) => {
8308
8274
  store22.setUiSchema(uiSchema);
8309
8275
  },
8310
8276
  getFormData: Component(store2, dynamicData2, submitHandler, service2).getFormdata,
8311
- getUiSchema: async function() {
8312
- return await EventUiSchema(store2.theme.myTheme);
8277
+ getUiSchema: function() {
8278
+ return EventUiSchema;
8313
8279
  },
8314
8280
  getSchema: () => {
8315
8281
  return EventSchema;