impaktapps-ui-builder 0.0.101-alpha.9 → 0.0.101-alpha.91

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 (36) hide show
  1. package/dist/impaktapps-ui-builder.es.js +1134 -809
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +15 -15
  4. package/dist/impaktapps-ui-builder.umd.js.map +1 -1
  5. package/dist/src/impaktapps-ui-builder/builder/build/uischema/apiSection.d.ts +62 -59
  6. package/dist/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.d.ts +17 -21
  7. package/dist/src/impaktapps-ui-builder/builder/build/uischema/coreSection.d.ts +98 -95
  8. package/dist/src/impaktapps-ui-builder/builder/build/uischema/eventSection.d.ts +26 -33
  9. package/dist/src/impaktapps-ui-builder/builder/build/uischema/refresh.d.ts +52 -38
  10. package/dist/src/impaktapps-ui-builder/builder/build/uischema/styleSection.d.ts +7 -8
  11. package/dist/src/impaktapps-ui-builder/builder/build/uischema/tableSection.d.ts +29 -33
  12. package/dist/src/impaktapps-ui-builder/builder/build/uischema/validationSections.d.ts +56 -37
  13. package/dist/src/impaktapps-ui-builder/builder/build/uischema/valueTab.d.ts +56 -36
  14. package/dist/src/impaktapps-ui-builder/builder/elements/UiSchema/event/schema.d.ts +6 -0
  15. package/dist/src/impaktapps-ui-builder/builder/services/event.d.ts +6 -0
  16. package/package.json +1 -1
  17. package/src/impaktapps-ui-builder/builder/build/buildText.ts +21 -18
  18. package/src/impaktapps-ui-builder/builder/build/buildUiSchema.ts +14 -10
  19. package/src/impaktapps-ui-builder/builder/build/uischema/apiSection.ts +111 -96
  20. package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts +101 -95
  21. package/src/impaktapps-ui-builder/builder/build/uischema/coreSection.ts +189 -110
  22. package/src/impaktapps-ui-builder/builder/build/uischema/eventSection.ts +39 -17
  23. package/src/impaktapps-ui-builder/builder/build/uischema/refresh.ts +44 -44
  24. package/src/impaktapps-ui-builder/builder/build/uischema/styleSection.ts +9 -13
  25. package/src/impaktapps-ui-builder/builder/build/uischema/tableSection.ts +40 -18
  26. package/src/impaktapps-ui-builder/builder/build/uischema/validationSections.ts +117 -48
  27. package/src/impaktapps-ui-builder/builder/build/uischema/valueTab.ts +113 -45
  28. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/schema.ts +23 -23
  29. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +119 -51
  30. package/src/impaktapps-ui-builder/builder/elements/UiSchema/PageMaster/uiSchema.ts +30 -21
  31. package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/schema.ts +15 -12
  32. package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/uiSchema.ts +188 -295
  33. package/src/impaktapps-ui-builder/builder/services/component.ts +146 -32
  34. package/src/impaktapps-ui-builder/builder/services/event.ts +167 -65
  35. package/src/impaktapps-ui-builder/runtime/services/events.ts +8 -1
  36. package/src/impaktapps-ui-builder/runtime/services/service.ts +5 -4
