impaktapps-ui-builder 0.0.409-j → 0.0.409-l

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "impaktapps-ui-builder",
-    "version": "0.0.409j",
+    "version": "0.0.409l",
     "scripts": {
         "dev": "vite",
         "build": "tsc && vite build",

package/src/impaktapps-ui-builder/builder/build/buildConfig.ts

@@ -3,13 +3,6 @@ import _ from "lodash";
 export default (FormData: any) => {
   const formData = _.cloneDeep(FormData)
   let component: any = {};
-  // if (formData?.layout) {
-  //   component.layout = createData(FormData?.layout, "layout");
-  //   delete formData.layout
-  // }
-  // if(!formData.type ){
-  //  component.type = "page";
-  // }
   if (formData.pageName) {
     delete formData.pageName
   }

package/src/impaktapps-ui-builder/builder/build/buildUiSchema.ts

@@ -316,7 +316,53 @@ const buildUiSchema = (config: any) => {
           sizeMap[e.keyName] = e.value
         });
       }
-      elements.elements = transformConfigToOutput(config, sizeMap)
+      function nodeProvider(element) {
+        if (element.type) {
+          return {
+            accessorKey: element.name,
+            type: element.columnFormat,
+            header: element.label || element.name,
+            size: sizeMap[element.name] || 180,
+            widget: buildUiSchema(element)
+
+          };
+        }
+        return {
+          accessorKey: element.name,
+          type: element.columnFormat,
+          header: element.label || element.name,
+          size: sizeMap[element.name] || 180,
+        }
+      }
+
+      function buildHierarchy(elements, parentName = null) {
+        const result = [];
+        for (const element of elements) {
+          if (element?.parent === parentName) {
+            const children = buildHierarchy(elements, element.name);
+            const node: any = nodeProvider(element)
+            if (children.length > 0) {
+              node.columns = children;
+              node.type = "group";
+            }
+            result.push(node);
+          }
+        }
+        return result;
+      }
+
+      function transformConfigToOutput(config) {
+        const output = [];
+        const hierarchy = buildHierarchy(config.elements, config.name);
+        for (const element of config.elements) {
+          const parentExists = config.elements.some(e => e.name === element.parent);
+          if (!parentExists && element.parent !== config.name) {
+            output.push(nodeProvider(element))
+          }
+        }
+        return [ ...hierarchy,...output,];
+      }
+      elements.elements = transformConfigToOutput(config)
     }
     else if (config.type == "Array") {
       elements.options.detail.elements = config.elements.map((e: any, elemInd: number) => {

package/src/impaktapps-ui-builder/builder/services/component.ts

@@ -1,5 +1,5 @@
 import _ from "lodash";
-import { ComponentSchema } from "../elements/UiSchema/Component/schema"; 
+import { ComponentSchema } from "../elements/UiSchema/Component/schema";
 import { componentBasicUiSchema } from "../elements/UiSchema/Component/uiSchema";
 import { CoreSection } from "../build/uischema/coreSection";
 import { EventSection } from "../build/uischema/eventSection";
@@ -10,57 +10,57 @@ import { ValueTab } from "../build/uischema/valueTab";
 import { ValidationSection } from "../build/uischema/validationSections";
 import { getFormdataFromLocalStorage, okHandler, saveFormdataInLocalStorage, saveHandler } from "./utils";
 const sectionLabels = {
-  Select: ["Core", "Properties","Value", "style", "Event","Validation"],
-  MultipleSelect: ["Core", "Properties","Value", "style", "Event","Validation"],
-  Table: ["Core", "Components",  "Properties","style",  "Event","Validation"],
-  LeaderBoard: ["Core", "Components", "Properties", "style", "Event","Validation"],
-  WrapperSection: ["Core", "Components","Properties", "style","Validation"],
-  TabSection: ["Core", "Components", "Properties", "style","Validation"],
-  SpeedoMeter:["Core", "Properties", "style", "Event","Validation"],
-  card:["Core", "Properties", "style", "Event","Validation"],
-  UploadFile:["Core",  "style", "Event","Validation"],
-  Graph:["Core", "Properties", "style", "Event","Validation"],
-  DownloadFile:["Core",  "style", "Event","Validation"],
-  Box: ["Core", "style", "Event","Validation"],
-  Properties: ["Core", "Properties", "style", "Event","Validation"],
-  ProgressBarCard: ["Core", "Properties", "style", "Event","Validation"],
-  RankCard: ["Core", "Properties", "style", "Event","Validation"],
-  Slider: ["Core", "Components", "style", "Event","Validation"],
-  Timer: ["Core", "style", "Event","Validation"],
-  Rank: ["Core","style", "Event","Validation"],
-  Button: ["Core", "Properties", "style", "Event","Validation"],
-  Array:["Core","Components","Validation"],
-  Radio:["Core", "Properties", "style", "Event","Validation"],
-  Text:["Core","Properties","style", "Event","Validation"],
-  TextArea:["Core","Properties","style", "Event","Validation"],
-  PopUp: ["Core", "Components","Properties", "style"],
-  Stepper: ["Core", "Components","Properties","Event", "style"],
-  DataGrid: ["Core", "Components","Properties","Event", "style"],
-  InputSlider:["Core","Properties","style", "Event","Validation"],
- TreeMap:["Core", "Components","Properties","style", "Event"],
+  Select: ["Core", "Properties", "Value", "Event", "Style", "Validation"],
+  MultipleSelect: ["Core", "Properties", "Value", "Event", "Style", "Validation"],
+  Table: ["Core", "Components", "Properties", "Event", "Style", "Validation"],
+  LeaderBoard: ["Core", "Components", "Properties", "Event", "Style", "Validation"],
+  WrapperSection: ["Core", "Components", "Properties", "Style", "Validation"],
+  TabSection: ["Core", "Components", "Properties", "Style", "Validation"],
+  SpeedoMeter: ["Core", "Properties", "Event", "Style", "Validation"],
+  card: ["Core", "Properties", "Event", "Style", "Validation"],
+  UploadFile: ["Core", "Event", "Style", "Validation"],
+  Graph: ["Core", "Properties", "Event", "Style", "Validation"],
+  DownloadFile: ["Core", "Event", "Style", "Validation"],
+  Box: ["Core", "Event", "Style", "Validation"],
+  Properties: ["Core", "Properties", "Event", "Style", "Validation"],
+  ProgressBarCard: ["Core", "Properties", "Event", "Style", "Validation"],
+  RankCard: ["Core", "Properties", "Event", "Style", "Validation"],
+  Slider: ["Core", "Components", "Event", "Style", "Validation"],
+  Timer: ["Core", "Event", "Style", "Validation"],
+  Rank: ["Core", "Event", "Style", "Validation"],
+  Button: ["Core", "Properties", "Event", "Style", "Validation"],
+  Array: ["Core", "Components", "Validation"],
+  Radio: ["Core", "Properties", "Event", "Style", "Validation"],
+  Text: ["Core", "Properties", "Event", "Style", "Validation"],
+  TextArea: ["Core", "Properties", "Event", "Style", "Validation"],
+  PopUp: ["Core", "Components", "Properties", "Style"],
+  Stepper: ["Core", "Components", "Properties", "Event", "Style"],
+  DataGrid: ["Core", "Components", "Properties", "Event", "Style"],
+  InputSlider: ["Core", "Properties", "Event", "Style", "Validation"],
+  TreeMap: ["Core", "Components", "Properties", "Event", "Style",],
 }
 
 
 
-export const refreshPage = (type:string,store:any) => {
+export const refreshPage = (type: string, store: any) => {
   const UiSchema = _.cloneDeep(componentBasicUiSchema)
-  if(type){
-  const sectionUiSchema = {
-    Core: CoreSection,
-    Value: ValueTab,
-    style: StyleSection,
-    Event: EventSection,
-    Components: TableSection,
-    Properties: buildPropertiesSection(type),
-    Validation:ValidationSection
-  
+  if (type) {
+    const sectionUiSchema = {
+      Core: CoreSection,
+      Value: ValueTab,
+      Style: StyleSection,
+      Event: EventSection,
+      Components: TableSection,
+      Properties: buildPropertiesSection(type),
+      Validation: ValidationSection
+
+    }
+    const elements = sectionLabels[type]?.map(e => sectionUiSchema[e]);
+    UiSchema.elements[1].config.main.tabLabels = sectionLabels[type] || ["Core", "style", "Event", "Validation"];
+    UiSchema.elements[1].elements = elements || [CoreSection, StyleSection, EventSection, ValidationSection];
+
   }
-  const elements = sectionLabels[type]?.map(e => sectionUiSchema[e]);
-  UiSchema.elements[1].config.main.tabLabels = sectionLabels[type] || ["Core", "style","Event","Validation"];
-  UiSchema.elements[1].elements = elements || [CoreSection, StyleSection,EventSection,ValidationSection];
- 
-}
-store.setUiSchema(UiSchema);
+  store.setUiSchema(UiSchema);
 }
 
 export default (store: any, dynamicData: any, submitHandler: any, service: any) => {
@@ -69,26 +69,26 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       const formdata = await this.getFormdata();
       store.setFormdata(formdata);
       const schema = this.getSchema();
-      store.setSchema(schema); 
-     this.refreshPage(formdata?.type, store);
-    
+      store.setSchema(schema);
+      this.refreshPage(formdata?.type, store);
+
     },
-    refreshPage:refreshPage,
+    refreshPage: refreshPage,
     getFormdata: function () {
       const path = store.searchParams?.get("path");
-      return getFormdataFromLocalStorage(path) 
+      return getFormdataFromLocalStorage(path)
     },
     getSchema: function () {
       return ComponentSchema;
     },
-    okHandler:()=>okHandler(store),
-    saveHandler: async ()=> await saveHandler(store,service,submitHandler,"PageMaster"),
+    okHandler: () => okHandler(store),
+    saveHandler: async () => await saveHandler(store, service, submitHandler, "PageMaster"),
     onChange: function () {
       if (
         store?.formData?.type !== store?.newData?.type &&
         store?.newData?.type !== undefined
       ) {
-        this.refreshPage(store?.newData?.type,store);
+        this.refreshPage(store?.newData?.type, store);
       }
     },
     editComponents: function () {

package/src/impaktapps-ui-builder/runtime/services/events.ts

@@ -1,3 +1,4 @@
+
 import _ from "lodash";
 import { handlersProps } from "./interface";
 
@@ -134,7 +135,7 @@ function executeInBuiltFunctionHandler(params: handlersProps) {
 function executeCustomHandler(params: handlersProps) {
   const makeFunc = eval(params.config.eventCode)
   if (params.config.isSync !== "Yes") {
-    makeFunc(params.store, params.dynamicData, params.userValue, params.parentEventOutput, params.service, params.componentName).then((res) => res)
+    return makeFunc(params.store, params.dynamicData, params.userValue, params.parentEventOutput, params.service, params.componentName).then((res) => res)
   } else {
     const response = makeFunc(params.store, params.dynamicData, params.userValue, params.parentEventOutput, params.service, params.componentName)
     return response;

package/src/impaktapps-ui-builder/runtime/services/service.ts

@@ -251,8 +251,3 @@ export default (funcParams: funcParamsProps) => {
     ...funcParams.functionsProvider
   };
 };
-
-
-
-
-