impaktapps-ui-builder 0.0.276 → 0.0.277

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

@@ -17,6 +17,7 @@ export declare const buildButton: (config: any, componentScope: string) => {
             color: string;
             type: string;
             startIcon: string;
+            styleDefault: boolean;
             icon: string;
             onClick: string;
             size: string;

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

@@ -0,0 +1 @@
+export declare const buildEmptyBox: (config: any, componentScope: any) => any;

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

@@ -1,2 +1,7 @@
+export declare let schema: {
+    type: string;
+    properties: {};
+    required: any[];
+};
 declare const buildUiSchema: (config: any) => any;
 export default buildUiSchema;

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

@@ -29,6 +29,7 @@ export declare const APISection: {
         scope: string;
         options: {
             widget: string;
+            elementLabelProp?: undefined;
             detail?: undefined;
         };
         config: {
@@ -54,6 +55,7 @@ export declare const APISection: {
         scope: string;
         options: {
             widget: string;
+            elementLabelProp?: undefined;
             detail?: undefined;
         };
         config: {
@@ -76,6 +78,7 @@ export declare const APISection: {
         scope: string;
         layout: number;
         options: {
+            elementLabelProp: string;
             detail: {
                 type: string;
                 elements: {

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

@@ -17,6 +17,7 @@ declare const _default: {
             color: string;
             type: string;
             startIcon: string;
+            styleDefault: boolean;
             icon: string;
             onClick: string;
             size: string;

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

@@ -5,6 +5,7 @@ export declare const CoreSection: {
         scope: string;
         options: {
             widget: string;
+            elementLabelProp?: undefined;
             detail?: undefined;
         };
         config: {
@@ -29,6 +30,7 @@ export declare const CoreSection: {
         scope: string;
         options: {
             widget: string;
+            elementLabelProp?: undefined;
             detail?: undefined;
         };
         config: {
@@ -59,6 +61,7 @@ export declare const CoreSection: {
         };
         options: {
             widget: string;
+            elementLabelProp?: undefined;
             detail?: undefined;
         };
         layout?: undefined;
@@ -67,9 +70,10 @@ export declare const CoreSection: {
         scope: string;
         layout: number;
         options: {
+            elementLabelProp: string;
             detail: {
                 type: string;
-                elements: ({
+                elements: {
                     type: string;
                     scope: string;
                     options: {
@@ -90,25 +94,7 @@ export declare const CoreSection: {
                             }[];
                         };
                     };
-                } | {
-                    type: string;
-                    scope: string;
-                    options: {
-                        widget: string;
-                    };
-                    config: {
-                        layout: {
-                            xs: number;
-                            sm: number;
-                            md: number;
-                            lg: number;
-                        };
-                        main: {
-                            label: string;
-                            options?: undefined;
-                        };
-                    };
-                })[];
+                }[];
             };
             widget?: undefined;
         };

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

@@ -113,6 +113,7 @@ export declare const LineGraph: {
         widget: string;
     };
     config: {
+        layout: number;
         main: {
             type: string;
             header: string;

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

@@ -5,9 +5,10 @@ export declare const ValidationSection: {
         scope: string;
         layout: number;
         options: {
+            elementLabelProp: string;
             detail: {
                 type: string;
-                elements: {
+                elements: ({
                     type: string;
                     scope: string;
                     options: {
@@ -22,9 +23,31 @@ export declare const ValidationSection: {
                         };
                         main: {
                             label: string;
+                            options: {
+                                value: string;
+                                label: string;
+                            }[];
                         };
                     };
-                }[];
+                } | {
+                    type: string;
+                    scope: string;
+                    options: {
+                        widget: string;
+                    };
+                    config: {
+                        layout: {
+                            xs: number;
+                            sm: number;
+                            md: number;
+                            lg: number;
+                        };
+                        main: {
+                            label: string;
+                            options?: undefined;
+                        };
+                    };
+                })[];
             };
         };
     }[];

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

@@ -2,6 +2,7 @@ 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";

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

@@ -1,4 +1,7 @@
-export declare const executeEvents: (config: any, componentName: string, store: any, dynamicData: any, userValue: any, service: any, serviceHolder: any, eventGroups?: any, parentEventOutput?: any) => Promise<void>;
+export declare const executeEvents: (config: any, componentName: string, store: any, dynamicData: any, userValue: any, service: any, serviceHolder: any, eventGroups?: any, parentEventOutput?: any) => Promise<{
+    response: any;
+    events: any;
+}>;
 export declare function buildApiPayload(compConfig: any, body: any, headers: any, store: any, dynamicData: any, userValue: any, service: any): Promise<{
     body: any;
     headers: any;

package/package.json

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

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

@@ -14,6 +14,9 @@ export const buildButton = (config:any,componentScope:string) =>{
     if(config.layout){
       button.config.layout = createLayoutFormat(config.layout)
     }
+    if(config.defaultStyle){
+      button.config.main.styleDefault = config.defaultStyle==="true"?true:false;
+    }
     button.scope = componentScope;
     if (config.style) {
       button.config.style = JSON.parse(config.style)
@@ -22,8 +25,10 @@ export const buildButton = (config:any,componentScope:string) =>{
       button.config.main.size = config.size
     }
     if (config.color) {
-      button.config.main.size = config.color
+      button.config.main.color = config.color
     }
+    if(config.label){
     button.config.main.name = config.label;
+    }
     return button;
 }

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

@@ -0,0 +1,11 @@
+import _ from "lodash";
+import { createLayoutFormat } from "./buildConfig";
+import emptyBox from "./uischema/emptyBox";
+
+export const buildEmptyBox = (config,componentScope) =>{
+    const EmptyBox: any = _.cloneDeep(emptyBox);
+      if (config.layout) {
+        EmptyBox.config.layout = createLayoutFormat(config.layout);
+      }
+      return EmptyBox;
+}

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

@@ -1,11 +1,11 @@
-import { flatObjectValueInArray } from "./buildConfig";
+import { createLayoutFormat, flatObjectValueInArray } from "./buildConfig";
 import { LineGraph } from "./uischema/graph";
 import _ from "lodash";
 
 export const buildLineGraph = (config, componentScope) => {
   const lineGraph: any = _.cloneDeep(LineGraph);
   if (config.layout) {
-    lineGraph.config.layout = config.layout;
+    lineGraph.config.layout = createLayoutFormat(config.layout);
   }
   lineGraph.config.main.header = config.heading;
   if (config.height) {

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

@@ -22,11 +22,9 @@ export const buildSchema = (config: any) => {
                 }
             });
         }
+       
     }
     buildRule(config)
-    if (config?.elements) {
-        config.elements.forEach(buildRule);
-    }
     console.log(schema)
     window.localStorage.setItem("schemaDemo",JSON.stringify(schema))
     return schema;

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

@@ -33,7 +33,30 @@ import { buildSlider } from "./buildSlider";
 import { buildCheckbox } from "./buildCheckbox";
 import { buildLineGraph } from "./buildLineGraph";
 import { buildRadio } from "./buildRadio";
+import { buildEmptyBox } from "./buildEmptyBox";
+export let schema =  {
+  type: "object",
+  properties: {},
+  required: []
+};
+function buildRule(configObj: any) {
+  if (configObj.validation) {
+    configObj.validation.forEach((rule: any) => {
+      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)
+      }
+    });
+  }
 
+}
 
 
 const buildUiSchema = (config: any) => {
@@ -42,6 +65,7 @@ const buildUiSchema = (config: any) => {
   switch (config.type) {
     case "RunnerBoyProgressBar":
       elements = RunnerBoyProgressbar(config, componentScope);
+
       break;
     case "TabSection":
       elements = buildTabSection(config, componentScope);
@@ -51,45 +75,51 @@ const buildUiSchema = (config: any) => {
       break;
     case "Text":
       elements = buildTextField(config, componentScope);
+      buildRule(config);
       break;
     case "TextArea":
       elements = buildTextArea(config, componentScope)
+      buildRule(config);
       break;
     case "Date":
       elements = buildDate(config, componentScope);
+      buildRule(config);
       break;
     case "Select":
       elements = buildSelect(config, componentScope);
+      buildRule(config);
       break;
     case "Radio":
       elements = buildRadio(config, componentScope);
+      buildRule(config);
       break;
     case "Button":
 
       elements = buildButton(config, componentScope);
+      buildRule(config);
       break;
     case "Table":
       elements = buildTable(config, componentScope);
-      //return
+      buildRule(config);
       break;
     case "Box":
       elements = buildLabel(config, componentScope);
+      buildRule(config);
       break;
     case "CheckBox":
       elements = buildCheckbox(config, componentScope);
+      buildRule(config);
       break;
     case "UploadFile":
       elements = buildUploadFile(config, componentScope);
+      buildRule(config);
       break;
     case "DownloadFile":
       elements = buildDownloadFile(config, componentScope);
+      buildRule(config);
       break;
     case "EmptyBox":
-      const EmptyBox: any = _.cloneDeep(emptyBox);
-      if (config.layout) {
-        EmptyBox.config.layout = config.layout;
-      }
-      elements = EmptyBox;
+      elements = buildEmptyBox(config, componentScope);
       break;
     case "card":
       elements = buildCard(config, componentScope);
@@ -135,11 +165,17 @@ const buildUiSchema = (config: any) => {
 
     case "MultipleSelect":
       elements = buildMultiSelect(config, componentScope);
+      buildRule(config);
       break;
     case "LeaderBoard":
       elements = buildLeaderBoard(config);
       break;
     default:
+      schema = {
+        type: "object",
+        properties: {},
+        required: []
+      };
       elements = buildBasicUiSchema(config)
   }
 
@@ -168,6 +204,7 @@ const buildUiSchema = (config: any) => {
       });
     }
   }
+  localStorage.setItem("libSchema", JSON.stringify(schema || {}))
   return elements;
 }
 
@@ -176,34 +213,6 @@ export default buildUiSchema;
 
 
 
-// export const buildSchema = (config: any) => {
-//   const properties = buildProperties(config)
-//   return { properties }
-// }
-// export const buildProperties = (config: any) => {
-//   let properties = {}
-//   switch (config.type) {
-//     case "Array":
-//       properties[config.name] = buildArraySchema(config);
-//       if (config?.elements) {
-//         config.elements.map((e: any, elemInd: number) => {
-//           properties[config.name].items.properties[e.name] = buildProperties(e)
-//         });
-//       }
-//       break;
-//     default:
-//       properties = { "type": "string" }
-//   }
-//   if (config.elements && config.type !== "Array") {
-//     config.elements.map((e) => {
-//       properties = buildProperties(e)
-//     })
-//   }
-//   return properties
-// }
-
-
-
 
 
 

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

@@ -46,6 +46,7 @@ export const APISection = {
       scope: "#/properties/headers",
       layout: 11.5,
       options: {
+        "elementLabelProp": "key",
         detail: {
           type: "HorizontalLayout",
           elements: [
@@ -95,6 +96,7 @@ export const APISection = {
       scope: "#/properties/body",
       layout: 11.5,
       options: {
+        "elementLabelProp": "key",
         detail: {
           type: "HorizontalLayout",
           elements: [

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

@@ -1,10 +1,31 @@
+
 import _ from "lodash";
+const EmptyBox =  {
+  type: "Control",
+  scope: `#/properties/empty`,
+
+  options: {
+    widget: "EmptyBox",
+  },
+  config: {
+    layout: {
+      xs: 11,
+      sm: 11,
+      md: 5.5,
+      lg: 5.5,
+    },
+    main: {
+      
+    },
+  },
+};
 const getArrayControl = (parentScope:string,childScope:string,childLabel?:string,) =>{
   return  {
     type: "Control",
     scope: `#/properties/${parentScope}`,
     layout: 11.5,
     options: {
+      "elementLabelProp": childScope,
       detail: {
         type: "HorizontalLayout",
         elements: [
@@ -187,7 +208,12 @@ if(type === "SpeedoMeter" ){
         { label: "Button With Text", value: "Button" },
         { label: "Button With Icon", value: "IconButton" },
         { label: "Button With Icon and Text", value: "ButtonWithIconAndText" },
-      ]), iconName,size,caption
+      ]), iconName,size,caption,
+      getSelectField("defaultStyle","Default Style",[
+        { label: "Apply Default Style", value: "true" },
+        { label: "No Style", value: "false" },
+      ]),
+      JSON.parse(JSON.stringify(EmptyBox))
     ];
   } else if (type === "Graph") {
     const height = getInputField("height", "Height");

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

@@ -17,9 +17,10 @@ export default  {
       color: "info",
       type: "text",
       startIcon:"",
+      styleDefault:false,
       icon:"",
       onClick: "onClick",
-      size: "large",
+      size: "small",
     },
     style: {
     },

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

@@ -97,14 +97,16 @@ export const CoreSection = {
       scope: "#/properties/layout",
       layout: 11.5,
       options: {
+        "elementLabelProp": "key",
         detail: {
           type: "HorizontalLayout",
+          
           elements: [
             {
               type: "Control",
               scope: "#/properties/key",
               options: {
-                widget: "InputField",
+                widget: "SelectInputField",
               },
               config: {
                 layout: {
@@ -129,7 +131,7 @@ export const CoreSection = {
               scope: "#/properties/value",
 
               options: {
-                widget: "InputField",
+                widget: "MultipleSelect",
               },
               config: {
                 layout: {
@@ -140,6 +142,12 @@ export const CoreSection = {
                 },
                 main: {
                   label: "Value",
+                  options: [
+                    { label: "3", value: "3" },
+                    { label: "5.5", value: "5.5" },
+                    { label: "8", value: "8" },
+                    { label: "12", value: "12" },
+                  ],
                 },
               },
             },

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

@@ -126,6 +126,7 @@ export const LineGraph = {
     widget: "Graph",
   },
   config: {
+    layout:12,
     main: {
       type: "LineGraph",
       header: "Quartely Incentive in Thousand",

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

@@ -5,7 +5,7 @@ export default  {
       widget: "SpeedoMeter",
     },
    config:{
-    layout:{xs:0,sm:12,md:12,lg:12},
+    layout:{xs:12,sm:12,md:11.7,lg:11.7},
     width:350,
     segments:"5",
     main:{

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

@@ -1,11 +1,37 @@
 export const ValidationSection = {
   type: "HorizontalLayout",
   elements: [
+    // {
+    //   type: "Control",
+    //   scope: "#/properties/validationType",
+
+    //   options: {
+    //     widget: "SelectInputField",
+    //   },
+    //   config: {
+    //     layout: {
+    //       xs: 11,
+    //       sm: 11,
+    //       md: 5.5,
+    //       lg: 5.5,
+    //     },
+    //     main: {
+    //       label: "Validation Type",
+    //       options: [
+    //         { value: "String", label: "string" },
+    //         { value: "minLength", label: "Minimum Length" },
+    //         { value: "maxLength", label: "Maximum Length" },
+    //         { value: "pattern", label: "Pattern" },
+    //       ]
+    //     },
+    //   },
+    // },
     {
       type: "Control",
       scope: "#/properties/validation",
       layout: 11.5,
       options: {
+        "elementLabelProp": "validationType",
         detail: {
           type: "HorizontalLayout",
           elements: [
@@ -14,7 +40,7 @@ export const ValidationSection = {
               scope: "#/properties/validationType",
 
               options: {
-                widget: "InputField",
+                widget: "SelectInputField",
               },
               config: {
                 layout: {
@@ -25,51 +51,38 @@ export const ValidationSection = {
                 },
                 main: {
                   label: "Validation Type",
+                  options: [
+                    { value: "required", label: "Required" },
+                    { value: "minLength", label: "Minimum Length" },
+                    { value: "maxLength", label: "Maximum Length" },
+                    { value: "pattern", label: "Pattern" },
+                  ]
                 },
               },
             },
             {
-                type: "Control",
-                scope: "#/properties/validationValue",
-  
-                options: {
-                  widget: "InputField",
+              type: "Control",
+              scope: "#/properties/validationValue",
+
+              options: {
+                widget: "InputField",
+              },
+              config: {
+                layout: {
+                  xs: 11,
+                  sm: 11,
+                  md: 5.5,
+                  lg: 5.5,
                 },
-                config: {
-                  layout: {
-                    xs: 11,
-                    sm: 11,
-                    md: 5.5,
-                    lg: 5.5,
-                  },
-                  main: {
-                    label: "Validation Value",
-                  },
+                main: {
+                  label: "Validation Value",
                 },
-              }
+              },
+            }
           ],
         },
       },
-      
-    },
-]};
 
-// export const ValidationSchema = {
-//   validation: {
-//     type: "array",
-//     items: {
-//       type: "object",
-//       properties: {
-//         componentName: {
-//           type: "string",
-//         },
-//         validationType:{
-//             type: "string",
-//         },
-//         validationValue: {
-//           type: "string",
-//         },
-//       },
-//     },
-//   },
-// };
+    },
+  ]
+};