impaktapps-ui-builder 1.0.130 → 1.0.131-alpha.10

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "impaktapps-ui-builder",
3
- "version": "1.0.130",
3
+ "version": "1.0.131-alpha.10",
4
4
  "scripts": {
5
5
  "dev": "vite",
6
6
  "build": "tsc && vite build",
@@ -77,5 +77,8 @@ export const buildTable = (config: any, componentScope: string) => {
77
77
  if (config.maxPageSize) {
78
78
  table.config.main.maxPageSize = config.maxPageSize
79
79
  }
80
+ if(config.initialDensity){
81
+ table.config.main.initialDensity = config.initialDensity
82
+ }
80
83
  return table;
81
84
  };
@@ -292,7 +292,8 @@ const buildUiSchema = (config: any, store?: any) => {
292
292
  enableColumnFilter: cellElem.enableFilter === "No" ? false : true,
293
293
  columnFilterModeOptions: cellElem.filteringOptions,
294
294
  enableSorting: cellElem.enableSorting === "No" ? false : true,
295
- columnKey: cellElem.columnKey
295
+ columnKey: cellElem.columnKey,
296
+ dateFormat: cellElem.dateFormat,
296
297
  }
297
298
  if (cellElem.type) {
298
299
  const tableElem = {
@@ -325,7 +326,8 @@ const buildUiSchema = (config: any, store?: any) => {
325
326
  enableColumnFilter: cellElem.enableFilter === "No" ? false : true,
326
327
  columnFilterModeOptions: cellElem.filteringOptions,
327
328
  enableSorting: cellElem.enableSorting === "No" ? false : true,
328
- columnKey: cellElem.columnKey
329
+ columnKey: cellElem.columnKey,
330
+ dateFormat: cellElem.dateFormat,
329
331
  }
330
332
  if (cellElem.type) {
331
333
  if (cellElem.elementType == "action") {
@@ -487,6 +487,11 @@ export const buildPropertiesSection = function (type: String) {
487
487
  { label: "100", value: 100 },
488
488
  { label: "500", value: 500 }
489
489
  ]),
490
+ getSelectField("initialDensity", "Initial Toggle Density", [
491
+ { label: "Compact", value: "compact" },
492
+ { label: "Comfortable", value: "comfortable" },
493
+ { label: "Spacious", value: "spacious" }
494
+ ]),
490
495
  buildWrapper("Tree Table Properties", [
491
496
  getRadioInputField("enableRowMovement", "Row Rearrangement", ["YES", "NO"]),
492
497
  getRadioInputField("enableExpanding", "Row Expanding", ["YES", "NO"]),
@@ -62,20 +62,76 @@ export const CoreSection = {
62
62
  },
63
63
  },
64
64
  },
65
- // {
66
- // type: "Control",
67
- // scope: "#/properties/columnFormat",
68
- // options: {
69
- // widget: "SelectInputField",
70
- // },
71
- // config: {
72
- // layout: { xs: 6, sm: 6, md: 4, lg: 3 },
73
- // main: {
74
- // label: "Column Format",
75
-
76
- // },
77
- // },
78
- // },
65
+ {
66
+ type: "Control",
67
+ scope: "#/properties/proc5",
68
+ config: {
69
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 },
70
+ },
71
+ options: {
72
+ widget: "EmptyBox",
73
+ },
74
+ },
75
+ {
76
+ type: "Control",
77
+ scope: "#/properties/proc6",
78
+ config: {
79
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 },
80
+ },
81
+ options: {
82
+ widget: "EmptyBox",
83
+ },
84
+ },
85
+ {
86
+ type: "Control",
87
+ scope: "#/properties/proc7",
88
+ config: {
89
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 },
90
+ },
91
+ options: {
92
+ widget: "EmptyBox",
93
+ },
94
+ },
95
+ {
96
+ type: "Control",
97
+ scope: "#/properties/proc8",
98
+ config: {
99
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 },
100
+ },
101
+ options: {
102
+ widget: "EmptyBox",
103
+ },
104
+ },
105
+ {
106
+ type: "Control",
107
+ scope: "#/properties/proc9",
108
+ config: {
109
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 },
110
+ },
111
+ options: {
112
+ widget: "EmptyBox",
113
+ },
114
+ },
115
+ {
116
+ type: "Control",
117
+ scope: "#/properties/proc10",
118
+ config: {
119
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 },
120
+ },
121
+ options: {
122
+ widget: "EmptyBox",
123
+ },
124
+ },
125
+ {
126
+ type: "Control",
127
+ scope: "#/properties/proc11",
128
+ config: {
129
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 },
130
+ },
131
+ options: {
132
+ widget: "EmptyBox",
133
+ },
134
+ },
79
135
  {
80
136
  type: "Control",
81
137
  scope: "#/properties/proc",
@@ -117,7 +173,7 @@ export const CoreSection = {
117
173
  layout: { xs: 6, sm: 6, md: 4, lg: 4 },
118
174
  main: {
119
175
  label: "Screen Size",
120
-
176
+
121
177
  },
122
178
  },
123
179
  },