package/src/impaktapps-ui-builder/builder/build/uischema/coreSection.ts CHANGED
@@ -1,5 +1,11 @@
1
1
  export const CoreSection = {
2
- type: "HorizontalLayout",
2
+ type: "WrapperLayout",
3
+ config: {
4
+ main: {
5
+ label: " ",
6
+ gap: "8px"
7
+ }
8
+ },
3
9
  elements: [
4
10
  {
5
11
  type: "Control",
@@ -9,13 +15,23 @@ export const CoreSection = {
9
15
  widget: "SelectInputField",
10
16
  },
11
17
  config: {
12
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
18
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
13
19
  main: {
14
20
  label: "Type",
15
21
  type: "text",
16
22
  },
17
23
  },
18
24
  },
25
+ {
26
+ type: "Control",
27
+ scope: "#/properties/proc",
28
+ config: {
29
+ layout: { xs: 6, sm: 0, md: 0, lg: 0 },
30
+ },
31
+ options: {
32
+ widget: "EmptyBox",
33
+ },
34
+ },
19
35
  {
20
36
  type: "Control",
21
37
  scope: "#/properties/name",
@@ -24,9 +40,10 @@ export const CoreSection = {
24
40
  widget: "InputField",
25
41
  },
26
42
  config: {
27
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
43
+ layout: { xs: 12, sm: 6, md: 4, lg: 3 },
28
44
  main: {
29
- label: "Name",
45
+ label: "Component ID",
46
+ required: true,
30
47
  },
31
48
  },
32
49
  },
@@ -38,123 +55,130 @@ export const CoreSection = {
38
55
  widget: "InputField",
39
56
  },
40
57
  config: {
41
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
58
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
42
59
  main: {
43
60
  label: "Label",
61
+ required: true,
44
62
  },
45
63
  },
46
64
  },
47
- {
48
- type: "Control",
49
- scope: "#/properties/columnFormat",
50
- options: {
51
- widget: "SelectInputField",
52
- },
53
- config: {
54
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
55
- main: {
56
- label: "Column Format",
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",
57
75
 
58
- },
59
- },
60
- },
61
- {
62
- type: "Control",
63
- scope: "#/properties/proc",
64
- config: {
65
- layout: { xs: 0, sm: 0, md: 4, lg: 4 },
66
- },
67
- options: {
68
- widget: "EmptyBox",
69
- },
70
- },
76
+ // },
77
+ // },
78
+ // },
71
79
  {
72
80
  type: "Control",
73
81
  scope: "#/properties/proc",
74
82
  config: {
75
- layout: { xs: 0, sm: 0, md: 4, lg: 4 },
83
+ layout: { xs: 6, sm: 6, md: 0, lg: 3 },
76
84
  },
77
85
  options: {
78
86
  widget: "EmptyBox",
79
87
  },
80
88
  },
89
+ // {
90
+ // type: "Control",
91
+ // scope: "#/properties/layout",
92
+ // layout: 12,
93
+ // options: {
94
+ // "elementLabelProp": "key",
95
+ // detail: {
96
+ // type: "HorizontalLayout",
97
+
98
+ // elements: [
99
+ // {
100
+ // type: "Control",
101
+ // scope: "#/properties/key",
102
+ // options: {
103
+ // widget: "SelectInputField",
104
+ // },
105
+ // config: {
106
+ // layout: { xs: 6, sm: 6, md: 4, lg: 4 },
107
+ // main: {
108
+ // label: "Screen Size",
109
+
110
+ // },
111
+ // },
112
+ // },
113
+ // {
114
+ // type: "Control",
115
+ // scope: "#/properties/value",
116
+
117
+ // options: {
118
+ // widget: "InputField",
119
+ // },
120
+ // config: {
121
+ // layout: { xs: 6, sm: 6, md: 4, lg: 4 },
122
+ // main: {
123
+ // label: "Value",
124
+ // type:"number",
125
+ // // freeSolo:true,
126
+ // helperText:'Number should be in range of 0 to 12',
127
+ // errorMessage:"Number Can't be greater than 12 and can't be less than 0.",
128
+ // },
129
+ // },
130
+ // },
131
+ // {
132
+ // type: "Control",
133
+ // scope: "#/properties/proc",
134
+ // config: {
135
+ // layout: { xs: 0, sm: 0, md: 4, lg: 4 },
136
+ // },
137
+ // options: {
138
+ // widget: "EmptyBox",
139
+ // },
140
+ // },
141
+ // ],
142
+ // },
143
+ // },
144
+ // },
145
+
146
+
81
147
  {
82
148
  type: "Control",
83
149
  scope: "#/properties/layout",
84
- layout: 12,
85
150
  options: {
86
- "elementLabelProp": "key",
87
- detail: {
88
- type: "HorizontalLayout",
89
-
90
- elements: [
91
- {
92
- type: "Control",
93
- scope: "#/properties/key",
94
- options: {
95
- widget: "SelectInputField",
96
- },
97
- config: {
98
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
99
- main: {
100
- label: "Screen Size",
101
-
102
- },
103
- },
104
- },
105
- {
106
- type: "Control",
107
- scope: "#/properties/value",
108
-
109
- options: {
110
- widget: "InputField",
111
- },
112
- config: {
113
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
114
- main: {
115
- label: "Value",
116
- type:"number",
117
- // freeSolo:true,
118
- helperText:'Number should be in range of 0 to 12',
119
- errorMessage:"Number Can't be greater than 12 and can't be less than 0.",
120
- },
121
- },
122
- },
123
- {
124
- type: "Control",
125
- scope: "#/properties/proc",
126
- config: {
127
- layout: { xs: 0, sm: 0, md: 4, lg: 4 },
128
- },
129
- options: {
130
- widget: "EmptyBox",
131
- },
132
- },
133
- ],
151
+ widget: "Array",
152
+ },
153
+ config: {
154
+ layout: 12,
155
+ main: {
156
+ label: "Layout",
157
+ childElementLabel: "Layout",
134
158
  },
159
+ style: {
160
+ marginLeft: "-24px",
161
+ marginBottom: "24px !important",
162
+ labelStyle: {
163
+ marginLeft: "24px",
164
+ },
165
+ detailsStyle: {
166
+ marginLeft: "24px",
167
+ }
168
+ }
135
169
  },
136
- },
137
- ],
138
- };
139
-
140
- export const OptionArray: any = {
141
- type: "Control",
142
- scope: "#/properties/value",
143
- layout: 11.5,
144
- options: {
145
- detail: {
146
- type: "HorizontalLayout",
147
170
  elements: [
148
171
  {
149
172
  type: "Control",
150
- scope: "#/properties/label",
173
+ scope: "#/properties/key",
151
174
  options: {
152
175
  widget: "SelectInputField",
153
176
  },
154
177
  config: {
155
178
  layout: { xs: 6, sm: 6, md: 4, lg: 4 },
156
179
  main: {
157
- label: "Label",
180
+ label: "Screen Size",
181
+
158
182
  },
159
183
  },
160
184
  },
@@ -169,29 +193,84 @@ export const OptionArray: any = {
169
193
  layout: { xs: 6, sm: 6, md: 4, lg: 4 },
170
194
  main: {
171
195
  label: "Value",
172
- helperText: 'Number should be in range of 0 to 12',
173
- errorMessage: "Number Can't be greater than 12 and can't be less than 0.",
196
+ type:"number",
197
+ // freeSolo:true,
198
+ helperText:'Number should be in range of 0 to 12',
199
+ errorMessage:"Number Can't be greater than 12 and can't be less than 0.",
200
+
174
201
  },
175
202
  },
176
203
  },
204
+ {
205
+ type: "Control",
206
+ scope: "#/properties/proc",
207
+ config: {
208
+ layout: { xs: 0, sm: 0, md: 4, lg: 4 },
209
+ },
210
+ options: {
211
+ widget: "EmptyBox",
212
+ },
213
+ },
177
214
  ],
178
215
  },
179
- },
216
+ ],
180
217
  };
