impaktapps-ui-builder 0.0.382-alpha.60 → 0.0.382-alpha.6000

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 (48) hide show
  1. package/dist/impaktapps-ui-builder.es.js +1839 -1272
  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/buildBasicUiSchema.d.ts +0 -1
  6. package/dist/src/impaktapps-ui-builder/builder/build/uischema/apiSection.d.ts +2 -35
  7. package/dist/src/impaktapps-ui-builder/builder/build/uischema/card.d.ts +12 -10
  8. package/dist/src/impaktapps-ui-builder/builder/build/uischema/coreSection.d.ts +18 -15
  9. package/dist/src/impaktapps-ui-builder/builder/build/uischema/eventSection.d.ts +121 -70
  10. package/dist/src/impaktapps-ui-builder/builder/build/uischema/graph.d.ts +108 -1
  11. package/dist/src/impaktapps-ui-builder/builder/build/uischema/leaderBoard.d.ts +8 -5
  12. package/dist/src/impaktapps-ui-builder/builder/build/uischema/tableSection.d.ts +102 -53
  13. package/dist/src/impaktapps-ui-builder/builder/build/uischema/validationSections.d.ts +2 -17
  14. package/dist/src/impaktapps-ui-builder/builder/build/uischema/valueTab.d.ts +2 -17
  15. package/dist/src/impaktapps-ui-builder/builder/services/component.d.ts +4 -2
  16. package/dist/src/impaktapps-ui-builder/builder/services/event.d.ts +3 -2
  17. package/dist/src/impaktapps-ui-builder/builder/services/pageMaster.d.ts +3 -1
  18. package/dist/src/impaktapps-ui-builder/runtime/services/service.d.ts +0 -1
  19. package/package.json +1 -1
  20. package/src/impaktapps-ui-builder/builder/build/buildBasicUiSchema.ts +0 -1
  21. package/src/impaktapps-ui-builder/builder/build/buildHorizontalBarGraph.ts +26 -30
  22. package/src/impaktapps-ui-builder/builder/build/buildPieGraph.ts +21 -30
  23. package/src/impaktapps-ui-builder/builder/build/buildStackBarGraph.ts +6 -6
  24. package/src/impaktapps-ui-builder/builder/build/buildWrapperSection.ts +1 -3
  25. package/src/impaktapps-ui-builder/builder/build/uischema/apiSection.ts +27 -50
  26. package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts +49 -30
  27. package/src/impaktapps-ui-builder/builder/build/uischema/card.ts +10 -9
  28. package/src/impaktapps-ui-builder/builder/build/uischema/coreSection.ts +36 -16
  29. package/src/impaktapps-ui-builder/builder/build/uischema/dateInputField.ts +6 -1
  30. package/src/impaktapps-ui-builder/builder/build/uischema/emptyBox.ts +1 -1
  31. package/src/impaktapps-ui-builder/builder/build/uischema/eventSection.ts +125 -99
  32. package/src/impaktapps-ui-builder/builder/build/uischema/graph.ts +108 -108
  33. package/src/impaktapps-ui-builder/builder/build/uischema/leaderBoard.ts +9 -5
  34. package/src/impaktapps-ui-builder/builder/build/uischema/multiSelect.ts +1 -1
  35. package/src/impaktapps-ui-builder/builder/build/uischema/refresh.ts +12 -2
  36. package/src/impaktapps-ui-builder/builder/build/uischema/selectInputField.ts +6 -1
  37. package/src/impaktapps-ui-builder/builder/build/uischema/tableSection.ts +58 -84
  38. package/src/impaktapps-ui-builder/builder/build/uischema/textInputField.ts +6 -1
  39. package/src/impaktapps-ui-builder/builder/build/uischema/validationSections.ts +12 -12
  40. package/src/impaktapps-ui-builder/builder/build/uischema/valueTab.ts +12 -12
  41. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/uiSchema.ts +440 -448
  42. package/src/impaktapps-ui-builder/builder/elements/UiSchema/PageMaster/uiSchema.ts +515 -456
  43. package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/uiSchema.ts +367 -520
  44. package/src/impaktapps-ui-builder/builder/services/component.ts +25 -7
  45. package/src/impaktapps-ui-builder/builder/services/event.ts +17 -9
  46. package/src/impaktapps-ui-builder/builder/services/pageMaster.ts +19 -3
  47. package/src/impaktapps-ui-builder/runtime/services/events.ts +4 -14
  48. package/src/impaktapps-ui-builder/runtime/services/service.ts +0 -5
