impaktapps-ui-builder 0.0.382-alpha.61 → 0.0.382-alpha.63

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 (12) hide show
  1. package/dist/impaktapps-ui-builder.es.js +106 -96
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +7 -7
  4. package/dist/impaktapps-ui-builder.umd.js.map +1 -1
  5. package/dist/src/impaktapps-ui-builder/runtime/services/events.d.ts +1 -0
  6. package/dist/src/impaktapps-ui-builder/runtime/services/interface.d.ts +1 -0
  7. package/dist/src/impaktapps-ui-builder/runtime/services/service.d.ts +3 -1
  8. package/package.json +1 -1
  9. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +96 -239
  10. package/src/impaktapps-ui-builder/runtime/services/events.ts +13 -6
  11. package/src/impaktapps-ui-builder/runtime/services/interface.ts +10 -9
  12. package/src/impaktapps-ui-builder/runtime/services/service.ts +24 -23
package/dist/src/impaktapps-ui-builder/runtime/services/events.d.ts CHANGED
@@ -6,3 +6,4 @@ export declare function buildApiPayload(compConfig: any, body: any, headers: any
6
6
  headers: any;
7
7
  }>;
8
8
  export declare function getRefreshElements(eventConfig: any, eventGropus: any): string[];
9
+ export declare function asyncOperation(): Promise<unknown>;
package/dist/src/impaktapps-ui-builder/runtime/services/interface.d.ts CHANGED
@@ -8,4 +8,5 @@ export interface handlersProps {
8
8
  serviceHolder: any;
9
9
  eventGroups?: any;
10
10
  parentEventOutput?: any;
11
+ functionsProvider?: Record<string, any>;
11
12
  }
package/dist/src/impaktapps-ui-builder/runtime/services/service.d.ts CHANGED
@@ -7,19 +7,21 @@ interface funcParamsProps {
7
7
  schema: any;
8
8
  service: any;
9
9
  userValue: any;
10
+ functionsProvider?: Record<string, any>;
10
11
  }
