impaktapps-ui-builder 0.0.408 → 0.0.409-c

package/dist/src/impaktapps-ui-builder/builder/build/buildTreeMap.d.ts

@@ -0,0 +1 @@
+export declare const buildTreeMap: (config: any, componentScope: any) => any;

package/dist/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.d.ts

@@ -1,3 +1,22 @@
+export declare const getRadioInputField: (scope: String, label: String, options: string[]) => {
+    type: string;
+    scope: string;
+    options: {
+        widget: string;
+    };
+    config: {
+        layout: {
+            xs: number;
+            sm: number;
+            md: number;
+            lg: number;
+        };
+        main: {
+            label: String;
+            options: string[];
+        };
+    };
+};
 export declare const getTextArea: (scope: string, heading: string, hideButton: boolean, layout?: any) => {
     type: string;
     scope: string;

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

@@ -1,9 +1,10 @@
 import { handlersProps } from "./interface";
-export declare const executeEvents: (params: handlersProps) => Promise<any>;
-export declare function executeRefreshHandler(params: handlersProps): Promise<void>;
-export declare function buildApiPayload(compConfig: any, body: any, headers: any, store: any, dynamicData: any, userValue: any, service: any): Promise<{
+export declare const executeEvents: (params: handlersProps) => any;
+export declare function getRefreshElements(eventConfig: any, eventGropus: any): string[];
+export declare function executeRefreshHandler(params: handlersProps): Promise<any[][]>;
+export declare function executeApiRequest(params: any): any;
+export declare function shouldEventExecute(params: handlersProps): any;
+export declare function buildApiPayload(compConfig: any, body: any, headers: any, store: any, dynamicData: any, userValue: any, service: any): {
     body: any;
     headers: any;
-}>;
-export declare function getRefreshElements(eventConfig: any, eventGropus: any): string[];
-export declare function asyncOperation(): Promise<unknown>;
+};

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

@@ -1,20 +1,18 @@
-export declare const extractEvents: (eventConfig: any) => any;
 interface funcParamsProps {
     store: any;
     dynamicData: any;
-    config: any;
-    uiSchema: any;
-    schema: any;
     service: any;
     userValue: any;
     functionsProvider?: Record<string, any>;
 }
+export declare const extractEvents: (eventConfig: any) => any;
 declare const _default: (funcParams: funcParamsProps) => {
     setPage: () => Promise<void>;
-    onClick: () => Promise<void>;
-    onMount: () => Promise<void>;
-    onFileDownload: () => Promise<void>;
-    onFileUpload: () => Promise<void>;
+    onCellRenderer: (cellParams: any) => {};
+    onClick: () => void;
+    onMount: () => void;
+    onFileDownload: () => void;
+    onFileUpload: () => void;
     backHandler: () => void;
     onPaginationChange: (paginationValues: any) => Promise<any>;
     getSelectOptions: (param: any) => Promise<any>;

package/package.json

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

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

@@ -0,0 +1,58 @@
+import { createLayoutFormat } from "./buildConfig";
+import _ from "lodash";
+
+const TreeMap = {
+    "type": "Control",
+    "scope": "#/properties/TreeMap2",
+    "config": {
+        "main": {
+            "layout": "cartsian",
+            orientation: "vertical",
+            header: "Territory Hierarchy",
+            "linkType": "step",
+            graphHeight: "500px",
+        },
+        "style": {
+            BoxStyle: {
+                borderRadius: "5px",
+            }
+        }
+    },
+    "options": {
+        "widget": "TreeMap"
+    },
+    elements: [
+
+    ]
+}
+
+
+export const buildTreeMap = (config, componentScope) => {
+    const treMap: any = _.cloneDeep(TreeMap);
+    treMap.scope = componentScope;
+    if (config.label) {
+        treMap.config.main.header = config.label;
+    }
+    if (config.layout) {
+        treMap.config.layout = createLayoutFormat(config.layout);
+    }
+    if (config.orientation) {
+        treMap.config.main.orientation = config.orientation;
+    }
+    if (config.linkType) {
+        treMap.config.main.linkType = config.linkType;
+    }
+    if (config.graphHeight) {
+        treMap.config.main.graphHeight = config.graphHeight;
+    }
+    if (config.graphWidth) {
+        treMap.config.main.graphWidth = config.graphWidth;
+    }
+    if (config.graphZoomHeight) {
+        treMap.config.main.graphZoomHeight = config.graphZoomHeight;
+    }
+    if (config.graphZoomWidth) {
+        treMap.config.main.graphZoomWidth = config.graphZoomWidth;
+    }
+    return treMap;
+}

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

@@ -38,6 +38,7 @@ import { buildStepper } from "./buildStepper";
 import { buildPopUp } from "./buildPop";
 import { buildDataGrid } from "./buildDataGrid";
 import { buildInputSlider } from "./buildInputSlider";
+import { buildTreeMap } from "./buildTreeMap";
 export let schema = {
   type: "object",
   properties: {},
@@ -168,6 +169,8 @@ const buildUiSchema = (config: any) => {
   let elements: any = {};
   const componentScope = `#/properties/${config.name}`;
   switch (config.type) {
+    case "TreeMap":
+      elements = buildTreeMap(config,componentScope)
     case "DateTime":
       elements = buildDateTime(config, componentScope);
       break;

package/src/impaktapps-ui-builder/builder/build/uischema/buildPropertiesSection.ts

@@ -151,7 +151,7 @@ const getInputField = (scope: String, label: String) => {
   };
 };
 
-const getRadioInputField = (scope: String, label: String, options: string[]) => {
+export const getRadioInputField = (scope: String, label: String, options: string[]) => {
   return {
     type: "Control",
     scope: `#/properties/${scope}`,
@@ -235,6 +235,15 @@ const GraphSection = {
 export const buildPropertiesSection = function (type: String) {
   let uiSchema = _.cloneDeep(GraphSection);
   switch (type) {
+   
+    case "TreeMap":
+      uiSchema.elements = [
+        getSelectField("orientation", "orientation",[]),
+        getInputField("linkType", "linkType"),
+        getInputField("graphHeight", "Graph Height"),
+        getInputField("graphWidth", "Graph Width"),
+        getInputField("graphZoomHeight", "Zoom Height"),
+      ]
     case "InputSlider":
       uiSchema.elements = [
         getInputField("max", "Max Limit"),

package/src/impaktapps-ui-builder/builder/build/uischema/graph.ts

@@ -88,7 +88,6 @@ export const PieGraph = {
       type: "PieGraph",
       bottomLabel: "Name of Employe",
       leftLabel: "Value",
-      // tooltipDataKey: ["HDFC", "SBI", "Kotak","Sbi"],
       axisLeft: true,
       axisBottom: true,
       legendAvailable: true,

package/src/impaktapps-ui-builder/builder/elements/UiSchema/Component/schema.ts

@@ -45,6 +45,7 @@ export const ComponentSchema: any = {
         { title: "Date Column", const: "date" },
         { title: "DateTime Column", const: "dateTime" },
         { title: "Amount Column", const: "amount" },
+        { title: "TreeMap", const: "TreeMap" },
       ]
     },
     orientation:{

package/src/impaktapps-ui-builder/builder/elements/UiSchema/event/schema.ts

@@ -44,7 +44,7 @@ export const EventSchema = {
         { title: "Mount Event", const: "onMount" },
         { title: "Success", const: "Success" },
         { title: "onStart", const: "onStart" },
-     
+        { title: "Cell Renderer", const: "onCellRenderer" },
         { title: "File Upload Event", const: "onUpload" },
         { title: "Back Event", const: "onBack" },
         { title: "Next Event", const: "onNext" },

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

@@ -37,6 +37,7 @@ const sectionLabels = {
   Stepper: ["Core", "Components","Properties","Event", "style"],
   DataGrid: ["Core", "Components","Properties","Event", "style"],
   InputSlider:["Core","Properties","style", "Event","Validation"],
+ TreeMap:["Core", "Components","Properties","style", "Event"],
 }
 
 

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

@@ -3,7 +3,7 @@ import { EventUiSchema } from "../elements/UiSchema/event/uiSchema";
 import Component from "./component";
 import { okHandler, saveFormdataInLocalStorage, saveHandler } from "./utils";
 import { APISection } from "../build/uischema/apiSection";
-import { getSelectField, getTextArea } from "../build/uischema/buildPropertiesSection";
+import { getRadioInputField, getSelectField, getTextArea } from "../build/uischema/buildPropertiesSection";
 import { refreshSectionUiSchema } from "../build/uischema/refresh";
 import _ from "lodash";
 
@@ -27,7 +27,8 @@ export default (
       const schema: any = _.cloneDeep(EventSchema)
       if (handlerType) {
         if (handlerType === "custom") {
-          uiSchema.elements[1].elements[0].elements[2] = getTextArea("eventCode", "Write Custom Code", false)
+          uiSchema.elements[1].elements[0].elements[2] =  getRadioInputField("isSync","Run in Sync",["Yes","No"])
+          uiSchema.elements[1].elements[0].elements[3] = getTextArea("eventCode", "Write Custom Code", false)
           schema.required = ["eventType", "Handler", "eventCode"]
 
         } else if (handlerType === "api") {

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

@@ -29,4 +29,5 @@ export const doDownload = (response: any, service) => {
     document.body.appendChild(link);
     link.click();
     link.parentNode.removeChild(link);
-};
+};
+

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

@@ -1,87 +1,126 @@
-import _, { cloneDeep } from "lodash";
+import _ from "lodash";
 import { handlersProps } from "./interface";
 
-
-export const executeEvents = async (
-  params: handlersProps
-) => {
+export const executeEvents = (params: handlersProps) => {
   let nextEvent = [];
   let finalResponse = null;
+
+  if (params.config.isSync !== "Yes") {
+    return shouldEventExecute(params)
+      .then((shouldExecute) => {
+        if (!shouldExecute) {
+          return { response: undefined, events: undefined };
+        }
+        return executeEventsHandler(params);
+      })
+      .then((response) => {
+        finalResponse = response;
+        const SuccessEvent = params.config?.events.filter(e => e.eventType === "Success");
+        nextEvent = SuccessEvent;
+      })
+      .catch((err) => {
+        const FailEvent = params.config?.events?.filter(e => e.eventType === "Fail");
+        const setEvent = FailEvent?.length > 0 ? FailEvent : [];
+        nextEvent = setEvent;
+      })
+      .then(() => {
+        if (nextEvent?.length > 0) {
+          return nextEvent.reduce((chain, actionConfig) => {
+            return chain.then(() => executeEvents({ ...params, config: actionConfig, parentEventOutput: finalResponse }));
+          }, Promise.resolve());
+        }
+      })
+      .then(() => finalResponse)
+  }
+  const shouldExecute = shouldEventExecute(params);
+  if (!shouldExecute) {
+    return { response: undefined, events: undefined };
+  }
   try {
-    const shouldExecute = await shouldEventExecute(params)
-    if (!shouldExecute) {
-      return { response: undefined, events: undefined };
-    }
-    const response = await executeEventsHandler(params)
-    finalResponse = response;
+    const eventsResponse = executeEventsHandler(params);
+    finalResponse = eventsResponse;
     const SuccessEvent = params.config?.events.filter(e => e.eventType === "Success");
     nextEvent = SuccessEvent;
-  } catch (err) {
-    const FailEvent = params.config?.events?.filter(e => e.eventType === "Fail")
-    const setEvent = FailEvent?.length > 0 ? FailEvent : []
+  } catch {
+    const FailEvent = params.config?.events?.filter(e => e.eventType === "Fail");
+    const setEvent = FailEvent?.length > 0 ? FailEvent : [];
     nextEvent = setEvent;
   }
   if (nextEvent?.length > 0) {
     for (const actionConfig of nextEvent) {
-      await executeEvents({ ...params, config: actionConfig, parentEventOutput: finalResponse })
+      executeEvents({ ...params, config: actionConfig, parentEventOutput: finalResponse })
     }
   }
   return finalResponse;
 }
-
-async function executeEventsHandler(params: handlersProps) {
+function executeEventsHandler(params: handlersProps) {
   if (params.config.Handler === "api") {
-    return await executeApiEventHandler(params)
-  }
-  else if (params.config.Handler === "inBuiltFunction") {
-    return await executeInBuiltFunctionHandler(params)
-  }
-  else if (params.config.Handler === "custom") {
-    return await executeCustomHandler(params)
-  }
-  else if (params.config.Handler === "refresh") {
-    return await executeRefreshHandler(params)
-  }
-  else if (params.config.Handler === "mergeFormdata") {
-    const result = await mergeFormdata(
-      params.parentEventOutput, params.componentName, params.config, params.store, params.service)
-    return result;
-  }
-  else if (params.config.Handler === "onBackHandler") {
-    return params.store.functionParameters?.handleBack()
-  }
-  else if (params.config.Handler === "onNextHandler") {
-    return params.store.functionParameters?.handleNext()
-  }
-  else if (params.config.Handler === "onResetHandler") {
-    return params.store.functionParameters?.handleReset()
+    return executeApiRequest(params);
+  } else if (params.config.Handler === "inBuiltFunction") {
+    return executeInBuiltFunctionHandler(params);
+  } else if (params.config.Handler === "custom") {
+    return executeCustomHandler(params);
+  } else if (params.config.Handler === "refresh") {
+    return executeRefreshHandler(params);
+  } else if (params.config.Handler === "mergeFormdata") {
+    return mergeFormdata(
+      params.parentEventOutput,
+      params.componentName,
+      params.config,
+      params.store,
+      params.service
+    );
+  } else if (params.config.Handler === "onBackHandler") {
+    return params.store.functionParameters?.handleBack();
+  } else if (params.config.Handler === "onNextHandler") {
+    return params.store.functionParameters?.handleNext();
+  } else if (params.config.Handler === "onResetHandler") {
+    return params.store.functionParameters?.handleReset();
   }
 }
-export async function executeRefreshHandler(params: handlersProps) {
-  const compToRefresh: string[] = getRefreshElements(params.config, params.eventGroups)
-  for (const componentName of compToRefresh) {
-    for (const compEventConfig of params.eventGroups.onLoad[componentName]) {
-      await executeEvents({ ...params, config: compEventConfig, componentName });
+
+export function getRefreshElements(eventConfig: any, eventGropus: any) {
+  let result: string[] = [];
+  if (eventConfig?.refreshElements?.length > 0) {
+    result = eventConfig.refreshElements.map((e) => {
+      return e.value
+    })
+
+  } else {
+    if (eventGropus?.onLoad) {
+      result = Object.keys(eventGropus?.onLoad)
+      result.push(result[0]);
     }
   }
+  return result;
 }
-async function executeApiEventHandler(params: handlersProps) {
+export function executeRefreshHandler(params: handlersProps) {
+  const compToRefresh: string[] = getRefreshElements(params.config, params.eventGroups);
+
+  return Promise.all(compToRefresh.map(componentName => {
+    return Promise.all(params.eventGroups.onLoad[componentName].map(compEventConfig => {
+      return executeEvents({ ...params, config: compEventConfig, componentName });
+    }));
+  }))
+};
+export function executeApiRequest(params: any) {
   const initialBody = { ...params.userValue?.payload };
   const initialHeaders = {
     "X-Requested-With": "XMLHttpRequest",
     "Access-Control-Allow-Origin": "*"
   };
-  const { body, headers } = await buildApiPayload(params.config, initialBody, initialHeaders, params.store, params.dynamicData, params.userValue, params.service)
 
-  const response = await params.service[params.config.method](
+  const payloadApi = buildApiPayload(params.config, initialBody, initialHeaders, params.store, params.dynamicData, params.userValue, params.service)
+  return params.service[params.config.method](
     params.config.path,
-    body,
-    headers && { headers: headers }
-  );
-  return response;
-}
+    payloadApi.body,
+    { headers: payloadApi.headers }
+  ).then((response) => {
+    return response;
+  });
+};
 
-async function executeInBuiltFunctionHandler(params: handlersProps) {
+function executeInBuiltFunctionHandler(params: handlersProps) {
   let parameter = {};
   if (params.config.funcParametersCode) {
     const makeFunc = eval(params.config.funcParametersCode)
@@ -92,13 +131,18 @@ async function executeInBuiltFunctionHandler(params: handlersProps) {
   }
 }
 
-async function executeCustomHandler(params: handlersProps) {
+function executeCustomHandler(params: handlersProps) {
   const makeFunc = eval(params.config.eventCode)
-  const response = await makeFunc(params.store, params.dynamicData, params.userValue, params.parentEventOutput, params.service, params.componentName);
-  return response;
+  if (params.config.isSync !== "Yes") {
+    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;
+  }
+
 }
 
-async function mergeFormdata(handlerResponse: any, componentName: string, eventConfig: any, store: any, service: any) {
+function mergeFormdata(handlerResponse: any, componentName: string, eventConfig: any, store: any, service: any) {
   if (eventConfig.type === "Select" && !(_.isEmpty(handlerResponse?.data) && handlerResponse?.data)) {
     store.setSchema((pre) => {
       return {
@@ -134,7 +178,6 @@ async function mergeFormdata(handlerResponse: any, componentName: string, eventC
   else {
     if (handlerResponse) {
       store.setFormdata((pre) => { return { ...pre, [componentName]: eventConfig.lazyLoading ? handlerResponse?.data?.data : handlerResponse.data } });
-      const demoData = await asyncOperation();
     }
   }
 }
@@ -176,58 +219,40 @@ const buildHeadersFormat = (headers: any[]) => {
   return headerObj;
 }
 
-async function shouldEventExecute(params: handlersProps) {
+export function shouldEventExecute(params: handlersProps) {
   const startEvent = params.config?.events?.filter(e => e.eventType === "onStart");
+
   if (startEvent?.length > 0) {
-    const response = await executeEventsHandler({ ...params, config: startEvent[0] });
-    return response;
+    return executeEventsHandler({ ...params, config: startEvent[0] }).then((response) => {
+      return response;
+    });
   } else {
-    return true
+    if (params.config.isSync !== "Yes") {
+      return Promise.resolve(true)
+    } else {
+      return true
+    }
   }
 }
 
-export async function buildApiPayload(compConfig: any, body: any, headers: any, store: any, dynamicData: any, userValue: any, service) {
-  if (compConfig?.headers) {
-    headers = buildHeadersFormat(compConfig.headers)
 
+export function buildApiPayload(compConfig: any, body: any, headers: any, store: any, dynamicData: any, userValue: any, service) {
+  if (compConfig?.headers) {
+    headers = buildHeadersFormat(compConfig.headers);
   }
+
   if (compConfig.body) {
     body = { ...buildBodyFormat(compConfig.body, store.newData || store?.ctx?.core?.data || store.formData, userValue) };
   }
-  if (compConfig.apiBody) {
-    const makeFunc = eval(compConfig.apiBody);
-    const data = await makeFunc(store, dynamicData, userValue, body);
-    body = data
-  }
-  return { body, headers };
-}
 
-export function getRefreshElements(eventConfig: any, eventGropus: any) {
-  let result: string[] = [];
-  if (eventConfig?.refreshElements?.length > 0) {
-    result = eventConfig.refreshElements.map((e) => {
-      return e.value
-    })
+  const promiseChain = { body, headers };
 
-  } else {
-    if (eventGropus?.onLoad) {
-      result = Object.keys(eventGropus?.onLoad)
-      result.push(result[0]);
-    }
-  }
-  console.log(result);
-  return result;
-}
 
+  if (compConfig.apiBody) {
+    const makeFunc = eval(compConfig.apiBody);
+    return { body: makeFunc(store, dynamicData, userValue, promiseChain.body), headers: promiseChain.headers };
+    // return result;
 
-export function asyncOperation() {
-  return new Promise((resolve, reject) => {
-    setTimeout(() => {
-      const success = true;
-      if (success) {
-        resolve("Operation completed successfully!");
-        reject(new Error("Operation failed!"));
-      }
-    }, 50);
-  });
+  }
+  return promiseChain;
 }