impaktapps-ui-builder 1.0.102 → 1.0.104

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

@@ -3,10 +3,6 @@ export declare let schema: {
     properties: {};
     required: any[];
 };
-export declare const buildSchema: (config: any, tableName?: string, isArrayType?: boolean) => {
-    type: string;
-    properties: {};
-    required: any[];
-};
+export declare function buildSchema(config: any): any;
 declare const buildUiSchema: (config: any, store?: any) => any;
 export default buildUiSchema;

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 { downloadFileFromBase64, downloadFileFromUrl } from "../runtime/services/downloadFile";

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

@@ -1,2 +1,6 @@
 export declare const downloadFile: (obj: any) => void;
-export declare const doDownload: (response: any, service: any) => void;
+export declare function downloadFileFromBase64({ 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 { downloadFileFromBase64 } from "./downloadFile";
 interface funcParamsProps {
     store: any;
     dynamicData: any;
@@ -28,6 +29,7 @@ declare const _default: (funcParams: funcParamsProps) => {
     onReset: (functionParameters: any) => Promise<void>;
     callHandler: (eventType: string, functionParameters?: any) => Promise<void>;
     downloadFile: (obj: any) => void;
-    download: (response: any, service: any) => void;
+    downloadFileFromUrl: (response: any, service: any) => void;
+    downloadFileFromBase64: typeof downloadFileFromBase64;
 };
 export default _default;

package/package.json

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

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

@@ -10,6 +10,9 @@ export const buildTable = (config: any, componentScope: string) => {
   if (config.lazyLoading) {
     table.config.main.lazyLoading = config.lazyLoading === "YES" ? true : false;
   }
+  if (config.defaultColumnSize) {
+    table.config.main.enableRowMovement = config.defaultColumnSize
+  }
   if (config.enableRowMovement) {
     table.config.main.enableRowMovement = config.enableRowMovement === "YES" ? true : false;
   }
@@ -41,28 +44,28 @@ export const buildTable = (config: any, componentScope: string) => {
   if (config.downloadAllData) {
     table.config.main.downloadAllData = config.downloadAllData === "YES" ? true : false
   }
-  if(config.disableGlobalSearch){
+  if (config.disableGlobalSearch) {
     table.config.main.disableGlobalSearch = config.disableGlobalSearch === "YES" ? true : false
   }
-  if(config.disableColumnFilter){
+  if (config.disableColumnFilter) {
     table.config.main.disableColumnFilter = config.disableColumnFilter === "YES" ? true : false
   }
-  if(config.disableSorting){
+  if (config.disableSorting) {
     table.config.main.disableSorting = config.disableSorting === "YES" ? true : false
   }
-  if(config.disableEditColumn){
+  if (config.disableEditColumn) {
     table.config.main.disableEditColumn = config.disableEditColumn === "YES" ? true : false
   }
-  if(config.disableFullScreenToggle){
+  if (config.disableFullScreenToggle) {
     table.config.main.disableFullScreenToggle = config.disableFullScreenToggle === "YES" ? true : false
   }
-  if(config.disableDensityToggle){
+  if (config.disableDensityToggle) {
     table.config.main.disableDensityToggle = config.disableDensityToggle === "YES" ? true : false
   }
-  if(config.disableDownloadFile){
+  if (config.disableDownloadFile) {
     table.config.main.disableDownloadFile = config.disableDownloadFile === "YES" ? true : false
   }
-  if(config.disablePagination){
+  if (config.disablePagination) {
     table.config.main.disablePagination = config.disablePagination === "YES" ? true : false
   }
   if (config.Table_Download_Keys_Name) {
@@ -71,7 +74,7 @@ export const buildTable = (config: any, componentScope: string) => {
   if (config.selectKey) {
     table.config.main.selectKey = config.selectKey
   }
-  if(config.maxPageSize){
+  if (config.maxPageSize) {
     table.config.main.maxPageSize = config.maxPageSize
   }
   return table;

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";
@@ -47,126 +45,117 @@ export let schema = {
   properties: {},
   required: []
 };
-//MultipleSelect
-function buildRule(configObj: any, tableName?: string, arrayHolderName?: boolean) {
-  if (arrayHolderName) {
-    if (schema.properties?.[tableName]?.items?.properties) {
-      if (!schema.properties?.[tableName]?.items?.properties?.[configObj.name]) {
-        schema.properties[tableName].items.properties[configObj.name] = {};
-        if (configObj.type === "Select" && configObj.value?.length > 0) {
-          schema.properties[tableName].items.properties[configObj.name] = {
-            oneOf: configObj.value.map((e) => {
-              return { const: e.value, title: e.label }
-            })
-          }
-        }
-        else if (configObj.type === "MultipleSelect" && configObj.value?.length > 0) {
-          schema.properties[tableName].items.properties[configObj.name] = {
-            items: {
-              oneOf: configObj.value.map((e) => {
-                return { const: e.value, title: e.label }
-              })
-            }
-          }
-        }
-      }
+function buildOneOf(values: any[]) {
+  return values.map((e) => ({
+    const: e.value,
+    title: e.label
+  }));
+}
+function applyValidations(
+  schemaNode: any,
+  validations: any[] = [],
+  requiredArr?: string[],
+  fieldName?: string
+) {
+  validations.forEach((rule) => {
+    if (rule.validationType === "readOnly") {
+      schemaNode.disabled = true
     }
-  } else if ((configObj.type === "Select" || configObj.type === "MultipleSelect") && configObj.value?.length > 0) {
-    if (configObj.type === "Select") {
-      schema.properties[configObj.name] = {
-        oneOf: configObj.value.map((e) => {
-          return { const: e.value, title: e.label }
-        })
+    if (rule.validationType === "required") {
+      if (requiredArr && fieldName) {
+        requiredArr.push(fieldName);
       }
+    } else {
+      schemaNode.type = "string";
+      schemaNode[rule.validationType] =
+        isNaN(rule.validationValue)
+          ? rule.validationValue
+          : Number(rule.validationValue);
     }
-    else if (configObj.type === "MultipleSelect") {
-      schema.properties[configObj.name] = {
-        items: {
-          oneOf: configObj.value.map((e) => {
-            return { const: e.value, title: e.label }
-          })
-        }
+  });
+}
+
+function buildNode(config: any): any {
+  if (config.type === "Array") {
+    const arraySchema: any = {
+      type: "array",
+      items: {
+        type: "object",
+        properties: {},
+        required: []
       }
-    }
-  }
-  if (configObj.validation) {
-    configObj.validation.forEach((rule: any) => {
-      if (tableName) {
-        if (schema.properties?.[tableName]?.items?.properties) {
-          if (!schema.properties?.[tableName]?.items?.properties?.[configObj.name]) {
-            schema.properties[tableName].items.properties[configObj.name] = {};
-            if (configObj.type === "Select" || configObj.value?.length > 0) {
-              schema.properties[tableName].items.properties[configObj.name] = {
-                oneOf: configObj.value.map((e) => {
-                  return { const: e.value, title: e.label }
-                })
-              }
-            }
-            else if (configObj.type === "MultipleSelect" || configObj.value?.length > 0) {
-              schema.properties[tableName].items.properties[configObj.name] = {
-                items: {
-                  oneOf: configObj.value.map((e) => {
-                    return { const: e.value, title: e.label }
-                  })
-                }
-              }
-            }
-          }
-          if (rule.validationType === "required") {
-            schema.properties?.[tableName]?.items?.required.push(configObj.name)
-          } else {
-            schema.properties[tableName].items.properties[configObj.name]["type"] = "string"
-            schema.properties[tableName].items.properties[configObj.name][rule.validationType] =
-              isNaN(rule.validationValue) ?
-                rule.validationValue : Number(rule.validationValue)
-          }
+    };
 
-        }
-      } else {
-        if (!schema.properties[configObj.name]) {
-          schema.properties[configObj.name] = {};
-        }
-        if (rule.validationType === "required") {
-          schema.required.push(configObj.name)
-        } else {
-          schema.properties[configObj.name]["type"] = "string"
-          schema.properties[configObj.name][rule.validationType] =
-            isNaN(rule.validationValue) ?
-              rule.validationValue : Number(rule.validationValue)
-        }
+    config.elements?.forEach((child: any) => {
+      const childNode = buildNode(child);
+      if (!childNode) return;
+
+      arraySchema.items.properties[child.name] = childNode.schema;
+
+      if (childNode.required?.length) {
+        arraySchema.items.required.push(child.name);
       }
     });
+
+    return { schema: arraySchema };
   }
 
+  let fieldSchema: any = {};
+  if (
+    (config.type === "Select" || config.type === "MultipleSelect") &&
+    config.value?.length > 0
+  ) {
+    if (config.type === "Select") {
+      fieldSchema.oneOf = buildOneOf(config.value);
+    } else {
+      fieldSchema.type = "array";
+      fieldSchema.items = {
+        oneOf: buildOneOf(config.value)
+      };
+    }
+  }
+
+  if (config.validation) {
+    applyValidations(fieldSchema, config.validation);
+  }
+
+  const required =
+    config.validation?.some(
+      (v: any) => v.validationType === "required"
+    )
+      ? [config.name]
+      : [];
 
+  return {
+    schema: fieldSchema,
+    required
+  };
 }
-export const buildSchema = (config: any, tableName?: string, isArrayType?: boolean) => {
-  buildRule(config, tableName, isArrayType);
-  if (config?.elements) {
-    if ( config.type == "Array") {
-      if (!schema.properties[config.name]) {
-        schema.properties[config.name] = {
-          type: "array",
-          items: {
-            type: "object",
-            properties: {},
-            required: []
-          }
-        }
-      }
-      config.elements.map((e, elemInd) => {
-        buildSchema(e, config.name, config.type === "Array" ? true : false)
-      })
-    }
-    else {
-      config.elements.map((e, elemInd) => {
-        buildSchema(e)
-      })
+
+export function buildSchema(config: any): any {
+  const schema: any = {
+    type: "object",
+    properties: {},
+    required: []
+  };
+
+  config.elements?.forEach((element: any) => {
+    const node = buildNode(element);
+    if (!node) return;
+
+    schema.properties[element.name] = node.schema;
+
+    if (node.required?.length) {
+      schema.required.push(element.name);
     }
+  });
+
+  if (schema.required.length === 0) {
+    delete schema.required;
   }
-  return schema;
-}
 
+  return schema;
+};
 
 const buildUiSchema = (config: any, store?: any) => {
   let elements: any = {};
@@ -387,7 +376,7 @@ const buildUiSchema = (config: any, store?: any) => {
           }
           if (cellElem.elementType == "tableHeader") {
             const headerElem = buildUiSchema(cellElem, store);
-            tableHeaderElements.push({widget:headerElem});
+            tableHeaderElements.push({ widget: headerElem });
             return false;
           }
           const tableElem = {

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

@@ -327,7 +327,7 @@ export const buildPropertiesSection = function (type: String) {
         emptyBox("PopUpEmpty", { xs: 6, sm: 6, md: 0, lg: 0 })
       ]
       break;
-    case "Text": 
+    case "Text":
       uiSchema.elements = [
         getInputField("placeholder", "Placeholder"),
         getRadioInputField("multiline", "Multiline", ["YES", "NO"]),
@@ -477,7 +477,7 @@ export const buildPropertiesSection = function (type: String) {
         getRadioInputField("disableDensityToggle", "Disable Density Toggle", ["YES", "NO"]),
         getRadioInputField("disableDownloadFile", "Disable Download File", ["YES", "NO"]),
         getRadioInputField("disablePagination", "Disable Pagination", ["YES", "NO"]),
-        getInputField("selectKey", "Selection Key"),
+        getInputField("selectKey", "Selection Key"),//defaultColumnSize
         getMultiSelectField("filteringOptions", "Filtering Options"),
         getSelectField("maxPageSize", "Max Page Size", [
           { label: "10", value: 10 },
@@ -494,7 +494,7 @@ export const buildPropertiesSection = function (type: String) {
           getRadioInputField("paginateExpandedRows", "Multi Page Expansion", ["YES", "NO"]),
           getRadioInputField("treeStructure", "Flat Tree Structure", ["YES", "NO"]),
           getRadioInputField("filterFromLeafRows", "Filter from tree rows", ["YES", "NO"]),
-          emptyBox("LazyLoadingTableEmpty2"), emptyBox("LazyLoadingTableEmpty3")
+          getInputField("defaultColumnSize", "Default Column Size"), , emptyBox("LazyLoadingTableEmpty3")
         ]),
         getArrayControl("Table_Download_Keys_Name", "KeyName", "Table Key Name"),
         sizeHolder,
@@ -532,7 +532,7 @@ export const buildPropertiesSection = function (type: String) {
         emptyBox("MultipleSelectEmpty2")
       ]
       break;
-    case "Date": 
+    case "Date":
       uiSchema.elements = [
         getSelectField("variant", "Variant", [
           { label: "Outlined", value: "outlined" },
@@ -542,7 +542,7 @@ export const buildPropertiesSection = function (type: String) {
         emptyBox("DateEmpty1", { xs: 6, sm: 6, md: 8, lg: 9 }),
       ]
       break;
-    case "DateTime": 
+    case "DateTime":
       uiSchema.elements = [
         getSelectField("variant", "Variant", [
           { label: "Outlined", value: "outlined" },
@@ -569,7 +569,7 @@ export const buildPropertiesSection = function (type: String) {
         getRadioInputField("variant", "Variant", ["Outlined", "Standard"]),
         getRadioInputField("disableUpload", "Disable Upload", ["YES", "NO"]),
         getRadioInputField("disableDelete", "Disable Delete", ["YES", "NO"]),
-        getRadioInputField("disableDownload", "Disable Download", ["YES", "NO"]) 
+        getRadioInputField("disableDownload", "Disable Download", ["YES", "NO"])
       ]
       break;
   }

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

@@ -58,15 +58,15 @@ export const ComponentSchema: any = {
         { title: "Date Column", const: "date" },
         { title: "DateTime Column", const: "dateTime" },
         { title: "Amount Column", const: "amount" },
-        { title: "Center Column", const: "action"}
+        { title: "Center Column", const: "action" }
       ]
     },
     variant: {
       oneOf: [
-          { title: "Outlined", const: "outlined" },
-          { title: "Filled", const: "filled" },
-          { title: "Standard", const: "standard" },
-        ]
+        { title: "Outlined", const: "outlined" },
+        { title: "Filled", const: "filled" },
+        { title: "Standard", const: "standard" },
+      ]
     },
     orientation: {
       oneOf: [
@@ -83,7 +83,7 @@ export const ComponentSchema: any = {
         { title: "Put", const: "put" },
       ]
     },
-    maxPageSize:{
+    maxPageSize: {
       type: "number",
       oneOf: [
         { title: "10", const: 10 },
@@ -297,6 +297,7 @@ export const ComponentSchema: any = {
               { const: "minLength", title: "Minimum Length" },
               { const: "maxLength", title: "Maximum Length" },
               { const: "pattern", title: "Pattern" },
+              { const: "readOnly", title: "Read Only" },
             ]
           },
           validationValue: {

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

@@ -1,3 +1,5 @@
+import { title } from "process";
+
 export const EventSchema = {
   type: "object",
   properties: {
@@ -72,7 +74,8 @@ export const EventSchema = {
       oneOf: [
         { title: "RankProvider", const: "RankProvider" },
         { title: "Download File", const: "downloadFile" },
-        { title: "Download", const: "download" },
+        { title: "downloadFileFromUrl", const: "downloadFileFromUrl" },
+        { title: "downloadFileFromBase64", const: "downloadFileFromBase64" }
       ]
     },
     body: {

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

@@ -30,7 +30,7 @@ const sectionLabels = {
   Timer: ["Core", "Events", "Style", "Validation"],
   Rank: ["Core", "Events", "Style", "Validation"],
   Button: ["Core", "Properties", "Events", "Style", "Validation"],
-  Array: ["Core", "Components",  "Properties","Validation"],
+  Array: ["Core", "Components",  "Properties","Events","Validation"],
   Radio: ["Core", "Properties", "Events", "Style", "Validation"],
   Text: ["Core", "Properties", "Events", "Style", "Validation"],
   TextArea: ["Core", "Properties", "Events", "Style", "Validation"],

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

@@ -1,10 +1,11 @@
 
-export {default as pageMaster} from "../builder/services/pageMaster"
-export {default as pageMasterEvents} from "../builder/services/event"
-export {default as pageMasterComponents} from "../builder/services/component"
-export {default as pageService} from "../runtime/services/service"
-export { schema} from "../builder/build/buildUiSchema"
-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 { default as pageMaster } from "../builder/services/pageMaster"
+export { default as pageMasterEvents } from "../builder/services/event"
+export { default as pageMasterComponents } from "../builder/services/component"
+export { default as pageService } from "../runtime/services/service"
+export { schema } from "../builder/build/buildUiSchema"
+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 { downloadFileFromBase64, downloadFileFromUrl } from "../runtime/services/downloadFile"

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

@@ -15,13 +15,43 @@ export const downloadFile = (obj: any) => {
     URL.revokeObjectURL(url);
     document.body.removeChild(link);
 };
+export function downloadFileFromBase64({ data, name }: { data: string; name: string }) {
+    const binary = window.atob(data);
+    const bytes = new Uint8Array(binary.length);
 
-export const doDownload = (response: any, service) => {
+    for (let i = 0; i < binary.length; i++) {
+        bytes[i] = binary.charCodeAt(i);
+    }
+
+    const extension = name.split(".").pop()?.toLowerCase();
+    const mimeMap: Record<string, string> = {
+        pdf: "application/pdf",
+        png: "image/png",
+        jpg: "image/jpeg",
+        jpeg: "image/jpeg",
+        xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+        csv: "text/csv",
+    };
+
+    const blob = new Blob([bytes], {
+        type: mimeMap[extension!] || "application/octet-stream",
+    });
+
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = name;
+    a.click();
+
+    URL.revokeObjectURL(url);
+}
+
+export const downloadFileFromUrl = (response: any, service) => {
     let url = `${service.defaults.baseURL}/${response.path}`;
     if (response?.params) {
         const keysArray = Object.keys(response?.params);
         keysArray.map((e, i) => {
-            url = url + `${i === 0?"?":"&"}${e}=${response?.params[e]}`
+            url = url + `${i === 0 ? "?" : "&"}${e}=${response?.params[e]}`
         })
     }
     const link = document.createElement('a');
@@ -30,3 +60,5 @@ export const doDownload = (response: any, service) => {
     link.click();
     link.parentNode.removeChild(link);
 };
+
+

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

@@ -1,5 +1,5 @@
 import _, { isEmpty } from "lodash";
-import { doDownload, downloadFile } from "./downloadFile";
+import { downloadFileFromUrl, downloadFile, downloadFileFromBase64 } from "./downloadFile";
 import { executeEvents, executeRefreshHandler } from "./events";
 import { handlersProps } from "./interface";
 let compType: string;
@@ -66,7 +66,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, ...funcParams.functionsProvider }, eventGroups,
+    serviceHolder: { downloadFile, download: downloadFileFromUrl, downloadFileFromBase64, ...funcParams.functionsProvider }, eventGroups,
     functionsProvider: funcParams.functionsProvider, formDataHolder
   };
   return {
@@ -106,24 +106,26 @@ export default (funcParams: funcParamsProps) => {
         store: funcParams.store, dynamicData: funcParams.dynamicData, userValue: funcParams.userValue, service: funcParams.service,
         serviceHolder: this, eventGroups, formDataHolder: {}
       })
-  
+
       uiSchema.elements.push(notifyUiSchema);
       funcParams.store.setUiSchema(uiSchema);
     },
     onCellRenderer: (cellParams) => {
-      if (eventGroups.onCellRenderer) {
+      const cloneEventGroup = _.cloneDeep(eventGroups)
+      if (cloneEventGroup.onCellRenderer) {
         let finalResponse = {};
         const path = funcParams.dynamicData?.tableButtonPath || funcParams?.dynamicData?.path?.split(".")[0];
-
-        for (const eventConfig of eventGroups?.onCellRenderer?.[path]) {
-          executeEventsParameters.store.functionParameters = cellParams
-          finalResponse = executeEvents({
-            ...executeEventsParameters,
-            config: eventConfig,
-            componentName: path
-          })
+        if (cloneEventGroup?.onCellRenderer?.[path]) {
+          for (const eventConfig of cloneEventGroup?.onCellRenderer?.[path]) {
+            executeEventsParameters.store.functionParameters = cellParams
+            finalResponse = executeEvents({
+              ...executeEventsParameters,
+              config: eventConfig,
+              componentName: path
+            })
+          }
+          return finalResponse
         }
-        return finalResponse
       }
       return {}
     },
@@ -165,7 +167,7 @@ export default (funcParams: funcParamsProps) => {
         { key: "sorting", value: paginationValues.sorting || [] },
         { key: "filters", value: paginationValues.tableColumnConfig || [] },
         { key: "globalFilter", value: paginationValues.globalFilter ?? '' },
-        { key: "expandedRowIds", value: paginationValues.expandedRowIds ?? []}
+        { key: "expandedRowIds", value: paginationValues.expandedRowIds ?? [] }
       ]
       const response = await this.callExecuteEvents(paginationValues, apiBody, "onLoad");
       return response?.data;
@@ -256,7 +258,8 @@ export default (funcParams: funcParamsProps) => {
       }
     },
     downloadFile: downloadFile,
-    download: doDownload,
+    downloadFileFromUrl: downloadFileFromUrl,
+    downloadFileFromBase64: downloadFileFromBase64,
     ...funcParams.functionsProvider
   };
 };