@@ -7,72 +7,72 @@ export const BarGraph = {
7
7
 
8
8
  config: {
9
9
  main: {
10
- // header: "Bar Graph",
11
- // bottomLabel: "Name of Employe",
12
- // numTicks: 6,
13
- // leftLabel: "Value in lakhs",
14
- // axisLeft: true,
15
- // axisBottom: true,
10
+ header: "Bar Graph",
11
+ bottomLabel: "Name of Employe",
12
+ numTicks: 6,
13
+ leftLabel: "Value in lakhs",
14
+ axisLeft: true,
15
+ axisBottom: true,
16
16
 
17
- // hideTicks: false,
18
- // hideLeftAxisLine: false,
19
- // hideBottomAxisLine: false,
20
- // bottomAxisWidth: "10px",
21
- // legend: {
22
- // labelColor: "green",
23
- // legendTitle: "",
24
- // direction: "row",
25
- // align: "none",
17
+ hideTicks: false,
18
+ hideLeftAxisLine: false,
19
+ hideBottomAxisLine: false,
20
+ bottomAxisWidth: "10px",
21
+ legend: {
22
+ labelColor: "green",
23
+ legendTitle: "",
24
+ direction: "row",
25
+ align: "none",
26
26
 
27
- // },
28
27
  },
29
- // style: {
30
- // containerStyle: {
31
- // // width:"100%",
32
- // // height:"450",
28
+ },
29
+ style: {
30
+ containerStyle: {
31
+ width:"100%",
32
+ height:300,
33
33
 
34
- // },
35
- // headerStyle: {
36
- // // color:"white"
37
- // },
38
- // tooltipStyle: {
34
+ },
35
+ headerStyle: {
36
+ // color:"white"
37
+ },
38
+ tooltipStyle: {
39
39
 
40
40
 
41
- // },
42
- // // labelStyle: { margin:{left:80,bottom:20},
43
- // // leftLabelOffset: 50,
44
- // // bottomLabelOffset:10
45
- // // },
46
- // barStyle: {
47
- // // color:{
48
- // // firstBarColor:"#6c5efb",
49
- // // secondBarColor:"#3f51b5"
50
- // // "#6c5efb"#3f51b5
51
- // // secondColor:"#3e50b3"
52
- // // }
53
- // },
54
- // legendStyle: {
55
- // legend: {
56
- // // lineHeight: "0.9em",
57
- // // fontSize: "8px",
58
- // // fontFamily: "arial",
59
- // // padding: "10px 10px",
60
- // // width:"30%",
61
- // // display:"flex",
62
- // // justifyContent:"center",
63
- // // border: "1px solid rgba(255, 255, 255, 0.3)",
64
- // // borderRadius: " 8px",
65
- // // marginRight: "auto",
41
+ },
42
+ labelStyle: { margin:{left:80,bottom:20},
43
+ leftLabelOffset: 50,
44
+ bottomLabelOffset:10
45
+ },
46
+ barStyle: {
47
+ color:{
48
+ firstBarColor:"#6c5efb",
49
+ secondBarColor:"#3f51b5"
50
+ // "#6c5efb"#3f51b5
51
+ // secondColor:"#3e50b3"
52
+ }
53
+ },
54
+ legendStyle: {
55
+ legend: {
56
+ lineHeight: "0.9em",
57
+ fontSize: "8px",
58
+ fontFamily: "arial",
59
+ padding: "10px 10px",
60
+ width:"30%",
61
+ display:"flex",
62
+ justifyContent:"center",
63
+ border: "1px solid rgba(255, 255, 255, 0.3)",
64
+ borderRadius: " 8px",
65
+ marginRight: "auto",
66
66
 
67
- // },
68
- // legendTitle: {
69
- // // fontSize: "10px",
70
- // // marginBottom: "10px",
71
- // // fontWeight: "100",
67
+ },
68
+ legendTitle: {
69
+ fontSize: "10px",
70
+ marginBottom: "10px",
71
+ fontWeight: "100",
72
72
 
73
- // },
74
- // },
75
- // },
73
+ },
74
+ },
75
+ },
76
76
  },
77
77
  };
78
78
 
@@ -84,39 +84,39 @@ export const PieGraph = {
84
84
  },