11
12
  declare const _default: (funcParams: funcParamsProps) => {
12
13
  setPage: () => Promise<void>;
13
14
  onClick: () => Promise<void>;
15
+ onMount: () => Promise<void>;
14
16
  onFileDownload: () => Promise<void>;
15
17
  onFileUpload: () => Promise<void>;
18
+ backHandler: () => void;
16
19
  onPaginationChange: (paginationValues: any) => Promise<any>;
17
20
  getSelectOptions: (param: any) => Promise<any>;
18
21
  onChange: () => Promise<void>;
19
22
  updateConfigApiBody: (paramValue: any, apiBody: any) => Promise<any>;
20
23
  onBack: (functionParameters: any) => Promise<void>;
21
24
  onNext: (functionParameters: any) => Promise<void>;
22
- backHandler: () => void;
23
25
  onReset: (functionParameters: any) => Promise<void>;
24
26
  callHandler: (eventType: string, functionParameters?: any) => Promise<void>;
25
27
  downloadFile: (obj: any) => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "impaktapps-ui-builder",
3
- "version": "0.0.382-alpha.61",
3
+ "version": "0.0.382-alpha.63",
4
4
  "scripts": {
5
5
  "dev": "vite",
6
6
  "build": "tsc && vite build",
package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts CHANGED
@@ -277,250 +277,107 @@ export const componentBasicUiSchema: any = (theme) => {
277
277
  {
278
278
  type: "HorizontalLayout",
279
279
  config: {
280
- layout: 12,
281
- style: {
282
- position: "absolute",
283
- bottom: 5,
284
- overflow: 'hidden'
285
- }
280
+ main: {
281
+ direction: 'row'
282
+ },
283
+ style: {
284
+ flexDirection: "row",
285
+ position: "absolute",
286
+ bottom: 0,
287
+ marginBottom: '-8px',
288
+ height: 'fit-content',
289
+ overflow: 'hidden',
290
+ zIndex: 1000,
291
+ width: 'inherit'
292
+ }
286
293
  },
287
294
  elements: [
288
- {
289
-
290
- type: "Control",
291
- scope: "#/properties/FooterText",
292
- options: {
293
- widget: "Box",
294
- },
295
- config: {
296
- layout: 9.5,
297
- main: {
298
- heading: "Copywriter@ACT21.IO"
299
- },
300
- style: {
301
- color: theme?.palette?.text.disabled || "#AFAFAF",
302
- fontSize: '12px',
303
- textAlign: 'center'
304
- }
305
- },
295
+ {
296
+
297
+ type: "Control",
298
+ scope: "#/properties/FooterText",
299
+ options: {
300
+ widget: "Box",
306
301
  },
307
- {
308
- type: "HorizontalLayout",
309
- config: {
310
- layout: 2.5,
311
- style: {
312
- }
313
- },
314
- elements: [
315
- {
316
- type: "Control",
317
- scope: "#/properties/EmptyBox",
318
- options: {
319
- widget: "EmptyBox",
320
- },
321
- config: {
322
- layout: 6,
323
- style: {
324
- flexGrow: 1
325
- }
326
- },
327
- },
328
- {
329
- type: "Control",
330
- scope: "#/properties/backIcon",
331
- options: {
332
- widget: "Box",
333
- },
334
- config: {
335
- layout: 1,
336
- main: {
337
- iconName: 'PrevIcon',
338
- onClick: "backHandler"
339
- },
340
- style: {
341
- fill: theme.palette.primary.main,
342
- width: 20,
343
- height: 20,
344
- display: 'flex',
345
- alignItems: 'center',
346
- justifyContent: 'center',
347
- marginRight: '-8px',
348
- cursor: 'pointer',
349
- ':hover': {
350
- fill: theme.palette.primary.dark,
351
- }
352
- }
353
- }
354
- },
355
- {
356
- type: "Control",
357
- scope: "#/properties/text",
358
-
359
- options: {
360
- widget: "Box",
361
- },
362
- config: {
363
- layout: 5,
364
- main: {
365
- heading: "Previous Page",
366
- onClick: "backHandler"
367
- },
368
- style: {
369
- width: 'fit-content',
370
- color: theme.palette.primary.main,
371
- fontSize: "12px",
372
- cursor: 'pointer',
373
- marginLeft: '2px',
374
- marginRight: 0,
375
- ':hover': {
376
- color: theme.palette.primary.dark,
377
- }
378
- }
379
- },
380
- },
381
- ],
302
+ config: {
303
+ main: {
304
+ heading: "Copywriter@ACT21.IO"
305
+ },
306
+ style: {
307
+ color: theme?.palette?.text.disabled || "#AFAFAF",
308
+ fontSize: '12px',
309
+ textAlign: 'center',
310
+ lineHeight: 1,
311
+ width: 'fit-content',
312
+ left: '50%',
313
+ position: 'relative',
314
+ margin: 0,
315
+ flexGrow: 1,
316
+ height: 0
317
+ }
382
318
  },
383
- ]
384
- }
385
- // {
386
- // type: "HorizontalLayout",
387
- // config: {
388
- // style: {
389
- // position: "fixed",
390
- // bottom: 5,
391
- // overflow: 'visible',
392
- // margin: "0",
393
- // width: "100vw",
394
- // }
395
- // },
396
- // elements: [
397
- // {
398
- // type: "Control",
399
- // scope: "#/properties/EmptyBox",
400
- // options: {
401
- // widget: "EmptyBox",
402
- // },
403
- // config: {
404
- // layout: { xs: 0, sm: 4, md: 4, lg: 4 },
405
- // },
406
- // },
407
- // {
408
-
409
- // type: "Control",
410
- // scope: "#/properties/FooterText",
411
- // options: {
412
- // widget: "Box",
413
- // },
414
- // config: {
415
- // layout: { xs: 11, sm: 4, md: 4, lg: 4 },
416
- // main: {
417
- // heading: "Copywriter@ACT21.IO"
418
- // },
419
- // style: {
420
- // color: theme?.palette?.text.disabled || "#AFAFAF",
421
- // fontSize: '12px',
422
- // }
423
- // },
424
- // },
425
- // {
426
- // type: "HorizontalLayout",
427
- // config: {
428
- // layout: { xs: 11, sm: 4, md: 4, lg: 4 },
429
- // },
430
- // elements: [
431
- // {
432
- // type: "Control",
433
- // scope: "#/properties/EmptyBox",
434
- // options: {
435
- // widget: "EmptyBox",
436
- // },
437
- // config: {
438
- // layout: 2,
439
- // },
440
- // },
441
- // {
442
- // type: "Control",
443
- // scope: "#/properties/backIcon",
444
- // options: {
445
- // widget: "Box",
446
- // },
447
- // config: {
448
- // layout: 1,
449
- // main: {
450
- // iconName: 'PrevIcon',
451
- // onClick: "backHandler"
452
- // },
453
- // style: {
454
- // fill: theme.palette.primary.dark,
455
- // width: 20,
456
- // height: 20,
457
- // display: 'flex',
458
- // alignItems: 'center',
459
- // justifyContent: 'center',
460
- // marginRight: '-8px',
461
- // cursor: 'pointer'
462
- // }
463
- // }
464
- // },
465
- // {
466
- // type: "Control",
467
- // scope: "#/properties/text",
468
-
469
- // options: {
470
- // widget: "Box",
471
- // },
472
- // config: {
473
- // layout: 9,
474
- // main: {
475
- // heading: "Previous Page",
476
- // onClick: "backHandler"
477
- // },
478
- // style: {
479
- // color: theme.palette.primary.dark,
480
- // fontSize: "12px",
481
- // cursor: 'pointer',
482
- // marginLeft: '-6px'
483
- // }
484
- // },
485
- // },
486
- // ],
487
- // },
488
- // // {
489
- // // type: "Control",
490
- // // scope: "#/properties/pageName",
319
+ },
320
+ {
321
+ type: "Control",
322
+ scope: "#/properties/backIcon",
323
+ options: {
324
+ widget: "Box",
325
+ },
326
+ config: {
327
+ main: {
328
+ iconName: 'PrevIcon',
329
+ onClick: "backHandler",
330
+ width: 'fit-content',
331
+ },
332
+ style: {
333
+ fill: theme.palette.primary.main,
334
+ width: 20,
335
+ height: 0,
336
+ margin: 0,
337
+ top: 0,
338
+ right: '90px',
339
+ position: 'absolute',
340
+ fontSize: '12px',
341
+ cursor: 'pointer',
342
+ ':hover': {
343
+ fill: theme.palette.primary.dark,
344
+ }
345
+ }
346
+ }
347
+ },
348
+ {
349
+ type: "Control",
350
+ scope: "#/properties/text",
491
351
 
492
- // // options: {
493
- // // widget: "Box",
494
- // // },
495
- // // config: {
496
- // // layout: 9.7,
497
- // // main: {
498
- // // heading: " ",
499
- // // },
500
- // // style: {
501
- // // color: theme.palette.text.disabled,
502
- // // // float: 'right',
503
- // // textAlign: 'right',
504
- // // // width: 'fit-content',
505
- // // fontSize: "12px",
506
- // // marginTop: '-16px',
507
- // // // marginRight: '100px'
508
- // // // marginLeft: '-6px'
509
- // // }
510
- // // },
511
- // // },
512
- // // {
513
- // // type: "Control",
514
- // // scope: "#/properties/emptyBox",
515
- // // options: {
516
- // // widget: "EmptyBox",
517
- // // },
518
- // // config: {
519
- // // layout: 2.3
520
- // // }
521
- // // },
522
- // ]
523
- // }
352
+ options: {
353
+ widget: "Box",
354
+ },
355
+ config: {
356
+ main: {
357
+ heading: "Previous Page",
358
+ onClick: "backHandler"
359
+ },
360
+ style: {
361
+ textAlign: 'left',
362
+ lineHeight: 1,
363
+ height: 0,
364
+ width: 'fit-content',
365
+ color: theme.palette.primary.main,
366
+ fontSize: "12px",
367
+ cursor: 'pointer',
368
+ marginLeft: '2px',
369
+ marginRight: 0,
370
+ top: 3,
371
+ right: '20px',
372
+ position: 'absolute',
373
+ ':hover': {
374
+ color: theme.palette.primary.dark,
375
+ }
376
+ }
377
+ },
378
+ },
379
+ ]
380
+ }
524
381
  ],
525
382
  };
526
383
  return uiSchema
package/src/impaktapps-ui-builder/runtime/services/events.ts CHANGED
@@ -86,8 +86,10 @@ async function executeInBuiltFunctionHandler(params: handlersProps) {
86
86
  if (params.config.funcParametersCode) {
87
87
  const makeFunc = eval(params.config.funcParametersCode)
88
88
  parameter = makeFunc(params.store, params.dynamicData, params.userValue, params.parentEventOutput, params.service);
89
+ params.serviceHolder[params.config.inBuiltFunctionType](parameter, params.service)
90
+ } else {
91
+ params.serviceHolder[params.config.inBuiltFunctionType](params.store, params.dynamicData, params.userValue, params.parentEventOutput, params.service)
89
92
  }
90
- params.serviceHolder[params.config.inBuiltFunctionType](parameter)
91
93
  }
92
94
 
93
95
  async function executeCustomHandler(params: handlersProps) {
@@ -131,14 +133,14 @@ async function mergeFormdata(handlerResponse: any, componentName: string, eventC
131
133
  }
132
134
  else {
133
135
  if (handlerResponse) {
134
- store.setFormdata((pre) => { return { ...pre, [componentName]: eventConfig.lazyLoading ? handlerResponse.data.data : handlerResponse.data } });
136
+ store.setFormdata((pre) => { return { ...pre, [componentName]: eventConfig.lazyLoading ? handlerResponse?.data?.data : handlerResponse.data } });
135
137
  const demoData = await asyncOperation();
136
138
  }
137
139
  }
138
140
  }
139
141
 
140
142
  const buildBodyFormat = (body: any[], formData: any, userValue: any) => {
141
- const finalBody = { ...userValue?.payload };
143
+ let finalBody = { ...userValue?.payload };
142
144
  body.map((elem) => {
143
145
  if (typeof elem?.value !== "string") {
144
146
  finalBody[elem.key] = elem.value;
@@ -150,7 +152,12 @@ const buildBodyFormat = (body: any[], formData: any, userValue: any) => {
150
152
  else if (elem?.value?.startsWith("$")) {
151
153
  const finalpath = elem.value.substring(1);
152
154
  finalBody[elem.key] = _.get(formData, finalpath);;
153
- } else {
155
+ } else if (elem?.value === "*" && elem?.key === "*") {
156
+ finalBody = { ...finalBody, ...formData };
157
+ } else if (elem?.value === "*") {
158
+ finalBody[elem.key] = formData;
159
+ }
160
+ else {
154
161
  finalBody[elem.key] = elem.value;
155
162
  }
156
163
  }
@@ -213,7 +220,7 @@ export function getRefreshElements(eventConfig: any, eventGropus: any) {
213
220
  }
214
221
 
215
222
 
216
- function asyncOperation() {
223
+ export function asyncOperation() {
217
224
  return new Promise((resolve, reject) => {
218
225
  setTimeout(() => {
219
226
  const success = true;
@@ -223,4 +230,4 @@ function asyncOperation() {
223
230
  }
224
231
  }, 50);
225
232
  });
226
- }
233
+ }
package/src/impaktapps-ui-builder/runtime/services/interface.ts CHANGED
@@ -1,11 +1,12 @@
1
1
  export interface handlersProps {
2
- config: any,
3
- componentName: string,
4
- store: any,
5
- dynamicData: any,
6
- userValue: any,
7
- service: any,
8
- serviceHolder: any,
9
- eventGroups?: any,
10
- parentEventOutput?: any
2
+ config: any,
3
+ componentName: string,
4
+ store: any,
5
+ dynamicData: any,
6
+ userValue: any,
7
+ service: any,
8
+ serviceHolder: any,
9
+ eventGroups?: any,
10
+ parentEventOutput?: any,
11
+ functionsProvider?:Record<string,any>
11
12
  }
package/src/impaktapps-ui-builder/runtime/services/service.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import _, { isEmpty } from "lodash";
2
2
  import { doDownload, downloadFile } from "./downloadFile";
3
- import { executeEvents, executeRefreshHandler } from "./events";
3
+ import { asyncOperation, executeEvents, executeRefreshHandler } from "./events";
4
4
  import { handlersProps } from "./interface";
5
5
  let compType: string;
6
6
  let eventGroups: any = {};
@@ -32,7 +32,7 @@ export const extractEvents = (eventConfig: any) => {
32
32
  if (!(!!SuccessEvent) && event.eventType === "onLoad") {
33
33
  event.events.push({ Handler: "mergeFormdata", eventType: "Success", type: compType, lazyLoading: eventConfig.lazyLoading === "YES" ? true : false })
34
34
  }
35
- if (!(!!SuccessEvent) && (event.eventType === "onBack" || event.eventType === "onNext"|| event.eventType === "onReset")) {
35
+ if (!(!!SuccessEvent) && (event.eventType === "onBack" || event.eventType === "onNext" || event.eventType === "onReset")) {
36
36
  event.events.push({ Handler: `${event.eventType}Handler`, eventType: "Success", type: compType, lazyLoading: eventConfig.lazyLoading === "YES" ? true : false })
37
37
  }
38
38
  eventGroups[event.eventType][eventConfigObj.name].push({ ...event, type: compType })
@@ -55,6 +55,7 @@ interface funcParamsProps {
55
55
  schema: any,
56
56
  service: any,
57
57
  userValue: any,
58
+ functionsProvider?: Record<string, any>
58
59
  }
59
60
  export default (funcParams: funcParamsProps) => {
60
61
  eventGroups = {}
@@ -62,16 +63,25 @@ export default (funcParams: funcParamsProps) => {
62
63
  let executeEventsParameters: handlersProps = {
63
64
  config: {}, componentName: "",
64
65
  store: funcParams.store, dynamicData: funcParams.dynamicData, userValue: funcParams.userValue, service: funcParams.service,
65
- serviceHolder: { downloadFile,download:doDownload }, eventGroups
66
+ serviceHolder: { downloadFile, download: doDownload ,...funcParams.functionsProvider}, eventGroups,
67
+ functionsProvider: funcParams.functionsProvider,
66
68
  };
67
69
  return {
68
70
  setPage: async function () {
69
71
  funcParams.store.setFormdata({});
72
+ const demoData = await asyncOperation();
70
73
  executeEventsParameters = {
71
74
  config: {}, componentName: "",
72
75
  store: funcParams.store, dynamicData: funcParams.dynamicData, userValue: funcParams.userValue, service: funcParams.service,
76
+ functionsProvider: funcParams.functionsProvider,
73
77
  serviceHolder: this, eventGroups
74
78
  }
79
+ await executeRefreshHandler({
80
+ config: {}, componentName: "",
81
+ store: funcParams.store, dynamicData: funcParams.dynamicData, userValue: funcParams.userValue, service: funcParams.service,
82
+ serviceHolder: this, eventGroups
83
+ })
84
+ const demoData2 = await asyncOperation();
75
85
  funcParams.store.setSchema(
76
86
  (pre: any) => {
77
87
  return {
@@ -82,21 +92,23 @@ export default (funcParams: funcParamsProps) => {
82
92
  )
83
93
  funcParams.uiSchema.elements.push(notifyUiSchema);
84
94
  funcParams.store.setUiSchema(funcParams.uiSchema);
85
- await executeRefreshHandler({
86
- config: {}, componentName: "",
87
- store: funcParams.store, dynamicData: funcParams.dynamicData, userValue: funcParams.userValue, service: funcParams.service,
88
- serviceHolder: this, eventGroups
89
- })
95
+
90
96
  },
91
97
  onClick: async function () {
92
98
  await this.callHandler("onClick")
93
99
  },
100
+ onMount: async function () {
101
+ await this.callHandler("onMount")
102
+ },
94
103
  onFileDownload: async function () {
95
104
  await this.callHandler("onDownload")
96
105
  },
97
106
  onFileUpload: async function () {
98
107
  await this.callHandler("onUpload")
99
108
  },
109
+ backHandler:function(){
110
+ funcParams.store.navigate(-1)
111
+ },
100
112
  onPaginationChange: async function (paginationValues) {
101
113
  const apiBody = [
102
114
  { key: "size", value: paginationValues.pagination.pageSize },
@@ -114,12 +126,12 @@ export default (funcParams: funcParamsProps) => {
114
126
  { key: "searchValue", value: param.serachValue },
115
127
  { key: "currentValue", value: param.currentValue }
116
128
  ]
117
- return await this.updateConfigApiBody(param, apiBody)
129
+ const response = await this.updateConfigApiBody(param, apiBody);
130
+ return response?.data;
118
131
  }
119
132
  },
120
133
  onChange: async function () {
121
134
  if (eventGroups.onChange) {
122
- funcParams.dynamicData?.setLoading(true);
123
135
  const ChangeEventsKeysArray = Object.keys(eventGroups.onChange);
124
136
  Promise.all(ChangeEventsKeysArray.map(async (componentName: string) => {
125
137
  if (
@@ -135,7 +147,6 @@ export default (funcParams: funcParamsProps) => {
135
147
  }
136
148
  }
137
149
  }))
138
- funcParams.dynamicData?.setLoading(false);
139
150
  }
140
151
  },
141
152
  updateConfigApiBody: async function (paramValue, apiBody) {
@@ -173,9 +184,6 @@ export default (funcParams: funcParamsProps) => {
173
184
  functionParameters?.handleNext()
174
185
  }
175
186
  },
176
- backHandler:()=>{
177
- funcParams.store.navigate(-1)
178
- },
179
187
  onReset: async function (functionParameters) {
180
188
  const path = funcParams.dynamicData?.tableButtonPath || funcParams.dynamicData.path.split(".")[0];
181
189
  await this.callHandler("onReset", functionParameters)
@@ -197,17 +205,10 @@ export default (funcParams: funcParamsProps) => {
197
205
  }
198
206
  },
199
207
  downloadFile: downloadFile,
200
- download:doDownload,
208
+ download: doDownload,
209
+ ...funcParams.functionsProvider
201
210
  };
202
211
  };
203
212
 
204
213
 
205
214
 
206
-
207
-
208
-
209
-
210
-
211
-
212
-
213
-