impaktapps-ui-builder 0.0.297 → 0.0.298

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

@@ -1,40 +1,39 @@
-export const ComponentSchema:any = {
+export const ComponentSchema: any = {
   type: "object",
   properties: {
-    type:{
-    type:"string",
-    oneOf:[
-      { title: "Select", const: "Select" },
-      { title: "Date", const: "Date" },
-      { title: "CheckBox", const: "CheckBox" },
-      { title: "Table", const: "Table" },
-      { title: "Lazy Loading Table", const: "LazyLoadingTable" },
-      { title: "Array", const: "Array" },
-      { title: "Container", const: "WrapperSection" },
-      { title: "Tabs", const: "TabSection" },
-      { title: "Text", const: "Text" },
-      { title: "Text Area", const: "TextArea" },
-      { title: "Button", const: "Button" },
-      { title: "Card", const: "card" },
-      { title: "Radio", const: "Radio" },
-      { title: "Rank", const: "Rank" },
-      { title: "SpeedoMeter", const: "SpeedoMeter" },
-      { title: "ProgressBar", const: "ProgressBar" },
-      { title: "Graph", const: "Graph" },
-      { title: "Label", const: "Box" },
-      { title: "Upload File", const: "UploadFile" },
-      { title: "Download File", const: "DownloadFile" },
-      { title: "Empty Box", const: "EmptyBox" },
-      { title: "ProgressBar Card", const: "ProgressBarCard" },
-      { title: "Rank Card", const: "RankCard" },
-      { title: "Runner Boy Progress Bar", const: "RunnerBoyProgressBar" },
-      { title: "Slider", const: "Slider" },
-      { title: "Timer", const: "Timer" },
-      { title: "MultipleSelect", const: "MultipleSelect" },
-      { title: "LeaderBoard", const: "LeaderBoard" },]
-    },
-    method:{
-      type:"string",
+    type: {
+      type: "string",
+      oneOf: [
+        { title: "Array", const: "Array" },
+        { title: "Button", const: "Button" },
+        { title: "Card", const: "card" },
+        { title: "CheckBox", const: "CheckBox" },
+        { title: "Container", const: "WrapperSection" },
+        { title: "Date", const: "Date" },
+        { title: "Download File", const: "DownloadFile" },
+        { title: "Empty Box", const: "EmptyBox" },
+        { title: "Graph", const: "Graph" },
+        { title: "Label", const: "Box" },
+        { title: "LeaderBoard", const: "LeaderBoard" },
+        { title: "MultipleSelect", const: "MultipleSelect" },
+        { title: "ProgressBar", const: "ProgressBar" },
+        { title: "ProgressBar Card", const: "ProgressBarCard" },
+        { title: "Select", const: "Select" },
+        { title: "Slider", const: "Slider" },
+        { title: "SpeedoMeter", const: "SpeedoMeter" },
+        { title: "Radio", const: "Radio" },
+        { title: "Rank", const: "Rank" },
+        { title: "Rank Card", const: "RankCard" },
+        { title: "Runner Boy Progress Bar", const: "RunnerBoyProgressBar" },
+        { title: "Table", const: "Table" },
+        { title: "Tabs", const: "TabSection" },
+        { title: "Text", const: "Text" },
+        { title: "Text Area", const: "TextArea" },
+        { title: "Timer", const: "Timer" },
+        { title: "Upload File", const: "UploadFile" },]
+    },
+    method: {
+      type: "string",
       oneOf: [
         { title: "Get", const: "get" },
         { title: "Post", const: "post" },
@@ -49,7 +48,7 @@ export const ComponentSchema:any = {
         properties: {
           key: {
             type: "string",
-            oneOf:[
+            oneOf: [
               { title: "Extra Small", const: "xs" },
               { title: "Small", const: "sm" },
               { title: "Medium", const: "md" },
@@ -57,7 +56,8 @@ export const ComponentSchema:any = {
             ],
           },
           value: {
-            type: "string",
+            // type: "string",
+      
           },
         },
       },
@@ -98,7 +98,7 @@ export const ComponentSchema:any = {
       items: {
         type: "object",
         properties: {
-            eventType: {
+          eventType: {
             type: "string",
           },
           configType: {
@@ -115,7 +115,7 @@ export const ComponentSchema:any = {
           label: {
             type: "string",
           },
-         
+
         },
       },
     },
@@ -127,7 +127,7 @@ export const ComponentSchema:any = {
           label: {
             type: "string",
           },
-         
+
         },
       },
     },
@@ -139,7 +139,7 @@ export const ComponentSchema:any = {
           label: {
             type: "string",
           },
-         
+
         },
       },
     },
@@ -150,16 +150,16 @@ export const ComponentSchema:any = {
         properties: {
           componentName: {
             type: "string",
-            
+
           },
-          validationType:{
-              type: "string",
-              oneOf:[
-                { const: "required", title: "Required" },
-                { const: "minLength", title: "Minimum Length" },
-                { const: "maxLength", title: "Maximum Length" },
-                { const: "pattern", title: "Pattern" },
-              ]
+          validationType: {
+            type: "string",
+            oneOf: [
+              { const: "required", title: "Required" },
+              { const: "minLength", title: "Minimum Length" },
+              { const: "maxLength", title: "Maximum Length" },
+              { const: "pattern", title: "Pattern" },
+            ]
           },
           validationValue: {
             type: "string",
@@ -167,31 +167,68 @@ export const ComponentSchema:any = {
         },
       },
     },
-    buttonType:{
-      type:"string",
-      oneOf:[
-        { title: "Button With Text", const: "Button" },
-        { title: "Button With Icon", const: "IconButton" },
-        { title: "Button With Icon and Text", const: "ButtonWithIconAndText" },
+    buttonType: {
+      type: "string",
+      oneOf: [
+        { title: "Button", const: "Button" },
+        { title: "IconButton", const: "IconButton" },
+        { title: "HybridButton", const: "ButtonWithIconAndText" },
       ]
     },
-    defaultStyle:{
-      type:"string",
-      oneOf:[
+    defaultStyle: {
+      type: "string",
+      oneOf: [
         { title: "Apply Default Style", const: "true" },
         { title: "No Style", const: "false" },
       ]
     },
-    graphType:{
-      type:"string",
-      oneOf:[
+    graphType: {
+      type: "string",
+      oneOf: [
         { title: "Bar Graph", const: "BarGraph" },
         { title: "Stack Bar Graph", const: "StackBarGraph" },
         { title: "Line Graph", const: "LineGraph" },
         { title: "Pie Graph", const: "PieGraph" },
         { title: "Horizontal Bar Graph", const: "HorizontalBarGraph" },
       ]
-    }
+    },
+    iconName:{
+      type:"string",
+      oneOf:[
+        { title: "Search Icon", const: "SearchIcon" },
+        { title: "Edit Icon", const: "EditIcon" },
+        { title: "Add Icon", const: "AddIcon" },
+        { title: "Send Icon", const: "SendIcon" },
+        { title: "Approve Icon", const: "ApproveIcon" },
+        { title: "RejectIcon", const: "RejectIcon" },
+        { title: "Back Icon", const: "BackIcon" },
+        { title: "Back Icon Second ", const: "BackIcon2" },
+        { title: "Pending Icon", const: "PendingIcon" },
+        { title: "View Icon", const: "ViewIcon" },
+        { title: "Notification Icon", const: "NotificationIcon" },
+        { title: "Person Icon", const: "PersonIcon" },
+        { title: "Report Icon", const: "ReportIcon" },
+        { title: "Error Icon", const: "ErrorIcon" },
+        { title: "Refresh Icon", const: "RefreshIcon" },
+        { title: "Download Icon", const: "DownloadIcon" },
+        { title: "Exception Icon", const: "ExceptionIcon" },
+      ]
+    },
+    color:{
+      type:"string",
+      oneOf: [
+        { title: "Primary", const: "primary" },
+        { title: "Secondary", const: "secondary" },
+        { title: "Error", const: "error" },
+        { title: "Success", const: "success" },
+        { title: "Info", const: "info" },
+      ]
+    },
+    name: {
+      type: "string",
+    },
+    label: { type: 'string' }
   },
-  
+ 
+  required: ["type", "name", "label"]
 };

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

@@ -101,36 +101,6 @@ export const componentBasicUiSchema: any = {
                 layout: { xs: 12, sm: 12, md: 6, lg: 6 },
                 main: {
                   label: "Type",
-                  options: [
-                    {   label: "Select", value: "Select" },
-                    {   label: "Date", value: "Date" },
-                    {   label: "CheckBox", value: "CheckBox" },
-                    {   label: "Table", value: "Table" },
-                    {   label: "Lazy Loading Table", value: "LazyLoadingTable" },
-                    {   label: "Array", value: "Array" },
-                    {   label: "Container", value: "WrapperSection" },
-                    {   label: "Tabs", value: "TabSection" },
-                    {   label: "Text", value: "Text" },
-                    {   label: "Radio", value: "Radio" },
-                    {   label: "Text Area", value: "TextArea" },
-                    {   label: "Button", value: "Button" },
-                    {   label: "Card", value: "card" },
-                    {   label: "Rank", value: "Rank" },
-                    {   label: "SpeedoMeter", value: "SpeedoMeter" },
-                    {   label: "ProgressBar", value: "ProgressBar" },
-                    {   label: "Graph", value: "Graph" },
-                    {   label: "Label", value: "Box" },
-                    {   label: "Upload File", value: "UploadFile" },
-                    {   label: "Download File", value: "DownloadFile" },
-                    {   label: "Empty Box", value: "EmptyBox" },
-                    {   label: "ProgressBar Card", value: "ProgressBarCard" },
-                    {   label: "Rank Card", value: "RankCard" },
-                    {   label: "Runner Boy Progress Bar", value: "RunnerBoyProgressBar" },
-                    {   label: "Slider", value: "Slider" },
-                    {   label: "Timer", value: "Timer" },
-                    {   label: "MultipleSelect", value: "MultipleSelect" },
-                    {   label: "LeaderBoard", value: "LeaderBoard" }
-              ],
                 },
               },
             },
@@ -232,12 +202,11 @@ export const componentBasicUiSchema: any = {
                         },
                         main: {
                           label: "Value",
-                          options: [
-                            {   label: "3", value: "3" },
-                            {   label: "5.5", value: "5.5" },
-                            {   label: "8", value: "8" },
-                            {   label: "12", value: "12" },
-                          ],
+                          type:"number",
+                          // freeSolo:true,
+                          helperText:'Number should be in range of 0 to 12',
+                          errorMessage:"Number Can't be greater than 12 and can't be less than 0.",
+                         
                         },
                       },
                     },

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

@@ -1,6 +1,14 @@
 export const PageMasterSchema  = {
     type: "object",
     properties: {
+      name:{
+     type:"string",
+     minLength: 6,
+     pattern: '^page_\\w+$'
+      },
+      label:{
+        type:"string",
+      },
       layout: {
         type: "array",
         items: {
@@ -26,4 +34,6 @@ export const PageMasterSchema  = {
           },
         },
       }
-}}
+},
+required:["label","name"]
+}

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

@@ -72,24 +72,8 @@ export const PageMasterUiSchema: any = {
               label: "Name",
               options: [],
               color: "secondary",
-              required: true,
-            },
-          },
-        },
-        {
-          type: "Control",
-          scope: "#/properties/template",
-
-          options: {
-            widget: "SelectInputField",
-          },
-          config: {
-            layout: { xs: 11, sm: 11, md: 5.5, lg: 5.5 },
-            main: {
-              label: "Template",
-              programType: true,
-              options: [{ label: "Basic Template", value: 1 }],
-
+              errorMessage:"Name should be start with 'page_'",
+              helperText:'Name should be start with "page_"',
               required: true,
             },
           },
@@ -110,17 +94,7 @@ export const PageMasterUiSchema: any = {
               required: true,
             },
           },
-        },
-        {
-          type: "Control",
-          scope: "#/properties/proc",
-          config: {
-            layout: { xs: 11, sm: 11, md: 5.5, lg: 5.5 },
-          },
-          options: {
-            widget: "EmptyBox",
-          },
-        },
+        }
       ],
     },
     {
@@ -178,7 +152,7 @@ export const PageMasterUiSchema: any = {
                   styleDefault: true,
                   size: "small",
                   onClick: "onAddClickHandler",
-                  tooltipMessage: "Back",
+                  tooltipMessage: "Add New",
                 },
                 style: {
                   float: "right",
@@ -224,7 +198,7 @@ export const PageMasterUiSchema: any = {
                     icon: "EditIcon",
                     color: "primary",
                     onClick: "Edit_Components",
-                    tooltipMessage: "Reject This Record",
+                    tooltipMessage: "Edit This Record",
                   },
                 },
               },

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

@@ -1,78 +1,81 @@
 export const EventSchema = {
-    type: "object",
-    properties: {
-        headers: {
-    type: "array",
-    items: {
-      type: "object",
-      properties: {
-        headers_key: {
-          type: "string",
-        },
-        headers_value: {
-          type: "string",
+  type: "object",
+  properties: {
+    headers: {
+      type: "array",
+      items: {
+        type: "object",
+        properties: {
+          headers_key: {
+            type: "string",
+          },
+          headers_value: {
+            type: "string",
+          },
         },
       },
     },
-  },
-  method:{
-    type:"string",
-    oneOf: [
-      { title: "Get", const: "get" },
-      { title: "Post", const: "post" },
-      { title: "Delete", const: "delete" },
-      { title: "Put", const: "put" },
-    ]
-  },
-  refreshElements: {
-    type: "array",
-    items: {
-      type: "object",
-      properties: {
-        value: {
-          type: "string",
+    method: {
+      type: "string",
+      oneOf: [
+        { title: "Get", const: "get" },
+        { title: "Post", const: "post" },
+        { title: "Delete", const: "delete" },
+        { title: "Put", const: "put" },
+      ]
+    },
+    refreshElements: {
+      type: "array",
+      items: {
+        type: "object",
+        properties: {
+          value: {
+            type: "string",
+          },
         },
       },
     },
-  },
-  eventType:{
-    type:"string",
-    oneOf:[
-      { title: "Click Event", const: "onClick" },
-      { title: "onStart", const: "onStart" },
-      { title: "Load Event", const: "onLoad" },
-      { title: "Change Event", const: "onChange" },
-      { title: "Success", const: "Success" },
-      { title: "Fail", const: "Fail" }
-    ]
-  },
-  Handler:{
-    type:"string",
-    oneOf:[
-      { title: "Custom", const: "custom" },
-      { title: "Api", const: "api" },
-      { title: "Inbuilt Function", const: "inBuiltFunction" },
-      { title: "Refresh", const: "refresh" },
-    ]
-  },
-  inBuiltFunctionType:{
-  type:"string",
-  oneOf:[
-    { title: "RankProvider", const: "RankProvider" },
-    { title: "Download File", const: "downloadFile" },
-  ]
-  },
-  body: {
-    type: "array",
-    items: {
-      type: "object",
-      properties: {
-        body_key: {
-          type: "string",
-        },
-        body_value: {
-          type: "string",
+    eventType: {
+      type: "string",
+      oneOf: [
+        { title: "Click Event", const: "onClick" },
+        { title: "onStart", const: "onStart" },
+        { title: "Load Event", const: "onLoad" },
+        { title: "Change Event", const: "onChange" },
+        { title: "Success", const: "Success" },
+        { title: "Fail", const: "Fail" }
+      ]
+    },
+    Handler: {
+      type: "string",
+      oneOf: [
+        { title: "Custom", const: "custom" },
+        { title: "Api", const: "api" },
+        { title: "Inbuilt Function", const: "inBuiltFunction" },
+        { title: "Refresh", const: "refresh" },
+      ]
+    },
+    inBuiltFunctionType: {
+      type: "string",
+      oneOf: [
+        { title: "RankProvider", const: "RankProvider" },
+        { title: "Download File", const: "downloadFile" },
+      ]
+    },
+    body: {
+      type: "array",
+      items: {
+        type: "object",
+        properties: {
+          body_key: {
+            type: "string",
+          },
+          body_value: {
+            type: "string",
+          },
         },
       },
-    },
-  }}}
+    }
+  },
+required:["eventType","Handler"]
+}

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

@@ -13,7 +13,6 @@ const sectionLabels = {
   Select: ["Core", "Properties","Value", "style", "Event","Validation"],
   MultipleSelect: ["Core", "Properties","Value", "style", "Event","Validation"],
   Table: ["Core", "Components",  "Properties","style",  "Event","Validation"],
-  LazyLoadingTable:["Core", "Components", "Properties", "style", "Event","Validation"],
   LeaderBoard: ["Core", "Components", "Properties", "style", "Event","Validation"],
   WrapperSection: ["Core", "Components","Properties", "style","Validation"],
   TabSection: ["Core", "Components", "Properties", "style","Validation"],
@@ -26,9 +25,9 @@ const sectionLabels = {
   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"],
+  Slider: ["Core", "Components", "style", "Event","Validation"],
+  Timer: ["Core", "style", "Event","Validation"],
+  Rank: ["Core","style", "Event","Validation"],
   Button: ["Core", "Properties", "style", "Event","Validation"],
   Array:["Core","Components","Validation"],
   Radio:["Core", "Properties", "style", "Event","Validation"],
@@ -76,12 +75,20 @@ export default (store: any, dynamicData: any) => {
     },
     saveHandler: async function () {
       const path = store.searchParams?.get("path");
-      saveFormdataInLocalStorage(store.formData,path)
+      if (_.isEmpty(store.ctx.core.errors)) {
+        saveFormdataInLocalStorage(store.formData,path)
           store.navigate(-1)
           store.setNotify({
             SuccessMessage: "Save Successfully",
             Success: true,
           });
+      } else {
+        store.setValidation("ValidateAndShow");
+         store.setNotify({
+          Fail:true,
+          FailMessage:"Errors on Page"
+        })
+      }
     },
     onChange: function () {
       if (

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

@@ -20,23 +20,31 @@ export default (
      this.refreshPage(formdata.Handler,store)
     },
     refreshPage: (handlerType: any, store: any) => {
-      const uiSchema = _.cloneDeep(EventUiSchema)
+      const uiSchema = _.cloneDeep(EventUiSchema);
+      const schema:any = _.cloneDeep(EventSchema)
       if (handlerType) {
         if (handlerType === "custom") {
           uiSchema.elements[1].elements[0].elements[2] = getTextArea("eventCode", "Write Custom Code", false)
+          schema.required = ["eventType","Handler","eventCode"]
+
         } else if (handlerType === "api") {
           uiSchema.elements[1].elements[0].elements[2] = APISection;
-
+          schema.required = ["eventType","Handler","method","path"]
         } else if (handlerType === "inBuiltFunction") {
           uiSchema.elements[1].elements[0].elements[2] = getSelectField("inBuiltFunctionType", "Function Name", [
             { label: "RankProvider", value: "RankProvider" },
             { label: "Download File", value: "downloadFile" },
           ])
-          uiSchema.elements[1].elements[0].elements[3] = getTextArea("funcParametersCode", "Write Custom Code for Functions Parameter", true, { xs: 12, sm: 12, md: 6 })
+          uiSchema.elements[1].elements[0].elements[3] = getTextArea("funcParametersCode", "Write Custom Code for Functions Parameter", true, { xs: 12, sm: 12, md: 6 });
+          schema.required = ["eventType","Handler","inBuiltFunctionType"]
         } else if (handlerType === "refresh") {
-          uiSchema.elements[1].elements[0].elements[2] = refreshSectionUiSchema
+          uiSchema.elements[1].elements[0].elements[2] = refreshSectionUiSchema;
+          schema.properties.refreshElements.required = ["value"]
+          schema.properties.refreshElements.items.required = ["value"]
+          schema.required = ["eventType","Handler","refreshElements"]
         }
       }
+      store.setSchema(schema)
       store.setUiSchema(uiSchema)
     },