impaktapps-ui-builder 0.0.384 → 0.0.386

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

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

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

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

package/package.json

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

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

@@ -0,0 +1,51 @@
+import _ from "lodash";
+import { createLayoutFormat } from "./buildConfig";
+
+const dataGrid = {
+    "type": "Control",
+    "scope": "#/properties/dataGrid",
+    "layout": 12,
+    "options": {
+        "widget": "DataGrid"
+    },
+    elements: [
+    ],
+    "config": {
+        "main": {
+            // "label": "Data Grid",
+            elevation: 0,
+            useWrapper: false
+        },
+        style: {
+
+        }
+    }
+};
+
+export const buildDataGrid = (config, componentScope) => {
+    const DataGrid: any = _.cloneDeep(dataGrid);
+    DataGrid.scope = componentScope;
+    if (config.elevation) {
+        DataGrid.config.main.elevation = +config.elevation;
+    }
+    DataGrid.config.main.divider = config.divider === "NO" ? false : true;
+    if (config.height) {
+        DataGrid.config.main.height = `${config.height}px`;
+    }
+    if (config.justifyContent) {
+        DataGrid.config.main.justifyContent = config.justifyContent;
+    }
+    if (config.label) {
+        DataGrid.config.main.label = config.label;
+    }
+    if (config.layout) {
+        DataGrid.config.layout = createLayoutFormat(config.layout)
+    }
+    if (config.cardLayout) {
+        DataGrid.config.cardLayout = createLayoutFormat(config.cardLayout)
+    }
+    if (config.style) {
+        DataGrid.config.style = JSON.parse(config.style)
+    }
+    return DataGrid;
+}

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

@@ -0,0 +1,46 @@
+
+import _ from "lodash";
+import { createLayoutFormat } from "./buildConfig";
+const InputSlider = {
+    type: "Control",
+    scope: "#/properties/inputSlider",
+    options: {
+        widget: "InputSlider",
+    },
+
+    config: {
+        layout: 12,
+        main: {
+            limitToMax: false,
+            max: 10000,
+            step: 1000,
+            min: 0,
+            label: "Slider"
+        },
+       
+    },
+};
+export const buildInputSlider = (config, componentScope) => {
+    const inputSlider: any = _.cloneDeep(InputSlider);
+    inputSlider.scope = componentScope;
+    inputSlider.config.main.label = config.label
+    if (config.layout) {
+        inputSlider.config.layout = createLayoutFormat(config.layout)
+    }
+    if (config.limitToMax) {
+        inputSlider.config.main.limitToMax = config.limitToMax === "YES" ? true : false;
+    }
+    if (config.max) {
+        inputSlider.config.main.max = config.max
+    }
+    if (config.step) {
+        inputSlider.config.main.step = config.step;
+    }
+    if (config.min) {
+        inputSlider.config.main.min = config.min;
+    }
+    if (config.style) {
+        inputSlider.config.main.defaultStyle = JSON.parse(config.style)
+    }
+    return inputSlider;
+}

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

