impaktapps-ui-builder 0.0.99 → 0.0.100
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/dist/impaktapps-ui-builder.es.js +20 -66
- package/dist/impaktapps-ui-builder.es.js.map +1 -1
- package/dist/impaktapps-ui-builder.umd.js +9 -9
- package/dist/impaktapps-ui-builder.umd.js.map +1 -1
- package/dist/src/impaktapps-ui-builder/builder/build/uischema/graph.d.ts +1 -24
- package/package.json +1 -1
- package/src/impaktapps-ui-builder/builder/build/buildHorizontalBarGraph.ts +0 -16
- package/src/impaktapps-ui-builder/builder/build/buildLineGraph.ts +0 -13
- package/src/impaktapps-ui-builder/builder/build/buildStackBarGraph.ts +0 -14
- package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts +2 -4
- package/src/impaktapps-ui-builder/builder/build/uischema/graph.ts +1 -4
- package/src/impaktapps-ui-builder/runtime/services/events.ts +2 -2
- package/src/impaktapps-ui-builder/runtime/services/service.ts +47 -48
|
@@ -5,12 +5,6 @@ export declare const BarGraph: {
|
|
|
5
5
|
widget: string;
|
|
6
6
|
};
|
|
7
7
|
config: {
|
|
8
|
-
layout: {
|
|
9
|
-
xs: number;
|
|
10
|
-
sm: number;
|
|
11
|
-
md: number;
|
|
12
|
-
lg: number;
|
|
13
|
-
};
|
|
14
8
|
main: {};
|
|
15
9
|
style: {
|
|
16
10
|
containerStyle: {};
|
|
@@ -24,12 +18,6 @@ export declare const PieGraph: {
|
|
|
24
18
|
widget: string;
|
|
25
19
|
};
|
|
26
20
|
config: {
|
|
27
|
-
layout: {
|
|
28
|
-
xs: number;
|
|
29
|
-
sm: number;
|
|
30
|
-
md: number;
|
|
31
|
-
lg: number;
|
|
32
|
-
};
|
|
33
21
|
main: {
|
|
34
22
|
type: string;
|
|
35
23
|
};
|
|
@@ -43,12 +31,7 @@ export declare const LineGraph: {
|
|
|
43
31
|
widget: string;
|
|
44
32
|
};
|
|
45
33
|
config: {
|
|
46
|
-
layout:
|
|
47
|
-
xs: number;
|
|
48
|
-
sm: number;
|
|
49
|
-
md: number;
|
|
50
|
-
lg: number;
|
|
51
|
-
};
|
|
34
|
+
layout: number;
|
|
52
35
|
main: {
|
|
53
36
|
type: string;
|
|
54
37
|
header: string;
|
|
@@ -83,12 +66,6 @@ export declare const HorizontalBarGraph: {
|
|
|
83
66
|
widget: string;
|
|
84
67
|
};
|
|
85
68
|
config: {
|
|
86
|
-
layout: {
|
|
87
|
-
xs: number;
|
|
88
|
-
sm: number;
|
|
89
|
-
md: number;
|
|
90
|
-
lg: number;
|
|
91
|
-
};
|
|
92
69
|
main: {
|
|
93
70
|
type: string;
|
|
94
71
|
};
|
package/package.json
CHANGED
|
@@ -12,12 +12,6 @@ const buildHorizontalBarGraph = (config:any,componentScope:string) => {
|
|
|
12
12
|
horizontalBarGraph.config.main.type = config.graphType;
|
|
13
13
|
horizontalBarGraph.scope = componentScope;
|
|
14
14
|
horizontalBarGraph.config.main.header = config.heading;
|
|
15
|
-
if (config.legendHide) {
|
|
16
|
-
horizontalBarGraph.config.main.legendAvailable = config.legendHide==="YES"?false:true;
|
|
17
|
-
}
|
|
18
|
-
if (config.bottomAxisAngle) {
|
|
19
|
-
horizontalBarGraph.config.main.bottomAxisAngle = config.bottomAxisAngle==="YES"?true:false;
|
|
20
|
-
}
|
|
21
15
|
if (config.barColor) {
|
|
22
16
|
horizontalBarGraph.config.barStyle.color = config.barColor;
|
|
23
17
|
}
|
|
@@ -36,16 +30,6 @@ const buildHorizontalBarGraph = (config:any,componentScope:string) => {
|
|
|
36
30
|
}
|
|
37
31
|
}
|
|
38
32
|
|
|
39
|
-
}
|
|
40
|
-
if (config.leftMargin) {
|
|
41
|
-
horizontalBarGraph.config.style =
|
|
42
|
-
{
|
|
43
|
-
labelStyle: {
|
|
44
|
-
margin: {
|
|
45
|
-
left: config.leftMargin
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
33
|
}
|
|
50
34
|
if (config.bottomLabel) {
|
|
51
35
|
horizontalBarGraph.config.main.bottomLabel =
|
|
@@ -11,16 +11,6 @@ export const buildLineGraph = (config, componentScope) => {
|
|
|
11
11
|
if (config.height) {
|
|
12
12
|
lineGraph.config.style.containerStyle.height = config.height;
|
|
13
13
|
}
|
|
14
|
-
if (config.leftMargin) {
|
|
15
|
-
lineGraph.config.style =
|
|
16
|
-
{
|
|
17
|
-
labelStyle: {
|
|
18
|
-
margin: {
|
|
19
|
-
left: config.leftMargin
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
14
|
if (config.bottomLabel) {
|
|
25
15
|
lineGraph.config.main.bottomLabel = config.bottomLabel;
|
|
26
16
|
}
|
|
@@ -36,9 +26,6 @@ export const buildLineGraph = (config, componentScope) => {
|
|
|
36
26
|
if (config.legendHide) {
|
|
37
27
|
lineGraph.config.main.legendAvailabe = config.legendHide==="YES"?false:true;
|
|
38
28
|
}
|
|
39
|
-
if (config.bottomAxisAngle) {
|
|
40
|
-
lineGraph.config.main.bottomAxisAngle = config.bottomAxisAngle==="YES"?true:false;
|
|
41
|
-
}
|
|
42
29
|
if (config.legendLabels) {
|
|
43
30
|
lineGraph.config.main.tooltipDataKey = flatObjectValueInArray(config.legendLabels);
|
|
44
31
|
}
|
|
@@ -9,10 +9,6 @@ export const buildStackbarGraph = (config:any,componentScope:string) => {
|
|
|
9
9
|
}
|
|
10
10
|
if (config.legendHide) {
|
|
11
11
|
barGraph.config.main.legendAvailable = config.legendHide;
|
|
12
|
-
barGraph.config.main.legendAvailable = config.legendHide==="YES"?false:true;
|
|
13
|
-
}
|
|
14
|
-
if (config.bottomAxisAngle) {
|
|
15
|
-
barGraph.config.main.bottomAxisAngle = config.bottomAxisAngle==="YES"?true:false;
|
|
16
12
|
}
|
|
17
13
|
barGraph.config.main.type = config.graphType;
|
|
18
14
|
barGraph.config.main.header = config.heading;
|
|
@@ -25,16 +21,6 @@ export const buildStackbarGraph = (config:any,componentScope:string) => {
|
|
|
25
21
|
if (config.height) {
|
|
26
22
|
barGraph.config.style.containerStyle.height = config.height;
|
|
27
23
|
}
|
|
28
|
-
if (config.leftMargin) {
|
|
29
|
-
barGraph.config.style =
|
|
30
|
-
{
|
|
31
|
-
labelStyle: {
|
|
32
|
-
margin: {
|
|
33
|
-
left: config.leftMargin
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
24
|
if (config.bottomLabel) {
|
|
39
25
|
barGraph.config.main.bottomLabel = config.bottomLabel;
|
|
40
26
|
}
|
|
@@ -172,7 +172,7 @@ export const buildWrapper = (label: string, elements: any[]) => {
|
|
|
172
172
|
width: "108%"
|
|
173
173
|
},
|
|
174
174
|
componentsBoxStyle: {
|
|
175
|
-
marginLeft: "
|
|
175
|
+
marginLeft: "24px",
|
|
176
176
|
},
|
|
177
177
|
defaultStyle: true
|
|
178
178
|
},
|
|
@@ -411,9 +411,7 @@ export const buildPropertiesSection = function (type: String) {
|
|
|
411
411
|
getRadioInputField("legendHide", "Legend Hide", ["YES", "No"]),
|
|
412
412
|
getInputField("yAxisValue", "Y-AxisValue"),
|
|
413
413
|
getInputField("xAxisValue", "X-AxisValue"),
|
|
414
|
-
|
|
415
|
-
getInputField("leftMargin", "Left Margin"),
|
|
416
|
-
emptyBox("GraphEmpty1", {xs: 6, sm: 0, md: 8, lg: 8 }),
|
|
414
|
+
emptyBox("GraphEmpty2"),
|
|
417
415
|
getArrayControl("legendLabels", "label"),
|
|
418
416
|
getArrayControl("pieArcColors", "color"),
|
|
419
417
|
];
|
|
@@ -6,7 +6,6 @@ export const BarGraph = {
|
|
|
6
6
|
},
|
|
7
7
|
|
|
8
8
|
config: {
|
|
9
|
-
layout: {xs :12,sm:12,md:12,lg:6},
|
|
10
9
|
main: {
|
|
11
10
|
},
|
|
12
11
|
style: { containerStyle: {} }
|
|
@@ -20,7 +19,6 @@ export const PieGraph = {
|
|
|
20
19
|
widget: "Graph",
|
|
21
20
|
},
|
|
22
21
|
config: {
|
|
23
|
-
layout: {xs :12,sm:12,md:12,lg:6},
|
|
24
22
|
main: {
|
|
25
23
|
type: "PieGraph",
|
|
26
24
|
},
|
|
@@ -34,7 +32,7 @@ export const LineGraph = {
|
|
|
34
32
|
widget: "Graph",
|
|
35
33
|
},
|
|
36
34
|
config: {
|
|
37
|
-
layout:
|
|
35
|
+
layout: 12,
|
|
38
36
|
main: {
|
|
39
37
|
type: "LineGraph",
|
|
40
38
|
header: "Quartely Incentive in Thousand",
|
|
@@ -70,7 +68,6 @@ export const HorizontalBarGraph = {
|
|
|
70
68
|
widget: "Graph",
|
|
71
69
|
},
|
|
72
70
|
config: {
|
|
73
|
-
layout: {xs :12,sm:12,md:12,lg:6},
|
|
74
71
|
main: {
|
|
75
72
|
type: "HorizontalBarGraph",
|
|
76
73
|
},
|
|
@@ -146,7 +146,7 @@ function executeCustomHandler(params: handlersProps) {
|
|
|
146
146
|
}
|
|
147
147
|
|
|
148
148
|
function mergeFormdata(handlerResponse: any, componentName: string, eventConfig: any, store: any, service: any, formDataHolder: any) {
|
|
149
|
-
if (eventConfig.type === "Select" && handlerResponse?.data
|
|
149
|
+
if (eventConfig.type === "Select" && handlerResponse?.data) {
|
|
150
150
|
store.setSchema((pre) => {
|
|
151
151
|
return {
|
|
152
152
|
...pre, properties: {
|
|
@@ -158,7 +158,7 @@ function mergeFormdata(handlerResponse: any, componentName: string, eventConfig:
|
|
|
158
158
|
}
|
|
159
159
|
})
|
|
160
160
|
}
|
|
161
|
-
else if (eventConfig.type === "MultipleSelect" && handlerResponse?.data
|
|
161
|
+
else if (eventConfig.type === "MultipleSelect" && handlerResponse?.data) {
|
|
162
162
|
store.setSchema((pre) => {
|
|
163
163
|
return {
|
|
164
164
|
...pre, properties: {
|
|
@@ -101,22 +101,20 @@ export default (funcParams: funcParamsProps) => {
|
|
|
101
101
|
type: "HorizontalLayout",
|
|
102
102
|
config: {
|
|
103
103
|
main: {
|
|
104
|
-
direction:
|
|
104
|
+
direction: "row",
|
|
105
105
|
},
|
|
106
106
|
style: {
|
|
107
107
|
flexDirection: "row",
|
|
108
108
|
position: "absolute",
|
|
109
109
|
bottom: 0,
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
overflow: 'hidden',
|
|
110
|
+
height: "fit-content",
|
|
111
|
+
overflow: "hidden",
|
|
113
112
|
zIndex: 1000,
|
|
114
|
-
width:
|
|
115
|
-
}
|
|
113
|
+
width: "inherit",
|
|
114
|
+
},
|
|
116
115
|
},
|
|
117
116
|
elements: [
|
|
118
117
|
{
|
|
119
|
-
|
|
120
118
|
type: "Control",
|
|
121
119
|
scope: "#/properties/FooterText",
|
|
122
120
|
options: {
|
|
@@ -124,84 +122,85 @@ export default (funcParams: funcParamsProps) => {
|
|
|
124
122
|
},
|
|
125
123
|
config: {
|
|
126
124
|
main: {
|
|
127
|
-
heading: "Copywriter@ACT21.IO"
|
|
125
|
+
heading: "Copywriter@ACT21.IO",
|
|
128
126
|
},
|
|
129
127
|
style: {
|
|
130
|
-
color: theme?.palette?.text
|
|
131
|
-
fontSize:
|
|
132
|
-
textAlign:
|
|
128
|
+
color: theme?.palette?.text?.disabled || "#AFAFAF",
|
|
129
|
+
fontSize: "12px",
|
|
130
|
+
textAlign: "center",
|
|
133
131
|
lineHeight: 2,
|
|
134
|
-
width:
|
|
135
|
-
left:
|
|
136
|
-
position:
|
|
132
|
+
width: "fit-content",
|
|
133
|
+
left: "50%",
|
|
134
|
+
position: "relative",
|
|
137
135
|
margin: 0,
|
|
138
136
|
flexGrow: 1,
|
|
139
137
|
height: 0,
|
|
140
|
-
transform: "translate(-50%,0%)"
|
|
141
|
-
}
|
|
138
|
+
transform: "translate(-50%, 0%)",
|
|
139
|
+
},
|
|
142
140
|
},
|
|
143
141
|
},
|
|
144
142
|
{
|
|
145
143
|
type: "Control",
|
|
146
|
-
scope: "#/properties/
|
|
144
|
+
scope: "#/properties/FooterBackIcon",
|
|
147
145
|
options: {
|
|
148
146
|
widget: "Box",
|
|
149
147
|
},
|
|
150
148
|
config: {
|
|
151
149
|
main: {
|
|
152
|
-
iconName:
|
|
150
|
+
iconName: "PrevIcon",
|
|
153
151
|
onClick: "backHandler",
|
|
154
|
-
width:
|
|
152
|
+
width: "fit-content",
|
|
155
153
|
},
|
|
156
154
|
style: {
|
|
157
|
-
fill: theme
|
|
155
|
+
fill: theme?.palette?.primary?.main,
|
|
158
156
|
width: 20,
|
|
159
157
|
height: 0,
|
|
160
|
-
margin: 0,
|
|
158
|
+
// margin: 0,
|
|
161
159
|
top: 0,
|
|
162
|
-
right: {xs:
|
|
163
|
-
position:
|
|
164
|
-
fontSize:
|
|
165
|
-
cursor:
|
|
166
|
-
|
|
167
|
-
fill: theme
|
|
168
|
-
}
|
|
169
|
-
|
|
170
|
-
|
|
160
|
+
right: { xs: "12px", sm: "84px" },
|
|
161
|
+
position: "absolute",
|
|
162
|
+
fontSize: "12px",
|
|
163
|
+
cursor: "pointer",
|
|
164
|
+
":hover": {
|
|
165
|
+
fill: theme?.palette?.primary?.dark,
|
|
166
|
+
},
|
|
167
|
+
marginRight: "13px",
|
|
168
|
+
},
|
|
169
|
+
},
|
|
171
170
|
},
|
|
172
171
|
{
|
|
173
172
|
type: "Control",
|
|
174
|
-
scope: "#/properties/
|
|
175
|
-
|
|
173
|
+
scope: "#/properties/FooterBackHandlerText",
|
|
176
174
|
options: {
|
|
177
175
|
widget: "Box",
|
|
178
176
|
},
|
|
179
177
|
config: {
|
|
180
178
|
main: {
|
|
181
179
|
heading: "Previous Page",
|
|
182
|
-
onClick: "backHandler"
|
|
180
|
+
onClick: "backHandler",
|
|
183
181
|
},
|
|
184
182
|
style: {
|
|
185
|
-
display: {xs:
|
|
186
|
-
textAlign:
|
|
183
|
+
display: { xs: "none", sm: "flex" },
|
|
184
|
+
textAlign: "left",
|
|
187
185
|
lineHeight: 1,
|
|
188
186
|
height: 0,
|
|
189
|
-
width:
|
|
190
|
-
color: theme
|
|
191
|
-
fontSize: "
|
|
192
|
-
cursor:
|
|
193
|
-
marginLeft:
|
|
194
|
-
|
|
187
|
+
width: "fit-content",
|
|
188
|
+
color: theme?.palette?.primary?.main,
|
|
189
|
+
fontSize: "14px",
|
|
190
|
+
cursor: "pointer",
|
|
191
|
+
marginLeft: "2px",
|
|
192
|
+
|
|
195
193
|
top: 3,
|
|
196
|
-
right:
|
|
197
|
-
position:
|
|
198
|
-
|
|
199
|
-
color: theme
|
|
200
|
-
}
|
|
201
|
-
|
|
194
|
+
right: "12px",
|
|
195
|
+
position: "absolute",
|
|
196
|
+
":hover": {
|
|
197
|
+
color: theme?.palette?.primary?.dark,
|
|
198
|
+
},
|
|
199
|
+
marginRight: "4px",
|
|
200
|
+
},
|
|
202
201
|
},
|
|
203
202
|
},
|
|
204
|
-
]
|
|
203
|
+
],
|
|
205
204
|
}
|
|
206
205
|
);
|
|
207
206
|
const schema = pageData?.schema ?? { type: "object", properties: {} };
|