impaktapps-ui-builder 0.0.351 → 0.0.353

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

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

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

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

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

@@ -17,6 +17,10 @@ declare const _default: (funcParams: funcParamsProps) => {
     getSelectOptions: (param: any) => Promise<any>;
     onChange: () => Promise<void>;
     updateConfigApiBody: (paramValue: any, apiBody: any) => Promise<any>;
+    StepperBackHandler: (param: any) => Promise<void>;
+    StepperSkipHandler: (param: any) => Promise<void>;
+    StepperNextHandler: (param: any) => Promise<void>;
+    callHandler: (eventType: string) => Promise<void>;
     downloadFile: (obj: any) => void;
 };
 export default _default;

package/package.json

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

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

@@ -24,7 +24,7 @@ const FileInput = {
   export const buildFileInput = (config,componentScope) => {
     const box: any = _.cloneDeep(FileInput);
     box.scope = componentScope;
-    box.config.main.heading = config.label
+    box.config.main.label = config.label
     if(config.layout){
       box.config.layout = createLayoutFormat(config.layout)
     }

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

@@ -0,0 +1,43 @@
+import { createLayoutFormat } from "./buildConfig";
+import WrapperSection from "./uischema/wrapperSection";
+import _ from "lodash";
+
+const PopUP =  {
+    type: "Control",
+    scope: "#/properties/text",
+    options: {
+      widget: "PopUp",
+    },
+    config: {
+      layout: {
+        xs: 12,
+        sm: 12,
+        md: 12,
+        lg: 12,
+      },
+      main: {
+        label: "PopUp",
+        fullScreen:false,
+        fullWidth:false,
+        maxWidth:false,
+        alignItems:false,
+        spacing:2
+      },
+      style:{}
+    },
+  }
+export const buildPopUp = (config,componentScope) =>{
+    const popup: any = _.cloneDeep(PopUP);
+    popup.scope = componentScope;
+    popup.config.main.label = 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)
+    }
+    if (config.style) {
+      PopUP.config.style = JSON.parse(config.style)
+  }
+    return popup;
+}

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

@@ -0,0 +1,49 @@
+import _ from "lodash";
+import { createLayoutFormat } from "./buildConfig";
+
+const Stepper =
+
+{
+    type: "Control",
+    scope: "#/properties/Stepper",
+    options: {
+        widget: "Stepper",
+    },
+
+    config: {
+        main: {
+            label: ["First", "Second", "Third"],
+            stepsSkip: { 0: "false", 1: "false" },
+            resetButton: false,
+            resetText: "RESETdaad",
+            orientation: "vertical"
+        },
+    },
+    "elements":
+        [],
+};
+
+export const buildStepper = (config, componentScope) => {
+    const stepper: any = _.cloneDeep(Stepper);
+    stepper.scope = componentScope;
+    stepper.config.main.complete = config.fullScreen === "YES" ? true : false;
+    stepper.config.main.resetButton = config.fullWidth === "YES" ? true : false;
+    stepper.config.main.resetText = config.resetText || "ResetData";
+    stepper.config.main.completeText = config.completeText || "CompleteText";
+    stepper.config.main.orientation = config.orientation || "horizontal";
+    if (config.sectionLabels) {
+        stepper.config.main.tabLabels = config.sectionLabels.map((e,i:number) =>{ 
+            return {label:e.label,id:i}});
+    }
+    if (config.skipAvailable) {
+        stepper.config.main.tabLabels = config.skipAvailable.map((e,i:number) =>{ 
+            return {[e.skipId]:true}});
+    }
+    if (config.layout) {
+        stepper.config.layout = createLayoutFormat(config.layout)
+    }
+    if (config.style) {
+        stepper.config.style = JSON.parse(config.style)
+    }
+    return stepper;
+}

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

@@ -34,6 +34,8 @@ import { buildEmptyBox } from "./buildEmptyBox";
 import { buildArray } from "./buildArray";
 import { buildAdhaarField, buildPanField } from "./buildAadharCard";
 import { buildFileInput } from "./buildFileInput";
