impaktapps-ui-builder 0.0.275 → 0.0.277

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

@@ -104,6 +104,7 @@ export const EventUiSchema: any = {
                   type: "text",
                   options: [
                     { label: "Click Event", value: "onClick" },
+                    { label: "onStart", value: "onStart" },
                     { label: "Load Event", value: "onLoad" },
                     { label: "Change Event", value: "onChange" },
                     { label: "Success", value: "Success" },

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

@@ -8,29 +8,31 @@ import { buildPropertiesSection } from "../build/uischema/buildPropertiesSection
 import { StyleSection } from "../build/uischema/styleSection";
 import { TableSection } from "../build/uischema/tableSection";
 import { ValueTab } from "../build/uischema/valueTab";
+import { ValidationSection } from "../build/uischema/validationSections";
 
 const sectionLabels = {
-  Select: ["Core", "Value", "style", "Event"],
-  MultipleSelect: ["Core", "Value", "style", "Event"],
-  Table: ["Core", "Components", "style", "Event"],
-  LeaderBoard: ["Core", "Components", "Properties", "style", "Event"],
-  WrapperSection: ["Core", "Components","Properties", "style"],
-  TabSection: ["Core", "Components", "Properties", "style"],
-  SpeedoMeter:["Core", "Properties", "style", "Event"],
-  card:["Core", "Properties", "style", "Event"],
-  UploadFile:["Core",  "style", "Event"],
-  Graph:["Core", "Properties", "style", "Event"],
-  DownloadFile:["Core",  "style", "Event"],
-  Box: ["Core", "Properties", "style", "Event"],
-  Properties: ["Core", "Properties", "style", "Event"],
-  ProgressBarCard: ["Core", "Properties", "style", "Event"],
-  RankCard: ["Core", "Properties", "style", "Event"],
-  Slider: ["Core", "Components","Properties", "style", "Event"],
-  Timer: ["Core", "Properties", "style", "Event"],
-  Rank: ["Core", "Properties", "style", "Event"],
-  Button: ["Core", "Properties", "style", "Event"],
-  Array:["Core","Components",],
-
+  Select: ["Core", "Value", "style", "Event","Validation"],
+  MultipleSelect: ["Core", "Value", "style", "Event","Validation"],
+  Table: ["Core", "Components", "style", "Event","Validation"],
+  LeaderBoard: ["Core", "Components", "Properties", "style", "Event","Validation"],
+  WrapperSection: ["Core", "Components","Properties", "style","Validation"],
+  TabSection: ["Core", "Components", "Properties", "style","Validation"],
+  SpeedoMeter:["Core", "Properties", "style", "Event","Validation"],
+  card:["Core", "Properties", "style", "Event","Validation"],
+  UploadFile:["Core",  "style", "Event","Validation"],
+  Graph:["Core", "Properties", "style", "Event","Validation"],
+  DownloadFile:["Core",  "style", "Event","Validation"],
+  Box: ["Core", "Properties", "style", "Event","Validation"],
+  Properties: ["Core", "Properties", "style", "Event","Validation"],
+  ProgressBarCard: ["Core", "Properties", "style", "Event","Validation"],
+  RankCard: ["Core", "Properties", "style", "Event","Validation"],
+  Slider: ["Core", "Components","Properties", "style", "Event","Validation"],
+  Timer: ["Core", "Properties", "style", "Event","Validation"],
+  Rank: ["Core", "Properties", "style", "Event","Validation"],
+  Button: ["Core", "Properties", "style", "Event","Validation"],
+  Array:["Core","Components","Validation"],
+  Radio:["Core", "Properties", "style", "Event","Validation"],
+  Text:["Core", "Event","Validation"]
 }
 
 export const refreshPage = (type:string,store:any) => {
@@ -42,12 +44,13 @@ export const refreshPage = (type:string,store:any) => {
     style: StyleSection,
     Event: EventSection,
     Components: TableSection,
-    Properties: buildPropertiesSection(type)
+    Properties: buildPropertiesSection(type),
+    Validation:ValidationSection
   
   }
   const elements = sectionLabels[type]?.map(e => sectionUiSchema[e]);
-  UiSchema.elements[1].config.main.tabLabels = sectionLabels[type] || ["Core", "style","Event"];
-  UiSchema.elements[1].elements = elements || [CoreSection, StyleSection,EventSection];
+  UiSchema.elements[1].config.main.tabLabels = sectionLabels[type] || ["Core", "style","Event","Validation"];
+  UiSchema.elements[1].elements = elements || [CoreSection, StyleSection,EventSection,ValidationSection];
  
 }
 store.setUiSchema(UiSchema);

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

@@ -3,6 +3,7 @@ import { PageMasterUiSchema } from "../elements/UiSchema/PageMaster/uiSchema";
 import _ from "lodash";
 import Component from "./component";
 import { getFormdataFromLocalStorage, saveFormdataInLocalStorage } from "./saveHandler";
+import { schema } from "../build/buildUiSchema";
 
 interface funcParamsProps {
   store: any,
@@ -52,6 +53,7 @@ export default (funcParams:funcParamsProps) => {
       );
     },
     submitPageHandler: async function () {
+      console.log(schema)
       submitHandler(store,funcParams.service)
         .then((saveReturn: any) => {
           localStorage.removeItem("pageFormdata")

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

@@ -3,6 +3,8 @@ 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  {default as buildSchema} from "../builder/build/buildSchema"
 export {default as clearPreviousCache} from "../builder/services/clearLocalStorage"

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

@@ -16,6 +16,11 @@ export const executeEvents = async (
     nextEvent = events;
   }
   else {
+    if (!shouldEventExecute(config, componentName,
+      store, dynamicData, userValue,
+      service, serviceHolder, eventGroups)) {
+      return { response: undefined, events: undefined };
+    }
     const { response, events } = await executeEventsHandler(config, componentName,
       store, dynamicData, userValue,
       service, serviceHolder, eventGroups, parentEventOutput)
@@ -35,6 +40,11 @@ const executetOnLoadEvent = async (
 ) => {
 
   try {
+    if (!shouldEventExecute(config, componentName,
+      store, dynamicData, userValue,
+      service, serviceHolder, eventGroups)) {
+      return { response: undefined, events: undefined };
+    }
     const { response } = await executeEventsHandler(config, componentName,
       store, dynamicData, userValue,
       service, serviceHolder, eventGroups, parentEventOutput)
@@ -132,17 +142,20 @@ async function executeInBuiltFunctionHandler(refreshHandlerConfig: any, componen
 async function executeCustomHandler(customHandlerConfig: any, componentName: string,
   store: any, dynamicData: any, userValue: any,
   service: any, serviceHolder: any, parentEventOutput?: any) {
+  console.log(service)
   const makeFunc = eval(customHandlerConfig.eventCode)
-  makeFunc(store, dynamicData, userValue, parentEventOutput, service);
-  return { response: undefined, events: customHandlerConfig?.events };
+  const response = await makeFunc(store, dynamicData, userValue, parentEventOutput, service, componentName);
+  return { response: response, events: customHandlerConfig?.events };
 }
 
 async function mergeFormdata(handlerResponse: any, componentName: string, eventConfig: any, store: any) {
-  if (eventConfig.type === "Select" && !(_.isEmpty(handlerResponse)&&handlerResponse)) {
+
+  if (eventConfig.type === "Select" && !(_.isEmpty(handlerResponse) && handlerResponse)) {
     store.setSchema((pre) => {
       return {
         ...pre, properties: {
           ...pre.properties, [componentName]: {
+            // ...pre?.properties?. [componentName],
             enum: handlerResponse.data
           }
         }
@@ -192,12 +205,24 @@ const buildHeadersFormat = (headers: any[]) => {
   return headerObj;
 }
 
-
+async function shouldEventExecute(config, componentName,
+  store, dynamicData, userValue,
+  service, serviceHolder, eventGroups) {
+  const startEvent = config?.events?.filter(e => e.eventType === "onStart");
+  if (startEvent?.length > 0) {
+    const { response } = await executeEventsHandler(startEvent[0], componentName,
+      store, dynamicData, userValue,
+      service, serviceHolder, eventGroups);
+    return response
+  }
+}
+// if(!response){
+//   return {response:undefined,events:undefined};
+// }
 export async function buildApiPayload(compConfig: any, body: any, headers: any, store: any, dynamicData: any, userValue: any, service) {
   if (compConfig?.headers) {
-    headers = {
-      headers: buildHeadersFormat(compConfig.headers)
-    }
+    headers = buildHeadersFormat(compConfig.headers)
+
   }
   if (compConfig.body) {
     body = { ...buildBodyFormat(compConfig.body, store.newData || store?.ctx?.core?.data || store.formData, userValue) };
@@ -217,10 +242,14 @@ export function getRefreshElements(eventConfig: any, eventGropus: any) {
     result = eventConfig.refreshElements.map((e) => {
       return e.value
     })
+
   } else {
     if (eventGropus?.onLoad) {
       result = Object.keys(eventGropus?.onLoad)
+      result.push(result[0]);
     }
   }
+  console.log(result);
   return result;
-}
+}
+

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

@@ -3,7 +3,7 @@ import { downloadFile } from "./downloadFile";
 import { executeEvents } from "./events";
 let compType: string;
 let eventGroups: any = {};
-const notifyUiSchema =  {
+const notifyUiSchema = {
   type: "Control",
   scope: "#/properties/notify",
   options: {
@@ -37,7 +37,7 @@ export const extractEvents = (eventConfig: any) => {
 };
 
 interface funcParamsProps {
- store: any,
+  store: any,
   dynamicData: any,
   config: any,
   uiSchema: any,
@@ -45,24 +45,32 @@ interface funcParamsProps {
   service: any,
   userValue: any,
 }
-export default (funcParams:funcParamsProps) => {
+export default (funcParams: funcParamsProps) => {
   return {
     setPage: async function () {
       funcParams.store.setFormdata({});
       eventGroups = {}
       eventGroups = extractEvents(funcParams.config)
       await executeEvents(
-        { Handler: "refresh",eventType:"onPageRefresh"}, "all",
+        { Handler: "refresh", eventType: "onPageRefresh" }, "all",
         funcParams.store, funcParams.dynamicData, funcParams.userValue, funcParams.service,
         this, eventGroups)
-        funcParams.uiSchema.elements.push(notifyUiSchema);
-        funcParams.store.setUiSchema(funcParams.uiSchema);     
+      funcParams.store.setSchema(
+        (pre:any) => {
+          return {
+            ...funcParams.schema, properties:
+              { ...funcParams.schema.properties, ...pre.properties, }
+          }
+        })
+      funcParams.uiSchema.elements.push(notifyUiSchema);
+      funcParams.store.setUiSchema(funcParams.uiSchema);
     },
     onClick: async function () {
       const path = funcParams.dynamicData?.tableButtonPath || funcParams.dynamicData.path.split(".")[0];
       for (const eventConfig of eventGroups?.onClick[path]) {
-         await executeEvents(
-         eventConfig, path,
+
+        await executeEvents(
+          eventConfig, path,
           funcParams.store, funcParams.dynamicData, funcParams.userValue, funcParams.service,
           this, eventGroups)
       }
@@ -78,8 +86,8 @@ export default (funcParams:funcParamsProps) => {
             for (const eventConfig of eventGroups.onChange[componentName]) {
               await executeEvents(
                 eventConfig, componentName,
-                 funcParams.store, funcParams.dynamicData, funcParams.userValue, funcParams.service,
-                 this, eventGroups)
+                funcParams.store, funcParams.dynamicData, funcParams.userValue, funcParams.service,
+                this, eventGroups)
             }
           }
         }))