impaktapps-ui-builder 1.0.435 → 1.0.437

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

@@ -1,4 +1,4 @@
-export declare const TableSection: (theme: any) => {
+export declare const TableSection: (theme: any, scopeName?: string) => {
     type: string;
     elements: {
         type: string;

package/package.json

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

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

@@ -22,27 +22,31 @@ export default (FormData: any) => {
   if (formData.events) {
     delete formData.events
   }
+  if (formData.tabLabelsElements) {
+    component.tabLabelsElements = formData.tabLabelsElements || [];
+    delete formData.tabLabelsElements
+  }
   component = { ...formData, ...component };
   return component;
 };
 
 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)){
+    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 === "Graph") {
+      return { xs: 12, sm: 12, md: 12, lg: 6 }
     }
-    else if(type === "Button"){
+    else if (type === "Button") {
       return { xs: 4, sm: 2.5, md: 2, lg: 1.5 }
     }
-    else{
+    else {
       return { xs: 6, sm: 6, md: 4, lg: 3 }
     }
   }
-  let data: any = {  };
+  let data: any = {};
 
   layout.map((e: any) => {
     data[e.key || "xs"] =

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

@@ -11,15 +11,9 @@ export const buildTable = (config: any, componentScope: string) => {
   if (config.lazyLoading) {
     table.config.main.lazyLoading = config.lazyLoading === "YES" ? true : false;
   }
-  if (config.lazyLoadTree) {
-    table.config.main.lazyTree = config.lazyLoadTree === "YES" ? true : false;
-  }
   if (config.defaultColumnSize) {
     table.config.main.defaultColumnSize = config.defaultColumnSize
   }
-  if (config.subRowsExpansionPageSize) {
-    table.config.main.subRowsExpansionPageSize = config.subRowsExpansionPageSize
-  }
   if (config.enableRowMovement) {
     table.config.main.enableRowMovement = config.enableRowMovement === "YES" ? true : false;
   }
@@ -36,6 +30,9 @@ export const buildTable = (config: any, componentScope: string) => {
   if (config.paginateExpandedRows) {
     table.config.main.paginateExpandedRows = config.paginateExpandedRows === "YES" ? true : false;
   }
+  if (config.treeStructure) {
+    table.config.main.treeStructure = config.treeStructure === "YES" ? "flatTreeMap" : false;
+  }
   if (config.SelectionAvailable) {
     table.config.main.Selection = config.SelectionAvailable === "YES" ? true : false
   };

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

@@ -295,7 +295,6 @@ const buildUiSchema = (config: any, store?: any) => {
     case "PdfViewer":
       elements = buildPdfViewer(config, componentScope);
       break;
-    break;
     default:
       schema = {
         type: "object",
@@ -404,6 +403,11 @@ const buildUiSchema = (config: any, store?: any) => {
       });
     }
   }
+  if (config.tabLabelsElements) {
+    elements.tabLabelsElements = config.tabLabelsElements.map((e: any, elemInd: number) => {
+      return buildUiSchema(e, store)
+    });
+  }
   return elements;
 }
 

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

@@ -630,7 +630,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 },
@@ -648,12 +648,11 @@ export const buildPropertiesSection = function (type: String) {
         buildWrapper("Tree Table Properties", [
           getRadioInputField("enableRowMovement", "Row Rearrangement", ["YES", "NO"]),
           getRadioInputField("enableExpanding", "Row Expanding", ["YES", "NO"]),
-          getRadioInputField("lazyLoadTree", "Lazy Load Tree", ["YES", "NO"]),
           // getRadioInputField("enableExpandAll", "Use All Row Expanding", ["YES", "NO"]),
           getRadioInputField("paginateExpandedRows", "Multi Page Expansion", ["YES", "NO"]),
+          getRadioInputField("treeStructure", "Flat Tree Structure", ["YES", "NO"]),
           getRadioInputField("filterFromLeafRows", "Filter from tree rows", ["YES", "NO"]),
-          getInputField("defaultColumnSize", "Default Column Size"),
-          getInputField("subRowsExpansionPageSize", "Page Size for Subrows Expansion") , emptyBox("LazyLoadingTableEmpty3")
+          getInputField("defaultColumnSize", "Default Column Size"), , emptyBox("LazyLoadingTableEmpty3")
         ]),
         getArrayControl("Table_Download_Keys_Name", "KeyName", "Table Key Name"),
         sizeHolder,

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

@@ -1,10 +1,10 @@
-export const TableSection = (theme) => {
+export const TableSection = (theme,scopeName="elements") => {
   const uiSchema = {
     type: "HorizontalLayout",
     elements: [
       {
         type: "Control",
-        scope: "#/properties/elements",
+        scope: `#/properties/${scopeName}`,
         options: {
           widget: "Table",
         },
@@ -15,8 +15,7 @@ export const TableSection = (theme) => {
                 {
                   widget: {
                     type: "Control",
-                    scope: "#/properties/New_Record",
-
+                     scope: `#/properties/${scopeName}_New_Record`,
                     options: {
                       widget: "IconButton",
                     },
@@ -43,7 +42,7 @@ export const TableSection = (theme) => {
                 {
                   widget: {
                     type: "Control",
-                    scope: "#/properties/Paste_Component",
+                     scope: scopeName === "elements" ? `#/properties/Paste_Component` : `#/properties/Paste_TabsComponent`,
                     options: {
                       widget: "IconButton",
                     },
@@ -109,7 +108,7 @@ export const TableSection = (theme) => {
             },
             {
               type: "Control",
-              scope: "#/properties/Copy_Component",
+              scope: scopeName === "elements" ? `#/properties/Copy_Component` : `#/properties/Copy_TabsComponent`,
               options: {
                 widget: "Button",
               },

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

@@ -16,7 +16,7 @@ const sectionLabels = {
   LeaderBoard: ["Core", "Components", "Properties", "Events", "Style",],
   WrapperSection: ["Core", "Components", "Properties", "Style",],
   HorizontalLayout: ["Core", "Components", "Properties", "Style",],
-  TabSection: ["Core", "Components", "Properties", "Style", "Validation"],
+  TabSection: ["Core", "Components", "TabLebelComponet", "Properties", "Style", "Validation"],
   SpeedoMeter: ["Core", "Properties", "Events", "Style",],
   card: ["Core", "Properties", "Events", "Style", "Validation"],
   UploadFile: ["Core", "Events", "Style", "Validation"],
@@ -39,7 +39,7 @@ const sectionLabels = {
   TextArea: ["Core", "Properties", "Events", "Style", "Validation"],
   PopUp: ["Core", "Components", "Properties", "Events", "Style"],
   PopOver: ["Core", "Components", "Properties", "Style"],
-  PdfViewer: ["Core","Properties", "Style"],
+  PdfViewer: ["Core", "Properties", "Style"],
   Stepper: ["Core", "Components", "Properties", "Events", "Style"],
   DataGrid: ["Core", "Components", "Properties", "Events", "Style"],
   InputSlider: ["Core", "Properties", "Events", "Style", "Validation"],
@@ -63,6 +63,7 @@ export function refreshPage(type: string, store: any) {
       Style: StyleSection,
       Events: EventSection(store.theme.myTheme),
       Components: TableSection(store.theme.myTheme),
+      TabLebelComponet: TableSection(store.theme.myTheme, "tabLabelsElements"),
       Properties: buildPropertiesSection(type),
       Validation: ValidationSection
     }
@@ -74,7 +75,7 @@ export function refreshPage(type: string, store: any) {
   // Get Widget Type of parent
   const path = store.searchParams?.get("path");
   const lastDotIndex = path.lastIndexOf('.')
-  const parentPath = path.slice(0,lastDotIndex)
+  const parentPath = path.slice(0, lastDotIndex)
 
   const parentObj = _.get(currentConfig, parentPath)
 
@@ -234,7 +235,7 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       if (sessionStorage.getItem("copiedConfig")) {
         schema.properties.RemoveItemButton.disabled = false;
       }
-      
+
       const config = JSON.parse(sessionStorage.getItem("pageFormdata"));
       const path = store.searchParams?.get("path");
       const id = store.searchParams?.get("id")
@@ -283,8 +284,12 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       const id = store.searchParams?.get("id");
       saveFormdataInSessionStorage(store.ctx.core.data, path)
       if (path) {
-        const path = store.searchParams?.get("path");
-        const finalPath = `${path}.elements[${rowId}]`
+        let finalPath = `${path}`;
+        if (dynamicData?.path?.startsWith("tabLabels")) {
+          finalPath = `${finalPath}.tabLabelsElements[${rowId}]`
+        } else {
+          finalPath = `${finalPath}.elements[${rowId}]`
+        }
         store.searchParams.set("path", finalPath)
         store.setSearchParams(store.searchParams)
         this.setPage()
@@ -295,7 +300,12 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
     deleteComponents: function (shouldUpdateDialog: boolean = true) {
       const path = store.searchParams?.get("path");
       const rowId = sessionStorage.getItem('rowId');
-      store.formData.elements.splice(rowId, 1);
+      const isTabLabelElements = sessionStorage.getItem('isTabLabelElements') === "true";
+      if (isTabLabelElements) {
+        store.formData.tabLabelsElements.splice(rowId, 1);
+      } else {
+        store.formData.elements.splice(rowId, 1);
+      }
       const response = saveFormdataInSessionStorage(store.ctx.core.data, path)
       const data = path ? _.get(response, path) : response;
       store.setFormdata(data);
@@ -303,6 +313,7 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
         store.updateDialog("popUpComponentSection");
       }
       sessionStorage.removeItem('rowId');
+      sessionStorage.removeItem('isTabLabelElements');
     },
     deleteEvent: function (shouldUpdateDialog: boolean = true) {
       const path = store.searchParams?.get("path");
@@ -321,9 +332,17 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       if (!Array.isArray(store.formData.elements)) {
         store.formData.elements = []
       }
+      if (!Array.isArray(store.formData.tabLabelsElements)) {
+        store.formData.tabLabelsElements = []
+      }
       const path = store.searchParams?.get("path");
       saveFormdataInSessionStorage(store.ctx.core.data, path)
-      const finalPath = `${path}.elements[${store.formData.elements.length}]`
+      let finalPath = `${path}`;
+      if (dynamicData.path.startsWith("tabLabels")) {
+        finalPath = `${finalPath}.tabLabelsElements[${store.formData.tabLabelsElements.length}]`
+      } else {
+        finalPath = `${finalPath}.elements[${store.formData.elements.length}]`
+      }
       store.searchParams.set("path", finalPath)
       store.setSearchParams(store.searchParams)
       this.setPage()
@@ -355,6 +374,7 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
     deletePopUpComponent: function () {
       const rowId = dynamicData.path.split(".")[1];
       sessionStorage.setItem('rowId', rowId);
+      sessionStorage.setItem('isTabLabelElements', dynamicData.path.startsWith("tabLabels") ? "true" : "false");
       store.updateDialog("popUpComponentSection");
     },
     deletePopUpEvent: function () {
@@ -401,9 +421,17 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       if (!Array.isArray(store.formData.events)) {
         store.formData.events = []
       }
+      if (!Array.isArray(store.formData.tabLabelsElements)) {
+        store.formData.tabLabelsElements = []
+      }
       saveFormdataInSessionStorage(store.ctx.core.data, pastedElementParentPath);
       const formData = getFormdataFromSessionStorage(pastedElementParentPath);
-      const insertElementIndex = elementType === "Component" ? formData.elements.length : formData.events.length;
+      const currentLength = {
+        "TabsComponent": formData.tabLabelsElements.length,
+        "Component": formData.elements.length,
+        "Events": formData.events.length
+      };
+      const insertElementIndex = currentLength[elementType] || 0;
       const pastedElementPath = this.elementPathHandler(pastedElementParentPath, insertElementIndex, elementType);
 
       const copiedConfig = JSON.parse(sessionStorage.getItem("copiedConfig"));
@@ -440,6 +468,9 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
     elementPathHandler: function (parentPath: string, rowId: any, elementType: string) {
       if (elementType === "Component") {
         return parentPath ? `${parentPath}.elements[${rowId}]` : `elements[${rowId}]`;
+      }
+        if(elementType === "TabsComponent"){
+        return `${parentPath}.tabLabelsElements[${rowId}]` 
       }
       return parentPath ? `${parentPath}.events[${rowId}]` : `events[${rowId}]`;
     },

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

@@ -190,10 +190,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: "parentId", value: paginationValues.parentId },
-        { key: "prevRowCount", value: paginationValues.prevRowCount },
-        { key: "newDataCount", value: paginationValues.newDataCount },
+        { key: "expandedRowIds", value: paginationValues.expandedRowIds ?? [] }
       ]
       const response = await this.callExecuteEvents(paginationValues, apiBody, "onLoad");
       return response?.data;