@@ -132,11 +188,11 @@ export const CoreSection = {
132
188
  layout: { xs: 6, sm: 6, md: 4, lg: 4 },
133
189
  main: {
134
190
  label: "Value",
135
- type:"number",
191
+ type: "number",
136
192
  // freeSolo:true,
137
- helperText:'Number should be in range of 0 to 12',
138
- errorMessage:"Number Can't be greater than 12 and can't be less than 0.",
139
-
193
+ helperText: 'Number should be in range of 0 to 12',
194
+ errorMessage: "Number Can't be greater than 12 and can't be less than 0.",
195
+
140
196
  },
141
197
  },
142
198
  },
@@ -43,36 +43,67 @@ export const ComponentSchema: any = {
43
43
  { title: "Upload", const: "UploadFile" },
44
44
  { title: "Tree ", const: "TreeMap" },
45
45
  { title: "Column Group", const: "ColumnGroup" },
46
- { title: "Thought of the day", const: "Thought" }
47
- ]
46
+ { title: "Thought of the day", const: "Thought" },
47
+ ],
48
48
  },
49
49
  elementType: {
50
50
  oneOf: [
51
51
  { title: "Table Action Element", const: "action" },
52
52
  { title: "Table Header Element", const: "tableHeader" },
53
53
  { title: "Table Element", const: "element" },
54
- ]
54
+ ],
55
55
  },
56
56
  columnFormat: {
57
57
  oneOf: [
58
58
  { title: "Date Column", const: "date" },
59
59
  { title: "DateTime Column", const: "dateTime" },
60
60
  { title: "Amount Column", const: "amount" },
61
- { title: "Center Column", const: "action" }
62
- ]
61
+ { title: "Center Column", const: "action" },
62
+ ],
63
+ },
64
+ dateFormat: {
65
+ oneOf: [
66
+ {
67
+ title: "ISO DateTime (UTC) — YYYY-MM-DDTHH:mm:ss.SSSZ",
68
+ const: "YYYY-MM-DDTHH:mm:ss.SSSZ",
69
+ },
70
+ {
71
+ title: "ISO DateTime — YYYY-MM-DDTHH:mm:ssZ",
72
+ const: "YYYY-MM-DDTHH:mm:ssZ",
73
+ },
74
+ {
75
+ title: "ISO DateTime (No TZ) — YYYY-MM-DDTHH:mm:ss",
76
+ const: "YYYY-MM-DDTHH:mm:ss",
77
+ },
78
+ { title: "ISO Date — YYYY-MM-DD", const: "YYYY-MM-DD" },
79
+ { title: "Date (DD-MM-YYYY) — DD-MM-YYYY", const: "DD-MM-YYYY" },
80
+ { title: "Date (MM/DD/YYYY) — MM/DD/YYYY", const: "MM/DD/YYYY" },
81
+ {
82
+ title: "DateTime (DB) — YYYY-MM-DD HH:mm:ss",
83
+ const: "YYYY-MM-DD HH:mm:ss",
84
+ },
85
+ {
86
+ title: "DateTime (DB ms) — YYYY-MM-DD HH:mm:ss.SSS",
87
+ const: "YYYY-MM-DD HH:mm:ss.SSS",
88
+ },
89
+ { title: "Time (24h) — HH:mm:ss", const: "HH:mm:ss" },
90
+ { title: "Time (12h) — hh:mm:ss A", const: "hh:mm:ss A" },
91
+ { title: "Epoch (Milliseconds)", const: "x" },
92
+ { title: "Epoch (Seconds)", const: "X" },
93
+ ],
63
94
  },
