impaktapps-ui-builder 1.0.312 → 1.0.321

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

@@ -40,7 +40,7 @@ export const ComponentSchema: any = {
         { title: "Rank", const: "Rank" },
         { title: "Rank Card", const: "RankCard" },
         { title: "Metric Card", const: "MetricCard" },
-        { title: "Runner Boy", const: "RunnerBoyProgressBar" },
+        { title: "Bow and Arrow", const: "RunnerBoyProgressBar" },
         { title: "Table", const: "Table" },
         { title: "Tabs", const: "TabSection" },
         { title: "Text", const: "Text" },
@@ -49,6 +49,7 @@ export const ComponentSchema: any = {
         { title: "Upload", const: "UploadFile" },
         { title: "Tree ", const: "TreeMap" },
         { title: "Thought of the day", const: "Thought" },
+        { title: "PDF", const: "PdfViewer" }
       ],
     },
     elementType: {
@@ -102,35 +103,35 @@ export const ComponentSchema: any = {
         { title: "Standard", const: "standard" },
       ],
     },
-    positionVertical:{
+    positionVertical: {
       oneOf: [
         { title: "Top", const: "top" },
         { title: "Center", const: "center" },
         { title: "Bottom", const: "bottom" }
       ],
     },
-    positionHorizontal:{
+    positionHorizontal: {
       oneOf: [
         { title: "Left", const: "left" },
         { title: "Center", const: "center" },
         { title: "Right", const: "right" }
       ],
     },
-    contentVertical:{
+    contentVertical: {
       oneOf: [
         { title: "Top", const: "top" },
         { title: "Center", const: "center" },
         { title: "Bottom", const: "bottom" }
       ],
     },
-    contentHorizontal:{
+    contentHorizontal: {
       oneOf: [
         { title: "Left", const: "left" },
         { title: "Center", const: "center" },
         { title: "Right", const: "right" }
       ],
     },
-    toolTipPosition:{
+    toolTipPosition: {
       oneOf: [
         { title: "Top", const: "top" },
         { title: "Left", const: "left" },
@@ -440,6 +441,7 @@ export const ComponentSchema: any = {
           const: "HorizontalStackBarGraph",
         },
         { title: "Area Graph", const: "AreaGraph" },
+        { title: "StackBar And Line Graph", const: "StackBarLineGraph" },
       ],
     },
     iconName: {
@@ -493,6 +495,11 @@ export const ComponentSchema: any = {
         { title: "Detail Icon", const: "DetailIcon" },
         { title: "Report View Icon", const: "ReportViewIcon" },
         { title: "Payout", const: "Payout" },
+        { title: "Info Outlined", const: "InfoOutlinedIcon" },
+        { title: "Territory Add", const: "TerritoryAdd" },
+        { title: "Territory Edit", const: "TerritoryEdit" },
+        { title: "Territory Delete", const: "TerritoryDelete" },
+        { title: "Git Compare", const: "GitCompare" },
       ],
     },
     color: {

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

@@ -1,5 +1,3 @@
-import { title } from "process";
-
 export const EventSchema = {
   type: "object",
   properties: {
@@ -55,8 +53,9 @@ export const EventSchema = {
         { title: "Row Movement", const: "onRowMovement" },
         { title: "Download", const: "onDownload" },
         { title: "Fail", const: "Fail" },
+        { title: "onClose", const: "onClose" },
         { title: "Key Down", const: "onKeyDown" },
-          { title: "Set Style", const: "setStyle" },
+        { title: "Set Style", const: "setStyle" },
 
       ]
     },

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

@@ -8,7 +8,7 @@ import { StyleSection } from "../build/uischema/styleSection";
 import { TableSection } from "../build/uischema/tableSection";
 import { ValueTab } from "../build/uischema/valueTab";
 import { ValidationSection } from "../build/uischema/validationSections";
-import { getFormdataFromSessionStorage, validateAndShowErrors, okHandler, saveFormdataInSessionStorage, saveHandler, doesScopeNameExist, initialiseScopeKey, addToScopeKey } from "./utils";
+import { getFormdataFromSessionStorage, validateAndShowErrors, okHandler, saveFormdataInSessionStorage, saveHandler } from "./utils";
 const sectionLabels = {
   Select: ["Core", "Properties", "Value", "Events", "Style", "Validation"],
   MultipleSelect: ["Core", "Properties", "Value", "Events", "Style", "Validation"],
@@ -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", "TabTitles", "Properties", "Style", "Validation"],
   SpeedoMeter: ["Core", "Properties", "Events", "Style",],
   card: ["Core", "Properties", "Events", "Style", "Validation"],
   UploadFile: ["Core", "Events", "Style", "Validation"],
@@ -37,8 +37,9 @@ const sectionLabels = {
   Radio: ["Core", "Properties", "Events", "Style", "Validation"],
   Text: ["Core", "Properties", "Events", "Style", "Validation"],
   TextArea: ["Core", "Properties", "Events", "Style", "Validation"],
-  PopUp: ["Core", "Components", "Properties", "Style"],
+  PopUp: ["Core", "Components", "Properties", "Events", "Style"],
   PopOver: ["Core", "Components", "Properties", "Style"],
+  PdfViewer: ["Core", "Properties", "Style"],
   Stepper: ["Core", "Components", "Properties", "Events", "Style"],
   DataGrid: ["Core", "Components", "Properties", "Events", "Style"],
   InputSlider: ["Core", "Properties", "Events", "Style", "Validation"],
@@ -52,8 +53,7 @@ const sectionLabels = {
   Camera: ["Core", "Properties", "Events", "Style", "Validation"],
   OTP_Input: ["Core", "Properties", "Events", "Style", "Validation"],
 }
-
-export function refreshPage(type: string, store: any, formdata?: any) {
+export function refreshPage(type: string, store: any) {
   const UiSchema = _.cloneDeep(componentBasicUiSchema(store.theme.myTheme))
   const currentConfig = JSON.parse(sessionStorage.getItem("pageFormdata"));
   if (type) {
@@ -63,13 +63,11 @@ export function refreshPage(type: string, store: any, formdata?: any) {
       Style: StyleSection,
       Events: EventSection(store.theme.myTheme),
       Components: TableSection(store.theme.myTheme),
+      TabTitles: TableSection(store.theme.myTheme, "tabLabelElements"),
       Properties: buildPropertiesSection(type),
       Validation: ValidationSection
     }
     const elements = sectionLabels[type]?.map(e => sectionUiSchema[e]);
-    if (!formdata?.style) {
-      store.setFormdata((prev) => ({ ...prev, style: "{\n}" }));
-    }
     UiSchema.elements[0].config.main.tabLabels = sectionLabels[type] || ["Core", "Style", "Events", "Validation"];
     UiSchema.elements[0].elements = elements || [CoreSection, StyleSection, EventSection(store.theme.myTheme), ValidationSection];
   }
@@ -217,17 +215,6 @@ export function refreshPage(type: string, store: any, formdata?: any) {
   store.setUiSchema(UiSchema);
 }
 
-const debouncedScopeNameValidator = _.debounce((store: any, newName: string) => {
-  if (doesScopeNameExist(newName)) {
-    store.setValidation("ValidateAndShow");
-    store.setNotify({
-      Fail: true,
-      FailMessage: `Name "${newName}" already exists. Please use a unique name.`
-    });
-  }
-}, 400);
-
-
 export default (store: any, dynamicData: any, submitHandler: any, service: any) => {
   return {
     setPage: async function () {
@@ -235,7 +222,7 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       store.setFormdata(formdata);
       const schema = this.getSchema();
       store.setSchema(schema);
-      this.refreshPage(formdata?.type, store,formdata);
+      this.refreshPage(formdata?.type, store);
 
     },
     refreshPage: refreshPage,
@@ -279,9 +266,7 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       schema.properties.pageName.path = pathArray
       return schema;
     },
-    okHandler: () => {
-      okHandler(store);
-    },
+    okHandler: () => okHandler(store),
     saveHandler: async () => await saveHandler(store, service, submitHandler),
     onChange: function () {
       if (
@@ -290,12 +275,6 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       ) {
         this.refreshPage(store?.newData?.type, store);
       }
-      if (
-        store?.formData?.name !== store?.newData?.name &&
-        store?.newData?.name !== undefined
-      ) {
-        debouncedScopeNameValidator(store, store.newData.name);
-      }
     },
     editComponents: function () {
 
@@ -304,11 +283,13 @@ export default (store: any, dynamicData: any, submitHandler: any, service: any)
       const path = store.searchParams?.get("path");
       const id = store.searchParams?.get("id");
       saveFormdataInSessionStorage(store.ctx.core.data, path)
-
-      addToScopeKey(store.ctx.core.data.name);
       if (path) {
-        const path = store.searchParams?.get("path");
-        const finalPath = `${path}.elements[${rowId}]`
+        let finalPath = `${path}`;
+        if (dynamicData?.path?.startsWith("tabLabel")) {
+          finalPath = `${finalPath}.tabLabelElements[${rowId}]`
+        } else {
+          finalPath = `${finalPath}.elements[${rowId}]`
+        }
         store.searchParams.set("path", finalPath)
         store.setSearchParams(store.searchParams)
         this.setPage()
@@ -319,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.tabLabelElements.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);
@@ -327,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");
@@ -345,11 +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.tabLabelElements)) {
+        store.formData.tabLabelElements = []
+      }
       const path = store.searchParams?.get("path");
       saveFormdataInSessionStorage(store.ctx.core.data, path)
-      addToScopeKey(store.ctx.core.data.name);
-      
-      const finalPath = `${path}.elements[${store.formData.elements.length}]`
+      let finalPath = `${path}`;
+      if (dynamicData.path.startsWith("tabLabel")) {
+        finalPath = `${finalPath}.tabLabelElements[${store.formData.tabLabelElements.length}]`
+      } else {
+        finalPath = `${finalPath}.elements[${store.formData.elements.length}]`
+      }
       store.searchParams.set("path", finalPath)
       store.setSearchParams(store.searchParams)
       this.setPage()
@@ -381,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("tabLabel") ? "true" : "false");
       store.updateDialog("popUpComponentSection");
     },
     deletePopUpEvent: function () {
@@ -427,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.tabLabelElements)) {
+        store.formData.tabLabelElements = []
+      }
       saveFormdataInSessionStorage(store.ctx.core.data, pastedElementParentPath);
       const formData = getFormdataFromSessionStorage(pastedElementParentPath);
-      const insertElementIndex = elementType === "Component" ? formData.elements.length : formData.events.length;
+      const currentLength = {
+        "TabsComponent": formData.tabLabelElements.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"));
@@ -466,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}.tabLabelElements[${rowId}]` 
       }
       return parentPath ? `${parentPath}.events[${rowId}]` : `events[${rowId}]`;
     },

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

@@ -32,9 +32,9 @@ export default (
       const schema = await this.getSchema();
       console.log("SettingSchema>>",schema)
       store.setSchema(schema);
-      this.refreshPage(formdata.Handler, store,formdata);
+      this.refreshPage(formdata.Handler, store);
     },
-    refreshPage: (handlerType: any, store: any, formdata?: any) => {
+    refreshPage: (handlerType: any, store: any) => {
       const uiSchema = _.cloneDeep(EventUiSchema(store.theme.myTheme));
       const schema: any = _.cloneDeep(EventSchema);
       if (handlerType) {
@@ -62,9 +62,6 @@ export default (
             "Write Custom Code",
             false
           );
-          if (!formdata?.eventCode) {
-            store.setFormdata((prev) => ({ ...prev, eventCode: "async (store, dynamicData, user, parentEventOutput, service, componentName) => {\n\n\n}" }));
-          }
           schema.required = ["eventType", "Handler", "eventCode"];
         } else if (handlerType === "api") {
           uiSchema.elements[0].elements[0].elements[2] = emptyBox("emptyBox", {
@@ -74,9 +71,6 @@ export default (
             lg: 6,
           });
           uiSchema.elements[0].elements[0].elements[3] = APISection;
-          if (!formdata?.apiBody) {
-            store.setFormdata((prev) => ({ ...prev, apiBody: "(store, dynamicData, user, body, service) => {\n\n\n}" }));
-          }
           schema.required = ["eventType", "Handler", "method", "path"];
         } else if (handlerType === "inBuiltFunction") {
           uiSchema.elements[0].elements[0].elements[2] = getSelectField(

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

@@ -2,7 +2,7 @@ import { PageMasterSchema } from "../elements/UiSchema/PageMaster/schema";
 import { PageMasterUiSchema } from "../elements/UiSchema/PageMaster/uiSchema";
 import _ from "lodash";
 import Component from "./component";
-import { getFormdataFromSessionStorage, validateAndShowErrors, saveFormdataInSessionStorage, saveHandler, initialiseScopeKey, addToScopeKey } from "./utils";
+import { getFormdataFromSessionStorage, validateAndShowErrors, saveFormdataInSessionStorage, saveHandler } from "./utils";
 
 
 interface funcParamsProps {
@@ -22,7 +22,6 @@ export default (funcParams: funcParamsProps) => {
       const schema = await this.getSchema();
       store.setSchema(schema);
       store.setUiSchema(uiSchema);
-      initialiseScopeKey();
     },
     getFormdata: async function () {
       const id = store.searchParams?.get("id");
@@ -50,7 +49,6 @@ export default (funcParams: funcParamsProps) => {
     },
     backHandler: () => {
       sessionStorage.removeItem("pageFormdata")
-      sessionStorage.removeItem("scopeKey")
       store.navigate("/PageMasterRecords");
     },
     onAddClickHandler: function () {
@@ -60,8 +58,6 @@ export default (funcParams: funcParamsProps) => {
         store.formData.elements = []
       }
       const response = saveFormdataInSessionStorage(store.ctx.core.data)
-      addToScopeKey(store.ctx.core.data.name);
-      
       if (id) {
         store.navigate(
           `/Component?path=${`elements[${response?.elements.length}]`}&id=${id}`
@@ -87,7 +83,6 @@ export default (funcParams: funcParamsProps) => {
         store.formData.events = []
       }
       saveFormdataInSessionStorage(store.ctx.core.data)
-      addToScopeKey(store.ctx.core.data.name);
       const finalPath = `events[${store.formData.events.length}]`
       store.navigate(`/ComponentEvents?path=${finalPath}&id=${id}`)
     },
@@ -96,7 +91,6 @@ export default (funcParams: funcParamsProps) => {
       const rowId = dynamicData.path.split(".")[1];
       const id = store.searchParams?.get("id");
       saveFormdataInSessionStorage(store.ctx.core.data)
-      addToScopeKey(store.ctx.core.data.name);
       const finalPath = `events[${rowId}]`
       store.navigate(`/ComponentEvents?path=${finalPath}&id=${id}`)
     },

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

@@ -67,86 +67,15 @@ export const getFormdataFromSessionStorage = (path?: string) => {
 
 }
 
-export const collectScopeNames = (config: any, scopeMap: Record<string, boolean> = {}): Record<string, boolean> => {
-    if (!config || typeof config !== "object") return scopeMap;
-
-    if (Array.isArray(config)) {
-        config.forEach((item) => collectScopeNames(item, scopeMap));
-        return scopeMap;
-    }
-    if (config.name) {
-        scopeMap[config.name] = true;
-    }
-    if (Array.isArray(config.elements)) {
-        collectScopeNames(config.elements, scopeMap);
-    }
-    return scopeMap;
-}
-
-export const initialiseScopeKey = () => {
-    const config = sessionStorage.getItem("pageFormdata")
-        ? JSON.parse(sessionStorage.getItem("pageFormdata"))
-            : undefined;
-
-    const names = config ? collectScopeNames(config) : {};
-    sessionStorage.setItem("scopeKey", JSON.stringify(names));
-}
-
-export const getScopeKey = (): Record<string, boolean> => {
-    const raw = sessionStorage.getItem("scopeKey");
-    return raw ? JSON.parse(raw) : {};
-}
-
-export const addToScopeKey = (name: string) => {
-    if (!name) return;
-    const scopeKey = getScopeKey();
-    scopeKey[name] = true;
-    sessionStorage.setItem("scopeKey", JSON.stringify(scopeKey));
-}
-
-export const doesScopeNameExist = (name: string): boolean => {
-    if (!name) return false;
-    const scopeKey = getScopeKey();
-    return !!scopeKey[name];
-}
-
-export const findDuplicateScopeNames = (config: any): string[] => {
-    const scopeNameCount: Record<string, number> = {};
-
-    const traverse = (currentNode: any) => {
-        if (!currentNode || typeof currentNode !== "object") return;
-        if (Array.isArray(currentNode)) {
-            currentNode.forEach(traverse);
-            return;
-        }
-        if (currentNode.name) {
-            scopeNameCount[currentNode.name] = (scopeNameCount[currentNode.name] || 0) + 1;
-        }
-        if (Array.isArray(currentNode.elements)) traverse(currentNode.elements);
-    };
-    traverse(config);
-    return Object.keys(scopeNameCount).filter((name) => scopeNameCount[name] > 1);
-}
-
-export async function saveHandler(store: any, service: any, submitHandler: any) {
+export async function saveHandler(store, service, submitHandler) {
+    const id = store.searchParams?.get("id");
     const path = store.searchParams?.get("path");
     saveFormdataInSessionStorage(store.ctx.core.data, path);
     const config = JSON.parse(sessionStorage.getItem("pageFormdata"));
-
-    const duplicates = findDuplicateScopeNames(config);
-    if (duplicates.length > 0) {
-        store.setValidation("ValidateAndShow");
-        store.setNotify({
-            Fail: true,
-            FailMessage: `Duplicate names found: ${duplicates.join(", ")}`
-        });
-        return;
-    }
-
     if (_.isEmpty(store.ctx.core.errors)) {
         try {
             const saveReturn = await submitHandler(store, service, config);
-            navigateHandler(store, true, "/PageMasterRecords")
+            navigateHandler(store, true,"/PageMasterRecords")
         } catch (err) {
             navigateHandler(store, false, undefined, err.message);
         }
@@ -155,10 +84,9 @@ export async function saveHandler(store: any, service: any, submitHandler: any)
     }
 }
 
-export const navigateHandler = (store: any, isSubmitted: boolean, pageName?: string | boolean, errorMessage?: string) => {
+export const navigateHandler = (store, isSubmitted,pageName?: string | boolean, errorMessage?: string) => {
     if (isSubmitted) {
         sessionStorage.removeItem("pageFormdata");
-        sessionStorage.removeItem("scopeKey");
         store.navigate(pageName || -1)
         store.setNotify({
             SuccessMessage: "Submit Successfully",
@@ -173,11 +101,10 @@ export const navigateHandler = (store: any, isSubmitted: boolean, pageName?: str
     }
 };
 
-export function okHandler(store: any) {
+export function okHandler(store) {
     const path = store.searchParams?.get("path");
     if (_.isEmpty(store.ctx.core.errors)) {
-        saveFormdataInSessionStorage(store.ctx.core.data, path);
-        addToScopeKey(store.ctx.core.data.name);
+        saveFormdataInSessionStorage(store.ctx.core.data, path)
         store.navigate(-1)
         store.setNotify({
             SuccessMessage: "Save Successfully",

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

@@ -116,7 +116,7 @@ export default (funcParams: funcParamsProps) => {
       const cloneEventGroup = _.cloneDeep(eventGroups)
       if (cloneEventGroup.setStyle) {
         let finalResponse = {};
-        const path = funcParams.dynamicData?.tableButtonPath || funcParams?.dynamicData?.path?.split(".")[0];
+        const path = funcParams.dynamicData?.tableButtonPath || funcParams?.dynamicData.path?.split(".").pop();
         if (cloneEventGroup?.setStyle?.[path]) {
           for (const eventConfig of cloneEventGroup?.setStyle?.[path]) {
             finalResponse = executeEvents({
@@ -158,6 +158,9 @@ export default (funcParams: funcParamsProps) => {
     onFileDelete: async function () {
       this.callHandler("onFileDelete")
     },
+    onClose: function () {
+      this.callHandler("onClose")
+    },
     onMount: function () {
       this.callHandler("onMount")
     },
@@ -209,8 +212,7 @@ export default (funcParams: funcParamsProps) => {
 
       const promises = ChangeEventsKeysArray.flatMap((componentName: string) => {
         if (
-          funcParams.store?.formData[componentName] === funcParams.store.newData[componentName] ||
-          funcParams.store?.newData[componentName] === undefined
+          funcParams.store?.formData[componentName] === funcParams.store.newData[componentName] 
         ) {
           return [];
         }