impaktapps-ui-builder 0.0.96 → 0.0.97-alpha.5

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.
@@ -22,6 +22,7 @@ export declare const APISection: {
22
22
  heading: string;
23
23
  minRows: number;
24
24
  hideButton: boolean;
25
+ enableCodeEditor: boolean;
25
26
  };
26
27
  };
27
28
  } | {
@@ -59,6 +59,7 @@ export declare const getTextArea: (scope: string, heading: string, hideButton: b
59
59
  heading: string;
60
60
  minRows: number;
61
61
  hideButton: boolean;
62
+ enableCodeEditor: boolean;
62
63
  };
63
64
  };
64
65
  };
@@ -14,6 +14,7 @@ export declare const BarGraph: {
14
14
  main: {};
15
15
  style: {
16
16
  containerStyle: {};
17
+ labelStyle: {};
17
18
  };
18
19
  };
19
20
  };
@@ -92,6 +93,8 @@ export declare const HorizontalBarGraph: {
92
93
  main: {
93
94
  type: string;
94
95
  };
95
- style: {};
96
+ style: {
97
+ labelStyle: {};
98
+ };
96
99
  };
97
100
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "impaktapps-ui-builder",
3
- "version": "0.0.96",
3
+ "version": "0.0.97-alpha.5",
4
4
  "scripts": {
5
5
  "dev": "vite",
6
6
  "build": "tsc && vite build",
@@ -57,4 +57,4 @@ const buildHorizontalBarGraph = (config:any,componentScope:string) => {
57
57
  return horizontalBarGraph
58
58
  }
59
59
 
60
- export default buildHorizontalBarGraph
60
+ export default buildHorizontalBarGraph;
@@ -46,6 +46,15 @@ export const buildLineGraph = (config, componentScope) => {
46
46
  if (config.pieArcColors) {
47
47
  lineGraph.config.style.lineStyle.colorRange = flatObjectValueInArray(config.pieArcColors);
48
48
  }
49
+ if (config.leftLabelMargin) {
50
+ lineGraph.config.style.labelStyle.margin = {
51
+ left: config.leftLabelMargin,
52
+ };
53
+ }
54
+ if (config.leftLabelOffset) {
55
+ lineGraph.config.style.labelStyle.leftLabelOffset =
56
+ config.leftLabelOffset;
57
+ }
49
58
  lineGraph.scope = componentScope;
50
59
  return lineGraph;
51
60
  }
@@ -41,6 +41,15 @@ export const buildStackbarGraph = (config:any,componentScope:string) => {
41
41
  if (config.leftLabel) {
42
42
  barGraph.config.main.leftLabel = config.leftLabel;
43
43
  }
44
+ if (config.leftLabelMargin) {
45
+ barGraph.config.style.labelStyle.margin = {
46
+ left: config.leftLabelMargin,
47
+ };
48
+ }
49
+ if (config.leftLabelOffset) {
50
+ barGraph.config.style.labelStyle.leftLabelOffset =
51
+ config.leftLabelOffset;
52
+ }
44
53
  barGraph.scope = componentScope;
45
54
  return barGraph;
46
55
  }
@@ -38,8 +38,11 @@ export const buildTable = (config: any, componentScope: string) => {
38
38
  if (config.downloadAllData) {
39
39
  table.config.main.downloadAllData = config.downloadAllData === "YES" ? true : false
40
40
  }
41
- if(config.disableFilters){
42
- table.config.main.disableFilters = config.disableFilters === "YES" ? true : false
41
+ if(config.disableGlobalSearch){
42
+ table.config.main.disableGlobalSearch = config.disableGlobalSearch === "YES" ? true : false
43
+ }
44
+ if(config.disableColumnFilter){
45
+ table.config.main.disableColumnFilter = config.disableColumnFilter === "YES" ? true : false
43
46
  }
44
47
  if(config.disableSorting){
45
48
  table.config.main.disableSorting = config.disableSorting === "YES" ? true : false
@@ -45,6 +45,12 @@ export const buildTextArea = (config:any,componentScope:string) =>{
45
45
  if (config.placeholder) {
46
46
  textArea.config.main.placeholder = config.placeholder;
47
47
  }
48
+ if(config.enableCodeEditor){
49
+ textArea.config.main.enableCodeEditor = config.enableCodeEditor === "YES" ? true : false
50
+ }
51
+ if(config.codeEditorLanguage){
52
+ textArea.config.main.codeEditorLanguage = config.codeEditorLanguage;
53
+ }
48
54
  textArea.scope = componentScope;
49
55
  return textArea;
50
56
  }
@@ -2,23 +2,20 @@ import { uploadFile } from "./uischema/file";
2
2
  import _ from "lodash";
3
3
  import { createLayoutFormat } from "./buildConfig";
4
4
 
5
- export const buildUploadFile = (config,componentScope)=>{
6
- const UploadFile: any = _.cloneDeep(uploadFile);
7
-
8
- UploadFile.scope = componentScope;
9
- UploadFile.config.main.label = config.label;
10
- if (config.layout) {
11
- UploadFile.config.layout = config.layout;
12
- }
13
- if(config.layout){
14
- uploadFile.config.layout = createLayoutFormat(config.layout)
15
- }
16
- if (config.style) {
17
- UploadFile.config.style = config.style;
18
- }
19
- if (config.required) {
20
- UploadFile.config.main.required = true;
21
- }
22
- UploadFile.config.main.errorMessage = config.errorMessage;
23
- return UploadFile;
5
+ export const buildUploadFile = (config, componentScope) => {
6
+ const UploadFile: any = _.cloneDeep(uploadFile);
7
+
8
+ UploadFile.scope = componentScope;
9
+ UploadFile.config.main.label = config.label;
10
+ if (config.layout) {
11
+ UploadFile.config.layout = createLayoutFormat(config.layout)
12
+ }
13
+ if (config.style) {
14
+ UploadFile.config.style = config.style;
15
+ }
16
+ if (config.required) {
17
+ UploadFile.config.main.required = true;
18
+ }
19
+ UploadFile.config.main.errorMessage = config.errorMessage;
20
+ return UploadFile;
24
21
  }
@@ -206,7 +206,8 @@ export const getTextArea = (scope: string, heading: string, hideButton: boolean,
206
206
  main: {
207
207
  heading: heading,
208
208
  minRows: 8,
209
- hideButton: hideButton
209
+ hideButton: hideButton,
210
+ enableCodeEditor: true
210
211
  },
211
212
  },
212
213
  }
@@ -324,7 +325,9 @@ export const buildPropertiesSection = function (type: String) {
324
325
  case "TextArea":
325
326
  uiSchema.elements = [
326
327
  getInputField("placeholder", "Placeholder"),
327
- emptyBox("TextAreaEmpty1", {xs: 6, sm: 6, md: 4, lg: 4 }), emptyBox("TextAreaEmpty2", {xs: 0, sm: 0, md: 4, lg: 4 })]
328
+ getRadioInputField("enableCodeEditor", "Enable Code Editor",["YES", "NO"]),
329
+ getInputField("codeEditorLanguage", "Enter Code Language"),
330
+ ]
328
331
  break;
329
332
 
330
333
  case "SpeedoMeter":
@@ -404,6 +407,8 @@ export const buildPropertiesSection = function (type: String) {
404
407
  ]),
405
408
  getInputField("leftLabel", "Left Label"),
406
409
  getInputField("bottomLabel", "Bottom Label"),
410
+ getInputField("leftLabelMargin", "Left Label Margin"),
411
+ getInputField("leftLabelOffset", "Left Label Offset"),
407
412
  emptyBox("GraphEmpty1", {xs: 6, sm: 0, md: 0, lg: 0 }),
408
413
  getRadioInputField("legendHide", "Legend Hide", ["YES", "No"]),
409
414
  getInputField("yAxisValue", "Y-AxisValue"),
@@ -439,7 +444,8 @@ export const buildPropertiesSection = function (type: String) {
439
444
  getRadioInputField("ColumnResizingAvailable", "ColumnResizing ", ["YES", "NO"]),
440
445
  getRadioInputField("DragAvailable", "Row Dragging", ["YES", "NO"]),
441
446
  getRadioInputField("downloadAllData", "Download All Data", ["YES", "NO"]),
442
- getRadioInputField("disableFilters", "Disable Filter", ["YES", "NO"]),
447
+ getRadioInputField("disableGlobalSearch", "Disable Global Search", ["YES", "NO"]),
448
+ getRadioInputField("disableColumnFilter", "Disable Column Filter", ["YES", "NO"]),
443
449
  getRadioInputField("disableSorting", "Disable Sorting", ["YES", "NO"]),
444
450
 
445
451
  getRadioInputField("disableEditColumn", "Disable Edit Column", ["YES", "NO"]),
@@ -449,7 +455,6 @@ export const buildPropertiesSection = function (type: String) {
449
455
  getRadioInputField("disablePagination", "Disable Pagination", ["YES", "NO"]),
450
456
  getInputField("selectKey", "Selection Key"),
451
457
  getMultiSelectField("filteringOptions", "Filtering Options"),
452
- emptyBox("LazyLoadingTableEmpty1", {xs: 6, sm: 0, md: 4, lg: 4 }),
453
458
  buildWrapper("Tree Table Properties", [
454
459
  getRadioInputField("enableRowMovement", "Row Rearrangement", ["YES", "NO"]),
455
460
  getRadioInputField("enableExpanding", "Row Expanding", ["YES", "NO"]),
@@ -15,7 +15,7 @@ export default {
15
15
  styleDefault:false,
16
16
  icon:"",
17
17
  onClick: "onClick",
18
- size: "medium",
18
+ size: "small",
19
19
  },
20
20
  style: {
21
21
  },
@@ -9,7 +9,7 @@ export const BarGraph = {
9
9
  layout: {xs :12,sm:12,md:12,lg:6},
10
10
  main: {
11
11
  },
12
- style: { containerStyle: {} }
12
+ style: { containerStyle: {},labelStyle:{} }
13
13
  },
14
14
  };
15
15
 
@@ -75,7 +75,7 @@ export const HorizontalBarGraph = {
75
75
  type: "HorizontalBarGraph",
76
76
  },
77
77
  style:{
78
-
78
+ labelStyle:{}
79
79
  }
80
80
  },
81
81
  };
@@ -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 && !_.isEmpty(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 && !_.isEmpty(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: 'row'
104
+ direction: "row",
105
105
  },
106
106
  style: {
107
107
  flexDirection: "row",
108
108
  position: "absolute",
109
109
  bottom: 0,
110
- marginBottom: '-8px',
111
- height: 'fit-content',
112
- overflow: 'hidden',
110
+ height: "fit-content",
111
+ overflow: "hidden",
113
112
  zIndex: 1000,
114
- width: 'inherit'
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.disabled || "#AFAFAF",
131
- fontSize: '12px',
132
- textAlign: 'center',
128
+ color: theme?.palette?.text?.disabled || "#AFAFAF",
129
+ fontSize: "12px",
130
+ textAlign: "center",
133
131
  lineHeight: 2,
134
- width: 'fit-content',
135
- left: '50%',
136
- position: 'relative',
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/backIcon",
144
+ scope: "#/properties/FooterBackIcon",
147
145
  options: {
148
146
  widget: "Box",
149
147
  },
150
148
  config: {
151
149
  main: {
152
- iconName: 'PrevIcon',
150
+ iconName: "PrevIcon",
153
151
  onClick: "backHandler",
154
- width: 'fit-content',
152
+ width: "fit-content",
155
153
  },
156
154
  style: {
157
- fill: theme.palette.primary.main,
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: '12px', sm: '84px'},
163
- position: 'absolute',
164
- fontSize: '12px',
165
- cursor: 'pointer',
166
- ':hover': {
167
- fill: theme.palette.primary.dark,
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/text",
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: 'none', sm: "flex"},
186
- textAlign: 'left',
183
+ display: { xs: "none", sm: "flex" },
184
+ textAlign: "left",
187
185
  lineHeight: 1,
188
186
  height: 0,
189
- width: 'fit-content',
190
- color: theme.palette.primary.main,
191
- fontSize: "12px",
192
- cursor: 'pointer',
193
- marginLeft: '2px',
194
- marginRight: 0,
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: '12px',
197
- position: 'absolute',
198
- ':hover': {
199
- color: theme.palette.primary.dark,
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: {} };