64
95
  variant: {
65
96
  oneOf: [
66
97
  { title: "Outlined", const: "outlined" },
67
98
  { title: "Filled", const: "filled" },
68
99
  { title: "Standard", const: "standard" },
69
- ]
100
+ ],
70
101
  },
71
102
  orientation: {
72
103
  oneOf: [
73
104
  { title: "Horizontal", const: "horizontal" },
74
105
  { title: "Vertical", const: "vertical" },
75
- ]
106
+ ],
76
107
  },
77
108
  method: {
78
109
  type: "string",
@@ -81,7 +112,7 @@ export const ComponentSchema: any = {
81
112
  { title: "Post", const: "post" },
82
113
  { title: "Delete", const: "delete" },
83
114
  { title: "Put", const: "put" },
84
- ]
115
+ ],
85
116
  },
86
117
  maxPageSize: {
87
118
  type: "number",
@@ -91,8 +122,16 @@ export const ComponentSchema: any = {
91
122
  { title: "30", const: 30 },
92
123
  { title: "50", const: 50 },
93
124
  { title: "100", const: 100 },
94
- { title: "500", const: 500 }
95
- ]
125
+ { title: "500", const: 500 },
126
+ ],
127
+ },
128
+ initialDensity: {
129
+ type: "string",
130
+ oneOf: [
131
+ { title: "Compact", const: "compact" },
132
+ { title: "Comfortable", const: "comfortable" },
133
+ { title: "Spacious", const: "spacious" },
134
+ ],
96
135
  },
97
136
  layout: {
98
137
  type: "array",
@@ -108,9 +147,7 @@ export const ComponentSchema: any = {
108
147
  { title: "Large", const: "lg" },
109
148
  ],
110
149
  },
111
- value: {
112
-
113
- },
150
+ value: {},
114
151
  },
115
152
  },
116
153
  },
@@ -128,9 +165,7 @@ export const ComponentSchema: any = {
128
165
  { title: "Large", const: "lg" },
129
166
  ],
130
167
  },
131
- value: {
132
-
133
- },
168
+ value: {},
134
169
  },
135
170
  },
136
171
  },
@@ -187,7 +222,6 @@ export const ComponentSchema: any = {
187
222
  label: {
188
223
  type: "string",
189
224
  },
190
-
191
225
  },
192
226
  },
193
227
  },
@@ -199,7 +233,6 @@ export const ComponentSchema: any = {
199
233
  KeyName: {
200
234
  type: "string",
201
235
  },
202
-
203
236
  },
204
237
  },
205
238
  },
@@ -212,8 +245,8 @@ export const ComponentSchema: any = {
212
245
  type: "string",
213
246
  },
214
247
  value: {
215
- type: "string"
216
- }
248
+ type: "string",
249
+ },
217
250
  },
218
251
  },
219
252
  },
@@ -230,19 +263,19 @@ export const ComponentSchema: any = {
230
263
  },
231
264
  filteringOptions: {
232
265
  oneOf: [
233
- { const: 'fuzzy', title: 'Fuzzy' },
234
- { const: 'contains', title: 'Contain' },
235
- { const: 'startsWith', title: 'Starts with' },
236
- { const: 'endsWith', title: 'Ends with' },
237
- { const: 'equals', title: 'Equals' },
238
- { const: 'notEquals', title: 'Not Equals' },
239
- { const: 'between', title: 'Between' },
240
- { const: 'betweenInclusive', title: 'Between inclusive' },
241
- { const: 'greaterThan', title: 'Greater than' },
242
- { const: 'greaterThanOrEqualTo', title: 'Greater than or equal to' },
243
- { const: 'lessThan', title: 'Less than' },
244
- { const: 'lessThanOrEqualTo', title: 'Less than or equal to' },
245
- ]
266
+ { const: "fuzzy", title: "Fuzzy" },
267
+ { const: "contains", title: "Contain" },
268
+ { const: "startsWith", title: "Starts with" },
269
+ { const: "endsWith", title: "Ends with" },
270
+ { const: "equals", title: "Equals" },
271
+ { const: "notEquals", title: "Not Equals" },
272
+ { const: "between", title: "Between" },
273
+ { const: "betweenInclusive", title: "Between inclusive" },
274
+ { const: "greaterThan", title: "Greater than" },
275
+ { const: "greaterThanOrEqualTo", title: "Greater than or equal to" },
276
+ { const: "lessThan", title: "Less than" },
277
+ { const: "lessThanOrEqualTo", title: "Less than or equal to" },
278
+ ],
246
279
  },