181
218
 
182
- export const OptionArraySchema = {
183
- value: {
184
- type: "array",
185
- items: {
186
- type: "object",
187
- properties: {
188
- label: {
189
- type: "string",
190
- },
191
- value: {
192
- type: "string",
193
- },
194
- },
195
- },
196
- },
197
- };
219
+ // export const OptionArray: any = {
220
+ // type: "Control",
221
+ // scope: "#/properties/value",
222
+ // layout: 11.5,
223
+ // options: {
224
+ // detail: {
225
+ // type: "HorizontalLayout",
226
+ // elements: [
227
+ // {
228
+ // type: "Control",
229
+ // scope: "#/properties/label",
230
+ // options: {
231
+ // widget: "SelectInputField",
232
+ // },
233
+ // config: {
234
+ // layout: { xs: 6, sm: 6, md: 4, lg: 4 },
235
+ // main: {
236
+ // label: "Label",
237
+ // },
238
+ // },
239
+ // },
240
+ // {
241
+ // type: "Control",
242
+ // scope: "#/properties/value",
243
+
244
+ // options: {
245
+ // widget: "InputField",
246
+ // },
247
+ // config: {
248
+ // layout: { xs: 6, sm: 6, md: 4, lg: 4 },
249
+ // main: {
250
+ // label: "Value",
251
+ // helperText: 'Number should be in range of 0 to 12',
252
+ // errorMessage: "Number Can't be greater than 12 and can't be less than 0.",
253
+ // },
254
+ // },
255
+ // },
256
+ // ],
257
+ // },
258
+ // },
259
+ // };
260
+
261
+ // export const OptionArraySchema = {
262
+ // value: {
263
+ // type: "array",
264
+ // items: {
265
+ // type: "object",
266
+ // properties: {
267
+ // label: {
268
+ // type: "string",
269
+ // },
270
+ // value: {
271
+ // type: "string",
272
+ // },
273
+ // },
274
+ // },
275
+ // },
276
+ // };
package/src/impaktapps-ui-builder/builder/build/uischema/eventSection.ts CHANGED
@@ -16,21 +16,25 @@ export const EventSection = (theme)=>{
16
16
  widget: {
17
17
  type: "Control",
18
18
  scope: "#/properties/New_Record",
19
-
20
19
  options: {
21
20
  widget: "IconButton",
22
21
  },
23
22
  config: {
24
23
  main: {
25
- color: "info",
26
24
  onClick: "eventAddHandler",
27
25
  size: "small",
28
- icon: "AddIcon",
29
- iconLabel: "Add New",
26
+ icon: "TableAddIcon",
27
+ iconLabel: "Add",
30
28
  styleDefault: true,
31
29
  },
32
30
  style: {
33
31
  mt: "6px",
32
+ color: "inherit",
33
+ fill: "inherit",
34
+ "&:hover": {
35
+ color: "inherit",
36
+ fill: "inherit",
37
+ }
34
38
  },
35
39
  },
36
40
  }
@@ -45,15 +49,20 @@ export const EventSection = (theme)=>{
45
49
  },
46
50
  config: {
47
51
  main: {
48
- // color: "info",
49
52
  onClick: "copyPasteElement",
50
53
  size: "small",
51
- icon: "PasteIcon",
54
+ icon: "TablePaste",
52
55
  iconLabel: "Paste",
53
56
  styleDefault: true,
54
57
  },
55
58
  style: {
56
59
  mt: "6px",
60
+ color: "inherit",
61
+ fill: "inherit",
62
+ "&:hover": {
63
+ color: "inherit",
64
+ fill: "inherit",
65
+ }
57
66
  },
58
67
  },
59
68
  }