+import { buildStepper } from "./buildStepper";
+import { buildPopUp } from "./buildPop";
 export let schema = {
   type: "object",
   properties: {},
@@ -164,6 +166,12 @@ const buildUiSchema = (config: any) => {
   let elements: any = {};
   const componentScope = `#/properties/${config.name}`;
   switch (config.type) {
+    case "Stepper":
+      elements = buildStepper(config, componentScope);
+      break;
+    case "PopUp":
+      elements = buildPopUp(config, componentScope);
+      break;
     case "FileInput":
       elements = buildFileInput(config, componentScope);
       break;

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

@@ -160,6 +160,29 @@ const GraphSection = {
 export const buildPropertiesSection = function (type: String) {
   let uiSchema = _.cloneDeep(GraphSection);
   switch (type) {
+    case "Stepper":
+      uiSchema.elements = [
+        getRadioInputField("complete", "Complete Needed", ["YES", "NO"]),
+        getRadioInputField("resetButton", "Reset Button", ["YES", "NO"]),
+        getInputField("resetText", "Reset Text"),
+        getInputField("completeText", "Complete Text"),
+        getSelectField("orientation", "Orientation Type", [
+          { label: "Horizontal", value: "horizontal" },
+          { label: "Vertical", value: "vertical" },
+        ]),
+        getArrayControl("sectionLabels", "label"),
+        getArrayControl("skipAvailable", "skipId"),
+        EmptyBox
+      ]
+      break;
+    case "PopUp":
+      uiSchema.elements = [
+        getRadioInputField("fullScreen", "FullScreen", ["YES", "NO"]),
+        getRadioInputField("fullWidth", "FullWidth", ["YES", "NO"]),
+        getInputField("maxWidth", "Max. Width"),
+        EmptyBox
+      ]
+      break;
     case "Text":
       uiSchema.elements = [
         getInputField("placeholder", "Placeholder"),

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

@@ -19,11 +19,13 @@ export const ComponentSchema: any = {
         { title: "LeaderBoard", const: "LeaderBoard" },
         { title: "MultipleSelect", const: "MultipleSelect" },
         { title: "PanCardText", const: "PanCardText" },
+        { title: "Popup Container", const: "PopUp" },
         { title: "ProgressBar", const: "ProgressBar" },
         { title: "ProgressBar Card", const: "ProgressBarCard" },
         { title: "Select", const: "Select" },
         { title: "Slider", const: "Slider" },
         { title: "SpeedoMeter", const: "SpeedoMeter" },
+        { title: "Stepper Container", const: "Stepper" },
         { title: "Radio", const: "Radio" },
         { title: "Rank", const: "Rank" },
         { title: "Rank Card", const: "RankCard" },
@@ -122,6 +124,18 @@ export const ComponentSchema: any = {
         },
       },
     },
+    skipAvailable: {
+      type: "array",
+      items: {
+        type: "object",
+        properties: {
+          skipId: {
+            type: "string",
+          },
+
+        },
+      },
+    },
     Table_Download_Keys_Name: {
       type: "array",
       items: {

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

@@ -39,12 +39,16 @@ export const EventSchema = {
       type: "string",
       oneOf: [
         { title: "Click Event", const: "onClick" },
-        { title: "onStart", const: "onStart" },
         { title: "Load Event", const: "onLoad" },
-        { title: "File Upload Event", const: "onUpload" },
-        { title: "File Download Event", const: "onDownload" },
         { title: "Change Event", const: "onChange" },
         { title: "Success", const: "Success" },
+        { title: "onStart", const: "onStart" },
+     
+        { title: "File Upload Event", const: "onUpload" },
+        { title: "Stepper Back Event", const: "onStepperBack" },
+        { title: "Stepper Next Event", const: "onStepperNext" },
+        { title: "Stepper Skip Event", const: "onStepperSkip" },
+        { title: "File Download Event", const: "onDownload" },
         { title: "Fail", const: "Fail" }
       ]
     },

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

@@ -33,6 +33,8 @@ const sectionLabels = {
   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"],
 }
 
 

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

@@ -30,7 +30,7 @@ export const extractEvents = (eventConfig: any) => {
           return elem.eventType === "Success"
         })
         if (!(!!SuccessEvent) && event.eventType === "onLoad") {
-          event.events.push({ Handler: "mergeFormdata", eventType: "Success", type: compType,lazyLoading:eventConfig.lazyLoading==="YES"?true:false })
+          event.events.push({ Handler: "mergeFormdata", eventType: "Success", type: compType, lazyLoading: eventConfig.lazyLoading === "YES" ? true : false })
         }
         eventGroups[event.eventType][eventConfigObj.name].push({ ...event, type: compType })
       });
@@ -59,7 +59,7 @@ export default (funcParams: funcParamsProps) => {
   let executeEventsParameters: handlersProps = {
     config: {}, componentName: "",
     store: funcParams.store, dynamicData: funcParams.dynamicData, userValue: funcParams.userValue, service: funcParams.service,
-    serviceHolder: {downloadFile}, eventGroups
+    serviceHolder: { downloadFile }, eventGroups
   };
   return {
     setPage: async function () {
@@ -76,54 +76,33 @@ export default (funcParams: funcParamsProps) => {
               { ...funcParams.schema.properties, ...pre.properties, }
           }
         }
-        )
+      )
       funcParams.uiSchema.elements.push(notifyUiSchema);
       funcParams.store.setUiSchema(funcParams.uiSchema);
-      await executeRefreshHandler( {
+      await executeRefreshHandler({
         config: {}, componentName: "",
         store: funcParams.store, dynamicData: funcParams.dynamicData, userValue: funcParams.userValue, service: funcParams.service,
         serviceHolder: this, eventGroups
       })
     },
     onClick: async function () {
-      const path = funcParams.dynamicData?.tableButtonPath || funcParams.dynamicData.path.split(".")[0];
-      for (const eventConfig of eventGroups?.onClick[path]) {
-        await executeEvents({
-          ...executeEventsParameters,
-          config: eventConfig,
-          componentName: path
-        })
-      }
+      await this.callHandler("onClick")
     },
-    onFileDownload:async () =>{
-      const path = funcParams.dynamicData?.tableButtonPath || funcParams.dynamicData.path.split(".")[0];
-      for (const eventConfig of eventGroups?.onDownload[path]) {
-        await executeEvents({
-          ...executeEventsParameters,
-          config: eventConfig,
-          componentName: path
-        })
-      }
+    onFileDownload: async function () {
+      await this.callHandler("onDownload")
     },
-    onFileUpload:async () =>{
-      const path = funcParams.dynamicData?.tableButtonPath || funcParams.dynamicData.path.split(".")[0];
-      for (const eventConfig of eventGroups?.onUpload[path]) {
-        await executeEvents({
-          ...executeEventsParameters,
-          config: eventConfig,
-          componentName: path
-        })
-      }
+    onFileUpload: async function () {
+      await this.callHandler("onUpload")
     },
     onPaginationChange: async function (paginationValues) {
       const apiBody = [
         { key: "size", value: paginationValues.pagination.pageSize },
-        { key: "pageIndex", value: paginationValues.pagination.pageIndex  },
+        { key: "pageIndex", value: paginationValues.pagination.pageIndex },
         { key: "sorting", value: paginationValues.sorting || [] },
         { key: "filters", value: paginationValues.columnFilters || [] },
         { key: "globalFilter", value: paginationValues.globalFilter ?? '' }
       ]
-      const response =  await this.updateConfigApiBody(paginationValues, apiBody);
+      const response = await this.updateConfigApiBody(paginationValues, apiBody);
       return response?.data;
     },
     getSelectOptions: async function (param) {
@@ -175,6 +154,28 @@ export default (funcParams: funcParamsProps) => {
       }
       return LastCallResponse
     },
+    StepperBackHandler: async function (param) {
+      await this.callHandler("onStepperBack")
+      param.handleBack()
+    },
+    StepperSkipHandler: async function (param) {
+      await this.callHandler("onStepperSkip")
+      param.handleSkip()
+    },
+    StepperNextHandler: async function (param) {
+      await this.callHandler("onStepperNext")
+      param.handleNext()
+    },
+    callHandler: async function (eventType: string) {
+      const path = funcParams.dynamicData?.tableButtonPath || funcParams.dynamicData.path.split(".")[0];
+      for (const eventConfig of eventGroups?.[eventType]?.[path]) {
+        await executeEvents({
+          ...executeEventsParameters,
+          config: eventConfig,
+          componentName: path
+        })
+      }
+    },
     downloadFile: downloadFile
   };
 };