247
280
 
248
281
  legendLabels: {
@@ -253,7 +286,6 @@ export const ComponentSchema: any = {
253
286
  label: {
254
287
  type: "string",
255
288
  },
256
-
257
289
  },
258
290
  },
259
291
  },
@@ -265,7 +297,6 @@ export const ComponentSchema: any = {
265
297
  label: {
266
298
  type: "string",
267
299
  },
268
-
269
300
  },
270
301
  },
271
302
  },
@@ -277,7 +308,6 @@ export const ComponentSchema: any = {
277
308
  formatElement: {
278
309
  type: "string",
279
310
  },
280
-
281
311
  },
282
312
  },
283
313
  },
@@ -288,7 +318,6 @@ export const ComponentSchema: any = {
288
318
  properties: {
289
319
  componentName: {
290
320
  type: "string",
291
-
292
321
  },
293
322
  validationType: {
294
323
  type: "string",
@@ -298,7 +327,7 @@ export const ComponentSchema: any = {
298
327
  { const: "maxLength", title: "Maximum Length" },
299
328
  { const: "pattern", title: "Pattern" },
300
329
  { const: "readOnly", title: "Read Only" },
301
- ]
330
+ ],
302
331
  },
303
332
  validationValue: {
304
333
  type: "string",
@@ -312,14 +341,14 @@ export const ComponentSchema: any = {
312
341
  { title: "Button", const: "Button" },
313
342
  { title: "IconButton", const: "IconButton" },
314
343
  { title: "HybridButton", const: "ButtonWithIconAndText" },
315
- ]
344
+ ],
316
345
  },
317
346
  defaultStyle: {
318
347
  type: "string",
319
348
  oneOf: [
320
349
  { title: "Apply Default Style", const: "true" },
321
350
  { title: "No Style", const: "false" },
322
- ]
351
+ ],
323
352
  },
324
353
  graphType: {
325
354
  type: "string",
@@ -329,8 +358,11 @@ export const ComponentSchema: any = {
329
358
  { title: "Line Graph", const: "LineGraph" },
330
359
  { title: "Pie Graph", const: "PieGraph" },
331
360
  { title: "Horizontal Bar Graph", const: "HorizontalBarGraph" },
332
- { title: "Stack Horizontal Bar Graph", const: "HorizontalStackBarGraph" }
333
- ]
361
+ {
362
+ title: "Stack Horizontal Bar Graph",
363
+ const: "HorizontalStackBarGraph",
364
+ },
365
+ ],
334
366
  },
