impaktapps-ui-builder 1.0.148 → 1.0.150

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 (13) hide show
  1. package/dist/impaktapps-ui-builder.es.js +170 -185
  2. package/dist/impaktapps-ui-builder.es.js.map +1 -1
  3. package/dist/impaktapps-ui-builder.umd.js +3 -3
  4. package/dist/impaktapps-ui-builder.umd.js.map +1 -1
  5. package/dist/src/impaktapps-ui-builder/builder/build/buildSegmentChart.d.ts +1 -0
  6. package/dist/src/impaktapps-ui-builder/builder/build/uischema/card.d.ts +173 -198
  7. package/package.json +1 -1
  8. package/src/impaktapps-ui-builder/builder/build/buildProgressBar.ts +28 -21
  9. package/src/impaktapps-ui-builder/builder/build/buildSegmentChart.ts +34 -0
  10. package/src/impaktapps-ui-builder/builder/build/buildUiSchema.ts +4 -0
  11. package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts +6 -1
  12. package/src/impaktapps-ui-builder/builder/build/uischema/card.ts +140 -187
  13. package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/schema.ts +2 -1
package/src/impaktapps-ui-builder/builder/build/uischema/card.ts CHANGED
@@ -1,216 +1,169 @@
1
- export default function Card(theme){
2
- const uiSchema = {
1
+ export default function Card(theme) {
2
+ const uiSchema =
3
+ {
3
4
  type: "WrapperLayout",
4
5
  config: {
5
6
  main: {},
6
- wrapperStyle: {
7
- position: "relative",
8
- top: "50%",
9
- transform: "translateY(-50%)",
10
- marginBottom: 0
11
- },
12
- componentsBoxStyle: {
13
- boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
14
- flexDirection: "row",
15
- flexWrap: "nowrap",
16
- width: "100% !important",
17
- background: "transparent",
18
- border: `1.5px solid ${theme.palette.primary.light}`,
19
- borderRadius: "8px",
20
- padding: "0px 4px",
21
- height: "100%",
22
- alignItems: "center",
23
- marginLeft: "0px",
24
- "&: hover": {
25
- background: `${theme.palette.primary.main}`,
26
- border: `1.5px solid black`,
27
- "& p": {
28
- color: "white",
7
+ style: {
8
+ wrapperStyle: {
9
+ position: "relative",
10
+ top: "50%",
11
+ transform: "translateY(-50%)",
12
+ marginBottom: 0,
13
+ borderRadius: "12px",
14
+ fontFamily:"poppins"
15
+ },
16
+ componentsBoxStyle: {
17
+ boxShadow: "0 0 6px 1px rgba(149, 147, 147, 0.25)",
18
+ flexDirection: "column",
19
+ overflow: "hidden",
20
+ flexWrap: "nowrap",
21
+ width: "100% !important",
22
+ background: "transparent",
23
+ // border: `1.5px solid ${theme.palette.primary.light}`,
24
+ borderRadius: "12px",
25
+ padding: "20px 20px 20px 14px",
26
+ height: "100%",
27
+ minHeight: "100px",
28
+ position: "relative",
29
+ marginLeft: "0px",
30
+ "&: hover": {
31
+ background: `${theme.palette.primary.main}`,
32
+ color: `${theme.palette.primary.contrastText}`,
33
+ // border: `1.5px solid black`,
34
+ // "& p": {
35
+ // color: "white",
36
+ // },
29
37
  },
30
38
  },
31
39
  },
32
- layout: { xs: 12, sm: 12, md: 6, lg: 6 },
40
+
41
+ layout: { xs: 12, sm: 12, md: 3, lg: 3 },
33
42
  },
34
43
  elements: [
35
44
  {
36
- type: "HorizontalLayout",
45
+ type: "Control",
46
+ scope: "#/properties/programType",
37
47
  config: {
38
- layout: 9,
39
- },
40
- elements: [
41
- {
42
- type: "WrapperLayout",
43
- config: {
44
- main: {
45
- columnSpacing: 0,
46
- gap: 0,
47
- },
48
- wrapperStyle: {
49
- background: "transparent",
50
- marginBottom: 0
51
- },
52
- componentsBoxStyle: {
53
- flexDirection: "column",
54
- flexWrap: "nowrap",
55
- width: "100%",
56
- height: "inherit",
57
- background: "transparent",
58
- borderRadius: "0px",
59
- paddingRight: 0
60
- },
61
- layout: 12,
48
+ main: {
49
+ url: "https://www.svgrepo.com/show/500606/loading.svg",
50
+ },
51
+ style: {
52
+ containerStyle: {
53
+ position: "absolute",
54
+ color:"inherit",
55
+ top: "4px",
56
+ right: "4px",
57
+ display: "flex",
58
+ justifyContent: "flex-end",
59
+ alignItems: "flex-start",
60
+ },
61
+ imageStyle: {
62
+ color:"inherit",
63
+ width: "32px",
64
+ height: "32px",
65
+ padding: "0px",
66
+ margin: "0px",
62
67
  },
63
- elements: [
64
- {
65
- type: "WrapperLayout",
66
- config: {
67
- main: {
68
- columnSpacing: 0,
69
- gap: 0,
70
- },
71
- wrapperStyle: {
72
- background: "transparent",
73
- marginBottom: 0
74
- },
75
- componentsBoxStyle: {
76
- flexDirection: "row",
77
- flexWrap: "nowrap",
78
- width: "100%",
79
- height: "0",
80
- background: "transparent",
81
- borderRadius: "0px",
82
- marginLeft: "-10px",
83
- marginTop: "-8px",
84
- justifyContent: "start",
85
- position: "relative",
86
-
87
- },
88
- layout: 12,
89
- },
90
- elements: [
91
- {
92
- type: "Control",
93
- scope: "#/properties/programType",
94
- config: {
95
- main: {
96
- heading: "",
97
- },
98
- style: {
99
- color: "black",
100
- display: "flex",
101
- fontSize: { xs: "24px", md: "28px" },
102
- fontWeight: "bold",
103
- background: "inherit",
104
- justifyContent: "flex-start",
105
- width: "auto",
106
- margin: "-8px",
107
- marginLeft: "-24px",
108
- height: 0
109
- },
110
- // layout: 1,
111
- },
112
- options: {
113
- widget: "Box",
114
- },
115
- },
116
- {
117
- type: "Control",
118
- scope: "#/properties/programType",
119
- config: {
120
- main: {
121
- heading: "5000.00",
122
- },
123
- style: {
124
- color: "black",
125
- display: "flex",
126
- fontSize: { xs: "21px", md: "22px" },
127
- fontWeight: "500",
128
- background: "inherit",
129
- justifyContent: "flex-start",
130
- width: "auto",
131
- margin: "-8px",
132
- marginTop: "-6px",
133
- position: "absolute",
134
- left: "7px",
135
- whiteSpace: "nowrap",
136
- overflowX: "auto",
137
- overflowY: "hidden",
138
- scrollbarWidth: "none",
139
- msOverflowStyle: "none",
140
- maxWidth: "calc(100% + 20px)",
141
- "&::-webkit-scrollbar": {
142
- display: "none",
143
- }
144
- },
145
- // layout: 11,
146
- },
147
- options: {
148
- widget: "Box",
149
- },
150
- },
151
- ],
152
- },
153
- {
154
- type: "Control",
155
- scope: "#/properties/programType",
156
- config: {
157
- main: {
158
- heading: "Total Earnings",
159
- },
160
- style: {
161
- color: "black",
162
- fontSize: "16px",
163
- fontWeight: "400",
164
- justifyContent: "center",
165
- whiteSpace: "nowrap",
166
- overflowX: "auto",
167
- overflowY: "hidden",
168
- scrollbarWidth: "none",
169
- msOverflowStyle: "none",
170
- background: "inherit",
171
- width: "calc(100% + 8px)",
172
- margin: "-8px",
173
- marginTop: { xs: "16px", md: "20px" },
174
- "&::-webkit-scrollbar": {
175
- display: "none",
176
- }
177
- },
178
- layout: 12,
179
- },
180
-
181
- options: {
182
- widget: "Box",
183
- },
184
- },
185
- ],
186
68
  },
187
- ],
69
+ },
70
+ options: {
71
+ widget: "Image",
72
+ },
188
73
  },
189
74
  {
190
75
  type: "Control",
191
76
  scope: "#/properties/programType",
192
77
  config: {
193
78
  main: {
194
- url: "https://www.svgrepo.com/show/500606/loading.svg",
79
+ heading: "Total Earnings",
195
80
  },
196
81
  style: {
197
- containerStyle: {
198
- height: "100%",
82
+ color: "inherit",
83
+ fontSize: "16px",
84
+ fontWeight: 300,
85
+ fontFamily:"Poppins",
86
+ justifyContent: "flex-start",
87
+ background: "inherit",
88
+ position: "absolute",
89
+ top: "8px",
90
+ left: "12px",
199
91
  display: "flex",
200
- justifyContent: "end",
92
+ maxWidth: "200px",
93
+ whiteSpace: "nowrap",
94
+ overflowX: "auto",
95
+ scrollbarWidth: "none",
96
+ "&::-webkit-scrollbar": {
97
+ display: "none",
201
98
  },
202
- imageStyle: {
203
- width: "unset",
204
- fontSize: "none",
205
- padding: "4px",
206
- margin: "0px 0px 0px 8px",
207
- height: "64px",
99
+ },
100
+ },
101
+ options: {
102
+ widget: "Box",
103
+ },
104
+ },
105
+ {
106
+ type: "Control",
107
+ scope: "#/properties/programType",
108
+ config: {
109
+ main: {
110
+ heading: "5000.00",
111
+ },
112
+ style: {
113
+ color: "inherit",
114
+ display: "flex",
115
+ fontSize: { xs: "22px", md: "40px" },
116
+ fontWeight: 600,
117
+ background: "inherit",
118
+ justifyContent: "flex-start",
119
+ width: "100%",
120
+ margin: "0px",
121
+ marginBottom: "4px",
122
+ marginTop: "8px",
123
+ lineHeight: "1",
124
+ maxWidth: "300px",
125
+ whiteSpace: "nowrap",
126
+ overflowX: "auto",
127
+ overflowY: "hidden",
128
+ scrollbarWidth: "none",
129
+
130
+ "&::-webkit-scrollbar": {
131
+ display: "none",
208
132
  },
209
133
  },
210
- layout: 3,
211
134
  },
212
135
  options: {
213
- widget: "Image",
136
+ widget: "Box",
137
+ },
138
+ },
139
+ {
140
+ type: "Control",
141
+ scope: "#/properties/programType",
142
+ config: {
143
+ main: {
144
+ heading: "Increased from last month",
145
+ },
146
+ style: {
147
+ color: "inherit",
148
+ fontSize: "12px",
149
+ fontWeight: "400",
150
+ justifyContent: "flex-start",
151
+ background: "inherit",
152
+ margin: "0px",
153
+ paddingLeft: "2px",
154
+ marginBottom:"8px",
155
+ maxWidth: "200px",
156
+ whiteSpace: "nowrap",
157
+ overflowX: "auto",
158
+ scrollbarWidth: "none",
159
+
160
+ "&::-webkit-scrollbar": {
161
+ display: "none",
162
+ },
163
+ },
164
+ },
165
+ options: {
166
+ widget: "Box",
214
167
  },
215
168
  },
216
169
  ],
package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/schema.ts CHANGED
@@ -41,7 +41,8 @@ export const ComponentSchema: any = {
41
41
  { title: "Text Area", const: "TextArea" },
42
42
  { title: "Timer", const: "Timer" },
43
43
  { title: "Upload", const: "UploadFile" },
44
- { title: "Tree ", const: "TreeMap" },
44
+ { title: "Tree ", const: "TreeMap" },//SegmentChart
45
+ { title: "SegmentChart ", const: "SegmentChart" },
45
46
  { title: "Column Group", const: "ColumnGroup" },
46
47
  { title: "Thought of the day", const: "Thought" },
47
48
  ],