impaktapps-ui-builder 1.0.146 → 1.0.147-test.2

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