85
85
  config: {
86
86
  main: {
87
- // header: "Incentive Branch category wise",
87
+ header: "Incentive Branch category wise",
88
88
  type: "PieGraph",
89
- // bottomLabel: "Name of Employe",
90
- // leftLabel: "Value",
89
+ bottomLabel: "Name of Employe",
90
+ leftLabel: "Value",
91
91
  // tooltipDataKey: ["HDFC", "SBI", "Kotak","Sbi"],
92
- // axisLeft: true,
93
- // axisBottom: true,
94
- // legendAvailable: true,
95
- // legend: {
96
- // labelColor: "green",
97
- // legendTitle: "Branches",
98
- // direction: "row",
99
- // align: "right",
100
- // },
92
+ axisLeft: true,
93
+ axisBottom: true,
94
+ legendAvailable: true,
95
+ legend: {
96
+ labelColor: "green",
97
+ legendTitle: "Branches",
98
+ direction: "row",
99
+ align: "right",
100
+ },
101
101
  },
102
102
 
103
- // style: {
104
- // containerStyle: {
105
- // height:"340"
106
- // },
107
- // headerStyle: {},
108
- // tooltipStyle: {
109
- // // width: "100%",
110
- // backgroundColor:"black",
111
- // width:"80px"
112
- // },
113
- // labelStyle: {},
114
- // legendStyle: {
115
- // legend: {},
116
- // legendTitle: {},
117
- // },
118
- // pieStyle: {},
119
- // },
103
+ style: {
104
+ containerStyle: {
105
+ height:"340"
106
+ },
107
+ headerStyle: {},
108
+ tooltipStyle: {
109
+ // width: "100%",
110
+ backgroundColor:"black",
111
+ width:"80px"
112
+ },
113
+ labelStyle: {},
114
+ legendStyle: {
115
+ legend: {},
116
+ legendTitle: {},
117
+ },
118
+ pieStyle: {},
119
+ },
120
120
  },
121
121
  };
122
122
  export const LineGraph = {
@@ -164,28 +164,28 @@ export const HorizontalBarGraph = {
164
164
  },
165
165
  config: {
166
166
  main: {
167
- // header: " ",
167
+ header: " ",
168
168
  type: "HorizontalBarGraph",
169
- // bottomLabel: " ",
170
- // leftLabel: "Value",
171
- // axisLeft: false,
172
- // axisBottom: true,
173
- // hideBottomTicks: false,
174
- // hideLeftTicks: false,
175
- // hideLeftAxisLine: true,
176
- // hideBottomAxisLine: false,
177
- // bottomAxisWidth: "10px",
169
+ bottomLabel: " ",
170
+ leftLabel: "Value",
171
+ axisLeft: false,
172
+ axisBottom: true,
173
+ hideBottomTicks: false,
174
+ hideLeftTicks: false,
175
+ hideLeftAxisLine: true,
176
+ hideBottomAxisLine: false,
177
+ bottomAxisWidth: "10px",
178
+ },
179
+ style: {
180
+ containerStyle: {
181
+ width:"100%"
182
+ },
183
+ headerStyle: {},
184
+ tooltipStyle: {},
185
+ labelStyle: {},
186
+ barStyle: {
187
+ color: "#6c5efb",
188
+ },
178
189
  },
179
- // style: {
180
- // containerStyle: {
181
- // width:"100%"
182
- // },
183
- // headerStyle: {},
184
- // tooltipStyle: {},
185
- // labelStyle: {},
186
- // barStyle: {
187
- // color: "#6c5efb",
188
- // },
189
- // },
190
190
  },
191
191
  };
@@ -7,9 +7,13 @@ export default {
7
7
  label: "LeaderBoard",
8
8
  divider: true,
9
9
  },
10
- style:{wrapperStyle:{
11
- height: {xs:850,sm:1000}
12
- }},
10
+ style: {
11
+ wrapperStyle: {
12
+ display: "flex",
13
+ gap: "10px",
14
+
15
+ }
16
+ },
13
17
  wrapperStyle: {
14
18
  position: "relative",
15
19
  width: "100%",
@@ -339,12 +343,12 @@ export default {
339
343
  fontWeight: 900,
340
344
  background: "rgb(179, 198, 255)"
341
345
  },
342
- position: "absolute",
343
346
  top: { xs: "300px", sm: "300px", md: "390px", lg: "390px" },
344
347
  // top:"390px",
345
348
  border: "2px solid rgb(179, 198, 255)",
346
349
  width: "95%",
347
- left: "2.5%"
350
+ left: "2.5%",
351
+ margin: "auto"
348
352
 
349
353
  },
