impaktapps-ui-builder 0.0.101-alpha.267 → 0.0.101-alpha.268

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 (21) hide show
  1. package/dist/impaktapps-ui-builder.es.js +268 -206
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +13 -13
  4. package/dist/impaktapps-ui-builder.umd.js.map +1 -1
  5. package/dist/src/impaktapps-ui-builder/builder/build/buildPhoneInput.d.ts +1 -0
  6. package/dist/src/impaktapps-ui-builder/builder/build/uischema/coreSection.d.ts +83 -71
  7. package/dist/src/impaktapps-ui-builder/builder/build/uischema/phoneInput.d.ts +20 -0
  8. package/dist/src/impaktapps-ui-builder/builder/build/uischema/table.d.ts +0 -1
  9. package/dist/src/impaktapps-ui-builder/builder/build/uischema/validationSections.d.ts +50 -37
  10. package/package.json +1 -1
  11. package/src/impaktapps-ui-builder/builder/build/buildPhoneInput.ts +26 -0
  12. package/src/impaktapps-ui-builder/builder/build/buildUiSchema.ts +13 -28
  13. package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts +49 -95
  14. package/src/impaktapps-ui-builder/builder/build/uischema/coreSection.ts +118 -118
  15. package/src/impaktapps-ui-builder/builder/build/uischema/phoneInput.ts +16 -0
  16. package/src/impaktapps-ui-builder/builder/build/uischema/table.ts +0 -1
  17. package/src/impaktapps-ui-builder/builder/build/uischema/validationSections.ts +60 -114
  18. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/schema.ts +2 -9
  19. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +63 -118
  20. package/src/impaktapps-ui-builder/builder/services/component.ts +7 -10
  21. package/src/impaktapps-ui-builder/runtime/services/service.ts +1 -2
@@ -6287,14 +6287,8 @@ const ComponentSchema = {
6287
6287
  { title: "Upload", const: "UploadFile" },
6288
6288
  { title: "Tree ", const: "TreeMap" },
6289
6289
  { title: "Column Group", const: "ColumnGroup" },
6290
- { title: "Thought of the day", const: "Thought" }
6291
- ]
6292
- },
6293
- elementType: {
6294
- oneOf: [
6295
- { title: "Table Action Element", const: "action" },
6296
- { title: "Table Header Element", const: "tableHeader" },
6297
- { title: "Table Element", const: "element" }
6290
+ { title: "Thought of the day", const: "Thought" },
6291
+ { title: "Phone Input", const: "PhoneInput" }
6298
6292
  ]
6299
6293
  },
