impaktapps-ui-builder 0.0.382460 → 1.0.1-alpha.1

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

@@ -9,28 +9,7 @@ export declare const TableSection: (theme: any) => {
         config: {
             main: {
                 headerIcons: {
-                    elements: ({
-                        widget: {
-                            type: string;
-                            scope: string;
-                            options: {
-                                widget: string;
-                            };
-                            config: {
-                                main: {
-                                    color: string;
-                                    onClick: string;
-                                    size: string;
-                                    icon: string;
-                                    iconLabel: string;
-                                    styleDefault: boolean;
-                                };
-                                style: {
-                                    mt: string;
-                                };
-                            };
-                        };
-                    } | {
+                    elements: {
                         widget: {
                             type: string;
                             scope: string;
@@ -44,14 +23,19 @@ export declare const TableSection: (theme: any) => {
                                     icon: string;
                                     iconLabel: string;
                                     styleDefault: boolean;
-                                    color?: undefined;
                                 };
                                 style: {
                                     mt: string;
+                                    color: string;
+                                    fill: string;
+                                    "&:hover": {
+                                        color: string;
+                                        fill: string;
+                                    };
                                 };
                             };
                         };
-                    })[];
+                    }[];
                 };
                 disableAction: boolean;
                 disableSelection: boolean;
@@ -61,13 +45,15 @@ export declare const TableSection: (theme: any) => {
         elements: ({
             accessorKey: string;
             header: string;
+            type: string;
+            size: number;
             field?: undefined;
-            flex?: undefined;
             widget?: undefined;
         } | {
             header: string;
             field: string;
-            flex: number;
+            size: number;
+            type: string;
             widget: {
                 type: string;
                 scope: string;
@@ -77,14 +63,17 @@ export declare const TableSection: (theme: any) => {
                 config: {
                     main: {
                         icon: string;
-                        color: string;
+                        size: string;
                         onClick: string;
                         tooltipMessage: string;
                         styleDefault?: undefined;
                         disabled?: undefined;
                     };
                     style: {
-                        color: any;
+                        fill: any;
+                        "& :hover": {
+                            fill: any;
+                        };
                     };
                 };
             };
@@ -92,7 +81,8 @@ export declare const TableSection: (theme: any) => {
         } | {
             header: string;
             field: string;
-            flex: number;
+            size: number;
+            type: string;
             widget: {
                 type: string;
                 scope: string;
@@ -102,20 +92,26 @@ export declare const TableSection: (theme: any) => {
                 config: {
                     main: {
                         icon: string;
-                        color: string;
                         onClick: string;
                         tooltipMessage: string;
+                        size?: undefined;
                         styleDefault?: undefined;
                         disabled?: undefined;
                     };
-                    style?: undefined;
+                    style: {
+                        fill: any;
+                        "& :hover": {
+                            fill: any;
+                        };
+                    };
                 };
             };
             accessorKey?: undefined;
         } | {
             header: string;
             field: string;
-            flex: number;
+            size: number;
+            type: string;
             widget: {
                 type: string;
                 scope: string;
@@ -128,7 +124,7 @@ export declare const TableSection: (theme: any) => {
                         onClick: string;
                         styleDefault: boolean;
                         disabled: boolean;
-                        color?: undefined;
+                        size?: undefined;
                         tooltipMessage?: undefined;
                     };
                     style?: undefined;

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

@@ -1,5 +1,11 @@
 export declare const ValidationSection: {
     type: string;
+    config: {
+        main: {
+            label: string;
+            gap: string;
+        };
+    };
     elements: {
         type: string;
         scope: string;

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

@@ -1,46 +1,66 @@
 export declare const ValueTab: {
     type: string;
+    config: {
+        main: {
+            label: string;
+            gap: string;
+        };
+    };
     elements: {
         type: string;
         scope: string;
-        layout: number;
         options: {
-            detail: {
-                type: string;
-                elements: ({
-                    type: string;
-                    scope: string;
-                    options: {
-                        widget: string;
-                    };
-                    config: {
-                        layout: {
-                            xs: number;
-                            sm: number;
-                            md: number;
-                            lg: number;
-                        };
-                        main: {
-                            label: string;
-                        };
-                    };
-                } | {
-                    type: string;
-                    scope: string;
-                    options: {
-                        widget: string;
-                    };
-                    config: {
-                        layout: {
-                            xs: number;
-                            sm: number;
-                            md: number;
-                            lg: number;
-                        };
-                        main?: undefined;
-                    };
-                })[];
+            widget: string;
+        };
+        config: {
+            layout: number;
+            main: {
+                label: string;
+                childElementLabel: string;
+            };
+            style: {
+                marginLeft: string;
+                marginBottom: string;
+                labelStyle: {
+                    marginLeft: string;
+                };
+                detailsStyle: {
+                    marginLeft: string;
+                };
             };
         };
+        elements: ({
+            type: string;
+            scope: string;
+            options: {
+                widget: string;
+            };
+            config: {
+                layout: {
+                    xs: number;
+                    sm: number;
+                    md: number;
+                    lg: number;
+                };
+                main: {
+                    label: string;
+                };
+            };
+        } | {
+            type: string;
+            scope: string;
+            options: {
+                widget: string;
+            };
+            config: {
+                layout: {
+                    xs: number;
+                    sm: number;
+                    md: number;
+                    lg: number;
+                };
+                main?: undefined;
+            };
+        })[];
     }[];
 };

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

@@ -71,6 +71,12 @@ export declare const EventSchema: {
         RemoveItemButton: {
             disabled: boolean;
         };
+        pageName: {
+            path: {
+                label: string;
+                path: string;
+            }[];
+        };
     };
     required: string[];
 };

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

@@ -22,5 +22,7 @@ declare const _default: (store: any, dynamicData: any, submitHandler: any, servi
     RemoveItemButton: (paramStore?: any) => void;
     elementPathHandler: (parentPath: string, rowId: any, elementType: string) => string;
     ElementPathSetter: (uiSchema: any, copiedFormData?: any) => void;
+    onNavigatePopupYes: () => void;
+    onNavigatePopupNo: () => void;
 };
 export default _default;

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

@@ -79,6 +79,12 @@ declare const _default: (store: any, dynamicData: any, submitHandler: any, servi
             RemoveItemButton: {
                 disabled: boolean;
             };
+            pageName: {
+                path: {
+                    label: string;
+                    path: string;
+                }[];
+            };
         };
         required: string[];
     };
@@ -92,5 +98,7 @@ declare const _default: (store: any, dynamicData: any, submitHandler: any, servi
     deletePopUpEvent: () => void;
     copyPasteElement: () => void;
     RemoveItemButton: () => void;
+    onNavigatePopupYes: () => void;
+    onNavigatePopupNo: () => void;
 };
 export default _default;

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

@@ -5,6 +5,6 @@ export declare const getNavigationHistory: (config: any, path: string | undefine
 };
 export declare const saveFormdataInSessionStorage: (formData: any, path?: string) => any;
 export declare const getFormdataFromSessionStorage: (path?: string) => any;
-export declare function saveHandler(store: any, service: any, submitHandler: any, pageName?: string): Promise<void>;
+export declare function saveHandler(store: any, service: any, submitHandler: any): Promise<void>;
 export declare const navigateHandler: (store: any, isSubmitted: any, pageName?: string | boolean) => void;
 export declare function okHandler(store: any): void;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "impaktapps-ui-builder",
-    "version": "0.0.382460",
+    "version": "1.0.1-alpha.1",
     "scripts": {
         "dev": "vite",
         "build": "tsc && vite build",

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

@@ -11,6 +11,7 @@ const TextField = {
       "widget": "InputField"
     },
   config:{
+    layout: { xs: 12, sm: 6, md: 4, lg: 4 },
     main:{
       label:"Adhaar Card",
       formatStrArray:["9","9","9","9"," ","9","9","9","9"," ","X9","X9","X9","X9"],
@@ -42,6 +43,7 @@ const PanField = {
       "widget": "InputField"
     },
   config:{
+    layout: { xs: 12, sm: 6, md: 4, lg: 4 },
     main:{
       label:"Pan Card",
       placeholder:"AAAAA0000A",

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

@@ -35,7 +35,12 @@ export const createLayoutFormat = (config: any[]) => {
       lg: 12,
     }
   }
-  let data: any = {};
+  let data: any = {
+    xs: 12,
+    sm: 12,
+    md: 6,
+    lg: 6,
+  };
   config.map((e: any) => {
     data[e.key || "xs"] = +e.value || 5.5
   })

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

@@ -0,0 +1,26 @@
+import _ from "lodash";
+import PhoneInput from "./uischema/phoneInput";
+import { createLayoutFormat } from "./buildConfig";
+
+export const buildPhoneInputField = (config: any, componentScope: string) => {
+  const phonInputField: any = _.cloneDeep(PhoneInput);
+  phonInputField.config.main.label = config.label;
+  if (config.style) {
+    phonInputField.config.style = JSON.parse(config.style)
+  }
+  // if (config.multiline) {
+  //   phonInputField.config.main.multiline = config.multiline === "YES" ? true : false;
+  // }
+  if (config.InputFormatingAndMasking) {
+    phonInputField.config.main.formatStrArray = config.InputFormatingAndMasking.map(e => e.formatElement);
+  }
+  if (config.placeholder) {
+    phonInputField.config.main.placeholder = config.placeholder;
+  }
+  if (config.layout) {
+    phonInputField.config.layout = createLayoutFormat(config.layout)
+  }
+  phonInputField.config.main.errorMessage = `${config.name} is empty or invalid`;
+  phonInputField.scope = componentScope;
+  return phonInputField;
+}

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

@@ -2,22 +2,25 @@ import _ from "lodash";
 import TextInputField from "./uischema/textInputField";
 import { createLayoutFormat } from "./buildConfig";
 
-export const buildTextField = (config:any,componentScope:string) =>{
-    const inputField: any = _.cloneDeep(TextInputField);
-    inputField.config.main.label = config.label;
-    if (config.style) {
-      inputField.config.style = JSON.parse(config.style)
-    }
-    if (config.InputFormatingAndMasking) {
-      inputField.config.main.formatStrArray = config.InputFormatingAndMasking.map(e => e.formatElement);
-    }
-    if (config.placeholder) {
-      inputField.config.main.placeholder = config.placeholder;
-    }
-    if (config.layout) {
-      inputField.config.layout = createLayoutFormat(config.layout)
-    }
-    inputField.config.main.errorMessage = `${config.name} is empty or invalid`;
-    inputField.scope = componentScope;
-    return inputField;
+export const buildTextField = (config: any, componentScope: string) => {
+  const inputField: any = _.cloneDeep(TextInputField);
+  inputField.config.main.label = config.label;
+  if (config.style) {
+    inputField.config.style = JSON.parse(config.style)
+  }
+  if (config.multiline) {
+    inputField.config.main.multiline = config.multiline === "YES" ? true : false;
+  }
+  if (config.InputFormatingAndMasking) {
+    inputField.config.main.formatStrArray = config.InputFormatingAndMasking.map(e => e.formatElement);
+  }
+  if (config.placeholder) {
+    inputField.config.main.placeholder = config.placeholder;
+  }
+  if (config.layout) {
+    inputField.config.layout = createLayoutFormat(config.layout)
+  }
+  inputField.config.main.errorMessage = `${config.name} is empty or invalid`;
+  inputField.scope = componentScope;
+  return inputField;
 }

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

@@ -1,6 +1,4 @@
 import _ from "lodash";
-import emptyBox from "./uischema/emptyBox";
-import cardSlider from "./uischema/cardSlider";
 import { buildLeaderBoard } from "./buildLeaderboard";
 import { buildProgressBarCard } from "./buildProgressBarCard";
 import { buildProgressBar } from "./buildProgressBar";
@@ -14,7 +12,7 @@ import { buildWrapperSection } from "./buildWrapperSection";
 import { buildTextField } from "./buildText";
 import { buildSelect } from "./buildSelect";
 import { buildButton } from "./buildButton";
-import {  buildTable } from "./buildTable";
+import { buildTable } from "./buildTable";
 import { buildLabel } from "./buildLabel";
 import { buildUploadFile } from "./buildUplaodFile";
 import { buildDownloadFile } from "./buildDownloadFile";
@@ -40,6 +38,7 @@ import { buildDataGrid } from "./buildDataGrid";
 import { buildInputSlider } from "./buildInputSlider";
 import { buildTreeMap } from "./buildTreeMap";
 import { buildThoughtOfTheDay } from "./buildThoughtOfTheDay";
+import { buildPhoneInputField } from "./buildPhoneInput";
 export let schema = {
   type: "object",
   properties: {},
@@ -307,6 +306,9 @@ const buildUiSchema = (config: any, store?: any) => {
     case "Thought":
       elements = buildThoughtOfTheDay(config, componentScope);
       break;
+    case "PhoneInput":
+      elements = buildPhoneInputField(config, componentScope);
+      break;
     default:
       schema = {
         type: "object",
@@ -336,53 +338,64 @@ const buildUiSchema = (config: any, store?: any) => {
           elements: cellElem.type == "ColumnGroup" ? cellElem.elements.map((childCellElem) => buildUiSchema(childCellElem, store)) : []
         }
       })
-    }
-    else if (config.type == "Table") {
+    } else if (config.type == "Table") {
       const sizeMap = {}
-      const filterMap = {}
+
       if (config.sizeHolder) {
         config.sizeHolder.map((e, i) => {
           sizeMap[e.keyName] = e.value
         });
       }
-      if(config.enableColumnFilter){
-        config.enableColumnFilter.map((e)=>{
-          filterMap[e.keyName] = true
-        })
-      }
-      elements.elements = config.elements.map((cellElem, elemInd) => {
+      const tableHeaderElements = [];
+      const tableActionElement = [];
+      const rowElements = []
+      config.elements.filter((cellElem, elemInd) => {
+        const commonProperties = {
+          accessorKey: cellElem.name,
+          type: cellElem.columnFormat,
+          header: cellElem.label || cellElem.name,
+          size: sizeMap[cellElem.name] || 180,
+          enableColumnFilter: cellElem.enableFilter === "No" ? false : true,
+          columnFilterModeOptions: cellElem.filteringOptions,
+          enableSorting: cellElem.enableSorting === "No" ? false : true,
+          columnKey: cellElem.columnKey
+        }
         if (cellElem.type) {
-          return {
-            accessorKey: cellElem.name,
-            header: cellElem.label || cellElem.name,
-            size: sizeMap[cellElem.name] || 180,
-            type: cellElem.columnFormat,
+          if (cellElem.elementType == "action") {
+            const actionElem = buildUiSchema(cellElem, store);
+            tableActionElement.push(actionElem);
+            return false;
+          }
+          if (cellElem.elementType == "tableHeader") {
+            const headerElem = buildUiSchema(cellElem, store);
+            tableHeaderElements.push({widget:headerElem});
+            return false;
+          }
+          const tableElem = {
             widget: cellElem.type != "ColumnGroup" ? buildUiSchema(cellElem, store) : undefined,
             elements: cellElem.type == "ColumnGroup" ? cellElem.elements.map((childCellElem) => buildUiSchema(childCellElem, store)) : [],
-            enableColumnFilter: Object.keys(filterMap).length === 0 ? true : filterMap[cellElem.name] ?? false,
-            columnFilterModeOptions: config.filteringOptions
+            ...commonProperties
+
           }
+          rowElements.push(tableElem)
         } else {
-          return {
-            accessorKey: cellElem.name,
-            type: cellElem.columnFormat,
-            header: cellElem.label || cellElem.name,
-            size: sizeMap[cellElem.name] || 180,
-            enableColumnFilter: Object.keys(filterMap).length === 0 ? true : filterMap[cellElem.name] ?? false,
-            columnFilterModeOptions: config.filteringOptions
-          }
+          rowElements.push({ ...commonProperties })
         }
 
       })
+      elements.elements = rowElements;
+      elements.config.action = tableActionElement;
+      elements.config.main.headerIcons.elements = tableHeaderElements;
     }
+
     else if (config.type == "Array") {
       elements.options.detail.elements = config.elements.map((e: any, elemInd: number) => {
-        return buildUiSchema(e,store)
+        return buildUiSchema(e, store)
       });
     }
     else {
       elements.elements = config.elements.map((e: any, elemInd: number) => {
-        return buildUiSchema(e,store)
+        return buildUiSchema(e, store)
       });
     }
   }