350
354
 
@@ -6,7 +6,7 @@ export default {
6
6
  widget: "MultipleSelect",
7
7
  },
8
8
  config: {
9
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
9
+ layout: { xs: 11, sm: 11, md: 5.5, lg: 5.5 },
10
10
  main: {
11
11
  label: "",
12
12
  type: "text",
@@ -19,7 +19,12 @@ export const refreshSectionUiSchema = {
19
19
  widget: "InputField",
20
20
  },
21
21
  config: {
22
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
22
+ layout: {
23
+ xs: 11,
24
+ sm: 11,
25
+ md: 5.5,
26
+ lg: 5.5,
27
+ },
23
28
  main: {
24
29
  label: "Value",
25
30
  },
@@ -33,7 +38,12 @@ export const refreshSectionUiSchema = {
33
38
  widget: "EmptyBox",
34
39
  },
35
40
  config: {
36
- layout: { xs: 0, sm: 4, md: 4, lg: 4 },
41
+ layout: {
42
+ xs: 11,
43
+ sm: 11,
44
+ md: 5.5,
45
+ lg: 5.5,
46
+ },
37
47
  main: {
38
48
 
39
49
  },
@@ -6,7 +6,12 @@ export default {
6
6
  widget: "SelectInputField",
7
7
  },
8
8
  config: {
9
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
9
+ "layout": {
10
+ "xs": 11,
11
+ "sm": 11,
12
+ "md": 5.5,
13
+ "lg": 5.5
14
+ },
10
15
  main: {
11
16
  label: "",
12
17
  type: "text",
@@ -1,58 +1,58 @@
1
1
  export const TableSection = {
2
2
  type: "HorizontalLayout",
3
3
  elements: [
4
- // {
5
- // type: "WrapperLayout",
6
- // config: {
7
- // main: {
8
- // // label: "Table Columns",
9
- // // divider: true,
10
- // },
11
- // wrapperStyle: {
12
- // border:"1px solid gray"
13
- // },
14
- // },
15
- // elements: [
16
- // {
17
- // type: "Control",
18
- // scope: "#/properties/programType",
19
-
20
- // options: {
21
- // widget: "Box",
22
- // },
23
- // config: {
24
- // layout: 8,
25
- // main: {
26
- // heading: "Components Table",
27
- // },
28
- // style: {
29
- // fontFamily: "Roboto",
30
- // fontWeight: "500",
31
- // paddingLeft:"-10px",
32
- // fontSize: "20px",},
33
- // },
34
- // },
35
- // {
36
- // type: "Control",
37
- // scope: "#/properties/Back_Button",
38
-
39
- // options: {
40
- // widget: "IconButton",
41
- // },
42
- // config: {
43
- // layout: 3,
44
- // main: {
45
- // icon: "AddIcon",
46
- // styleDefault: true,
47
- // size: "small",
48
- // onClick: "widgetAddClickHandler",
49
- // tooltipMessage: "Add New",
50
- // },
51
- // style: {
52
- // float: "right",
53
- // },
54
- // },
55
- // },
4
+ {
5
+ type: "WrapperLayout",
6
+ config: {
7
+ main: {
8
+ // label: "Table Columns",
9
+ // divider: true,
10
+ },
11
+ wrapperStyle: {
12
+ border:"1px solid gray"
13
+ },
14
+ },
15
+ elements: [
16
+ {
17
+ type: "Control",
18
+ scope: "#/properties/programType",
19
+
20
+ options: {
21
+ widget: "Box",
22
+ },
23
+ config: {
24
+ layout: 8,
25
+ main: {
26
+ heading: "Components Table",
27
+ },
28
+ style: {
29
+ fontFamily: "Roboto",
30
+ fontWeight: "500",
31
+ paddingLeft:"-10px",
32
+ fontSize: "20px",},
33
+ },
34
+ },
35
+ {
36
+ type: "Control",
37
+ scope: "#/properties/Back_Button",
38
+
39
+ options: {
40
+ widget: "IconButton",
41
+ },
42
+ config: {
43
+ layout: 3,
44
+ main: {
45
+ icon: "AddIcon",
46
+ styleDefault: true,
47
+ size: "small",
48
+ onClick: "widgetAddClickHandler",
49
+ tooltipMessage: "Add New",
50
+ },
51
+ style: {
52
+ float: "right",
53
+ },
54
+ },
55
+ },
56
56
  {
57
57
  type: "Control",
58
58
  scope: "#/properties/elements",
@@ -61,40 +61,13 @@ export const TableSection = {
61
61
  },
62
62
  config: {
63
63
  main: {
64
- headerIcons: {
65
- elements: [
66
- {
67
- widget: {
68
- type: "Control",
69
- scope: "#/properties/New_Record",
70
-
71
- options: {
72
- widget: "IconButton",
73
- },
74
- config: {
75
- main: {
76
- color: "info",
77
- onClick: "widgetAddClickHandler",
78
- size: "small",
79
- icon: "AddIcon",
80
- iconLabel: "Add New",
81
- styleDefault: true,
82
- },
83
- style: {
84
- mt: "6px",
85
- },
86
- },
87
- }
88
- },
89
- ]
90
- },
91
64
  disableAction: true,
92
65
  disableSelection: true,
93
66
  enableDrag: true,
94
-
67
+
95
68
  },
96
69
  },
97
- elements: [
70
+ elements:[
98
71
  {
99
72
  accessorKey: "name",
100
73
  header: "Name"
@@ -137,16 +110,17 @@ export const TableSection = {
137
110
  main: {
138
111
  icon: "RejectIcon",
139
112
  color: "error",
140
- onClick: "deleteComponents",
113
+ onClick: "deletePopUpComponent",
141
114
  tooltipMessage: "Reject This Record",
142
115
  },
143
116
  },
144
117
  },
145
118
  }
146
119
  ]
147
- }]
120
+ }
121
+ ]
148
122
  }
149
- // ]}
123
+ ]}
150
124
 
151
125
  export const TableSectionSchema = {
152
126
  columns: {
@@ -6,7 +6,12 @@ export default {
6
6
  widget: "InputField",
7
7
  },
8
8
  config: {
9
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
9
+ layout: {
10
+ xs: 11,
11
+ sm: 11,
12
+ md: 5.5,
13
+ lg: 5.5,
14
+ },
10
15
  main: {
11
16
  label: "",
12
17
  },
@@ -18,7 +18,12 @@ export const ValidationSection = {
18
18
  widget: "SelectInputField",
19
19
  },
20
20
  config: {
21
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
21
+ layout: {
22
+ xs: 11,
23
+ sm: 11,
24
+ md: 5.5,
25
+ lg: 5.5,
26
+ },
22
27
  main: {
23
28
  label: "Validation Type",
24
29
  },
@@ -32,21 +37,16 @@ export const ValidationSection = {
32
37
  widget: "InputField",
33
38
  },
34
39
  config: {
35
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
40
+ layout: {
41
+ xs: 11,
42
+ sm: 11,
43
+ md: 5.5,
44
+ lg: 5.5,
45
+ },
36
46
  main: {
37
47
  label: "Validation Value",
38
48
  },
39
49
  },
40
- },
41
- {
42
- type: "Control",
43
- scope: "#/properties/emptyBox",
44
- options: {
45
- widget: "EmptyBox"
46
- },
47
- config: {
48
- layout: {xs: 0, sm: 4}
49
- }
50
50
  }
51
51
  ],
52
52
  },
@@ -18,7 +18,12 @@ export const ValueTab = {
18
18
  widget: "InputField",
19
19
  },
20
20
  config: {
21
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
21
+ layout: {
22
+ xs: 11,
23
+ sm: 11,
24
+ md: 5.5,
25
+ lg: 5.5,
26
+ },
22
27
  main: {
23
28
  label: "Label",
24
29
  },
@@ -32,23 +37,18 @@ export const ValueTab = {
32
37
  widget: "InputField",
33
38
  },
34
39
  config: {
35
- layout: { xs: 11, sm: 4, md: 4, lg: 4 },
40
+ layout: {
41
+ xs: 11,
42
+ sm: 11,
43
+ md: 5.5,
44
+ lg: 5.5,
45
+ },
36
46
  main: {
37
47
  label: "Value",
38
48
 
39
49
  },
40
50
  },
41
51
  },
42
- {
43
- type: "Control",
44
- scope: "#/properties/emptyBox",
45
- options: {
46
- widget: "EmptyBox"
47
- },
48
- config: {
49
- layout: { xs: 0, sm: 4, md: 4, lg: 4 },
50
- }
51
- }
52
52
  ],
53
53
  },
54
54
  },