impaktapps-ui-builder 0.0.382460 → 1.0.1-alpha.1

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 (49) hide show
  1. package/dist/impaktapps-ui-builder.es.js +1316 -1121
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +16 -16
  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/apiSection.d.ts +62 -59
  7. package/dist/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.d.ts +17 -21
  8. package/dist/src/impaktapps-ui-builder/builder/build/uischema/card.d.ts +10 -2
  9. package/dist/src/impaktapps-ui-builder/builder/build/uischema/coreSection.d.ts +23 -32
  10. package/dist/src/impaktapps-ui-builder/builder/build/uischema/eventSection.d.ts +26 -33
  11. package/dist/src/impaktapps-ui-builder/builder/build/uischema/phoneInput.d.ts +20 -0
  12. package/dist/src/impaktapps-ui-builder/builder/build/uischema/refresh.d.ts +52 -38
  13. package/dist/src/impaktapps-ui-builder/builder/build/uischema/styleSection.d.ts +7 -8
  14. package/dist/src/impaktapps-ui-builder/builder/build/uischema/table.d.ts +1 -0
  15. package/dist/src/impaktapps-ui-builder/builder/build/uischema/tableSection.d.ts +29 -33
  16. package/dist/src/impaktapps-ui-builder/builder/build/uischema/validationSections.d.ts +6 -0
  17. package/dist/src/impaktapps-ui-builder/builder/build/uischema/valueTab.d.ts +56 -36
  18. package/dist/src/impaktapps-ui-builder/builder/elements/UiSchema/event/schema.d.ts +6 -0
  19. package/dist/src/impaktapps-ui-builder/builder/services/component.d.ts +2 -0
  20. package/dist/src/impaktapps-ui-builder/builder/services/event.d.ts +8 -0
  21. package/dist/src/impaktapps-ui-builder/builder/services/utils.d.ts +1 -1
  22. package/package.json +1 -1
  23. package/src/impaktapps-ui-builder/builder/build/buildAadharCard.ts +2 -0
  24. package/src/impaktapps-ui-builder/builder/build/buildConfig.ts +6 -1
  25. package/src/impaktapps-ui-builder/builder/build/buildPhoneInput.ts +26 -0
  26. package/src/impaktapps-ui-builder/builder/build/buildText.ts +21 -18
  27. package/src/impaktapps-ui-builder/builder/build/buildUiSchema.ts +42 -29
  28. package/src/impaktapps-ui-builder/builder/build/uischema/apiSection.ts +111 -96
  29. package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts +113 -61
  30. package/src/impaktapps-ui-builder/builder/build/uischema/card.ts +8 -4
  31. package/src/impaktapps-ui-builder/builder/build/uischema/coreSection.ts +108 -88
  32. package/src/impaktapps-ui-builder/builder/build/uischema/eventSection.ts +39 -17
  33. package/src/impaktapps-ui-builder/builder/build/uischema/phoneInput.ts +16 -0
  34. package/src/impaktapps-ui-builder/builder/build/uischema/refresh.ts +44 -44
  35. package/src/impaktapps-ui-builder/builder/build/uischema/styleSection.ts +9 -13
  36. package/src/impaktapps-ui-builder/builder/build/uischema/table.ts +1 -0
  37. package/src/impaktapps-ui-builder/builder/build/uischema/tableSection.ts +40 -18
  38. package/src/impaktapps-ui-builder/builder/build/uischema/validationSections.ts +73 -2
  39. package/src/impaktapps-ui-builder/builder/build/uischema/valueTab.ts +63 -45
  40. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/schema.ts +51 -44
  41. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +232 -309
  42. package/src/impaktapps-ui-builder/builder/elements/UiSchema/PageMaster/uiSchema.ts +166 -224
  43. package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/schema.ts +15 -12
  44. package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/uiSchema.ts +147 -205
  45. package/src/impaktapps-ui-builder/builder/services/component.ts +228 -57
  46. package/src/impaktapps-ui-builder/builder/services/event.ts +182 -66
  47. package/src/impaktapps-ui-builder/builder/services/utils.ts +2 -2
  48. package/src/impaktapps-ui-builder/runtime/services/events.ts +32 -21
  49. package/src/impaktapps-ui-builder/runtime/services/service.ts +18 -29