6300
6294
  columnFormat: {
@@ -6693,53 +6687,67 @@ const componentBasicUiSchema = (theme) => {
6693
6687
  {
6694
6688
  type: "Control",
6695
6689
  scope: "#/properties/layout",
6696
- layout: 12,
6697
6690
  options: {
6698
- detail: {
6699
- type: "HorizontalLayout",
6700
- elements: [
6701
- {
6702
- type: "Control",
6703
- scope: "#/properties/key",
6704
- options: {
6705
- widget: "SelectInputField"
6706
- },
6707
- config: {
6708
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6709
- main: {
6710
- label: "Screen Size"
6711
- }
6712
- }
6713
- },
6714
- {
6715
- type: "Control",
6716
- scope: "#/properties/value",
6717
- options: {
6718
- widget: "InputField"
6719
- },
6720
- config: {
6721
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6722
- main: {
6723
- label: "Value",
6724
- type: "number",
6725
- helperText: "Number should be in range of 0 to 12",
6726
- errorMessage: "Number Can't be greater than 12 and can't be less than 0."
6727
- }
6728
- }
6729
- },
6730
- {
6731
- type: "Control",
6732
- scope: "#/properties/proc",
6733
- config: {
6734
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6735
- },
6736
- options: {
6737
- widget: "EmptyBox"
6738
- }
6691
+ widget: "Array"
6692
+ },
6693
+ config: {
6694
+ layout: 12,
6695
+ main: {
6696
+ label: "Layout",
6697
+ childElementLabel: "Layout"
6698
+ },
6699
+ style: {
6700
+ marginLeft: "-24px",
6701
+ marginBottom: "24px !important",
6702
+ labelStyle: {
6703
+ marginLeft: "24px"
6704
+ },
6705
+ detailsStyle: {
6706
+ marginLeft: "24px"
6707
+ }
6708
+ }
6709
+ },
6710
+ elements: [
6711
+ {
6712
+ type: "Control",
6713
+ scope: "#/properties/key",
6714
+ options: {
6715
+ widget: "SelectInputField"
6716
+ },
6717
+ config: {
6718
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6719
+ main: {
6720
+ label: "Screen Size"
6739
6721
  }
6740
- ]
6722
+ }
6723
+ },
6724
+ {
6725
+ type: "Control",
6726
+ scope: "#/properties/value",
6727
+ options: {
6728
+ widget: "InputField"
6729
+ },
6730
+ config: {
6731
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
6732
+ main: {
6733
+ label: "Value",
6734
+ type: "number",
6735
+ helperText: "Number should be in range of 0 to 12",
6736
+ errorMessage: "Number Can't be greater than 12 and can't be less than 0."
6737
+ }
6738
+ }
6739
+ },
6740
+ {
6741
+ type: "Control",
6742
+ scope: "#/properties/proc",
6743
+ config: {
6744
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
6745
+ },
6746
+ options: {
6747
+ widget: "EmptyBox"
6748
+ }
6741
6749
  }
6742
- }
6750
+ ]
6743
6751
  }
6744
6752
  ]
6745
6753
  }
@@ -7204,54 +7212,67 @@ const CoreSection = {
7204
7212
  {
7205
7213
  type: "Control",
7206
7214
  scope: "#/properties/layout",
7207
- layout: 12,
7208
7215
  options: {
7209
- "elementLabelProp": "key",
7210
- detail: {
7211
- type: "HorizontalLayout",
7212
- elements: [
7213
- {
7214
- type: "Control",
7215
- scope: "#/properties/key",
7216
- options: {
7217
- widget: "SelectInputField"
7218
- },
7219
- config: {
7220
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7221
- main: {
7222
- label: "Screen Size"
7223
- }
7224
- }
7225
- },
7226
- {
7227
- type: "Control",
7228
- scope: "#/properties/value",
7229
- options: {
7230
- widget: "InputField"
7231
- },
7232
- config: {
7233
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7234
- main: {
7235
- label: "Value",
7236
- type: "number",
7237
- helperText: "Number should be in range of 0 to 12",
7238
- errorMessage: "Number Can't be greater than 12 and can't be less than 0."
7239
- }
7240
- }
7241
- },
7242
- {
7243
- type: "Control",
7244
- scope: "#/properties/proc",
7245
- config: {
7246
- layout: { xs: 0, sm: 0, md: 4, lg: 4 }
7247
- },
7248
- options: {
7249
- widget: "EmptyBox"
7250
- }
7216
+ widget: "Array"
7217
+ },
7218
+ config: {
7219
+ layout: 12,
7220
+ main: {
7221
+ label: "Layout",
7222
+ childElementLabel: "Layout"
7223
+ },
7224
+ style: {
7225
+ marginLeft: "-24px",
7226
+ marginBottom: "24px !important",
7227
+ labelStyle: {
7228
+ marginLeft: "24px"
7229
+ },
7230
+ detailsStyle: {
7231
+ marginLeft: "24px"
7232
+ }
7233
+ }
7234
+ },
7235
+ elements: [
7236
+ {
7237
+ type: "Control",
7238
+ scope: "#/properties/key",
7239
+ options: {
7240
+ widget: "SelectInputField"
7241
+ },
7242
+ config: {
7243
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7244
+ main: {
7245
+ label: "Screen Size"
7251
7246
  }
7252
- ]
7247
+ }
7248
+ },
7249
+ {
7250
+ type: "Control",
7251
+ scope: "#/properties/value",
7252
+ options: {
7253
+ widget: "InputField"
7254
+ },
7255
+ config: {
7256
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7257
+ main: {
7258
+ label: "Value",
7259
+ type: "number",
7260
+ helperText: "Number should be in range of 0 to 12",
7261
+ errorMessage: "Number Can't be greater than 12 and can't be less than 0."
7262
+ }
7263
+ }
7264
+ },
7265
+ {
7266
+ type: "Control",
7267
+ scope: "#/properties/proc",
7268
+ config: {
7269
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
7270
+ },
7271
+ options: {
7272
+ widget: "EmptyBox"
7273
+ }
7253
7274
  }
7254
- }
7275
+ ]
7255
7276
  }
7256
7277
  ]
7257
7278
  };
@@ -7451,44 +7472,58 @@ const emptyBox$1 = (scope, layout) => {
7451
7472
  const cardLayout = {
7452
7473
  type: "Control",
7453
7474
  scope: "#/properties/cardLayout",
7454
- layout: 12,
7455
7475
  options: {
7456
- detail: {
7457
- type: "HorizontalLayout",
7458
- elements: [
7459
- {
7460
- type: "Control",
7461
- scope: "#/properties/key",
7462
- options: {
7463
- widget: "SelectInputField"
7464
- },
7465
- config: {
7466
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7467
- main: {
7468
- label: "Screen Size"
7469
- }
7470
- }
7471
- },
7472
- {
7473
- type: "Control",
7474
- scope: "#/properties/value",
7475
- options: {
7476
- widget: "InputField"
7477
- },
7478
- config: {
7479
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7480
- main: {
7481
- label: "Value",
7482
- type: "number",
7483
- helperText: "Number should be in range of 0 to 12",
7484
- errorMessage: "Number Can't be greater than 12 and can't be less than 0."
7485
- }
7486
- }
7487
- },
7488
- emptyBox$1("cardEmpty")
7489
- ]
7476
+ widget: "Array"
7477
+ },
7478
+ config: {
7479
+ layout: 12,
7480
+ main: {
7481
+ label: "Card Layout",
7482
+ childElementLabel: "Card Layout"
7483
+ },
7484
+ style: {
7485
+ marginLeft: "-24px",
7486
+ marginBottom: "24px !important",
7487
+ labelStyle: {
7488
+ marginLeft: "24px"
7489
+ },
7490
+ detailsStyle: {
7491
+ marginLeft: "24px"
7492
+ }
7490
7493
  }
7491
- }
7494
+ },
7495
+ elements: [
7496
+ {
7497
+ type: "Control",
7498
+ scope: "#/properties/key",
7499
+ options: {
7500
+ widget: "SelectInputField"
7501
+ },
7502
+ config: {
7503
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7504
+ main: {
7505
+ label: "Screen Size"
7506
+ }
7507
+ }
7508
+ },
7509
+ {
7510
+ type: "Control",
7511
+ scope: "#/properties/value",
7512
+ options: {
7513
+ widget: "InputField"
7514
+ },
7515
+ config: {
7516
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
7517
+ main: {
7518
+ label: "Value",
7519
+ type: "number",
7520
+ helperText: "Number should be in range of 0 to 12",
7521
+ errorMessage: "Number Can't be greater than 12 and can't be less than 0."
7522
+ }
7523
+ }
7524
+ },
7525
+ emptyBox$1("cardEmpty")
7526
+ ]
7492
7527
  };
7493
7528
  const getArrayControl = (parentScope, childScope, childLabel) => {
7494
7529
  return {
@@ -8164,51 +8199,64 @@ const ValidationSection = {
8164
8199
  {
8165
8200
  type: "Control",
8166
8201
  scope: "#/properties/validation",
8167
- layout: 11.5,
8168
8202
  options: {
8169
- "elementLabelProp": "validationType",
8170
- detail: {
8171
- type: "HorizontalLayout",
8172
- elements: [
8173
- {
8174
- type: "Control",
8175
- scope: "#/properties/validationType",
8176
- options: {
8177
- widget: "SelectInputField"
8178
- },
8179
- config: {
8180
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8181
- main: {
8182
- label: "Validation Type"
8183
- }
8184
- }
8185
- },
8186
- {
8187
- type: "Control",
8188
- scope: "#/properties/validationValue",
8189
- options: {
8190
- widget: "InputField"
8191
- },
8192
- config: {
8193
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8194
- main: {
8195
- label: "Validation Value"
8196
- }
8197
- }
8198
- },
8199
- {
8200
- type: "Control",
8201
- scope: "#/properties/emptyBox",
8202
- options: {
8203
- widget: "EmptyBox"
8204
- },
8205
- config: {
8206
- layout: { xs: 0, sm: 0, md: 4 }
8207
- }
8203
+ widget: "Array"
8204
+ },
8205
+ config: {
8206
+ layout: 12,
8207
+ main: {
8208
+ label: "Validation",
8209
+ childElementLabel: "Validation"
8210
+ },
8211
+ style: {
8212
+ marginLeft: "-24px",
8213
+ marginBottom: "24px !important",
8214
+ labelStyle: {
8215
+ marginLeft: "24px"
8216
+ },
8217
+ detailsStyle: {
8218
+ marginLeft: "24px"
8219
+ }
8220
+ }
8221
+ },
8222
+ elements: [
8223
+ {
8224
+ type: "Control",
8225
+ scope: "#/properties/validationType",
8226
+ options: {
8227
+ widget: "SelectInputField"
8228
+ },
8229
+ config: {
8230
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8231
+ main: {
8232
+ label: "Validation Type"
8208
8233
  }
8209
- ]
8234
+ }
8235
+ },
8236
+ {
8237
+ type: "Control",
8238
+ scope: "#/properties/validationValue",
8239
+ options: {
8240
+ widget: "InputField"
8241
+ },
8242
+ config: {
8243
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
8244
+ main: {
8245
+ label: "Validation Value"
8246
+ }
8247
+ }
8248
+ },
8249
+ {
8250
+ type: "Control",
8251
+ scope: "#/properties/emptyBox",
8252
+ options: {
8253
+ widget: "EmptyBox"
8254
+ },
8255
+ config: {
8256
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 }
8257
+ }
8210
8258
  }
8211
- }
8259
+ ]
8212
8260
  }
8213
8261
  ]
8214
8262
  };
@@ -8485,15 +8533,12 @@ function refreshPage(type, store2) {
8485
8533
  }
8486
8534
  }, UiSchema.elements[0].elements[0].elements[9] = {
8487
8535
  type: "Control",
8488
- scope: "#/properties/elementType",
8489
- options: {
8490
- widget: "SelectInputField"
8491
- },
8536
+ scope: "#/properties/proc",
8492
8537
  config: {
8493
- layout: { xs: 6, sm: 6, md: 4, lg: 3 },
8494
- main: {
8495
- label: "Element Type"
8496
- }
8538
+ layout: { xs: 0, sm: 0, md: 4, lg: 0 }
8539
+ },
8540
+ options: {
8541
+ widget: "EmptyBox"
8497
8542
  }
8498
8543
  };
8499
8544
  }
@@ -10276,7 +10321,6 @@ var service = (funcParams) => {
10276
10321
  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
10277
10322
  funcParams.store.setAdditionalErrors([]);
10278
10323
  funcParams.store.setFormdata({});
10279
- funcParams.store.setSchema({ type: "object", properties: {} });
10280
10324
  funcParams.store.newData = {};
10281
10325
  const pageBasicDetailString = sessionStorage.getItem("pagemasterMetaData");
10282
10326
  if (pageBasicDetailString) {
@@ -10498,7 +10542,7 @@ var service = (funcParams) => {
10498
10542
  { key: "searchValue", value: param.serachValue },
10499
10543
  { key: "currentValue", value: param.currentValue }
10500
10544
  ];
10501
- const response = await this.callExecuteEvents(param, apiBody, "onLoad");
10545
+ const response = await this.callExecuteEvents(param, apiBody);
10502
10546
  return response == null ? void 0 : response.data;
10503
10547
  }
10504
10548
  },
@@ -11162,7 +11206,6 @@ var Table = {
11162
11206
  main: {
11163
11207
  onMount: "onMount",
11164
11208
  enableExpandAll: true,
11165
- headerIcons: {},
11166
11209
  allRowData: [],
11167
11210
  downloadAllData: false,
11168
11211
  columns: {
@@ -12258,6 +12301,39 @@ const buildThoughtOfTheDay = (config2, componentScope2) => {
12258
12301
  }
12259
12302
  return thought;
12260
12303
  };
12304
+ const PhoneInput = {
12305
+ scope: "#/properties/testPhone",
12306
+ type: "Control",
12307
+ options: {
12308
+ widget: "PhoneInput"
12309
+ },
12310
+ config: {
12311
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
12312
+ main: {
12313
+ defaultCountry: "in",
12314
+ label: "Phone"
12315
+ }
12316
+ }
12317
+ };
12318
+ const buildPhoneInputField = (config2, componentScope2) => {
12319
+ const phonInputField = _.cloneDeep(PhoneInput);
12320
+ phonInputField.config.main.label = config2.label;
12321
+ if (config2.style) {
12322
+ phonInputField.config.style = JSON.parse(config2.style);
12323
+ }
12324
+ if (config2.InputFormatingAndMasking) {
12325
+ phonInputField.config.main.formatStrArray = config2.InputFormatingAndMasking.map((e) => e.formatElement);
12326
+ }
12327
+ if (config2.placeholder) {
12328
+ phonInputField.config.main.placeholder = config2.placeholder;
12329
+ }
12330
+ if (config2.layout) {
12331
+ phonInputField.config.layout = createLayoutFormat(config2.layout);
12332
+ }
12333
+ phonInputField.config.main.errorMessage = `${config2.name} is empty or invalid`;
12334
+ phonInputField.scope = componentScope2;
12335
+ return phonInputField;
12336
+ };
12261
12337
  let schema = {
12262
12338
  type: "object",
12263
12339
  properties: {},
@@ -12512,6 +12588,9 @@ const buildUiSchema = (config2, store2) => {
12512
12588
  case "Thought":
12513
12589
  elements = buildThoughtOfTheDay(config2, componentScope2);
12514
12590
  break;
12591
+ case "PhoneInput":
12592
+ elements = buildPhoneInputField(config2, componentScope2);
12593
+ break;
12515
12594
  default:
12516
12595
  schema = {
12517
12596
  type: "object",
@@ -12546,10 +12625,7 @@ const buildUiSchema = (config2, store2) => {
12546
12625
  sizeMap[e.keyName] = e.value;
12547
12626
  });
12548
12627
  }
12549
- const tableHeaderElements = [];
12550
- const tableActionElement = [];
12551
- const rowElements = [];
12552
- config2.elements.filter((cellElem, elemInd) => {
12628
+ elements.elements = config2.elements.map((cellElem, elemInd) => {
12553
12629
  const commonProperties = {
12554
12630
  accessorKey: cellElem.name,
12555
12631
  type: cellElem.columnFormat,
@@ -12561,29 +12637,15 @@ const buildUiSchema = (config2, store2) => {
12561
12637
  columnKey: cellElem.columnKey
12562
12638
  };
12563
12639
  if (cellElem.type) {
12564
- if (cellElem.elementType == "action") {
12565
- const actionElem = buildUiSchema(cellElem, store2);
12566
- tableActionElement.push(actionElem);
12567
- return false;
12568
- }
12569
- if (cellElem.elementType == "tableHeader") {
12570
- const headerElem = buildUiSchema(cellElem, store2);
12571
- tableHeaderElements.push({ widget: headerElem });
12572
- return false;
12573
- }
12574
- const tableElem = {
12640
+ return {
12575
12641
  widget: cellElem.type != "ColumnGroup" ? buildUiSchema(cellElem, store2) : void 0,
12576
12642
  elements: cellElem.type == "ColumnGroup" ? cellElem.elements.map((childCellElem) => buildUiSchema(childCellElem, store2)) : [],
12577
12643
  ...commonProperties
12578
12644
  };
12579
- rowElements.push(tableElem);
12580
12645
  } else {
12581
- rowElements.push({ ...commonProperties });
12646
+ return commonProperties;
12582
12647
  }
12583
12648
  });
12584
- elements.elements = rowElements;
12585
- elements.config.action = tableActionElement;
12586
- elements.config.main.headerIcons.elements = tableHeaderElements;
12587
12649
  } else if (config2.type == "Array") {
12588
12650
  elements.options.detail.elements = config2.elements.map((e, elemInd) => {
12589
12651
  return buildUiSchema(e, store2);