@@ -70,16 +79,21 @@ export const EventSection = (theme)=>{
70
79
 
71
80
  {
72
81
  accessorKey: "eventType",
73
- header: "Event Type",
82
+ header: "Event's Type",
83
+ type: "string",
84
+ size: 300,
74
85
  },
75
86
  {
76
87
  accessorKey: "Handler",
77
88
  header: "Handler",
89
+ type: "string",
90
+ size: 200,
78
91
  },
79
92
  {
80
93
  accessorKey: "Edit_Approve_Records",
81
- header: "Edit Widget",
82
-
94
+ header: "Edit",
95
+ size: 150,
96
+ type: "action",
83
97
  widget: {
84
98
  type: "Control",
85
99
  scope: "#/properties/Edit_Records",
@@ -88,14 +102,16 @@ export const EventSection = (theme)=>{
88
102
  },
89
103
  config: {
90
104
  main: {
91
- color: "info",
92
105
  size: "small",
93
- icon: "EditIcon",
106
+ icon: "TableEditIcon",
94
107
  tooltipMessage: "Edit This Record",
95
108
  onClick: "eventEditHandler",
96
109
  },
97
110
  style: {
98
- color: theme.palette.primary.main,
111
+ fill: theme.palette.primary.main,
112
+ "& :hover": {
113
+ fill: theme.palette.primary.dark,
114
+ },
99
115
  },
100
116
  },
101
117
  },
@@ -103,7 +119,8 @@ export const EventSection = (theme)=>{
103
119
  {
104
120
  accessorKey: "Reject_Records",
105
121
  header: "Delete",
106
-
122
+ size: 150,
123
+ type: "action",
107
124
  widget: {
108
125
  type: "Control",
109
126
  scope: "#/properties/RejectButton",
@@ -113,18 +130,24 @@ export const EventSection = (theme)=>{
113
130
  },
114
131
  config: {
115
132
  main: {
116
- icon: "RejectIcon",
117
- color: "error",
133
+ icon: "Bin",
118
134
  tooltipMessage: "Reject This Record",
119
135
  onClick: "deletePopUpEvent",
120
136
  },
137
+ style: {
138
+ fill: theme.palette.primary.main,
139
+ "& :hover": {
140
+ fill: theme.palette.primary.dark,
141
+ },
142
+ },
121
143
  },
122
144
  },
123
145
  },
124
146
  {
125
147
  header: "Copy",
126
148
  field: "Copy_Event",
127
- flex: 1,
149
+ size: 150,
150
+ type: "action",
128
151
  widget: {
129
152
  type: "Control",
130
153
  scope: "#/properties/Copy_Event",
@@ -134,7 +157,6 @@ export const EventSection = (theme)=>{
134
157
  config: {
135
158
  main: {
136
159
  icon: "FileCopyIcon",
137
- // color: "error",
138
160
  onClick: "copyPasteElement",
139
161
  tooltipMessage: "Reject This Record",
140
162
  styleDefault: true,
package/src/impaktapps-ui-builder/builder/build/uischema/refresh.ts CHANGED
@@ -6,56 +6,56 @@ export const refreshSectionUiSchema = {
6
6
  {
7
7
  type: "Control",
8
8
  scope: "#/properties/refreshElements",
9
- layout: 11.5,
10
9
  options: {
11
- detail: {
12
- type: "HorizontalLayout",
13
- elements: [
14
- {
15
- type: "Control",
16
- scope: "#/properties/value",
17
-
18
- options: {
19
- widget: "InputField",
20
- },
21
- config: {
22
- layout: { xs: 12, sm: 6, md: 4, lg: 4 },
23
- main: {
24
- label: "Value",
25
- },
26
- },
27
- },
28
- {
29
- type: "Control",
30
- scope: "#/properties/emptyBox",
10
+ widget: "Array",
11
+ },
12
+ config: {
13
+ layout: 12,
14
+ main: {
15
+ label: "Refresh Elements",
16
+ childElementLabel: "Refresh Elements",
17
+ },
18
+ style: {
19
+ marginLeft: "-24px",
20
+ marginBottom: "24px !important",
21
+ labelStyle: {
22
+ marginLeft: "24px",
23
+ },
24
+ detailsStyle: {
25
+ marginLeft: "24px",
26
+ }
27
+ }
28
+ },
29
+ elements: [
30
+ {
31
+ type: "Control",
32
+ scope: "#/properties/value",
31
33
 
32
- options: {
33
- widget: "EmptyBox",
34
- },
35
- config: {
36
- layout: { xs: 0, sm: 6, md: 4, lg: 4 },
37
- main: {
38
-
39
- },
40
- },
34
+ options: {
35
+ widget: "InputField",
36
+ },
37
+ config: {
38
+ layout: { xs: 6, sm: 6, md: 4, lg: 4 },
39
+ main: {
40
+ label: "Value",
41
41
  },
42
- {
43
- type: "Control",
44
- scope: "#/properties/emptyBox",
42
+ },
43
+ },
44
+ {
45
+ type: "Control",
46
+ scope: "#/properties/emptyBox",
45
47
 
46
- options: {
47
- widget: "EmptyBox",
48
- },
49
- config: {
50
- layout: { xs: 0, sm: 0, md: 4, lg: 4 },
51
- main: {
52
-
53
- },
54
- },
48
+ options: {
49
+ widget: "EmptyBox",
50
+ },
51
+ config: {
52
+ layout: { xs: 6, sm: 6, md: 8, lg: 8 },
53
+ main: {
54
+
55
55
  },
56
- ],
56
+ },
57
57
  },
58
- },
58
+ ],
59
59
  }
60
60
  ],
61
61
  };
package/src/impaktapps-ui-builder/builder/build/uischema/styleSection.ts CHANGED
@@ -1,5 +1,11 @@
1
1
  export const StyleSection = {
2
- type: "HorizontalLayout",
2
+ type: "WrapperLayout",
3
+ config: {
4
+ main: {
5
+ label: " ",
6
+ gap: "8px"
7
+ }
8
+ },
3
9
  elements: [
4
10
  {
5
11
  type: "Control",
@@ -15,18 +21,8 @@ export const StyleSection = {
15
21
  md: 12,
16
22
  lg: 12,
17
23
  },
18
- style:{
19
- containerStyle:{
20
- // background:"gray"
21
- borderRadius:"20px"
22
- },
23
- headerContainerStyle:{
24
-
25
- },
26
- textAreaStyle:{
27
- borderRadius:"20px",
28
- padding:"20px"
29
- }
24
+ style: {
25
+ "& .MuiFormLabel-root:not(.MuiInputLabel-shrink)": {},
30
26
  },
31
27
  main: {
32
28
  heading:"JSON Style",