@@ -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,41 +55,32 @@ 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
- },
76
+ // },
77
+ // },
78
+ // },
61
79
  {
62
80
  type: "Control",
63
81
  scope: "#/properties/proc",
64
82
  config: {
65
- layout: { xs: 0, sm: 0, md: 4, lg: 4 },
66
- },
67
- options: {
68
- widget: "EmptyBox",
69
- },
70
- },
71
- {
72
- type: "Control",
73
- scope: "#/properties/proc",
74
- 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",
@@ -134,64 +142,76 @@ export const CoreSection = {
134
142
  },
135
143
  },
136
144
  },
137
- ],
138
- };
139
145
 
140
- export const OptionArray: any = {
141
- type: "Control",
142
- scope: "#/properties/value",
143
- layout: 11.5,
144
- options: {
145
- detail: {
146
- type: "HorizontalLayout",
147
- elements: [
148
- {
149
- type: "Control",
150
- scope: "#/properties/label",
151
- options: {
152
- widget: "SelectInputField",
153
- },
154
- config: {
155
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
156
- main: {
157
- label: "Label",
158
- },
159
- },
160
- },
161
- {
162
- type: "Control",
163
- scope: "#/properties/value",
146
+
147
+ // {
148
+ // type: "Control",
149
+ // scope: "#/properties/layout",
150
+ // options: {
151
+ // widget: "Array",
152
+ // },
153
+ // config: {
154
+ // layout: 12,
155
+ // main: {
156
+ // label: "Layout",
157
+ // childElementLabel: "Layout",
158
+ // },
159
+ // style: {
160
+ // marginLeft: "-24px",
161
+ // marginBottom: "24px !important",
162
+ // labelStyle: {
163
+ // marginLeft: "24px",
164
+ // },
165
+ // detailsStyle: {
166
+ // marginLeft: "24px",
167
+ // }
168
+ // }
169
+ // },
170
+ // elements: [
171
+ // {
172
+ // type: "Control",
173
+ // scope: "#/properties/key",
174
+ // options: {
175
+ // widget: "SelectInputField",
176
+ // },
177
+ // config: {
178
+ // layout: { xs: 6, sm: 6, md: 4, lg: 4 },
179
+ // main: {
180
+ // label: "Screen Size",
181
+
182
+ // },
183
+ // },
184
+ // },
185
+ // {
186
+ // type: "Control",
187
+ // scope: "#/properties/value",
164
188
 
165
- options: {
166
- widget: "InputField",
167
- },
168
- config: {
169
- layout: { xs: 6, sm: 6, md: 4, lg: 4 },
170
- main: {
171
- 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.",
174
- },
175
- },
176
- },
177
- ],
178
- },
179
- },
180
- };
181
-
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
- };
189
+ // options: {
190
+ // widget: "InputField",
191
+ // },
192
+ // config: {
193
+ // layout: { xs: 6, sm: 6, md: 4, lg: 4 },
194
+ // main: {
195
+ // label: "Value",
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
+
201
+ // },
202
+ // },
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
+ // },
214
+ // ],
215
+ // },
216
+ ],
217
+ };
@@ -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,
@@ -0,0 +1,16 @@
1
+ const PhoneInput = {
2
+ scope: "#/properties/testPhone",
3
+ type: "Control",
4
+ options: {
5
+ widget: "PhoneInput"
6
+ },
7
+ config: {
8
+ layout: { xs: 6, sm: 6, md: 4, lg: 3 },
9
+ main: {
10
+ defaultCountry: "in",
11
+ label: "Phone"
12
+ }
13
+ }
14
+ };
15
+
16
+ export default PhoneInput;
@@ -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
  };
@@ -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",
@@ -9,6 +9,7 @@ export default {
9
9
  main: {
10
10
  onMount: "onMount",
11
11
  enableExpandAll: true,
12
+ headerIcons:{},
12
13
  allRowData: [],
13
14
  downloadAllData: false,
14
15
  columns: {