@@ -10,7 +10,7 @@ const Stepper = {
 
     config: {
         main: {
-            steps:[{label:"First"}, {label:"Second"},{label: "Third"}],
+            steps: [{ label: "First" }, { label: "Second" }, { label: "Third" }],
             resetButton: false,
             resetText: "Reset",
             orientation: "vertical"
@@ -24,11 +24,14 @@ export const buildStepper = (config, componentScope) => {
     const stepper: any = _.cloneDeep(Stepper);
     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.label = config.sectionLabels.map((e, i: number) => {
+        stepper.config.main.steps = config.sectionLabels.map((e, i: number) => {
             return { label: e.label, id: i }
         });
     }

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

@@ -16,7 +16,7 @@ export const buildTable = (config: any, componentScope: string) => {
     table.config.main.Selection = config.SelectionAvailable === "YES" ? true : false
   };
   if (config.ColumnResizingAvailable) {
-    table.config.main.disableColumnResizing = config.ColumnResizingAvailable === "YES" ? true : false
+    table.config.main.disableColumnResizing = config.ColumnResizingAvailable === "YES" ? false : true
   };
   if (config.DragAvailable) {
     table.config.main.enableDrag = config.DragAvailable === "YES" ? true : false

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

@@ -36,6 +36,8 @@ import { buildAdhaarField, buildPanField } from "./buildAadharCard";
 import { buildFileInput } from "./buildFileInput";
 import { buildStepper } from "./buildStepper";
 import { buildPopUp } from "./buildPop";
+import { buildDataGrid } from "./buildDataGrid";
+import { buildInputSlider } from "./buildInputSlider";
 export let schema = {
   type: "object",
   properties: {},
@@ -66,14 +68,14 @@ function buildRule(configObj: any, tableName?: string, arrayHolderName?: boolean
       }
     }
   } else if ((configObj.type === "Select" || configObj.type === "MultipleSelect") && configObj.value?.length > 0) {
-    if (configObj.type === "Select" ) {
+    if (configObj.type === "Select") {
       schema.properties[configObj.name] = {
         oneOf: configObj.value.map((e) => {
           return { const: e.value, title: e.label }
         })
       }
     }
-    else if (configObj.type === "MultipleSelect" ) {
+    else if (configObj.type === "MultipleSelect") {
       schema.properties[configObj.name] = {
         items: {
           oneOf: configObj.value.map((e) => {
@@ -166,6 +168,12 @@ const buildUiSchema = (config: any) => {
   let elements: any = {};
   const componentScope = `#/properties/${config.name}`;
   switch (config.type) {
+    case "InputSlider":
+      elements = buildInputSlider(config, componentScope);
+      break;
+    case "DataGrid":
+      elements = buildDataGrid(config, componentScope);
+      break;
     case "Stepper":
       elements = buildStepper(config, componentScope);
       break;
@@ -178,15 +186,15 @@ const buildUiSchema = (config: any) => {
     case "AadharcardText":
       elements = buildAdhaarField(config, componentScope);
       break;
-      case "PanCardText":
+    case "PanCardText":
       elements = buildPanField(config, componentScope);
       break;
-      case "TabSection":
-        elements = buildTabSection(config, componentScope);
-        break;
+    case "TabSection":
+      elements = buildTabSection(config, componentScope);
+      break;
     case "RunnerBoyProgressBar":
       elements = RunnerBoyProgressbar(config, componentScope);
-    break;
+      break;
     case "WrapperSection":
       elements = buildWrapperSection(config, componentScope);
       break;
@@ -295,17 +303,25 @@ const buildUiSchema = (config: any) => {
       return elements;
     }
     else if (config.type == "Table") {
+      const sizeMap = {}
+      if (config.sizeHolder) {
+         config.sizeHolder.map((e, i) => {
+          sizeMap[e.keyName] = e.value
+        });
+      }
       elements.elements = config.elements.map((e, elemInd) => {
         if (e.type) {
           return {
             accessorKey: e.name,
             header: e.label || e.name,
+            size: sizeMap[e.name]|| 180,
             widget: buildUiSchema(e)
           }
         }
         return {
           accessorKey: e.name,
-          header: e.label || e.name
+          header: e.label || e.name,
+          size:  sizeMap[e.name]|| 180
         }
       })
     }

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

@@ -1,3 +1,4 @@
+import { createLayoutFormat } from "./buildConfig";
 import WrapperSection from "./uischema/wrapperSection";
 import _ from "lodash";
 
@@ -8,5 +9,8 @@ export const buildWrapperSection = (config,componentScope) =>{
     if (config.style) {
         wrapper.config.style = JSON.parse(config.style)
       }
+      if (config.layout) {
+        wrapper.config.layout = createLayoutFormat(config.layout)
+      }
     return wrapper;
 }

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

@@ -19,6 +19,61 @@ const EmptyBox = {
     },
   },
 };
+const cardLayout =  {
+  type: "Control",
+  scope: "#/properties/cardLayout",
+  layout: 11.5,
+  options: {
+    detail: {
+      type: "HorizontalLayout",
+      elements: [
+        {
+          type: "Control",
+          scope: "#/properties/key",
+          options: {
+            widget: "SelectInputField",
+          },
+          config: {
+            layout: {
+              xs: 11,
+              sm: 11,
+              md: 5.5,
+              lg: 5.5,
+            },
+            main: {
+              label: "Screen Size",
+            
+            },
+          },
+        },
+        {
+          type: "Control",
+          scope: "#/properties/value",
+
+          options: {
+            widget: "InputField",
+          },
+          config: {
+            layout: {
+              xs: 11,
+              sm: 11,
+              md: 5.5,
+              lg: 5.5,
+            },
+            main: {
+              label: "Value",
+              type:"number",
+              // freeSolo:true,
+              helperText:'Number should be in range of 0 to 12',
+              errorMessage:"Number Can't be greater than 12 and can't be less than 0.",
+             
+            },
+          },
+        },
+      ],
+    },
+  },
+};
 const getArrayControl = (parentScope: string, childScope: string, childLabel?: string,) => {
   return {
     type: "Control",
@@ -53,7 +108,27 @@ const getArrayControl = (parentScope: string, childScope: string, childLabel?: s
       },
     },
   }
-}
+};
+const sizeHolder = getArrayControl("sizeHolder", "keyName", "Component Name");
+sizeHolder.options.detail.elements[1] = {
+  type: "Control",
+  scope: `#/properties/value`,
+
+  options: {
+    widget: "InputField",
+  },
+  config: {
+    layout: {
+      xs: 11,
+      sm: 11,
+      md: 5.5,
+      lg: 5.5,
+    },
+    main: {
+      label: "Size",
+    },
+  },
+};
 const getInputField = (scope: String, label: String) => {
   return {
     type: "Control",
@@ -160,16 +235,34 @@ const GraphSection = {
 export const buildPropertiesSection = function (type: String) {
   let uiSchema = _.cloneDeep(GraphSection);
   switch (type) {
+    case "InputSlider":
+      uiSchema.elements = [
+        getInputField("max", "Max Limit"),
+        getInputField("step", "Step"),
+        getInputField("min", "Min Limit"),
+        getRadioInputField("limitToMax", "Applly Max. Limit", ["YES", "NO"]),
+      ]
+      break;
+    case "DataGrid":
+      uiSchema.elements = [
+        getRadioInputField("divider", "Use Header divider", ["YES", "NO"]),
+        getInputField("elevation", "Card Elevation"),
+        getInputField("height", "Grid height"),
+        getInputField("justifyContent", "justifyContent"),
+        cardLayout,
+      ]
+      break;
     case "Stepper":
       uiSchema.elements = [
         getRadioInputField("resetButton", "Reset Button", ["YES", "NO"]),
+        getRadioInputField("defaultButtonAvailable", "Use Default Buttons ", ["YES", "NO"]),
         getInputField("resetText", "Reset Text"),
         getInputField("completeText", "Complete Text"),
         getSelectField("orientation", "Orientation Type", [
           { label: "Horizontal", value: "horizontal" },
           { label: "Vertical", value: "vertical" },
         ]),
-        EmptyBox,
+
         getArrayControl("sectionLabels", "label")
 
       ]
@@ -291,6 +384,7 @@ export const buildPropertiesSection = function (type: String) {
         getRadioInputField("downloadAllData", "Download All Data", ["YES", "NO"]),
         getInputField("selectKey", "Selection Key"),
         getArrayControl("Table_Download_Keys_Name", "KeyName", "Table Key Name"),
+        sizeHolder
       ]
       break;
     case "Radio":

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

@@ -10,11 +10,13 @@ export const ComponentSchema: any = {
         { title: "Card", const: "card" },
         { title: "CheckBox", const: "CheckBox" },
         { title: "Container", const: "WrapperSection" },
+        { title: "DataGrid", const: "DataGrid" },
         { title: "Date", const: "Date" },
         { title: "Download File", const: "DownloadFile" },
         { title: "Empty Box", const: "EmptyBox" },
         { title: "File", const: "FileInput" },
         { title: "Graph", const: "Graph" },
+        { title: "Input Slider", const: "InputSlider" },
         { title: "Label", const: "Box" },
         { title: "LeaderBoard", const: "LeaderBoard" },
         { title: "MultipleSelect", const: "MultipleSelect" },
@@ -72,6 +74,27 @@ export const ComponentSchema: any = {
         },
       },
     },
+    cardLayout: {
+      type: "array",
+      items: {
+        type: "object",
+        properties: {
+          key: {
+            type: "string",
+            oneOf: [
+              { title: "Extra Small", const: "xs" },
+              { title: "Small", const: "sm" },
+              { title: "Medium", const: "md" },
+              { title: "Large", const: "lg" },
+            ],
+          },
+          value: {
+            // type: "string",
+      
+          },
+        },
+      },
+    },
     value: {
       type: "array",
       items: {
@@ -141,6 +164,20 @@ export const ComponentSchema: any = {
         },
       },
     },
+    sizeHolder: {
+      type: "array",
+      items: {
+        type: "object",
+        properties: {
+          keyName: {
+            type: "string",
+          },
+          value:{
+            type:"string"
+          }
+        },
+      },
+    },
     legendLabels: {
       type: "array",
       items: {

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

@@ -1,48 +1,46 @@
-import { template } from "lodash";
-
-export const PageMasterSchema = {
-  type: "object",
-  properties: {
-    name: {
-      type: "string",
-      minLength: 6,
-      //  pattern: '^page_\\w+$'
-    },
-    label: {
-      type: "string",
-    },
-    layout: {
-      type: "array",
-      items: {
-        type: "object",
-        properties: {
-          layout_key: {
-            type: "string",
-          },
-          layout_value: {
-            type: "string",
+export const PageMasterSchema  = {
+    type: "object",
+    properties: {
+      name:{
+     type:"string",
+     minLength: 6,
+    //  pattern: '^page_\\w+$'
+      },
+      label:{
+        type:"string",
+      },
+      layout: {
+        type: "array",
+        items: {
+          type: "object",
+          properties: {
+            layout_key: {
+              type: "string",
+            },
+            layout_value: {
+              type: "string",
+            },
           },
         },
       },
-    },
-    template: {
-      oneOf: [
-        { const: "template1", title: "template1" },
-        { const: "template2", title: "template2" },
-        { const: "template3", title: "template3" }
-      ]
-    },
+      template: {
+        oneOf: [
+          { const: "Template-1", title: "template1" },
+          { const: "Template-2", title: "template2" },
+          { const: "Template-3", title: "template3" }
+        ]
+      },
     sectionLabels: {
-      type: "array",
-      items: {
-        type: "object",
-        properties: {
-          label: {
-            type: "string",
-          }
+        type: "array",
+        items: {
+          type: "object",
+          properties: {
+            label: {
+              type: "string",
+            }
+          },
         },
-      },
-    }
-  },
-  required: ["template", "name"]
+      }
+},
+required:["label","template"]
 }

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

@@ -65,7 +65,7 @@ export const EventSchema = {
       oneOf: [
         { title: "RankProvider", const: "RankProvider" },
         { title: "Download File", const: "downloadFile" },
-        { title: "Download", const: "download" },
+        { title: "Download", const: "download" }
       ]
     },
     body: {

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

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

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

@@ -36,6 +36,7 @@ export default (
           uiSchema.elements[1].elements[0].elements[2] = getSelectField("inBuiltFunctionType", "Function Name", [
             { label: "RankProvider", value: "RankProvider" },
             { label: "Download File", value: "downloadFile" },
+            { label: "Download Blob File", value: "downloadBlobFile" }
           ])
           uiSchema.elements[1].elements[0].elements[3] = getTextArea("funcParametersCode", "Write Custom Code for Functions Parameter", true, { xs: 12, sm: 12, md: 6 });
           schema.required = ["eventType", "Handler", "inBuiltFunctionType"]

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

@@ -65,7 +65,7 @@ export async function saveHandler(store, service, submitHandler, pageName?: stri
     if (_.isEmpty(store.ctx.core.errors)) {
         try {
             const saveReturn = await submitHandler(store, service, config);
-            navigateHandler(store, true, pageName ? `/${pageName}?id=${id}` : "/PageMasterRecords")
+            navigateHandler(store, true, pageName ? `/${pageName}?id=${saveReturn.id}` : "/PageMasterRecords")
         } catch (err) {
             navigateHandler(store, false)
         }

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

@@ -87,7 +87,7 @@ async function executeInBuiltFunctionHandler(params: handlersProps) {
     const makeFunc = eval(params.config.funcParametersCode)
     parameter = makeFunc(params.store, params.dynamicData, params.userValue, params.parentEventOutput, params.service);
   }
-  params.serviceHolder[params.config.inBuiltFunctionType](parameter)
+  params.serviceHolder[params.config.inBuiltFunctionType](parameter,params.service)
 }
 
 async function executeCustomHandler(params: handlersProps) {
@@ -131,7 +131,7 @@ async function mergeFormdata(handlerResponse: any, componentName: string, eventC
   }
   else {
     if (handlerResponse) {
-      store.setFormdata((pre) => { return { ...pre, [componentName]: eventConfig.lazyLoading ? handlerResponse.data.data : handlerResponse.data } });
+      store.setFormdata((pre) => { return { ...pre, [componentName]: eventConfig.lazyLoading ? handlerResponse?.data?.data : handlerResponse.data } });
       const demoData = await asyncOperation();
     }
   }

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

@@ -62,7 +62,7 @@ export default (funcParams: funcParamsProps) => {
   let executeEventsParameters: handlersProps = {
     config: {}, componentName: "",
     store: funcParams.store, dynamicData: funcParams.dynamicData, userValue: funcParams.userValue, service: funcParams.service,
-    serviceHolder: { downloadFile,download:doDownload }, eventGroups
+    serviceHolder: { downloadFile ,download:doDownload}, eventGroups
   };
   return {
     setPage: async function () {