impaktapps-ui-builder 1.0.147-test.1 → 1.0.147-test.3

package/dist/impaktapps-ui-builder.es.js

@@ -7968,9 +7968,10 @@ const buildPropertiesSection = function(type) {
       uiSchema.elements = [
         getInputField("url", "Image Url"),
         getInputField("label", "Label"),
+        getInputField("value", "Value"),
         getInputField("titleIcon", "Unicode of Icon for title"),
         getInputField("description", "Description"),
-        emptyBox$1("cardEmpty", { xs: 0, sm: 0, md: 8, lg: 8 })
+        emptyBox$1("cardEmpty", { xs: 6, sm: 6, md: 8, lg: 9 })
       ];
       break;
     case "Button":
@@ -8479,12 +8480,12 @@ const createLayoutFormat = (layout, type) => {
   });
   return data;
 };
-const flatObjectValueInArray = (config2 = []) => {
-  if (config2.length < 1) {
+const flatObjectValueInArray = (config = []) => {
+  if (config.length < 1) {
     return;
   }
-  const keyName = Object.keys(config2[0])[0];
-  const data = config2.map((e) => {
+  const keyName = Object.keys(config[0])[0];
+  const data = config.map((e) => {
     return e[keyName];
   });
   return data;
@@ -8492,9 +8493,9 @@ const flatObjectValueInArray = (config2 = []) => {
 const clearFromSessionStorage = () => {
   sessionStorage.removeItem("pageFormdata");
 };
-const getNavigationHistory = (config2, path) => {
+const getNavigationHistory = (config, path) => {
   if (path) {
-    let urlRoutes = config2.name;
+    let urlRoutes = config.name;
     const pathArrayAll = path.split(".");
     const arr = [];
     pathArrayAll.map((e, i) => {
@@ -8505,7 +8506,7 @@ const getNavigationHistory = (config2, path) => {
       arr.push(`${arr[i - 1]}.${e}`);
     });
     arr.map((e) => {
-      const data = _.get(config2, e);
+      const data = _.get(config, e);
       if (data) {
         urlRoutes = urlRoutes + ` >    ${(data == null ? void 0 : data.name) || (data == null ? void 0 : data.eventType)}`;
       } else {
@@ -8544,10 +8545,10 @@ async function saveHandler(store2, service2, submitHandler) {
   (_a = store2.searchParams) == null ? void 0 : _a.get("id");
   const path = (_b = store2.searchParams) == null ? void 0 : _b.get("path");
   saveFormdataInSessionStorage(store2.ctx.core.data, path);
-  const config2 = JSON.parse(sessionStorage.getItem("pageFormdata"));
+  const config = JSON.parse(sessionStorage.getItem("pageFormdata"));
   if (_.isEmpty(store2.ctx.core.errors)) {
     try {
-      const saveReturn = await submitHandler(store2, service2, config2);
+      const saveReturn = await submitHandler(store2, service2, config);
       navigateHandler(store2, true, "/PageMasterRecords");
     } catch (err) {
       navigateHandler(store2, false);
@@ -8791,10 +8792,10 @@ var Component = (store2, dynamicData2, submitHandler, service2) => {
       if (sessionStorage.getItem("copiedConfig")) {
         schema2.properties.RemoveItemButton.disabled = false;
       }
-      const config2 = JSON.parse(sessionStorage.getItem("pageFormdata"));
+      const config = JSON.parse(sessionStorage.getItem("pageFormdata"));
       const path = (_a = store2.searchParams) == null ? void 0 : _a.get("path");
       const id = (_b = store2.searchParams) == null ? void 0 : _b.get("id");
-      let pathArray = [{ label: (_c = config2.name) != null ? _c : "NewPage", path: `/PageMaster${id ? `?id=${id}` : ""}` }];
+      let pathArray = [{ label: (_c = config.name) != null ? _c : "NewPage", path: `/PageMaster${id ? `?id=${id}` : ""}` }];
       if (path) {
         const pathArrayAll = path.split(".");
         const arr = [];
@@ -8806,7 +8807,7 @@ var Component = (store2, dynamicData2, submitHandler, service2) => {
           arr.push(`${arr[i - 1]}.${e}`);
         });
         arr.map((e) => {
-          const data = _.get(config2, e);
+          const data = _.get(config, e);
           pathArray.push({
             label: (data == null ? void 0 : data.name) || (data == null ? void 0 : data.eventType) || "NewComponent",
             path: `/Component?path=${e}${id ? `&id=${id}` : ""}`
@@ -9033,13 +9034,13 @@ var pageMaster = (funcParams) => {
     getFormdata: async function() {
       var _a;
       const id = (_a = store2.searchParams) == null ? void 0 : _a.get("id");
-      const config2 = await funcParams.pageConfigProvider(id);
+      const config = await funcParams.pageConfigProvider(id);
       const formData = getFormdataFromSessionStorage();
       if (formData) {
         return formData;
       }
-      saveFormdataInSessionStorage(config2);
-      return { ...config2, type: "page" };
+      saveFormdataInSessionStorage(config);
+      return { ...config, type: "page" };
     },
     getUiSchema: function() {
       const UiSchema = _.cloneDeep(PageMasterUiSchema(store2.theme.myTheme));
@@ -9999,10 +10000,10 @@ var event = (store2, dynamicData2, submitHandler, service2, functionsName) => {
         );
         schema2.properties.RemoveItemButton.disabled = false;
       }
-      const config2 = JSON.parse(sessionStorage.getItem("pageFormdata"));
+      const config = JSON.parse(sessionStorage.getItem("pageFormdata"));
       const path = (_a = store22.searchParams) == null ? void 0 : _a.get("path");
       const id = (_b = store22.searchParams) == null ? void 0 : _b.get("id");
-      let pathArray = [{ label: (_c = config2.name) != null ? _c : "NewPage", path: `/PageMaster${id ? `?id=${id}` : ""}` }];
+      let pathArray = [{ label: (_c = config.name) != null ? _c : "NewPage", path: `/PageMaster${id ? `?id=${id}` : ""}` }];
       if (path) {
         const pathArrayAll = path.split(".");
         const arr = [];
@@ -10014,7 +10015,7 @@ var event = (store2, dynamicData2, submitHandler, service2, functionsName) => {
           arr.push(`${arr[i - 1]}.${e}`);
         });
         arr.map((e) => {
-          const data = _.get(config2, e);
+          const data = _.get(config, e);
           pathArray.push({
             label: (data == null ? void 0 : data.name) || (data == null ? void 0 : data.eventType) || "NewComponent",
             path: (data == null ? void 0 : data.eventType) ? `/ComponentEvents?path=${e}${id ? `&id=${id}` : ""}` : `/Component?path=${e}${id ? `&id=${id}` : ""}`
@@ -10035,10 +10036,10 @@ var event = (store2, dynamicData2, submitHandler, service2, functionsName) => {
       if (sessionStorage.getItem("copiedConfig")) {
         schema2.properties.RemoveItemButton.disabled = false;
       }
-      const config2 = JSON.parse(sessionStorage.getItem("pageFormdata"));
+      const config = JSON.parse(sessionStorage.getItem("pageFormdata"));
       const path = (_a = store2.searchParams) == null ? void 0 : _a.get("path");
       const id = (_b = store2.searchParams) == null ? void 0 : _b.get("id");
-      let pathArray = [{ label: (_c = config2.name) != null ? _c : "NewPage", path: `/PageMaster${id ? `?id=${id}` : ""}` }];
+      let pathArray = [{ label: (_c = config.name) != null ? _c : "NewPage", path: `/PageMaster${id ? `?id=${id}` : ""}` }];
       if (path) {
         const pathArrayAll = path.split(".");
         const arr = [];
@@ -10050,7 +10051,7 @@ var event = (store2, dynamicData2, submitHandler, service2, functionsName) => {
           arr.push(`${arr[i - 1]}.${e}`);
         });
         arr.map((e) => {
-          const data = _.get(config2, e);
+          const data = _.get(config, e);
           pathArray.push({
             label: (data == null ? void 0 : data.name) || (data == null ? void 0 : data.eventType) || "NewComponent",
             path: (data == null ? void 0 : data.eventType) ? `/ComponentEvents?path=${e}${id ? `&id=${id}` : ""}` : `/Component?path=${e}${id ? `&id=${id}` : ""}`
@@ -10517,15 +10518,15 @@ var service = (funcParams) => {
       funcParams.store.newData = {};
       eventGroups = {};
       pageData = await funcParams.pageDataProvider();
-      const config2 = pageData == null ? void 0 : pageData.config;
+      const config = pageData == null ? void 0 : pageData.config;
       const uiSchema = pageData == null ? void 0 : pageData.uiSchema;
       const event2 = new CustomEvent("pageNameChanged", {
-        detail: { pageName: config2.label, hasBackIcon: config2.hasBackIcon === "NO" ? false : true }
+        detail: { pageName: config.label, hasBackIcon: config.hasBackIcon === "NO" ? false : true }
       });
       window.dispatchEvent(event2);
       (_b = (_a = funcParams == null ? void 0 : funcParams.store) == null ? void 0 : _a.theme) == null ? void 0 : _b.myTheme;
       const schema2 = (_c = pageData == null ? void 0 : pageData.schema) != null ? _c : { type: "object", properties: {} };
-      eventGroups = extractEvents(config2);
+      eventGroups = extractEvents(config);
       executeEventsParameters = {
         config: {},
         componentName: "",
@@ -10756,10 +10757,10 @@ var leaderBoard = {
     main: {}
   }
 };
-const buildLeaderBoard = (config2) => {
+const buildLeaderBoard = (config) => {
   const LeaderBoard = _.cloneDeep(leaderBoard);
-  if (config2.elements) {
-    const modifyColumns = config2.elements.map((e, i) => {
+  if (config.elements) {
+    const modifyColumns = config.elements.map((e, i) => {
       if (!e.type) {
         return { accessorKey: e.name, header: e.label || e.name };
       }
@@ -10768,36 +10769,36 @@ const buildLeaderBoard = (config2) => {
     });
     LeaderBoard.elements = modifyColumns;
   }
-  LeaderBoard.config.main.label = config2.label;
-  if (config2.name) {
-    LeaderBoard.scope = `#/properties/${config2.name}`;
+  LeaderBoard.config.main.label = config.label;
+  if (config.name) {
+    LeaderBoard.scope = `#/properties/${config.name}`;
   }
-  if (config2.firstImage) {
-    LeaderBoard.config.main.firstImage = config2.firstImage;
+  if (config.firstImage) {
+    LeaderBoard.config.main.firstImage = config.firstImage;
   }
-  if (config2.secondImage) {
-    LeaderBoard.config.main.secondImage = config2.secondImage;
+  if (config.secondImage) {
+    LeaderBoard.config.main.secondImage = config.secondImage;
   }
-  if (config2.thirdImage) {
-    LeaderBoard.config.main.thirdImage = config2.thirdImage;
+  if (config.thirdImage) {
+    LeaderBoard.config.main.thirdImage = config.thirdImage;
   }
-  if (config2.nameKey) {
-    LeaderBoard.config.main.nameKey = config2.nameKey;
+  if (config.nameKey) {
+    LeaderBoard.config.main.nameKey = config.nameKey;
   }
-  if (config2.imageKey) {
-    LeaderBoard.config.main.imageKey = config2.imageKey;
+  if (config.imageKey) {
+    LeaderBoard.config.main.imageKey = config.imageKey;
   }
-  if (config2.scoreKey) {
-    LeaderBoard.config.main.scoreKey = config2.scoreKey;
+  if (config.scoreKey) {
+    LeaderBoard.config.main.scoreKey = config.scoreKey;
   }
-  if (config2.isScoreAmount) {
-    LeaderBoard.config.main.isScoreAmount = config2.isScoreAmount === "YES" ? true : false;
+  if (config.isScoreAmount) {
+    LeaderBoard.config.main.isScoreAmount = config.isScoreAmount === "YES" ? true : false;
   }
-  if (config2.layout) {
-    LeaderBoard.config.layout = createLayoutFormat(config2.layout, config2.type);
+  if (config.layout) {
+    LeaderBoard.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  if (config2.style) {
-    LeaderBoard.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    LeaderBoard.config.style = JSON.parse(config.style);
   }
   return LeaderBoard;
 };
@@ -10816,44 +10817,44 @@ var progressBar = {
     }
   }
 };
-const buildProgressBarCard = (config2, myScope) => {
+const buildProgressBarCard = (config, myScope) => {
   const progressBarCard = _.cloneDeep(progressBar);
   progressBarCard.scope = myScope;
-  if (config2.heading) {
-    progressBarCard.config.main.heading = config2.heading;
+  if (config.heading) {
+    progressBarCard.config.main.heading = config.heading;
   }
-  if (config2.bottomLabel_3) {
-    progressBarCard.config.main.bottomLabel_3 = config2.bottomLabel_3;
+  if (config.bottomLabel_3) {
+    progressBarCard.config.main.bottomLabel_3 = config.bottomLabel_3;
   }
-  if (config2.bottomLabel_2) {
-    progressBarCard.config.main.bottomLabel_2 = config2.bottomLabel_2;
+  if (config.bottomLabel_2) {
+    progressBarCard.config.main.bottomLabel_2 = config.bottomLabel_2;
   }
-  if (config2.bottomLabel_1) {
-    progressBarCard.elements[0].config.main.bottomLabel_1 = config2.bottomLabel_1;
+  if (config.bottomLabel_1) {
+    progressBarCard.elements[0].config.main.bottomLabel_1 = config.bottomLabel_1;
   }
-  if (config2.layout) {
-    progressBarCard.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    progressBarCard.config.layout = createLayoutFormat(config.layout);
   }
   return progressBarCard;
 };
-const buildProgressBar = (config2, componentScope2) => {
+const buildProgressBar = (config, componentScope) => {
   const ProgressBar = _.cloneDeep(progressBar);
-  ProgressBar.scope = componentScope2;
-  if (config2.layout) {
-    ProgressBar.config.layout = config2.layout;
+  ProgressBar.scope = componentScope;
+  if (config.layout) {
+    ProgressBar.config.layout = config.layout;
   }
-  ProgressBar.config.main.heading = config2.label;
-  if (config2.bottomLabel_3) {
-    ProgressBar.config.main.bottomLabel_3 = config2.bottomLabel_3;
+  ProgressBar.config.main.heading = config.label;
+  if (config.bottomLabel_3) {
+    ProgressBar.config.main.bottomLabel_3 = config.bottomLabel_3;
   }
-  if (config2.layout) {
-    ProgressBar.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    ProgressBar.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.bottomLabel_2) {
-    ProgressBar.config.main.bottomLabel_2 = config2.bottomLabel_2;
+  if (config.bottomLabel_2) {
+    ProgressBar.config.main.bottomLabel_2 = config.bottomLabel_2;
   }
-  if (config2.bottomLabel_1) {
-    ProgressBar.config.main.bottomLabel_1 = config2.bottomLabel_1;
+  if (config.bottomLabel_1) {
+    ProgressBar.config.main.bottomLabel_1 = config.bottomLabel_1;
   }
   return ProgressBar;
 };
@@ -10917,49 +10918,49 @@ const HorizontalBarGraph = {
     style: { containerStyle: {}, labelStyle: { margin: {} }, barStyle: {} }
   }
 };
-const buildHorizontalBarGraph = (config2, componentScope2) => {
+const buildHorizontalBarGraph = (config, componentScope) => {
   const horizontalBarGraph = _.cloneDeep(HorizontalBarGraph);
-  horizontalBarGraph.scope = componentScope2;
-  if (config2.layout) {
-    horizontalBarGraph.config.layout = createLayoutFormat(config2.layout, config2.type);
+  horizontalBarGraph.scope = componentScope;
+  if (config.layout) {
+    horizontalBarGraph.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  horizontalBarGraph.config.main.type = config2.graphType;
-  horizontalBarGraph.scope = componentScope2;
-  horizontalBarGraph.config.main.header = config2.heading;
-  if (config2.legendHide) {
-    horizontalBarGraph.config.main.legendAvailable = config2.legendHide === "YES" ? false : true;
+  horizontalBarGraph.config.main.type = config.graphType;
+  horizontalBarGraph.scope = componentScope;
+  horizontalBarGraph.config.main.header = config.heading;
+  if (config.legendHide) {
+    horizontalBarGraph.config.main.legendAvailable = config.legendHide === "YES" ? false : true;
   }
-  if (config2.bottomAxisAngle) {
-    horizontalBarGraph.config.main.bottomAxisAngle = config2.bottomAxisAngle === "YES" ? true : false;
+  if (config.bottomAxisAngle) {
+    horizontalBarGraph.config.main.bottomAxisAngle = config.bottomAxisAngle === "YES" ? true : false;
   }
-  if (config2.legendLabels) {
-    horizontalBarGraph.config.main.legendLabels = flatObjectValueInArray(config2.legendLabels);
+  if (config.legendLabels) {
+    horizontalBarGraph.config.main.legendLabels = flatObjectValueInArray(config.legendLabels);
   }
-  if (config2.legendDirection) {
-    horizontalBarGraph.config.main.legendDirection = config2.legendDirection === "Row" ? "row" : "column";
+  if (config.legendDirection) {
+    horizontalBarGraph.config.main.legendDirection = config.legendDirection === "Row" ? "row" : "column";
   }
-  if (config2.pieArcColors) {
-    horizontalBarGraph.config.style.barStyle.colorRange = flatObjectValueInArray(config2.pieArcColors);
+  if (config.pieArcColors) {
+    horizontalBarGraph.config.style.barStyle.colorRange = flatObjectValueInArray(config.pieArcColors);
   }
-  if (config2.xAxisValue) {
-    horizontalBarGraph.config.main.xAxisValue = config2.xAxisValue;
+  if (config.xAxisValue) {
+    horizontalBarGraph.config.main.xAxisValue = config.xAxisValue;
   }
-  if (config2.height) {
-    horizontalBarGraph.config.style.containerStyle.height = config2.height;
+  if (config.height) {
+    horizontalBarGraph.config.style.containerStyle.height = config.height;
   }
-  if (config2.leftMargin) {
+  if (config.leftMargin) {
     horizontalBarGraph.config.style.labelStyle.margin = {
-      left: config2.leftMargin
+      left: config.leftMargin
     };
   }
-  if (config2.bottomLabel) {
-    horizontalBarGraph.config.main.bottomLabel = config2.bottomLabel;
+  if (config.bottomLabel) {
+    horizontalBarGraph.config.main.bottomLabel = config.bottomLabel;
   }
-  if (config2.leftLabel) {
-    horizontalBarGraph.config.main.leftLabel = config2.leftLabel;
+  if (config.leftLabel) {
+    horizontalBarGraph.config.main.leftLabel = config.leftLabel;
   }
-  if (config2.disableLeftLabel) {
-    horizontalBarGraph.config.main.disableLeftLabel = config2.disableLeftLabel === "YES" ? true : false;
+  if (config.disableLeftLabel) {
+    horizontalBarGraph.config.main.disableLeftLabel = config.disableLeftLabel === "YES" ? true : false;
   }
   return horizontalBarGraph;
 };
@@ -11009,20 +11010,20 @@ var SpeedoMeter = {
     }
   }
 };
-const buildSpeedoMeter = (config2, componentScope2) => {
+const buildSpeedoMeter = (config, componentScope) => {
   const speedoMeter = _.cloneDeep(SpeedoMeter);
-  speedoMeter.scope = componentScope2;
-  if (config2.layout) {
-    speedoMeter.config.layout = createLayoutFormat(config2.layout);
+  speedoMeter.scope = componentScope;
+  if (config.layout) {
+    speedoMeter.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.heading) {
-    speedoMeter.config.main.header = config2.heading;
+  if (config.heading) {
+    speedoMeter.config.main.header = config.heading;
   }
-  if (config2.segments) {
-    speedoMeter.config.main.segments = config2.segments;
+  if (config.segments) {
+    speedoMeter.config.main.segments = config.segments;
   }
-  if (config2.style) {
-    const styleObj = JSON.parse(config2.style);
+  if (config.style) {
+    const styleObj = JSON.parse(config.style);
     if (styleObj == null ? void 0 : styleObj.style) {
       speedoMeter.config.style = { ...speedoMeter.config.style, ...styleObj.style };
     }
@@ -11030,104 +11031,104 @@ const buildSpeedoMeter = (config2, componentScope2) => {
       speedoMeter.config.style.containerStyle = { ...speedoMeter.config.style.containerStyle, ...styleObj.containerStyle };
     }
   }
-  if (config2.width) {
-    speedoMeter.config.main.width = config2.width;
+  if (config.width) {
+    speedoMeter.config.main.width = config.width;
   }
-  if (config2.speedoCaption) {
-    speedoMeter.config.main.currentValueText = config2.speedoCaption;
+  if (config.speedoCaption) {
+    speedoMeter.config.main.currentValueText = config.speedoCaption;
   }
-  if (config2.data) {
-    speedoMeter.config.main.data = config2.data;
+  if (config.data) {
+    speedoMeter.config.main.data = config.data;
   }
-  if (config2.needleColor) {
-    speedoMeter.config.style.needleColor = config2.needleColor;
+  if (config.needleColor) {
+    speedoMeter.config.style.needleColor = config.needleColor;
   }
-  if (config2.segments) {
-    speedoMeter.config.style.segments = config2.segments;
+  if (config.segments) {
+    speedoMeter.config.style.segments = config.segments;
   }
-  if (config2.endColor) {
-    speedoMeter.config.style.endColor = config2.endColor;
+  if (config.endColor) {
+    speedoMeter.config.style.endColor = config.endColor;
   }
-  if (config2.startColor) {
-    speedoMeter.config.style.startColor = config2.startColor;
+  if (config.startColor) {
+    speedoMeter.config.style.startColor = config.startColor;
   }
-  if (config2.segmentColors) {
-    speedoMeter.config.style.segmentColors = config2.segmentColors;
+  if (config.segmentColors) {
+    speedoMeter.config.style.segmentColors = config.segmentColors;
   }
   return speedoMeter;
 };
-const buildPieGraph = (config2, componentScope2) => {
+const buildPieGraph = (config, componentScope) => {
   const pieGraph = _.cloneDeep(PieGraph);
-  if (config2.layout) {
-    pieGraph.config.layout = createLayoutFormat(config2.layout, config2.type);
+  if (config.layout) {
+    pieGraph.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  if (config2.height) {
-    pieGraph.config.style.containerStyle.height = config2.height;
+  if (config.height) {
+    pieGraph.config.style.containerStyle.height = config.height;
   }
-  if (config2.legendHide) {
-    pieGraph.config.main.legendAvailable = config2.legendHide === "YES" ? false : true;
+  if (config.legendHide) {
+    pieGraph.config.main.legendAvailable = config.legendHide === "YES" ? false : true;
   }
-  if (config2.legendDirection) {
-    pieGraph.config.main.legendDirection = config2.legendDirection === "Row" ? "row" : "column";
+  if (config.legendDirection) {
+    pieGraph.config.main.legendDirection = config.legendDirection === "Row" ? "row" : "column";
   }
-  pieGraph.scope = componentScope2;
-  pieGraph.config.main.header = config2.heading;
-  if (config2.legendLabels) {
-    pieGraph.config.main.legendLabels = flatObjectValueInArray(config2.legendLabels);
+  pieGraph.scope = componentScope;
+  pieGraph.config.main.header = config.heading;
+  if (config.legendLabels) {
+    pieGraph.config.main.legendLabels = flatObjectValueInArray(config.legendLabels);
   }
-  if (config2.xAxisValue) {
-    pieGraph.config.main.xAxisValue = config2.xAxisValue;
+  if (config.xAxisValue) {
+    pieGraph.config.main.xAxisValue = config.xAxisValue;
   }
-  if (config2.pieArcColors) {
-    pieGraph.config.style.pieStyle.colorRange = flatObjectValueInArray(config2.pieArcColors);
+  if (config.pieArcColors) {
+    pieGraph.config.style.pieStyle.colorRange = flatObjectValueInArray(config.pieArcColors);
   }
   return pieGraph;
 };
-const buildStackbarGraph = (config2, componentScope2) => {
+const buildStackbarGraph = (config, componentScope) => {
   var _a;
   const barGraph = _.cloneDeep(BarGraph);
-  if (config2.layout) {
-    barGraph.config.layout = createLayoutFormat(config2.layout, config2.type);
+  if (config.layout) {
+    barGraph.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  if (config2.legendHide) {
-    barGraph.config.main.legendAvailable = config2.legendHide;
-    barGraph.config.main.legendAvailable = config2.legendHide === "YES" ? false : true;
+  if (config.legendHide) {
+    barGraph.config.main.legendAvailable = config.legendHide;
+    barGraph.config.main.legendAvailable = config.legendHide === "YES" ? false : true;
   }
-  if (config2.legendDirection) {
-    barGraph.config.main.legendDirection = config2.legendDirection === "Row" ? "row" : "column";
+  if (config.legendDirection) {
+    barGraph.config.main.legendDirection = config.legendDirection === "Row" ? "row" : "column";
   }
-  if (config2.bottomAxisAngle) {
-    barGraph.config.main.bottomAxisAngle = config2.bottomAxisAngle === "YES" ? true : false;
+  if (config.bottomAxisAngle) {
+    barGraph.config.main.bottomAxisAngle = config.bottomAxisAngle === "YES" ? true : false;
   }
-  barGraph.config.main.type = (_a = config2 == null ? void 0 : config2.graphType) != null ? _a : "BarGraph";
-  barGraph.config.main.header = config2.heading;
-  if (config2.legendLabels) {
-    barGraph.config.main.legendLabels = flatObjectValueInArray(config2.legendLabels);
+  barGraph.config.main.type = (_a = config == null ? void 0 : config.graphType) != null ? _a : "BarGraph";
+  barGraph.config.main.header = config.heading;
+  if (config.legendLabels) {
+    barGraph.config.main.legendLabels = flatObjectValueInArray(config.legendLabels);
   }
-  if (config2.pieArcColors) {
-    barGraph.config.style.barStyle.colorRange = flatObjectValueInArray(config2.pieArcColors);
+  if (config.pieArcColors) {
+    barGraph.config.style.barStyle.colorRange = flatObjectValueInArray(config.pieArcColors);
   }
-  if (config2.xAxisValue) {
-    barGraph.config.main.xAxisValue = config2.xAxisValue;
+  if (config.xAxisValue) {
+    barGraph.config.main.xAxisValue = config.xAxisValue;
   }
-  if (config2.height) {
-    barGraph.config.style.containerStyle.height = config2.height;
+  if (config.height) {
+    barGraph.config.style.containerStyle.height = config.height;
   }
-  if (config2.leftMargin) {
+  if (config.leftMargin) {
     barGraph.config.style.labelStyle.margin = {
-      left: config2.leftMargin
+      left: config.leftMargin
     };
   }
-  if (config2.bottomLabel) {
-    barGraph.config.main.bottomLabel = config2.bottomLabel;
+  if (config.bottomLabel) {
+    barGraph.config.main.bottomLabel = config.bottomLabel;
   }
-  if (config2.leftLabel) {
-    barGraph.config.main.leftLabel = config2.leftLabel;
+  if (config.leftLabel) {
+    barGraph.config.main.leftLabel = config.leftLabel;
   }
-  if (config2.disableLeftLabel) {
-    barGraph.config.main.disableLeftLabel = config2.disableLeftLabel === "YES" ? true : false;
+  if (config.disableLeftLabel) {
+    barGraph.config.main.disableLeftLabel = config.disableLeftLabel === "YES" ? true : false;
   }
-  barGraph.scope = componentScope2;
+  barGraph.scope = componentScope;
   return barGraph;
 };
 var RunnerBoyProgressBar = {
@@ -11141,11 +11142,11 @@ var RunnerBoyProgressBar = {
     main: {}
   }
 };
-const RunnerBoyProgressbar = (config2, componentScope2) => {
+const RunnerBoyProgressbar = (config, componentScope) => {
   const RunnerBoy = _.cloneDeep(RunnerBoyProgressBar);
-  RunnerBoy.scope = componentScope2;
-  if (config2.layout) {
-    RunnerBoy.config.layout = createLayoutFormat(config2.layout);
+  RunnerBoy.scope = componentScope;
+  if (config.layout) {
+    RunnerBoy.config.layout = createLayoutFormat(config.layout);
   }
   return RunnerBoy;
 };
@@ -11160,22 +11161,22 @@ var Tabsection = {
   },
   elements: []
 };
-const buildTabSection = (config2, componentScope2) => {
+const buildTabSection = (config, componentScope) => {
   const tab = _.cloneDeep(Tabsection);
-  tab.scope = componentScope2;
-  if (config2.lazyLoad) {
-    tab.config.main.lazyLoad = config2.lazyLoad === "YES" ? true : false;
+  tab.scope = componentScope;
+  if (config.lazyLoad) {
+    tab.config.main.lazyLoad = config.lazyLoad === "YES" ? true : false;
   }
-  if (config2.orientation) {
-    tab.config.main.orientation = config2.orientation === "YES" ? "vertical" : "horizontal";
+  if (config.orientation) {
+    tab.config.main.orientation = config.orientation === "YES" ? "vertical" : "horizontal";
   }
-  if (config2.sectionLabels) {
-    tab.config.main.tabLabels = config2.sectionLabels.map((e) => e.label);
+  if (config.sectionLabels) {
+    tab.config.main.tabLabels = config.sectionLabels.map((e) => e.label);
   }
-  if (config2.style) {
-    tab.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    tab.config.style = JSON.parse(config.style);
   }
-  tab.config.main.id = config2.name;
+  tab.config.main.id = config.name;
   return tab;
 };
 var WrapperSection = {
@@ -11191,20 +11192,20 @@ var WrapperSection = {
   },
   elements: []
 };
-const buildWrapperSection = (config2, componentScope2) => {
+const buildWrapperSection = (config, componentScope) => {
   const wrapper = _.cloneDeep(WrapperSection);
-  wrapper.scope = componentScope2;
-  wrapper.config.main.label = config2.label;
-  wrapper.config.main.divider = config2.divider === "YES" ? true : false;
-  wrapper.config.main.isAccordion = config2.isAccordion === "No" ? false : true;
-  if (config2.defaultStyle) {
-    wrapper.config.defaultStyle = config2.defaultStyle === "YES" ? true : false;
+  wrapper.scope = componentScope;
+  wrapper.config.main.label = config.label;
+  wrapper.config.main.divider = config.divider === "YES" ? true : false;
+  wrapper.config.main.isAccordion = config.isAccordion === "No" ? false : true;
+  if (config.defaultStyle) {
+    wrapper.config.defaultStyle = config.defaultStyle === "YES" ? true : false;
   }
-  if (config2.style) {
-    wrapper.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    wrapper.config.style = JSON.parse(config.style);
   }
-  if (config2.layout) {
-    wrapper.config.layout = createLayoutFormat(config2.layout, config2.type);
+  if (config.layout) {
+    wrapper.config.layout = createLayoutFormat(config.layout, config.type);
   }
   return wrapper;
 };
@@ -11222,32 +11223,32 @@ var TextInputField = {
     style: {}
   }
 };
-const buildTextField = (config2, componentScope2) => {
+const buildTextField = (config, componentScope) => {
   const inputField = _.cloneDeep(TextInputField);
-  inputField.config.main.label = config2.label;
-  if (config2.style) {
-    inputField.config.style = JSON.parse(config2.style);
+  inputField.config.main.label = config.label;
+  if (config.style) {
+    inputField.config.style = JSON.parse(config.style);
   }
-  if (config2.multiline) {
-    inputField.config.main.multiline = config2.multiline === "YES" ? true : false;
+  if (config.multiline) {
+    inputField.config.main.multiline = config.multiline === "YES" ? true : false;
   }
-  if (config2.keyName) {
-    inputField.config.main.keyName = config2.keyName;
+  if (config.keyName) {
+    inputField.config.main.keyName = config.keyName;
   }
-  if (config2.InputFormatingAndMasking) {
-    inputField.config.main.formatStrArray = config2.InputFormatingAndMasking.map((e) => e.formatElement);
+  if (config.InputFormatingAndMasking) {
+    inputField.config.main.formatStrArray = config.InputFormatingAndMasking.map((e) => e.formatElement);
   }
-  if (config2.placeholder) {
-    inputField.config.main.placeholder = config2.placeholder;
+  if (config.placeholder) {
+    inputField.config.main.placeholder = config.placeholder;
   }
-  if (config2.variant) {
-    inputField.config.main.variant = config2.variant;
+  if (config.variant) {
+    inputField.config.main.variant = config.variant;
   }
-  if (config2.layout) {
-    inputField.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    inputField.config.layout = createLayoutFormat(config.layout);
   }
-  inputField.config.main.errorMessage = `${config2.name} is empty or invalid`;
-  inputField.scope = componentScope2;
+  inputField.config.main.errorMessage = `${config.name} is empty or invalid`;
+  inputField.scope = componentScope;
   return inputField;
 };
 var SelectInputField = {
@@ -11265,25 +11266,25 @@ var SelectInputField = {
     }
   }
 };
-const buildSelect = (config2, componentScope2) => {
+const buildSelect = (config, componentScope) => {
   const selectInputField = _.cloneDeep(SelectInputField);
-  selectInputField.config.main.label = config2.label;
-  if (config2.value) {
-    selectInputField.config.main.options = config2.value;
+  selectInputField.config.main.label = config.label;
+  if (config.value) {
+    selectInputField.config.main.options = config.value;
   }
-  if (config2.freeSolo) {
-    selectInputField.config.main.freeSolo = config2.freeSolo === "YES" ? true : false;
+  if (config.freeSolo) {
+    selectInputField.config.main.freeSolo = config.freeSolo === "YES" ? true : false;
   }
-  if (config2.lazyLoading) {
-    selectInputField.config.main.lazyLoading = config2.lazyLoading === "YES" ? true : false;
+  if (config.lazyLoading) {
+    selectInputField.config.main.lazyLoading = config.lazyLoading === "YES" ? true : false;
   }
-  if (config2.variant) {
-    selectInputField.config.main.variant = config2.variant;
+  if (config.variant) {
+    selectInputField.config.main.variant = config.variant;
   }
-  if (config2.layout) {
-    selectInputField.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    selectInputField.config.layout = createLayoutFormat(config.layout);
   }
-  selectInputField.scope = componentScope2;
+  selectInputField.scope = componentScope;
   return selectInputField;
 };
 var Button = {
@@ -11307,37 +11308,37 @@ var Button = {
     style: {}
   }
 };
-const buildButton = (config2, componentScope2) => {
+const buildButton = (config, componentScope) => {
   const button = _.cloneDeep(Button);
-  if (config2.buttonType) {
-    button.options.widget = config2.buttonType === "IconButton" ? "IconButton" : "Button";
-    config2.buttonType === "ButtonWithIconAndText" ? button.config.main.startIcon = config2.iconName : button.config.main.icon = config2.iconName;
+  if (config.buttonType) {
+    button.options.widget = config.buttonType === "IconButton" ? "IconButton" : "Button";
+    config.buttonType === "ButtonWithIconAndText" ? button.config.main.startIcon = config.iconName : button.config.main.icon = config.iconName;
   }
-  if (config2.layout) {
-    button.config.layout = createLayoutFormat(config2.layout, config2.type);
+  if (config.layout) {
+    button.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  if (config2.tooltipMessage) {
-    button.config.main.tooltipMessage = config2.tooltipMessage;
+  if (config.tooltipMessage) {
+    button.config.main.tooltipMessage = config.tooltipMessage;
   }
-  if (config2.defaultStyle) {
-    if (config2.buttonType === "IconButton") {
-      button.config.main.styleDefault = config2.defaultStyle === "true" ? true : false;
+  if (config.defaultStyle) {
+    if (config.buttonType === "IconButton") {
+      button.config.main.styleDefault = config.defaultStyle === "true" ? true : false;
     } else {
-      button.config.main.enableDefaultStyle = config2.defaultStyle === "true" ? false : true;
+      button.config.main.enableDefaultStyle = config.defaultStyle === "true" ? false : true;
     }
   }
-  button.scope = componentScope2;
-  if (config2.style) {
-    button.config.style = JSON.parse(config2.style);
+  button.scope = componentScope;
+  if (config.style) {
+    button.config.style = JSON.parse(config.style);
   }
-  if (config2.size) {
-    button.config.main.size = config2.size;
+  if (config.size) {
+    button.config.main.size = config.size;
   }
-  if (config2.color) {
-    button.config.main.color = config2.color;
+  if (config.color) {
+    button.config.main.color = config.color;
   }
-  if (config2.label) {
-    button.config.main.name = config2.label;
+  if (config.label) {
+    button.config.main.name = config.label;
   }
   return button;
 };
@@ -11363,83 +11364,83 @@ var Table = {
     }
   }
 };
-const buildTable = (config2, componentScope2) => {
+const buildTable = (config, componentScope) => {
   const table = _.cloneDeep(Table);
-  table.scope = componentScope2;
-  if (config2.style) {
-    table.config.style = JSON.parse(config2.style);
+  table.scope = componentScope;
+  if (config.style) {
+    table.config.style = JSON.parse(config.style);
   }
-  if (config2.lazyLoading) {
-    table.config.main.lazyLoading = config2.lazyLoading === "YES" ? true : false;
+  if (config.lazyLoading) {
+    table.config.main.lazyLoading = config.lazyLoading === "YES" ? true : false;
   }
-  if (config2.defaultColumnSize) {
-    table.config.main.defaultColumnSize = config2.defaultColumnSize;
+  if (config.defaultColumnSize) {
+    table.config.main.defaultColumnSize = config.defaultColumnSize;
   }
-  if (config2.enableRowMovement) {
-    table.config.main.enableRowMovement = config2.enableRowMovement === "YES" ? true : false;
+  if (config.enableRowMovement) {
+    table.config.main.enableRowMovement = config.enableRowMovement === "YES" ? true : false;
   }
-  if (config2.enableExpanding) {
-    table.config.main.enableExpanding = config2.enableExpanding === "YES" ? true : false;
+  if (config.enableExpanding) {
+    table.config.main.enableExpanding = config.enableExpanding === "YES" ? true : false;
   }
-  if (config2.enableExpandAll) {
-    table.config.main.enableExpandAll = config2.enableExpandAll === "YES" ? true : false;
+  if (config.enableExpandAll) {
+    table.config.main.enableExpandAll = config.enableExpandAll === "YES" ? true : false;
   }
-  if (config2.filterFromLeafRows) {
-    table.config.main.filterFromLeafRows = config2.filterFromLeafRows === "YES" ? true : false;
+  if (config.filterFromLeafRows) {
+    table.config.main.filterFromLeafRows = config.filterFromLeafRows === "YES" ? true : false;
   }
-  if (config2.paginateExpandedRows) {
-    table.config.main.paginateExpandedRows = config2.paginateExpandedRows === "YES" ? true : false;
+  if (config.paginateExpandedRows) {
+    table.config.main.paginateExpandedRows = config.paginateExpandedRows === "YES" ? true : false;
   }
-  if (config2.treeStructure) {
-    table.config.main.treeStructure = config2.treeStructure === "YES" ? "flatTreeMap" : false;
+  if (config.treeStructure) {
+    table.config.main.treeStructure = config.treeStructure === "YES" ? "flatTreeMap" : false;
   }
-  if (config2.SelectionAvailable) {
-    table.config.main.Selection = config2.SelectionAvailable === "YES" ? true : false;
+  if (config.SelectionAvailable) {
+    table.config.main.Selection = config.SelectionAvailable === "YES" ? true : false;
   }
-  if (config2.ColumnResizingAvailable) {
-    table.config.main.disableColumnResizing = config2.ColumnResizingAvailable === "YES" ? false : true;
+  if (config.ColumnResizingAvailable) {
+    table.config.main.disableColumnResizing = config.ColumnResizingAvailable === "YES" ? false : true;
   }
-  if (config2.DragAvailable) {
-    table.config.main.enableDrag = config2.DragAvailable === "YES" ? true : false;
+  if (config.DragAvailable) {
+    table.config.main.enableDrag = config.DragAvailable === "YES" ? true : false;
   }
-  if (config2.downloadAllData) {
-    table.config.main.downloadAllData = config2.downloadAllData === "YES" ? true : false;
+  if (config.downloadAllData) {
+    table.config.main.downloadAllData = config.downloadAllData === "YES" ? true : false;
   }
-  if (config2.disableGlobalSearch) {
-    table.config.main.disableGlobalSearch = config2.disableGlobalSearch === "YES" ? true : false;
+  if (config.disableGlobalSearch) {
+    table.config.main.disableGlobalSearch = config.disableGlobalSearch === "YES" ? true : false;
   }
-  if (config2.disableColumnFilter) {
-    table.config.main.disableColumnFilter = config2.disableColumnFilter === "YES" ? true : false;
+  if (config.disableColumnFilter) {
+    table.config.main.disableColumnFilter = config.disableColumnFilter === "YES" ? true : false;
   }
-  if (config2.disableSorting) {
-    table.config.main.disableSorting = config2.disableSorting === "YES" ? true : false;
+  if (config.disableSorting) {
+    table.config.main.disableSorting = config.disableSorting === "YES" ? true : false;
   }
-  if (config2.disableEditColumn) {
-    table.config.main.disableEditColumn = config2.disableEditColumn === "YES" ? true : false;
+  if (config.disableEditColumn) {
+    table.config.main.disableEditColumn = config.disableEditColumn === "YES" ? true : false;
   }
-  if (config2.disableFullScreenToggle) {
-    table.config.main.disableFullScreenToggle = config2.disableFullScreenToggle === "YES" ? true : false;
+  if (config.disableFullScreenToggle) {
+    table.config.main.disableFullScreenToggle = config.disableFullScreenToggle === "YES" ? true : false;
   }
-  if (config2.disableDensityToggle) {
-    table.config.main.disableDensityToggle = config2.disableDensityToggle === "YES" ? true : false;
+  if (config.disableDensityToggle) {
+    table.config.main.disableDensityToggle = config.disableDensityToggle === "YES" ? true : false;
   }
-  if (config2.disableDownloadFile) {
-    table.config.main.disableDownloadFile = config2.disableDownloadFile === "YES" ? true : false;
+  if (config.disableDownloadFile) {
+    table.config.main.disableDownloadFile = config.disableDownloadFile === "YES" ? true : false;
   }
-  if (config2.disablePagination) {
-    table.config.main.disablePagination = config2.disablePagination === "YES" ? true : false;
+  if (config.disablePagination) {
+    table.config.main.disablePagination = config.disablePagination === "YES" ? true : false;
   }
-  if (config2.Table_Download_Keys_Name) {
-    table.config.main.TableDownloadKeysName = config2.Table_Download_Keys_Name.map((e) => e.KeyName);
+  if (config.Table_Download_Keys_Name) {
+    table.config.main.TableDownloadKeysName = config.Table_Download_Keys_Name.map((e) => e.KeyName);
   }
-  if (config2.selectKey) {
-    table.config.main.selectKey = config2.selectKey;
+  if (config.selectKey) {
+    table.config.main.selectKey = config.selectKey;
   }
-  if (config2.maxPageSize) {
-    table.config.main.maxPageSize = config2.maxPageSize;
+  if (config.maxPageSize) {
+    table.config.main.maxPageSize = config.maxPageSize;
   }
-  if (config2.initialDensity) {
-    table.config.main.initialDensity = config2.initialDensity;
+  if (config.initialDensity) {
+    table.config.main.initialDensity = config.initialDensity;
   }
   return table;
 };
@@ -11457,18 +11458,18 @@ const Box = {
     style: {}
   }
 };
-const buildLabel = (config2, componentScope2) => {
+const buildLabel = (config, componentScope) => {
   const box = _.cloneDeep(Box);
-  box.scope = componentScope2;
-  box.config.main.heading = config2.label;
-  if (config2.layout) {
-    box.config.layout = createLayoutFormat(config2.layout);
+  box.scope = componentScope;
+  box.config.main.heading = config.label;
+  if (config.layout) {
+    box.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.iconName) {
-    box.config.main.iconName = config2.iconName;
+  if (config.iconName) {
+    box.config.main.iconName = config.iconName;
   }
-  if (config2.style) {
-    box.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    box.config.style = JSON.parse(config.style);
   }
   return box;
 };
@@ -11508,40 +11509,40 @@ const downloadFile = {
     "widget": "DownloadFile"
   }
 };
-const buildUploadFile = (config2, componentScope2) => {
+const buildUploadFile = (config, componentScope) => {
   const UploadFile = _.cloneDeep(uploadFile);
-  UploadFile.scope = componentScope2;
-  UploadFile.config.main.label = config2.label;
-  if (config2.layout) {
-    UploadFile.config.layout = createLayoutFormat(config2.layout);
+  UploadFile.scope = componentScope;
+  UploadFile.config.main.label = config.label;
+  if (config.layout) {
+    UploadFile.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.style) {
-    UploadFile.config.style = config2.style;
+  if (config.style) {
+    UploadFile.config.style = config.style;
   }
-  if (config2.required) {
+  if (config.required) {
     UploadFile.config.main.required = true;
   }
-  UploadFile.config.main.errorMessage = config2.errorMessage;
+  UploadFile.config.main.errorMessage = config.errorMessage;
   return UploadFile;
 };
-const buildDownloadFile = (config2, componentScope2) => {
+const buildDownloadFile = (config, componentScope) => {
   const DownloadFile = _.cloneDeep(downloadFile);
-  DownloadFile.scope = componentScope2;
-  DownloadFile.config.main.label = config2.label;
-  if (config2.layout) {
-    DownloadFile.config.layout = config2.layout;
+  DownloadFile.scope = componentScope;
+  DownloadFile.config.main.label = config.label;
+  if (config.layout) {
+    DownloadFile.config.layout = config.layout;
   }
-  if (config2.style) {
-    DownloadFile.config.style = config2.style;
+  if (config.style) {
+    DownloadFile.config.style = config.style;
   }
-  if (config2.required) {
+  if (config.required) {
     DownloadFile.config.main.required = true;
   }
-  if (config2.layout) {
-    DownloadFile.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    DownloadFile.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.errorMessage) {
-    DownloadFile.config.main.errorMessage = config2.errorMessage;
+  if (config.errorMessage) {
+    DownloadFile.config.main.errorMessage = config.errorMessage;
   }
   return DownloadFile;
 };
@@ -11559,181 +11560,24 @@ function Card(theme) {
         },
         componentsBoxStyle: {
           boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
-          flexDirection: "row",
+          flexDirection: "column",
           flexWrap: "nowrap",
           width: "100% !important",
           background: "transparent",
-          border: `1.5px solid ${theme.palette.primary.light}`,
           borderRadius: "8px",
-          padding: "0px 4px",
+          padding: "20px 20px 20px 14px",
           height: "100%",
-          alignItems: "center",
+          minHeight: "140px",
+          position: "relative",
           marginLeft: "0px",
           "&: hover": {
-            background: `${theme.palette.primary.main}`,
-            border: `1.5px solid black`,
-            "& p": {
-              color: "white"
-            }
+            background: `${theme.palette.primary.main}`
           }
         }
       },
-      layout: { xs: 12, sm: 12, md: 6, lg: 6 }
+      layout: { xs: 12, sm: 12, md: 6, lg: 3 }
     },
     elements: [
-      {
-        type: "HorizontalLayout",
-        config: {
-          layout: 9
-        },
-        elements: [
-          {
-            type: "WrapperLayout",
-            config: {
-              main: {
-                columnSpacing: 0,
-                gap: 0
-              },
-              style: {
-                wrapperStyle: {
-                  background: "transparent",
-                  marginBottom: 0
-                },
-                componentsBoxStyle: {
-                  flexDirection: "column",
-                  flexWrap: "nowrap",
-                  width: "100%",
-                  height: "inherit",
-                  background: "transparent",
-                  borderRadius: "0px",
-                  paddingRight: 0
-                }
-              },
-              layout: 12
-            },
-            elements: [
-              {
-                type: "WrapperLayout",
-                config: {
-                  main: {
-                    columnSpacing: 0,
-                    gap: 0
-                  },
-                  style: {
-                    wrapperStyle: {
-                      background: "transparent",
-                      marginBottom: 0
-                    },
-                    componentsBoxStyle: {
-                      flexDirection: "row",
-                      flexWrap: "nowrap",
-                      width: "100%",
-                      height: "0",
-                      background: "transparent",
-                      borderRadius: "0px",
-                      marginLeft: "-10px",
-                      marginTop: "-8px",
-                      justifyContent: "start",
-                      position: "relative"
-                    }
-                  },
-                  layout: 12
-                },
-                elements: [
-                  {
-                    type: "Control",
-                    scope: "#/properties/programType",
-                    config: {
-                      main: {
-                        heading: ""
-                      },
-                      style: {
-                        color: "black",
-                        display: "flex",
-                        fontSize: { xs: "24px", md: "28px" },
-                        fontWeight: "bold",
-                        background: "inherit",
-                        justifyContent: "flex-start",
-                        width: "auto",
-                        margin: "-8px",
-                        marginLeft: "-24px",
-                        height: 0
-                      }
-                    },
-                    options: {
-                      widget: "Box"
-                    }
-                  },
-                  {
-                    type: "Control",
-                    scope: "#/properties/programType",
-                    config: {
-                      main: {
-                        heading: "5000.00"
-                      },
-                      style: {
-                        color: "black",
-                        display: "flex",
-                        fontSize: { xs: "24px", md: "25px" },
-                        fontWeight: "bold",
-                        background: "inherit",
-                        justifyContent: "flex-start",
-                        width: "auto",
-                        margin: "-8px",
-                        marginTop: "-6px",
-                        position: "absolute",
-                        left: "7px",
-                        whiteSpace: "nowrap",
-                        overflowX: "auto",
-                        overflowY: "hidden",
-                        scrollbarWidth: "none",
-                        msOverflowStyle: "none",
-                        maxWidth: "calc(100% + 20px)",
-                        "&::-webkit-scrollbar": {
-                          display: "none"
-                        }
-                      }
-                    },
-                    options: {
-                      widget: "Box"
-                    }
-                  }
-                ]
-              },
-              {
-                type: "Control",
-                scope: "#/properties/programType",
-                config: {
-                  main: {
-                    heading: "Total Earnings"
-                  },
-                  style: {
-                    color: "black",
-                    fontSize: "16px",
-                    justifyContent: "center",
-                    whiteSpace: "nowrap",
-                    overflowX: "auto",
-                    overflowY: "hidden",
-                    scrollbarWidth: "none",
-                    msOverflowStyle: "none",
-                    background: "inherit",
-                    width: "calc(100% + 8px)",
-                    margin: "-8px",
-                    marginTop: { xs: "16px", md: "20px" },
-                    "&::-webkit-scrollbar": {
-                      display: "none"
-                    }
-                  },
-                  layout: 12
-                },
-                options: {
-                  widget: "Box"
-                }
-              }
-            ]
-          }
-        ]
-      },
       {
         type: "Control",
         scope: "#/properties/programType",
@@ -11743,51 +11587,140 @@ function Card(theme) {
           },
           style: {
             containerStyle: {
-              height: "100%",
+              position: "absolute",
+              top: "12px",
+              right: "12px",
               display: "flex",
-              justifyContent: "end"
+              justifyContent: "flex-end",
+              alignItems: "flex-start"
             },
             imageStyle: {
-              width: "unset",
-              fontSize: "none",
-              padding: "4px",
-              margin: "0px 0px 0px 8px",
-              height: "64px"
+              width: "48px",
+              height: "48px",
+              padding: "0px",
+              margin: "0px"
             }
-          },
-          layout: 3
+          }
         },
         options: {
           widget: "Image"
         }
+      },
+      {
+        type: "Control",
+        scope: "#/properties/programType",
+        config: {
+          main: {
+            heading: "Total Earnings"
+          },
+          style: {
+            color: "black",
+            fontSize: "17px",
+            fontWeight: "200",
+            justifyContent: "flex-start",
+            background: "inherit",
+            margin: "0px",
+            marginTop: "-8px",
+            marginBottom: "12px",
+            maxWidth: "160px",
+            whiteSpace: "nowrap",
+            overflowX: "auto",
+            scrollbarWidth: "none",
+            "&::-webkit-scrollbar": {
+              display: "none"
+            }
+          }
+        },
+        options: {
+          widget: "Box"
+        }
+      },
+      {
+        type: "Control",
+        scope: "#/properties/programType",
+        config: {
+          main: {
+            heading: "5000.00"
+          },
+          style: {
+            color: "black",
+            display: "flex",
+            fontSize: { xs: "22px", md: "30px" },
+            fontWeight: "450",
+            background: "inherit",
+            justifyContent: "flex-start",
+            width: "100%",
+            margin: "0px",
+            marginBottom: "8px",
+            lineHeight: "1",
+            maxWidth: "200px",
+            whiteSpace: "nowrap",
+            overflowX: "auto",
+            scrollbarWidth: "none",
+            "&::-webkit-scrollbar": {
+              display: "none"
+            }
+          }
+        },
+        options: {
+          widget: "Box"
+        }
+      },
+      {
+        type: "Control",
+        scope: "#/properties/programType",
+        config: {
+          main: {
+            heading: "Increased from last month"
+          },
+          style: {
+            color: "#767677ff",
+            fontSize: "11px",
+            fontWeight: "400",
+            justifyContent: "flex-start",
+            background: "inherit",
+            margin: "0px",
+            paddingLeft: "2px",
+            maxWidth: "200px",
+            whiteSpace: "nowrap",
+            overflowX: "auto",
+            scrollbarWidth: "none",
+            "&::-webkit-scrollbar": {
+              display: "none"
+            }
+          }
+        },
+        options: {
+          widget: "Box"
+        }
       }
     ]
   };
   return uiSchema;
 }
-const buildCard = (config, componentScope, store) => {
-  const card = _.cloneDeep(Card(store.theme.myTheme));
+const buildCard = (config, componentScope, store2) => {
+  const card = _.cloneDeep(Card(store2.theme.myTheme));
   if (config.style) {
     card.config.wrapperStyle = JSON.parse(config.style);
   }
-  card.elements[0].elements[0].elements[0].elements[1].scope = `#/properties/${config.name}/properties/value`;
-  card.elements[1].scope = `#/properties/${config.name}/properties/url`;
-  card.elements[0].elements[0].elements[1].scope = `#/properties/${config.name}/properties/description`;
+  card.elements[2].scope = `#/properties/${config.name}/properties/value`;
+  card.elements[0].scope = `#/properties/${config.name}/properties/url`;
+  card.elements[3].scope = `#/properties/${config.name}/properties/description`;
+  card.elements[1].scope = `#/properties/${config.name}/properties/label`;
   if (config.layout) {
     card.config.layout = createLayoutFormat(config.layout);
   }
-  if (config == null ? void 0 : config.titleIcon) {
-    card.elements[0].elements[0].elements[0].elements[0].config.main.heading = eval(`'\\${config.titleIcon}'`);
-    card.elements[0].elements[0].elements[0].elements[1].config.style.left = "24px";
-  }
   if (config.label) {
-    card.elements[0].elements[0].elements[0].elements[1].config.main.heading = config.label;
+    card.elements[1].config.main.heading = config.label;
   }
   if (config.url) {
-    card.elements[1].config.main.url = config.url;
+    card.elements[0].config.main.url = config.url;
   }
   if (config.description) {
-    card.elements[0].elements[0].elements[1].config.main.heading = config.description;
+    card.elements[3].config.main.heading = config.description;
+  }
+  if (config.value) {
+    card.elements[2].config.main.heading = config.value;
   }
   return card;
 };
@@ -11819,29 +11752,29 @@ const DateTime = {
     }
   }
 };
-const buildDate = (config2, componentScope2) => {
+const buildDate = (config, componentScope) => {
   const dateInputField = _.cloneDeep(DateInputField);
-  dateInputField.config.main.label = config2.label;
-  dateInputField.config.main.errorMessage = `${config2.name} is empty or invalid`;
-  dateInputField.scope = componentScope2;
-  if (config2.layout) {
-    dateInputField.config.layout = createLayoutFormat(config2.layout);
+  dateInputField.config.main.label = config.label;
+  dateInputField.config.main.errorMessage = `${config.name} is empty or invalid`;
+  dateInputField.scope = componentScope;
+  if (config.layout) {
+    dateInputField.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.variant) {
-    dateInputField.config.main.variant = config2.variant;
+  if (config.variant) {
+    dateInputField.config.main.variant = config.variant;
   }
   return dateInputField;
 };
-const buildDateTime = (config2, componentScope2) => {
+const buildDateTime = (config, componentScope) => {
   const dateTimeInputField = _.cloneDeep(DateTime);
-  dateTimeInputField.config.main.label = config2.label;
-  dateTimeInputField.config.main.errorMessage = `${config2.name} is empty or invalid`;
-  dateTimeInputField.scope = componentScope2;
-  if (config2.layout) {
-    dateTimeInputField.config.layout = createLayoutFormat(config2.layout);
+  dateTimeInputField.config.main.label = config.label;
+  dateTimeInputField.config.main.errorMessage = `${config.name} is empty or invalid`;
+  dateTimeInputField.scope = componentScope;
+  if (config.layout) {
+    dateTimeInputField.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.variant) {
-    dateTimeInputField.config.main.variant = config2.variant;
+  if (config.variant) {
+    dateTimeInputField.config.main.variant = config.variant;
   }
   return dateTimeInputField;
 };
@@ -11856,17 +11789,17 @@ var RankCard = {
     main: {}
   }
 };
-const buildRankCard = (config2, componentScope2) => {
+const buildRankCard = (config, componentScope) => {
   const rankCard = _.cloneDeep(RankCard);
-  rankCard.scope = componentScope2;
-  if (config2.rank) {
-    rankCard.config.main.rank = `${config2.rank}`;
+  rankCard.scope = componentScope;
+  if (config.rank) {
+    rankCard.config.main.rank = `${config.rank}`;
   }
-  if (config2.height) {
-    rankCard.config.main.height = `${config2.height}px`;
+  if (config.height) {
+    rankCard.config.main.height = `${config.height}px`;
   }
-  if (config2.layout) {
-    rankCard.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    rankCard.config.layout = createLayoutFormat(config.layout);
   }
   return rankCard;
 };
@@ -11881,13 +11814,13 @@ var RollAndDice = {
     main: {}
   }
 };
-const buildRollAndDice = (config2, componentScope2) => {
+const buildRollAndDice = (config, componentScope) => {
   const rank = _.cloneDeep(RollAndDice);
-  if (config2.name) {
-    rank.scope = componentScope2;
+  if (config.name) {
+    rank.scope = componentScope;
   }
-  if (config2.layout) {
-    rank.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    rank.config.layout = createLayoutFormat(config.layout);
   }
   return rank;
 };
@@ -11908,14 +11841,14 @@ var Timer = {
     style: {}
   }
 };
-const buildTimer = (config2, componentScope2) => {
+const buildTimer = (config, componentScope) => {
   const timer = _.cloneDeep(Timer);
-  timer.scope = componentScope2;
-  if (config2.label) {
-    timer.config.main.label = config2.label;
+  timer.scope = componentScope;
+  if (config.label) {
+    timer.config.main.label = config.label;
   }
-  if (config2.layout) {
-    timer.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    timer.config.layout = createLayoutFormat(config.layout);
   }
   return timer;
 };
@@ -11936,33 +11869,33 @@ var MultipleSelect = {
     }
   }
 };
-const buildMultiSelect = (config2, componentScope2) => {
+const buildMultiSelect = (config, componentScope) => {
   const multipleSelect = _.cloneDeep(MultipleSelect);
-  multipleSelect.scope = componentScope2;
-  if (config2.label) {
-    multipleSelect.config.main.label = config2.label;
+  multipleSelect.scope = componentScope;
+  if (config.label) {
+    multipleSelect.config.main.label = config.label;
   }
-  if (config2.layout) {
-    multipleSelect.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    multipleSelect.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.value) {
-    multipleSelect.config.main.options = config2.value;
+  if (config.value) {
+    multipleSelect.config.main.options = config.value;
   }
-  if (config2.variant) {
-    multipleSelect.config.main.variant = config2.variant;
+  if (config.variant) {
+    multipleSelect.config.main.variant = config.variant;
   }
-  if (config2.lazyLoading) {
-    multipleSelect.config.main.lazyLoading = config2.lazyLoading === "YES" ? true : false;
+  if (config.lazyLoading) {
+    multipleSelect.config.main.lazyLoading = config.lazyLoading === "YES" ? true : false;
   }
   return multipleSelect;
 };
-const buildBasicUiSchema = (config2) => {
+const buildBasicUiSchema = (config) => {
   return {
     "type": "HorizontalLayout",
-    pageName: config2.name,
-    name: config2.name,
-    accessorKey: config2.name,
-    heading: config2.label || config2.name,
+    pageName: config.name,
+    name: config.name,
+    accessorKey: config.name,
+    heading: config.label || config.name,
     "elements": []
   };
 };
@@ -11993,25 +11926,25 @@ const TextArea = {
     }
   }
 };
-const buildTextArea = (config2, componentScope2) => {
+const buildTextArea = (config, componentScope) => {
   const textArea = _.cloneDeep(TextArea);
-  textArea.config.main.heading = config2.label;
-  if (config2.layout) {
-    textArea.config.layout = createLayoutFormat(config2.layout, config2.type);
+  textArea.config.main.heading = config.label;
+  if (config.layout) {
+    textArea.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  if (config2.style) {
-    textArea.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    textArea.config.style = JSON.parse(config.style);
   }
-  if (config2.placeholder) {
-    textArea.config.main.placeholder = config2.placeholder;
+  if (config.placeholder) {
+    textArea.config.main.placeholder = config.placeholder;
   }
-  if (config2.enableCodeEditor) {
-    textArea.config.main.enableCodeEditor = config2.enableCodeEditor === "YES" ? true : false;
+  if (config.enableCodeEditor) {
+    textArea.config.main.enableCodeEditor = config.enableCodeEditor === "YES" ? true : false;
   }
-  if (config2.codeEditorLanguage) {
-    textArea.config.main.codeEditorLanguage = config2.codeEditorLanguage;
+  if (config.codeEditorLanguage) {
+    textArea.config.main.codeEditorLanguage = config.codeEditorLanguage;
   }
-  textArea.scope = componentScope2;
+  textArea.scope = componentScope;
   return textArea;
 };
 var cardSlider = {
@@ -12026,13 +11959,13 @@ var cardSlider = {
     main: {}
   }
 };
-const buildSlider = (config2, componentScope2) => {
+const buildSlider = (config, componentScope) => {
   const slider = _.cloneDeep(cardSlider);
-  if (config2.name) {
-    slider.scope = componentScope2;
+  if (config.name) {
+    slider.scope = componentScope;
   }
-  if (config2.layout) {
-    slider.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    slider.config.layout = createLayoutFormat(config.layout);
   }
   return slider;
 };
@@ -12049,63 +11982,63 @@ const Checkbox = {
     }
   }
 };
-const buildCheckbox = (config2, componentScope2) => {
+const buildCheckbox = (config, componentScope) => {
   const check = _.cloneDeep(Checkbox);
-  check.scope = componentScope2;
-  check.config.main.label = config2.label;
-  if (config2.layout) {
-    check.config.layout = createLayoutFormat(config2.layout);
+  check.scope = componentScope;
+  check.config.main.label = config.label;
+  if (config.layout) {
+    check.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.style) {
-    check.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    check.config.style = JSON.parse(config.style);
   }
   return check;
 };
-const buildLineGraph = (config2, componentScope2) => {
+const buildLineGraph = (config, componentScope) => {
   const lineGraph = _.cloneDeep(LineGraph);
-  if (config2.layout) {
-    lineGraph.config.layout = createLayoutFormat(config2.layout, config2.type);
+  if (config.layout) {
+    lineGraph.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  lineGraph.config.main.header = config2.heading;
-  if (config2.height) {
-    lineGraph.config.style.containerStyle.height = config2.height;
+  lineGraph.config.main.header = config.heading;
+  if (config.height) {
+    lineGraph.config.style.containerStyle.height = config.height;
   }
-  if (config2.leftMargin) {
+  if (config.leftMargin) {
     lineGraph.config.style.labelStyle.margin = {
-      left: config2.leftMargin
+      left: config.leftMargin
     };
   }
-  if (config2.bottomLabel) {
-    lineGraph.config.main.bottomLabel = config2.bottomLabel;
+  if (config.bottomLabel) {
+    lineGraph.config.main.bottomLabel = config.bottomLabel;
   }
-  if (config2.yAxisValue) {
-    lineGraph.config.main.yAxisValue = config2.yAxisValue;
+  if (config.yAxisValue) {
+    lineGraph.config.main.yAxisValue = config.yAxisValue;
   }
-  if (config2.xAxisValue) {
-    lineGraph.config.main.xAxisValue = config2.xAxisValue;
+  if (config.xAxisValue) {
+    lineGraph.config.main.xAxisValue = config.xAxisValue;
   }
-  if (config2.leftLabel) {
-    lineGraph.config.main.leftLabel = config2.leftLabel;
+  if (config.leftLabel) {
+    lineGraph.config.main.leftLabel = config.leftLabel;
   }
-  if (config2.disableLeftLabel) {
-    lineGraph.config.main.disableLeftLabel = config2.disableLeftLabel === "YES" ? true : false;
+  if (config.disableLeftLabel) {
+    lineGraph.config.main.disableLeftLabel = config.disableLeftLabel === "YES" ? true : false;
   }
-  if (config2.legendHide) {
-    lineGraph.config.main.legendAvailable = config2.legendHide === "YES" ? false : true;
+  if (config.legendHide) {
+    lineGraph.config.main.legendAvailable = config.legendHide === "YES" ? false : true;
   }
-  if (config2.legendDirection) {
-    lineGraph.config.main.legendDirection = config2.legendDirection === "Row" ? "row" : "column";
+  if (config.legendDirection) {
+    lineGraph.config.main.legendDirection = config.legendDirection === "Row" ? "row" : "column";
   }
-  if (config2.bottomAxisAngle) {
-    lineGraph.config.main.bottomAxisAngle = config2.bottomAxisAngle === "YES" ? true : false;
+  if (config.bottomAxisAngle) {
+    lineGraph.config.main.bottomAxisAngle = config.bottomAxisAngle === "YES" ? true : false;
   }
-  if (config2.legendLabels) {
-    lineGraph.config.main.legendLabels = flatObjectValueInArray(config2.legendLabels);
+  if (config.legendLabels) {
+    lineGraph.config.main.legendLabels = flatObjectValueInArray(config.legendLabels);
   }
-  if (config2.pieArcColors) {
-    lineGraph.config.style.lineStyle.colorRange = flatObjectValueInArray(config2.pieArcColors);
+  if (config.pieArcColors) {
+    lineGraph.config.style.lineStyle.colorRange = flatObjectValueInArray(config.pieArcColors);
   }
-  lineGraph.scope = componentScope2;
+  lineGraph.scope = componentScope;
   return lineGraph;
 };
 const RadioUiSchema = {
@@ -12122,21 +12055,21 @@ const RadioUiSchema = {
     }
   }
 };
-const buildRadio = (config2, componentScope2) => {
+const buildRadio = (config, componentScope) => {
   const Radio = _.cloneDeep(RadioUiSchema);
-  Radio.scope = componentScope2;
-  Radio.config.main.label = config2.label;
-  if (config2.layout) {
-    Radio.config.layout = createLayoutFormat(config2.layout);
+  Radio.scope = componentScope;
+  Radio.config.main.label = config.label;
+  if (config.layout) {
+    Radio.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.sectionLabels) {
-    Radio.config.main.options = config2.sectionLabels.map((e) => e.label || e.Options);
+  if (config.sectionLabels) {
+    Radio.config.main.options = config.sectionLabels.map((e) => e.label || e.Options);
   }
-  if (config2.style) {
-    Radio.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    Radio.config.style = JSON.parse(config.style);
   }
-  if (config2.errorMessage) {
-    Radio.config.main.errorMessage = config2.errorMessage;
+  if (config.errorMessage) {
+    Radio.config.main.errorMessage = config.errorMessage;
   }
   return Radio;
 };
@@ -12152,10 +12085,10 @@ var emptyBox = {
     style: {}
   }
 };
-const buildEmptyBox = (config2, componentScope2) => {
+const buildEmptyBox = (config, componentScope) => {
   const EmptyBox = _.cloneDeep(emptyBox);
-  if (config2.layout) {
-    EmptyBox.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    EmptyBox.config.layout = createLayoutFormat(config.layout);
   }
   return EmptyBox;
 };
@@ -12168,26 +12101,26 @@ const ArrayUiSchema = {
     main: {}
   }
 };
-const buildArray = (config2, componentScope2) => {
+const buildArray = (config, componentScope) => {
   const array = _.cloneDeep(ArrayUiSchema);
-  if (config2.allExpanded) {
-    array.config.main.allExpanded = config2.allExpanded === "YES" ? true : false;
+  if (config.allExpanded) {
+    array.config.main.allExpanded = config.allExpanded === "YES" ? true : false;
   }
-  if (config2.disableAddButton) {
-    array.config.main.disableAddButton = config2.disableAddButton === "YES" ? true : false;
+  if (config.disableAddButton) {
+    array.config.main.disableAddButton = config.disableAddButton === "YES" ? true : false;
   }
-  if (config2.disableExpandAllButton) {
-    array.config.main.disableExpandAllButton = config2.disableExpandAllButton === "YES" ? true : false;
+  if (config.disableExpandAllButton) {
+    array.config.main.disableExpandAllButton = config.disableExpandAllButton === "YES" ? true : false;
   }
-  if (config2.disableRowActions) {
-    array.config.main.disableRowActions = config2.disableRowActions === "YES" ? true : false;
+  if (config.disableRowActions) {
+    array.config.main.disableRowActions = config.disableRowActions === "YES" ? true : false;
   }
-  if (config2.style) {
-    array.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    array.config.style = JSON.parse(config.style);
   }
-  array.config.main.childElementLabel = config2.childElementLabel;
-  array.config.main.label = config2.label;
-  array.scope = componentScope2;
+  array.config.main.childElementLabel = config.childElementLabel;
+  array.config.main.label = config.label;
+  array.scope = componentScope;
   return array;
 };
 const TextField = {
@@ -12206,17 +12139,17 @@ const TextField = {
     }
   }
 };
-const buildAdhaarField = (config2, componentScope2) => {
+const buildAdhaarField = (config, componentScope) => {
   const inputField = _.cloneDeep(TextField);
-  inputField.config.main.label = config2.label;
-  if (config2.style) {
-    inputField.config.style = JSON.parse(config2.style);
+  inputField.config.main.label = config.label;
+  if (config.style) {
+    inputField.config.style = JSON.parse(config.style);
   }
-  if (config2.layout) {
-    inputField.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    inputField.config.layout = createLayoutFormat(config.layout);
   }
-  inputField.config.main.errorMessage = `${config2.name} is empty or invalid`;
-  inputField.scope = componentScope2;
+  inputField.config.main.errorMessage = `${config.name} is empty or invalid`;
+  inputField.scope = componentScope;
   return inputField;
 };
 const PanField = {
@@ -12235,17 +12168,17 @@ const PanField = {
     }
   }
 };
-const buildPanField = (config2, componentScope2) => {
+const buildPanField = (config, componentScope) => {
   const inputField = _.cloneDeep(PanField);
-  inputField.config.main.label = config2.label;
-  if (config2.style) {
-    inputField.config.style = JSON.parse(config2.style);
+  inputField.config.main.label = config.label;
+  if (config.style) {
+    inputField.config.style = JSON.parse(config.style);
   }
-  if (config2.layout) {
-    inputField.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    inputField.config.layout = createLayoutFormat(config.layout);
   }
-  inputField.config.main.errorMessage = `${config2.name} is empty or invalid`;
-  inputField.scope = componentScope2;
+  inputField.config.main.errorMessage = `${config.name} is empty or invalid`;
+  inputField.scope = componentScope;
   return inputField;
 };
 const FileInput = {
@@ -12267,30 +12200,30 @@ const FileInput = {
     }
   }
 };
-const buildFileInput = (config2, componentScope2) => {
+const buildFileInput = (config, componentScope) => {
   const box = _.cloneDeep(FileInput);
-  box.scope = componentScope2;
-  box.config.main.label = config2.label;
-  if (config2.layout) {
-    box.config.layout = createLayoutFormat(config2.layout);
+  box.scope = componentScope;
+  box.config.main.label = config.label;
+  if (config.layout) {
+    box.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.style) {
-    box.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    box.config.style = JSON.parse(config.style);
   }
-  if (config2.variant) {
-    box.config.main.variant = config2.variant;
+  if (config.variant) {
+    box.config.main.variant = config.variant;
   }
-  if (config2.disableUpload) {
-    box.config.main.disableUpload = config2.disableUpload === "YES" ? true : false;
+  if (config.disableUpload) {
+    box.config.main.disableUpload = config.disableUpload === "YES" ? true : false;
   }
-  if (config2.disableDownload) {
-    box.config.main.disableDownload = config2.disableDownload === "YES" ? true : false;
+  if (config.disableDownload) {
+    box.config.main.disableDownload = config.disableDownload === "YES" ? true : false;
   }
-  if (config2.disableDelete) {
-    box.config.main.disableDelete = config2.disableDelete === "YES" ? true : false;
+  if (config.disableDelete) {
+    box.config.main.disableDelete = config.disableDelete === "YES" ? true : false;
   }
-  if (config2.description) {
-    box.config.main.description = config2.description;
+  if (config.description) {
+    box.config.main.description = config.description;
   }
   return box;
 };
@@ -12310,26 +12243,26 @@ const Stepper = {
   },
   "elements": []
 };
-const buildStepper = (config2, componentScope2) => {
+const buildStepper = (config, componentScope) => {
   const stepper = _.cloneDeep(Stepper);
-  stepper.scope = componentScope2;
-  stepper.config.main.resetButton = config2.resetButton === "YES" ? true : false;
-  if (config2.defaultButtonAvailable) {
-    stepper.config.main.defaultButtonAvailable = config2.defaultButtonAvailable === "YES" ? true : false;
-  }
-  stepper.config.main.resetText = config2.resetText || "ResetData";
-  stepper.config.main.completeText = config2.completeText || "Complete Text";
-  stepper.config.main.orientation = config2.orientation || "horizontal";
-  if (config2.sectionLabels) {
-    stepper.config.main.steps = config2.sectionLabels.map((e, i) => {
+  stepper.scope = componentScope;
+  stepper.config.main.resetButton = config.resetButton === "YES" ? true : false;
+  if (config.defaultButtonAvailable) {
+    stepper.config.main.defaultButtonAvailable = config.defaultButtonAvailable === "YES" ? true : false;
+  }
+  stepper.config.main.resetText = config.resetText || "ResetData";
+  stepper.config.main.completeText = config.completeText || "Complete Text";
+  stepper.config.main.orientation = config.orientation || "horizontal";
+  if (config.sectionLabels) {
+    stepper.config.main.steps = config.sectionLabels.map((e, i) => {
       return { label: e.label, id: i };
     });
   }
-  if (config2.layout) {
-    stepper.config.layout = createLayoutFormat(config2.layout);
+  if (config.layout) {
+    stepper.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.style) {
-    stepper.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    stepper.config.style = JSON.parse(config.style);
   }
   return stepper;
 };
@@ -12357,18 +12290,18 @@ const PopUP = {
     style: {}
   }
 };
-const buildPopUp = (config2, componentScope2) => {
+const buildPopUp = (config, componentScope) => {
   const popup = _.cloneDeep(PopUP);
-  popup.scope = componentScope2;
-  popup.config.main.title = config2.label;
-  popup.config.main.fullScreen = config2.fullScreen === "YES" ? true : false;
-  popup.config.main.fullWidth = config2.fullWidth === "YES" ? true : false;
-  popup.config.main.maxWidth = config2.maxWidth || false;
-  if (config2.layout) {
-    popup.config.layout = createLayoutFormat(config2.layout, config2.type);
+  popup.scope = componentScope;
+  popup.config.main.title = config.label;
+  popup.config.main.fullScreen = config.fullScreen === "YES" ? true : false;
+  popup.config.main.fullWidth = config.fullWidth === "YES" ? true : false;
+  popup.config.main.maxWidth = config.maxWidth || false;
+  if (config.layout) {
+    popup.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  if (config2.style) {
-    popup.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    popup.config.style = JSON.parse(config.style);
   }
   return popup;
 };
@@ -12388,30 +12321,30 @@ const dataGrid = {
     style: {}
   }
 };
-const buildDataGrid = (config2, componentScope2) => {
+const buildDataGrid = (config, componentScope) => {
   const DataGrid = _.cloneDeep(dataGrid);
-  DataGrid.scope = componentScope2;
-  if (config2.elevation) {
-    DataGrid.config.main.elevation = +config2.elevation;
+  DataGrid.scope = componentScope;
+  if (config.elevation) {
+    DataGrid.config.main.elevation = +config.elevation;
   }
-  DataGrid.config.main.divider = config2.divider === "NO" ? false : true;
-  if (config2.height) {
-    DataGrid.config.main.height = `${config2.height}px`;
+  DataGrid.config.main.divider = config.divider === "NO" ? false : true;
+  if (config.height) {
+    DataGrid.config.main.height = `${config.height}px`;
   }
-  if (config2.justifyContent) {
-    DataGrid.config.main.justifyContent = config2.justifyContent;
+  if (config.justifyContent) {
+    DataGrid.config.main.justifyContent = config.justifyContent;
   }
-  if (config2.label) {
-    DataGrid.config.main.label = config2.label;
+  if (config.label) {
+    DataGrid.config.main.label = config.label;
   }
-  if (config2.layout) {
-    DataGrid.config.layout = createLayoutFormat(config2.layout, config2.type);
+  if (config.layout) {
+    DataGrid.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  if (config2.cardLayout) {
-    DataGrid.config.cardLayout = createLayoutFormat(config2.cardLayout, config2.type);
+  if (config.cardLayout) {
+    DataGrid.config.cardLayout = createLayoutFormat(config.cardLayout, config.type);
   }
-  if (config2.style) {
-    DataGrid.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    DataGrid.config.style = JSON.parse(config.style);
   }
   return DataGrid;
 };
@@ -12432,27 +12365,27 @@ const InputSlider = {
     }
   }
 };
-const buildInputSlider = (config2, componentScope2) => {
+const buildInputSlider = (config, componentScope) => {
   const inputSlider = _.cloneDeep(InputSlider);
-  inputSlider.scope = componentScope2;
-  inputSlider.config.main.label = config2.label;
-  if (config2.layout) {
-    inputSlider.config.layout = createLayoutFormat(config2.layout);
+  inputSlider.scope = componentScope;
+  inputSlider.config.main.label = config.label;
+  if (config.layout) {
+    inputSlider.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.limitToMax) {
-    inputSlider.config.main.limitToMax = config2.limitToMax === "YES" ? true : false;
+  if (config.limitToMax) {
+    inputSlider.config.main.limitToMax = config.limitToMax === "YES" ? true : false;
   }
-  if (config2.max) {
-    inputSlider.config.main.max = config2.max;
+  if (config.max) {
+    inputSlider.config.main.max = config.max;
   }
-  if (config2.step) {
-    inputSlider.config.main.step = config2.step;
+  if (config.step) {
+    inputSlider.config.main.step = config.step;
   }
-  if (config2.min) {
-    inputSlider.config.main.min = config2.min;
+  if (config.min) {
+    inputSlider.config.main.min = config.min;
   }
-  if (config2.style) {
-    inputSlider.config.main.defaultStyle = JSON.parse(config2.style);
+  if (config.style) {
+    inputSlider.config.main.defaultStyle = JSON.parse(config.style);
   }
   return inputSlider;
 };
@@ -12479,35 +12412,35 @@ const TreeMap = {
   },
   elements: []
 };
-const buildTreeMap = (config2, componentScope2) => {
+const buildTreeMap = (config, componentScope) => {
   const treMap = _.cloneDeep(TreeMap);
-  treMap.scope = componentScope2;
-  if (config2.label) {
-    treMap.config.main.header = config2.label;
+  treMap.scope = componentScope;
+  if (config.label) {
+    treMap.config.main.header = config.label;
   }
-  if (config2.layout) {
-    treMap.config.layout = createLayoutFormat(config2.layout, config2.type);
+  if (config.layout) {
+    treMap.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  if (config2.orientation) {
-    treMap.config.main.orientation = config2.orientation;
+  if (config.orientation) {
+    treMap.config.main.orientation = config.orientation;
   }
-  if (config2.linkType) {
-    treMap.config.main.linkType = config2.linkType;
+  if (config.linkType) {
+    treMap.config.main.linkType = config.linkType;
   }
-  if (config2.graphHeight) {
-    treMap.config.main.graphHeight = config2.graphHeight;
+  if (config.graphHeight) {
+    treMap.config.main.graphHeight = config.graphHeight;
   }
-  if (config2.graphWidth) {
-    treMap.config.main.graphWidth = config2.graphWidth;
+  if (config.graphWidth) {
+    treMap.config.main.graphWidth = config.graphWidth;
   }
-  if (config2.graphZoomHeight) {
-    treMap.config.main.graphZoomHeight = config2.graphZoomHeight;
+  if (config.graphZoomHeight) {
+    treMap.config.main.graphZoomHeight = config.graphZoomHeight;
   }
-  if (config2.graphZoomWidth) {
-    treMap.config.main.graphZoomWidth = config2.graphZoomWidth;
+  if (config.graphZoomWidth) {
+    treMap.config.main.graphZoomWidth = config.graphZoomWidth;
   }
-  if (config2.style) {
-    treMap.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    treMap.config.style = JSON.parse(config.style);
   }
   return treMap;
 };
@@ -12522,20 +12455,20 @@ var Thought = {
     main: {}
   }
 };
-const buildThoughtOfTheDay = (config2, componentScope2) => {
+const buildThoughtOfTheDay = (config, componentScope) => {
   const thought = _.cloneDeep(Thought);
-  thought.scope = componentScope2;
-  if (config2.thought) {
-    thought.config.main.thought = `${config2.thought}`;
+  thought.scope = componentScope;
+  if (config.thought) {
+    thought.config.main.thought = `${config.thought}`;
   }
-  if (config2.layout) {
-    thought.config.layout = createLayoutFormat(config2.layout, config2.type);
+  if (config.layout) {
+    thought.config.layout = createLayoutFormat(config.layout, config.type);
   }
-  if (config2.label) {
-    thought.config.main.label = config2.label;
+  if (config.label) {
+    thought.config.main.label = config.label;
   }
-  if (config2.style) {
-    thought.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    thought.config.style = JSON.parse(config.style);
   }
   return thought;
 };
@@ -12551,14 +12484,14 @@ var horizontalLayout = {
   },
   elements: []
 };
-const buildHorizontalLayout = (config2, componentScope2) => {
+const buildHorizontalLayout = (config, componentScope) => {
   const horizontal = _.cloneDeep(horizontalLayout);
-  horizontal.scope = componentScope2;
-  if (config2.style) {
-    horizontal.config.style = JSON.parse(config2.style);
+  horizontal.scope = componentScope;
+  if (config.style) {
+    horizontal.config.style = JSON.parse(config.style);
   }
-  if (config2.layout) {
-    horizontal.config.layout = createLayoutFormat(config2.layout, config2.type);
+  if (config.layout) {
+    horizontal.config.layout = createLayoutFormat(config.layout, config.type);
   }
   return horizontal;
 };
@@ -12576,18 +12509,18 @@ const imageUiSchema = {
     style: {}
   }
 };
-const buildImage = (config2, componentScope2) => {
+const buildImage = (config, componentScope) => {
   const image = _.cloneDeep(imageUiSchema);
-  image.scope = componentScope2;
-  image.config.main.url = config2.imageUrl;
-  if (config2.layout) {
-    image.config.layout = createLayoutFormat(config2.layout);
+  image.scope = componentScope;
+  image.config.main.url = config.imageUrl;
+  if (config.layout) {
+    image.config.layout = createLayoutFormat(config.layout);
   }
-  if (config2.style) {
-    image.config.style = JSON.parse(config2.style);
+  if (config.style) {
+    image.config.style = JSON.parse(config.style);
   }
-  if (config2.height) {
-    image.config.style.imageStyle = { ...image.config.style.imageStyle, height: config2.height };
+  if (config.height) {
+    image.config.style.imageStyle = { ...image.config.style.imageStyle, height: config.height };
   }
   return image;
 };
@@ -12596,12 +12529,12 @@ let schema = {
   properties: {},
   required: []
 };
-function buildSchemaFromConfig(config2, parentSchema) {
+function buildSchemaFromConfig(config, parentSchema) {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
-  if (config2.elements) {
-    if (config2.type === "Array") {
+  if (config.elements) {
+    if (config.type === "Array") {
       (_a = parentSchema.properties) != null ? _a : parentSchema.properties = {};
-      (_d = (_b = parentSchema.properties)[_c = config2.name]) != null ? _d : _b[_c] = {
+      (_d = (_b = parentSchema.properties)[_c = config.name]) != null ? _d : _b[_c] = {
         type: "array",
         items: {
           type: "object",
@@ -12609,26 +12542,26 @@ function buildSchemaFromConfig(config2, parentSchema) {
           required: []
         }
       };
-      const arrayItemSchema = parentSchema.properties[config2.name].items;
-      (_e = config2.elements) == null ? void 0 : _e.forEach(
+      const arrayItemSchema = parentSchema.properties[config.name].items;
+      (_e = config.elements) == null ? void 0 : _e.forEach(
         (child) => buildSchemaFromConfig(child, arrayItemSchema)
       );
       return;
     } else {
-      (_f = config2.elements) == null ? void 0 : _f.forEach(
+      (_f = config.elements) == null ? void 0 : _f.forEach(
         (child) => buildSchemaFromConfig(child, parentSchema)
       );
       return;
     }
   }
   (_g = parentSchema.properties) != null ? _g : parentSchema.properties = {};
-  (_j = (_h = parentSchema.properties)[_i = config2.name]) != null ? _j : _h[_i] = {};
-  const fieldSchema = parentSchema.properties[config2.name];
-  (_k = config2.validation) == null ? void 0 : _k.forEach((v) => {
+  (_j = (_h = parentSchema.properties)[_i = config.name]) != null ? _j : _h[_i] = {};
+  const fieldSchema = parentSchema.properties[config.name];
+  (_k = config.validation) == null ? void 0 : _k.forEach((v) => {
     var _a2;
     if (v.validationType === "required") {
       (_a2 = parentSchema.required) != null ? _a2 : parentSchema.required = [];
-      parentSchema.required.push(config2.name);
+      parentSchema.required.push(config.name);
     } else if (v.validationType === "readOnly") {
       fieldSchema.type = "string";
       fieldSchema.disabled = true;
@@ -12637,171 +12570,171 @@ function buildSchemaFromConfig(config2, parentSchema) {
       fieldSchema[v.validationType] = isNaN(v.validationValue) ? v.validationValue : Number(v.validationValue);
     }
   });
-  if (config2.type === "Select" && ((_l = config2.value) == null ? void 0 : _l.length)) {
-    fieldSchema.oneOf = config2.value.map((v) => ({
+  if (config.type === "Select" && ((_l = config.value) == null ? void 0 : _l.length)) {
+    fieldSchema.oneOf = config.value.map((v) => ({
       const: v.value,
       title: v.label
     }));
   }
-  if (config2.type === "MultipleSelect" && ((_m = config2.value) == null ? void 0 : _m.length)) {
+  if (config.type === "MultipleSelect" && ((_m = config.value) == null ? void 0 : _m.length)) {
     fieldSchema.type = "array";
     fieldSchema.items = {
-      oneOf: config2.value.map((v) => ({
+      oneOf: config.value.map((v) => ({
         const: v.value,
         title: v.label
       }))
     };
   }
 }
-const buildSchema = (config2) => {
-  buildSchemaFromConfig(config2, schema);
+const buildSchema = (config) => {
+  buildSchemaFromConfig(config, schema);
   return schema;
 };
-const buildUiSchema = (config2, store2) => {
+const buildUiSchema = (config, store2) => {
   let elements = {};
-  const componentScope2 = `#/properties/${config2.name}`;
-  switch (config2.type) {
+  const componentScope = `#/properties/${config.name}`;
+  switch (config.type) {
     case "TreeMap":
-      elements = buildTreeMap(config2, componentScope2);
+      elements = buildTreeMap(config, componentScope);
       break;
     case "DateTime":
-      elements = buildDateTime(config2, componentScope2);
+      elements = buildDateTime(config, componentScope);
       break;
     case "InputSlider":
-      elements = buildInputSlider(config2, componentScope2);
+      elements = buildInputSlider(config, componentScope);
       break;
     case "DataGrid":
-      elements = buildDataGrid(config2, componentScope2);
+      elements = buildDataGrid(config, componentScope);
       break;
     case "Stepper":
-      elements = buildStepper(config2, componentScope2);
+      elements = buildStepper(config, componentScope);
       break;
     case "PopUp":
-      elements = buildPopUp(config2, componentScope2);
+      elements = buildPopUp(config, componentScope);
       break;
     case "FileInput":
-      elements = buildFileInput(config2, componentScope2);
+      elements = buildFileInput(config, componentScope);
       break;
     case "AadharcardText":
-      elements = buildAdhaarField(config2, componentScope2);
+      elements = buildAdhaarField(config, componentScope);
       break;
     case "PanCardText":
-      elements = buildPanField(config2, componentScope2);
+      elements = buildPanField(config, componentScope);
       break;
     case "TabSection":
-      elements = buildTabSection(config2, componentScope2);
+      elements = buildTabSection(config, componentScope);
       break;
     case "RunnerBoyProgressBar":
-      elements = RunnerBoyProgressbar(config2, componentScope2);
+      elements = RunnerBoyProgressbar(config, componentScope);
       break;
     case "WrapperSection":
-      elements = buildWrapperSection(config2, componentScope2);
+      elements = buildWrapperSection(config, componentScope);
       break;
     case "HorizontalLayout":
-      elements = buildHorizontalLayout(config2, componentScope2);
+      elements = buildHorizontalLayout(config, componentScope);
       break;
     case "Text":
-      elements = buildTextField(config2, componentScope2);
+      elements = buildTextField(config, componentScope);
       break;
     case "TextArea":
-      elements = buildTextArea(config2, componentScope2);
+      elements = buildTextArea(config, componentScope);
       break;
     case "Date":
-      elements = buildDate(config2, componentScope2);
+      elements = buildDate(config, componentScope);
       break;
     case "Select":
-      elements = buildSelect(config2, componentScope2);
+      elements = buildSelect(config, componentScope);
       break;
     case "Radio":
-      elements = buildRadio(config2, componentScope2);
+      elements = buildRadio(config, componentScope);
       break;
     case "Button":
-      elements = buildButton(config2, componentScope2);
+      elements = buildButton(config, componentScope);
       break;
     case "Table":
-      elements = buildTable(config2, componentScope2);
+      elements = buildTable(config, componentScope);
       break;
     case "Array":
-      elements = buildArray(config2, componentScope2);
+      elements = buildArray(config, componentScope);
       break;
     case "Box":
-      elements = buildLabel(config2, componentScope2);
+      elements = buildLabel(config, componentScope);
       break;
     case "CheckBox":
-      elements = buildCheckbox(config2, componentScope2);
+      elements = buildCheckbox(config, componentScope);
       break;
     case "UploadFile":
-      elements = buildUploadFile(config2, componentScope2);
+      elements = buildUploadFile(config, componentScope);
       break;
     case "DownloadFile":
-      elements = buildDownloadFile(config2, componentScope2);
+      elements = buildDownloadFile(config, componentScope);
       break;
     case "EmptyBox":
-      elements = buildEmptyBox(config2);
+      elements = buildEmptyBox(config);
       break;
     case "card":
-      elements = buildCard(config2, componentScope2, store2);
+      elements = buildCard(config, componentScope, store2);
       break;
     case "Graph":
-      switch (config2.graphType) {
+      switch (config.graphType) {
         case "BarGraph":
         case "StackBarGraph":
-          elements = buildStackbarGraph(config2, componentScope2);
+          elements = buildStackbarGraph(config, componentScope);
           break;
         case "LineGraph":
-          elements = buildLineGraph(config2, componentScope2);
+          elements = buildLineGraph(config, componentScope);
           break;
         case "PieGraph":
-          elements = buildPieGraph(config2, componentScope2);
+          elements = buildPieGraph(config, componentScope);
           break;
         case "HorizontalBarGraph":
         case "HorizontalStackBarGraph":
-          elements = buildHorizontalBarGraph(config2, componentScope2);
+          elements = buildHorizontalBarGraph(config, componentScope);
           break;
         default:
-          elements = buildStackbarGraph(config2, componentScope2);
+          elements = buildStackbarGraph(config, componentScope);
           break;
       }
       break;
     case "ProgressBar":
-      elements = buildProgressBar(config2, componentScope2);
+      elements = buildProgressBar(config, componentScope);
       break;
     case "SpeedoMeter":
-      elements = buildSpeedoMeter(config2, componentScope2);
+      elements = buildSpeedoMeter(config, componentScope);
       break;
     case "ProgressBarCard":
-      elements = buildProgressBarCard(config2, componentScope2);
+      elements = buildProgressBarCard(config, componentScope);
       break;
     case "RankCard":
-      elements = buildRankCard(config2, componentScope2);
+      elements = buildRankCard(config, componentScope);
       break;
     case "Rank":
-      elements = buildRollAndDice(config2, componentScope2);
+      elements = buildRollAndDice(config, componentScope);
       break;
     case "Slider":
-      elements = buildSlider(config2, componentScope2);
+      elements = buildSlider(config, componentScope);
       break;
     case "Timer":
-      elements = buildTimer(config2, componentScope2);
+      elements = buildTimer(config, componentScope);
       break;
     case "ColumnGroup":
       elements = {
-        accessorKey: config2.name,
-        header: config2.label || config2.name,
+        accessorKey: config.name,
+        header: config.label || config.name,
         elements: []
       };
       break;
     case "MultipleSelect":
-      elements = buildMultiSelect(config2, componentScope2);
+      elements = buildMultiSelect(config, componentScope);
       break;
     case "LeaderBoard":
-      elements = buildLeaderBoard(config2);
+      elements = buildLeaderBoard(config);
       break;
     case "Thought":
-      elements = buildThoughtOfTheDay(config2, componentScope2);
+      elements = buildThoughtOfTheDay(config, componentScope);
       break;
     case "Image":
-      elements = buildImage(config2, componentScope2);
+      elements = buildImage(config, componentScope);
       break;
     default:
       schema = {
@@ -12809,12 +12742,12 @@ const buildUiSchema = (config2, store2) => {
         properties: {},
         required: []
       };
-      elements = buildBasicUiSchema(config2);
+      elements = buildBasicUiSchema(config);
   }
-  if (config2 == null ? void 0 : config2.elements) {
-    if ((config2 == null ? void 0 : config2.type) === "LeaderBoard") {
+  if (config == null ? void 0 : config.elements) {
+    if ((config == null ? void 0 : config.type) === "LeaderBoard") {
       const rowElements = [];
-      config2.elements.map((cellElem) => {
+      config.elements.map((cellElem) => {
         const commonProperties = {
           accessorKey: cellElem.name,
           type: cellElem.type === "ColumnGroup" ? "ColumnGroup" : cellElem.columnFormat,
@@ -12824,14 +12757,14 @@ const buildUiSchema = (config2, store2) => {
         rowElements.push({ ...commonProperties });
       });
       elements.elements = rowElements;
-    } else if (config2.type == "ColumnGroup") {
+    } else if (config.type == "ColumnGroup") {
       const sizeMap = {};
-      if (config2.sizeHolder) {
-        config2.sizeHolder.map((e, i) => {
+      if (config.sizeHolder) {
+        config.sizeHolder.map((e, i) => {
           sizeMap[e.keyName] = e.value;
         });
       }
-      elements.elements = config2.elements.map((cellElem, elemInd) => {
+      elements.elements = config.elements.map((cellElem, elemInd) => {
         const commonProperties = {
           accessorKey: cellElem.name,
           type: cellElem.type === "ColumnGroup" ? "ColumnGroup" : cellElem.columnFormat,
@@ -12854,17 +12787,17 @@ const buildUiSchema = (config2, store2) => {
           return { ...commonProperties };
         }
       });
-    } else if (config2.type == "Table") {
+    } else if (config.type == "Table") {
       const sizeMap = {};
-      if (config2.sizeHolder) {
-        config2.sizeHolder.map((e, i) => {
+      if (config.sizeHolder) {
+        config.sizeHolder.map((e, i) => {
           sizeMap[e.keyName] = e.value;
         });
       }
       const tableHeaderElements = [];
       const tableActionElement = [];
       const rowElements = [];
-      config2.elements.filter((cellElem, elemInd) => {
+      config.elements.filter((cellElem, elemInd) => {
         const commonProperties = {
           accessorKey: cellElem.name,
           type: cellElem.type === "ColumnGroup" ? "ColumnGroup" : cellElem.columnFormat,
@@ -12901,7 +12834,7 @@ const buildUiSchema = (config2, store2) => {
       elements.config.action = tableActionElement;
       elements.config.main.headerIcons.elements = tableHeaderElements;
     } else {
-      elements.elements = config2.elements.map((e, elemInd) => {
+      elements.elements = config.elements.map((e, elemInd) => {
         return buildUiSchema(e, store2);
       });
     }