impaktapps-ui-builder 1.0.3 → 1.0.5

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

@@ -9,9 +9,6 @@ export declare const ValueTab: {
     elements: {
         type: string;
         scope: string;
-        options: {
-            widget: string;
-        };
         config: {
             layout: number;
             main: {

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

@@ -1,10 +1,13 @@
 declare const _default: {
     type: string;
     config: {
+        layout: number;
         main: {
-            rowSpacing: number;
             divider: boolean;
             label: string;
+            rowSpacing: number;
+            columnSpacing: number;
+            spacing: number;
         };
         defaultStyle: boolean;
     };

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

@@ -1,10 +1,11 @@
 declare const clearFromSessionStorage: () => void;
 export default clearFromSessionStorage;
+export declare const validateAndShowErrors: (store: any) => boolean;
 export declare const getNavigationHistory: (config: any, path: string | undefined) => {
     pageName: string;
 };
 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): Promise<void>;
-export declare const navigateHandler: (store: any, isSubmitted: any, pageName?: string | boolean) => void;
+export declare const navigateHandler: (store: any, isSubmitted: any, pageName?: string | boolean, errorMessage?: string) => void;
 export declare function okHandler(store: any): void;

package/dist/src/impaktapps-ui-builder/lib/index.d.ts

@@ -7,3 +7,4 @@ export { default as buildConfig } from "../builder/build/buildConfig";
 export { default as buildUiSchema } from "../builder/build/buildUiSchema";
 export { buildSchema } from "../builder/build/buildUiSchema";
 export { default as clearFromSessionStorage } from "../builder/services/utils";
+export { downloadFile, downloadFileFromUrl } from "../runtime/services/downloadFile";

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

@@ -1,2 +1,5 @@
-export declare const downloadFile: (obj: any) => void;
-export declare const doDownload: (response: any, service: any) => void;
+export declare function downloadFile({ data, name }: {
+    data: string;
+    name: string;
+}): void;
+export declare const downloadFileFromUrl: (response: any, service: any) => void;

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

@@ -1,3 +1,4 @@
+import { downloadFile } from "./downloadFile";
 interface funcParamsProps {
     store: any;
     dynamicData: any;
@@ -5,12 +6,17 @@ interface funcParamsProps {
     userValue: any;
     pageDataProvider: any;
     functionsProvider?: Record<string, any>;
+    initFormData?: any;
 }
 export declare const extractEvents: (eventConfig: any) => any;
 declare const _default: (funcParams: funcParamsProps) => {
     setPage: () => Promise<void>;
+    getStyle: () => {};
     onCellRenderer: (cellParams: any) => {};
     onClick: () => void;
+    onKeyDown: () => void;
+    onFileDelete: () => Promise<void>;
+    onClose: () => void;
     onMount: () => void;
     onFileDownload: () => void;
     onFileUpload: () => void;
@@ -18,13 +24,13 @@ declare const _default: (funcParams: funcParamsProps) => {
     onRowMovement: (paginationValues: any) => Promise<any>;
     onPaginationChange: (paginationValues: any) => Promise<any>;
     getSelectOptions: (param: any) => Promise<any>;
-    onChange: () => Promise<void>;
+    onChange: () => void;
     callExecuteEvents: (paramValue: any, apiBody: any, eventType: string) => Promise<any>;
     onBack: (functionParameters: any) => Promise<void>;
     onNext: (functionParameters: any) => Promise<void>;
     onReset: (functionParameters: any) => Promise<void>;
-    callHandler: (eventType: string, functionParameters?: any) => Promise<void>;
-    downloadFile: (obj: any) => void;
-    download: (response: any, service: any) => void;
+    callHandler: (eventType: string, functionParameters?: any) => void;
+    downloadFile: typeof downloadFile;
+    downloadFileFromUrl: (response: any, service: any) => void;
 };
 export default _default;

package/package.json

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

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

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

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

@@ -0,0 +1,66 @@
+import { createLayoutFormat, createKeyValueMap } from "./buildConfig";
+import { AreaBarGraph } from "./uischema/graph";
+import _ from "lodash";
+
+
+const buildAreaGraph = (config:any,componentScope:string) => {
+    const AreaGraph: any = _.cloneDeep(AreaBarGraph);
+    AreaGraph.scope = componentScope;
+    if (config.layout) {
+      AreaGraph.config.layout = createLayoutFormat(config.layout, config.type);
+    }
+    AreaGraph.config.main.type = config.graphType;
+    AreaGraph.scope = componentScope;
+    AreaGraph.config.main.header = config.heading;
+    AreaGraph.config.main.subHeader = config.subHeader;
+    if (config.legendHide) {
+      AreaGraph.config.main.legendAvailable = config.legendHide==="YES"?false:true;
+    }
+    if (config.bottomAxisAngle) {
+      AreaGraph.config.main.bottomAxisAngle = config.bottomAxisAngle==="YES"?true:false;
+    }
+    if (config.legendLabels) {
+      AreaGraph.config.main.legendLabels = createKeyValueMap(config.legendLabels);
+    }
+    if(config.legendDirection){
+      AreaGraph.config.main.legendDirection = config.legendDirection === "Row" ? "row" : "column";
+    }
+    if (config.height) {
+      AreaGraph.config.style.containerStyle.height = config.height;
+    }
+    if (config.pieArcColors) {
+      AreaGraph.config.style.colorMap = createKeyValueMap(config.pieArcColors);
+    }
+    if(config.xAxisFormatType){
+      AreaGraph.config.main.xAxisFormatType = config.xAxisFormatType
+    }
+    if(config.yAxisTickCount){
+      AreaGraph.config.main.yAxisTickCount = config.yAxisTickCount
+    }
+    if(config.xAxisTickCount){
+      AreaGraph.config.main.xAxisTickCount = config.xAxisTickCount
+    }
+    if (config.xAxisValue) {
+      AreaGraph.config.main.xAxisValue = config.xAxisValue;
+    }
+    if(config.xAxisType) {
+      AreaGraph.config.main.xAxisType = config.xAxisType;
+    }
+    if (config.bottomLabel) {
+      AreaGraph.config.main.bottomLabel = config.bottomLabel;
+    }
+    if (config.leftLabel) {
+      AreaGraph.config.main.leftLabel = config.leftLabel;
+    }
+    if (config.disableLeftLabel) {
+      AreaGraph.config.main.disableLeftLabel = config.disableLeftLabel==="YES"? true: false;
+    }
+    if (config.leftMargin) {
+      AreaGraph.config.style.labelStyle.margin ={
+        left: config.leftMargin
+      }
+    }
+    return AreaGraph
+}
+
+export default buildAreaGraph;

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

@@ -1,18 +1,38 @@
 import _ from "lodash";
 
-const ArrayUiSchema = {
-            type: "Control",
-            scope: "#/properties/adjustments",
-            layout: 11.5,
-            options: {
-                detail: {
-                    type: "HorizontalLayout",
-                    elements: []
-                }
-            }
-        }
-export const buildArray = (config:any,componentScope:string)=>{
- const array = _.cloneDeep(ArrayUiSchema);
- array.scope = componentScope;
-return array;
+const ArrayUiSchema: any = {
+    type: "Control",
+    scope: "#/properties/adjustments",
+    layout: 12,
+    elements: [],
+    config: {
+        main: {}
+    }
+
+}
+export const buildArray = (config: any, componentScope: string) => {
+    const array = _.cloneDeep(ArrayUiSchema);
+    if (config.allExpanded) {
+        array.config.main.allExpanded = config.allExpanded === "YES" ? true : false
+    }
+    if (config.disableAddButton) {
+        array.config.main.disableAddButton = config.disableAddButton === "YES" ? true : false
+    }
+    if (config.disableExpandAllButton) {
+        array.config.main.disableExpandAllButton = config.disableExpandAllButton === "YES" ? true : false
+    }
+    if (config.disableRowActions) {
+        array.config.main.disableRowActions = config.disableRowActions === "YES" ? true : false
+    }
+    if (config.style) {
+        array.config.style = JSON.parse(config.style)
+    }
+    array.config.main.rowSpacing = Number(config.rowSpacing);
+    array.config.main.columnSpacing = Number(config.columnSpacing);
+    array.config.main.spacing = Number(config.spacing);
+    array.config.main.childElementLabel = config.childElementLabel;
+    array.config.main.showKeyAsLabel = config.showKeyAsLabel;
+    array.config.main.label = config.label;
+    array.scope = componentScope;
+    return array;
 }

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

@@ -12,7 +12,7 @@ export const buildButton = (config:any,componentScope:string) =>{
 
     }
     if(config.layout){
-      button.config.layout = createLayoutFormat(config.layout)
+      button.config.layout = createLayoutFormat(config.layout, config.type)
     }
     if(config.tooltipMessage){
         button.config.main.tooltipMessage = config.tooltipMessage

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

@@ -0,0 +1,50 @@
+import _ from "lodash";
+import { createLayoutFormat } from "./buildConfig";
+
+const cameraUiSchema = {
+    type: "Control",
+    scope: "#/properties/camera",
+
+    options: {
+        widget: "Camera",
+    },
+    config: {
+        main: {
+            label: "Upload Photo",
+            multiUplaod: false,
+        onUpload: "onFileUpload",
+        }
+    }
+};
+export const buildCamera = (config: any, componentScope: string) => {
+    const camera: any = _.cloneDeep(cameraUiSchema);
+    camera.scope = componentScope;
+    if (config.iconName) {
+        camera.config.main.startIcon = config.iconName;
+    }
+    if (config.layout) {
+        camera.config.layout = createLayoutFormat(config.layout, config.type);
+    }
+    if (config.tooltipMessage) {
+        camera.config.main.tooltipMessage = config.tooltipMessage;
+    }
+
+    camera.config.main.multiUplaod = config.multiUplaod === "YES" ? true : false;
+
+    if (config.style) {
+        camera.config.style = JSON.parse(config.style);
+    }
+    if (config.size) {
+        camera.config.main.size = config.size;
+    }
+    if (config.variant) {
+        camera.config.main.variant = config.variant;
+    }
+    if (config.color) {
+        camera.config.main.color = config.color
+    }
+    if (config.label) {
+        camera.config.main.label = config.label;
+    }
+    return camera;
+}

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

@@ -1,15 +1,17 @@
 import Card from "./uischema/card";
 import _ from "lodash";
 import { createLayoutFormat } from "./buildConfig";
-
+ 
 export const buildCard = (config,componentScope,store) =>{
     const card: any = _.cloneDeep(Card(store.theme.myTheme));
     if (config.style) {
       card.config.wrapperStyle = JSON.parse(config.style)
-    }
-    card.elements[0].elements[0].elements[0].elements[1].scope = `#/properties/${config.name}/properties/value`
-    card.elements[1].scope = `#/properties/${config.name}/properties/url`
-    card.elements[0].elements[0].elements[1].scope = `#/properties/${config.name}/properties/description`
+    } 
+    card.elements[0].scope = `#/properties/${config.name}/properties/url`;
+    card.elements[1].scope = `#/properties/${config.name}/properties/label`;
+    card.elements[2].scope = `#/properties/${config.name}/properties/value`;
+   
+    card.elements[3].scope = `#/properties/${config.name}/properties/description`;
     if(config.layout){
       card.config.layout = createLayoutFormat(config.layout)
     }
@@ -18,16 +20,14 @@ export const buildCard = (config,componentScope,store) =>{
       card.elements[0].elements[0].elements[0].elements[1].config.style.left = "24px"
     }
     if(config.label){
-      card.elements[0].elements[0].elements[0].elements[1].config.main.heading = config.label;
+      card.elements[1].config.main.heading = config.label;
     }
     if(config.url){
-      card.elements[1].config.main.url = config.url;
+      card.elements[0].config.main.url = config.url;
     }
     if(config.description){
-      card.elements[0].elements[0].elements[1].config.main.heading = config.description;
+      card.elements[3].config.main.heading = config.description;
     }
    
-  
-    
     return card;
 }

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

@@ -4,11 +4,11 @@ import { createLayoutFormat } from "./buildConfig";
 const Checkbox =  {
     "type": "Control",
     "scope": "#/properties/username1",
-    "layout": 12,
     "options": {
       "widget": "CheckBox"
     },
     "config": {
+    "layout": { xs: 6, sm: 6, md: 4, lg: 3 },
       "main": {
         "label": "Welcome to Hyperform",
       }

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

@@ -22,31 +22,41 @@ export default (FormData: any) => {
   if (formData.events) {
     delete formData.events
   }
+  if (formData.tabLabelElements) {
+    component.tabLabelElements = formData.tabLabelElements || [];
+    delete formData.tabLabelElements
+  }
   component = { ...formData, ...component };
   return component;
 };
 
-export const createLayoutFormat = (config: any[]) => {
-  if (_.isEmpty(config)) {
-    return {
-      xs: 12,
-      sm: 12,
-      md: 12,
-      lg: 12,
+export const createLayoutFormat = (layout: any[], type?: string) => {
+  if (_.isEmpty(layout)) {
+    const fullLayoutComponents: string[] = ["WrapperSection", "DataGrid", "LeaderBoard", "PopUp", "TextArea", "TreeMap", "Thought", "HorizontalLayout", "Table"]
+    if (fullLayoutComponents.includes(type)) {
+      return { xs: 12, sm: 12, md: 12, lg: 12 }
+    }
+    else if (type === "Graph") {
+      return { xs: 12, sm: 12, md: 12, lg: 6 }
+    }
+    else if (type === "Button") {
+      return { xs: 4, sm: 2.5, md: 2, lg: 1.5 }
+    }
+    else {
+      return { xs: 6, sm: 6, md: 4, lg: 3 }
     }
   }
-  let data: any = {
-    xs: 12,
-    sm: 12,
-    md: 6,
-    lg: 6,
-  };
-  config.map((e: any) => {
-    data[e.key || "xs"] = +e.value || 5.5
+  let data: any = {};
+
+  layout.map((e: any) => {
+    data[e.key || "xs"] =
+      e.value === null || e.value === undefined || e.value === ""
+        ? 5.5
+        : +e.value;
   })
   return data;
 };
-export const flatObjectValueInArray = (config: any[]=[]) => {
+export const flatObjectValueInArray = (config: any[] = []) => {
   if (config.length < 1) {
     return
   }
@@ -56,3 +66,11 @@ export const flatObjectValueInArray = (config: any[]=[]) => {
   })
   return data;
 }
+
+export const createKeyValueMap = (config: any[] = []) => {
+  return config.reduce((acc, item) => {
+    if (!item.key) return acc
+    acc[item.key] = item.value
+    return acc
+  }, {})
+}

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

@@ -39,10 +39,10 @@ export const buildDataGrid = (config, componentScope) => {
         DataGrid.config.main.label = config.label;
     }
     if (config.layout) {
-        DataGrid.config.layout = createLayoutFormat(config.layout)
+        DataGrid.config.layout = createLayoutFormat(config.layout, config.type)
     }
     if (config.cardLayout) {
-        DataGrid.config.cardLayout = createLayoutFormat(config.cardLayout)
+        DataGrid.config.cardLayout = createLayoutFormat(config.cardLayout, config.type)
     }
     if (config.style) {
         DataGrid.config.style = JSON.parse(config.style)

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

@@ -2,23 +2,45 @@ import DateInputField, { DateTime } from "./uischema/dateInputField";
 import _ from "lodash";
 import { createLayoutFormat } from "./buildConfig";
 
-export const buildDate = (config:any,componentScope:string)=> {
-    const dateInputField: any = _.cloneDeep(DateInputField);
-    dateInputField.config.main.label = config.label;
-    dateInputField.config.main.errorMessage = `${config.name} is empty or invalid`;
-    dateInputField.scope = componentScope;
-    if(config.layout){
-        dateInputField.config.layout = createLayoutFormat(config.layout)
-      }
-    return dateInputField;
+export const buildDate = (config: any, componentScope: string) => {
+  const dateInputField: any = _.cloneDeep(DateInputField);
+  dateInputField.config.main.label = config.label;
+  dateInputField.scope = componentScope;
+  if (config.layout) {
+    dateInputField.config.layout = createLayoutFormat(config.layout)
+  }
+  if (config.variant) {
+    dateInputField.config.main.variant = config.variant;
+  }
+  if (config.toolTip) {
+    dateInputField.config.main.toolTip = config.toolTip;
+  }
+  if (config.toolTipPosition) {
+    dateInputField.config.main.toolTipPosition = config.toolTipPosition;
+  }
+  if (config.style) {
+    dateInputField.config.style = JSON.parse(config.style)
+  }
+  return dateInputField;
 }
-export const buildDateTime = (config:any,componentScope:string)=>{
+export const buildDateTime = (config: any, componentScope: string) => {
   const dateTimeInputField: any = _.cloneDeep(DateTime);
   dateTimeInputField.config.main.label = config.label;
-  dateTimeInputField.config.main.errorMessage = `${config.name} is empty or invalid`;
   dateTimeInputField.scope = componentScope;
-  if(config.layout){
+  if (config.layout) {
     dateTimeInputField.config.layout = createLayoutFormat(config.layout)
-    }
+  }
+  if (config.variant) {
+    dateTimeInputField.config.main.variant = config.variant;
+  }
+  if (config.toolTip) {
+    dateTimeInputField.config.main.toolTip = config.toolTip;
+  }
+  if (config.toolTipPosition) {
+    dateTimeInputField.config.main.toolTipPosition = config.toolTipPosition;
+  }
+  if (config.style) {
+    dateTimeInputField.config.style = JSON.parse(config.style)
+  }
   return dateTimeInputField;
 }

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

@@ -5,6 +5,7 @@ import { createLayoutFormat } from "./buildConfig";
 export const buildDownloadFile = (config,componentScope) => {
     const DownloadFile: any = _.cloneDeep(downloadFile);
     DownloadFile.scope = componentScope;
+    DownloadFile.config.main.label = config.label;
     if (config.layout) {
       DownloadFile.config.layout = config.layout;
     }
@@ -20,5 +21,11 @@ export const buildDownloadFile = (config,componentScope) => {
     if (config.errorMessage) {
       DownloadFile.config.main.errorMessage = config.errorMessage;
     }
+    if (config.toolTip) {
+      DownloadFile.config.main.toolTip = config.toolTip;
+    }
+    if (config.toolTipPosition) {
+      DownloadFile.config.main.toolTipPosition = config.toolTipPosition;
+    }
     return DownloadFile;
 }

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

@@ -4,6 +4,7 @@ import emptyBox from "./uischema/emptyBox";
 
 export const buildEmptyBox = (config,componentScope) =>{
     const EmptyBox: any = _.cloneDeep(emptyBox);
+      EmptyBox.scope = componentScope;
       if (config.layout) {
         EmptyBox.config.layout = createLayoutFormat(config.layout);
       }

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

@@ -2,34 +2,48 @@ import _ from "lodash";
 import { createLayoutFormat } from "./buildConfig";
 
 const FileInput = {
-    type: "Control",
-    scope: "#/properties/docAggrementCopy",
-    options: {
-      widget: "FileInputField",
+  type: "Control",
+  scope: "#/properties/docAggrementCopy",
+  options: {
+    widget: "FileInputField",
+  },
+  config: {
+    layout: { xs: 12, sm: 6, md: 4, lg: 3 },
+    main: {
+      required: false,
+      onUpload: "onFileUpload",
+      onDownload: "onFileDownload",
+      label: "Aggrement Copy",
+      "onClick": "onClick"
+      // iconStyleDefault:true,
     },
-    config: {
-      layout: { xs: 6, sm: 6, md: 4, lg: 4 },
-      main: {
-        required: false,
-        onUpload: "onFileUpload",
-        onDownload:"onFileDownload",
-        label:"Aggrement Copy"
-        // iconStyleDefault:true,
-      },
-      style: {
-        backgroundColor: "none",
-      },
+    style: {
+      backgroundColor: "none",
     },
-  };
-  export const buildFileInput = (config,componentScope) => {
-    const box: any = _.cloneDeep(FileInput);
-    box.scope = componentScope;
-    box.config.main.label = config.label
-    if(config.layout){
-      box.config.layout = createLayoutFormat(config.layout)
-    }
-    if (config.style) {
-      box.config.style = JSON.parse(config.style)
-    }
-    return box;
+  },
+};
+export const buildFileInput = (config, componentScope) => {
+  const box: any = _.cloneDeep(FileInput);
+  box.scope = componentScope;
+  box.config.main.label = config.label
+  if (config.layout) {
+    box.config.layout = createLayoutFormat(config.layout)
+  }
+  if (config.style) {
+    box.config.style = JSON.parse(config.style)
+  }
+  box.config.main.variant = config.variant
+  box.config.main.disableUpload = config.disableUpload === "YES" ? true : false;
+  box.config.main.disableDownload = config.disableDownload === "YES" ? true : false;
+  box.config.main.disableDelete = config.disableDelete === "YES" ? true : false;
+  box.config.main.useLabel = config.useLabel === "YES" ? true : false;
+  box.config.main.description = config.description;
+  box.config.main.toolTip = config.toolTip;
+  box.config.main.chooseButtonLabel = config.chooseButtonLabel;
+  box.config.main.noFileAvailableMessage = config.noFileAvailableMessage;
+  if (config.toolTipPosition) {
+    box.config.main.toolTipPosition = config.toolTipPosition;
+  }
+  box.config.main.externalUpload = config.externalUpload === "YES" ? true : false;
+  return box;
 }

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

@@ -0,0 +1,24 @@
+import ButtonGroup from "./uischema/buttonGroup";
+import _ from "lodash";
+import { createLayoutFormat } from "./buildConfig";
+
+export const buildButtonGroup = (config:any,componentScope:string) =>{
+    const buttonGroup:any = _.cloneDeep(ButtonGroup);
+    if(config.layout){
+      buttonGroup.config.layout = createLayoutFormat(config.layout, config.type)
+    }
+    buttonGroup.scope = componentScope;
+    if(config.multiSelect){
+      buttonGroup.config.main.multiSelect = config.multiSelect === "YES" ? true : false
+    }
+    if (config.style) {
+      buttonGroup.config.style = JSON.parse(config.style)
+    }
+    if (config.size) {
+      buttonGroup.config.main.size = config.size
+    }
+    if (config.color) {
+      buttonGroup.config.main.color = config.color
+    }
+    return buttonGroup;
+}