335
367
  iconName: {
336
368
  type: "string",
@@ -353,36 +385,36 @@ export const ComponentSchema: any = {
353
385
  { title: "Download Icon", const: "DownloadIcon" },
354
386
  { title: "Download All Icon", const: "DownloadAllIcon" },
355
387
  { title: "Exception Icon", const: "ExceptionIcon" },
356
- { "title": "Alarm Icon", "const": "AlarmIcon" },
357
- { "title": "Click Icon", "const": "ClickIcon" },
358
- { "title": "Content Copy Icon", "const": "ContentCopyIcon" },
359
- { "title": "File Copy Icon", "const": "FileCopyIcon" },
360
- { "title": "Pause Icon", "const": "PauseIcon" },
361
- { "title": "Play Icon", "const": "PlayIcon" },
362
- { "title": "Close Icon", "const": "CloseIcon" },
363
- { "title": "Replay Icon", "const": "ReplayIcon" },
364
- { "title": "Delete Icon", "const": "DeleteIcon" },
365
- { "title": "Drafts Icon", "const": "DraftsIcon" },
366
- { "title": "Perm Phone Msg Icon", "const": "PermPhoneMsgIcon" },
367
- { "title": "Paste Icon", "const": "PasteIcon" },
368
- { "title": "Prev Icon", "const": "PrevIcon" },
369
- { "title": "Verified Icon", "const": "VerifiedIcon" },
370
- { "title": "Table Add Icon", "const": "TableAddIcon" },
371
- { "title": "Table Download Icon", "const": "TableDownloadIcon" },
372
- { "title": "Audit Trail Icon", "const": "AuditTrailIcon" },
373
- { "title": "View Component", "const": "View" },
374
- { "title": "Table Edit Icon", "const": "TableEditIcon" },
375
- { "title": "Maximize Icon", "const": "Maximize" },
376
- { "title": "Minimize Icon", "const": "Minimize" },
377
- { "title": "Subtract Icon", "const": "Subtract" },
378
- { "title": "Bin Icon", "const": "Bin" },
379
- { "title": "Export Icon", "const": "Export" },
380
- { "title": "Table Paste Icon", "const": "TablePaste" },
381
- { "title": "Clone Icon", "const": "CloneIcon" },
382
- { "title": "Detail Icon", "const": "DetailIcon" },
383
- { "title": "Report View Icon", "const": "ReportViewIcon" },
384
- { "title": "Payout", "const": "Payout" },
385
- ]
388
+ { title: "Alarm Icon", const: "AlarmIcon" },
389
+ { title: "Click Icon", const: "ClickIcon" },
390
+ { title: "Content Copy Icon", const: "ContentCopyIcon" },
391
+ { title: "File Copy Icon", const: "FileCopyIcon" },
392
+ { title: "Pause Icon", const: "PauseIcon" },
393
+ { title: "Play Icon", const: "PlayIcon" },
394
+ { title: "Close Icon", const: "CloseIcon" },
395
+ { title: "Replay Icon", const: "ReplayIcon" },
396
+ { title: "Delete Icon", const: "DeleteIcon" },
397
+ { title: "Drafts Icon", const: "DraftsIcon" },
398
+ { title: "Perm Phone Msg Icon", const: "PermPhoneMsgIcon" },
399
+ { title: "Paste Icon", const: "PasteIcon" },
400
+ { title: "Prev Icon", const: "PrevIcon" },
401
+ { title: "Verified Icon", const: "VerifiedIcon" },
402
+ { title: "Table Add Icon", const: "TableAddIcon" },
403
+ { title: "Table Download Icon", const: "TableDownloadIcon" },
404
+ { title: "Audit Trail Icon", const: "AuditTrailIcon" },
405
+ { title: "View Component", const: "View" },
406
+ { title: "Table Edit Icon", const: "TableEditIcon" },
407
+ { title: "Maximize Icon", const: "Maximize" },
408
+ { title: "Minimize Icon", const: "Minimize" },
409
+ { title: "Subtract Icon", const: "Subtract" },
410
+ { title: "Bin Icon", const: "Bin" },
411
+ { title: "Export Icon", const: "Export" },
412
+ { title: "Table Paste Icon", const: "TablePaste" },
413
+ { title: "Clone Icon", const: "CloneIcon" },
414
+ { title: "Detail Icon", const: "DetailIcon" },
415
+ { title: "Report View Icon", const: "ReportViewIcon" },
416
+ { title: "Payout", const: "Payout" },
417
+ ],
386
418
  },
387
419
  color: {
388
420
  type: "string",
@@ -392,19 +424,19 @@ export const ComponentSchema: any = {
392
424
  { title: "Error", const: "error" },
393
425
  { title: "Success", const: "success" },
394
426
  { title: "Info", const: "info" },
395
- ]
427
+ ],
396
428
  },
397
429
  pageName: {
398
- path: []
430
+ path: [],
399
431
  },
400
432
  name: {
401
433
  type: "string",
402
434
  },
403
- label: { type: 'string' },
435
+ label: { type: "string" },
404
436
  RemoveItemButton: {
405
437
  disabled: true,
406
438
  },
407
439
  },
408
440
 
409
- required: ["name",]
441
+ required: ["name"],
410
442
  };
@@ -162,6 +162,29 @@ export function refreshPage(type: string, store: any) {
162
162
  },
163
163
  },
164
164
  }
165
+ UiSchema.elements[0].elements[0].elements[10] = {
166
+ type: "Control",
167
+ scope: "#/properties/dateFormat",
168
+ options: {
169
+ widget: "SelectInputField",
170
+ },
171
+ config: {
172
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
173
+ main: {
174
+ label: "Date Time Format",
175
+ },
176
+ },
177
+ }
178
+ UiSchema.elements[0].elements[0].elements[11] = {
179
+ type: "Control",
180
+ scope: "#/properties/emptyBox",
181
+ options: {
182
+ widget: "EmptyBox",
183
+ },
184
+ config: {
185
+ layout: { xs: 0, sm: 0, md: 0, lg: 6 },
186
+ },
187
+ }
165
188
  }
166
189
 
167
190
  if (sessionStorage.getItem("copiedConfig") ) {