impaktapps-ui-builder 0.0.382-alpha.44 → 0.0.382-alpha.550

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

@@ -15,10 +15,10 @@ export const buildStackbarGraph = (config:any,componentScope:string) => {
     if (config.barColor) {
       barGraph.config.barStyle.color = config.barColor;
     }
-    // if (config.containerBackground) {
-    //   barGraph.config.containerStyle.background =
-    //     config.containerBackground;
-    // }
+    if (config.containerBackground) {
+      barGraph.config.containerStyle.background =
+        config.containerBackground;
+    }
     if (config.height) {
       barGraph.config.style.containerStyle.height = config.height;
     }
@@ -28,6 +28,6 @@ export const buildStackbarGraph = (config:any,componentScope:string) => {
     if (config.leftLabel) {
       barGraph.config.main.leftLabel = config.leftLabel;
     }
-    // barGraph.scope = componentScope;
+    barGraph.scope = componentScope;
     return barGraph;
 } 

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

@@ -4,10 +4,8 @@ import _ from "lodash";
 
 export const buildWrapperSection = (config,componentScope) =>{
     const wrapper: any = _.cloneDeep(WrapperSection);
-    wrapper.scope = componentScope;
     wrapper.config.main.label = config.label;
     wrapper.config.main.divider = config.divider === "YES" ? true : false;
-    wrapper.config.main.isAccordion = config.isAccordion==="YES"?true:false;
     if (config.style) {
         wrapper.config.style = JSON.parse(config.style)
       }
@@ -15,4 +13,4 @@ export const buildWrapperSection = (config,componentScope) =>{
         wrapper.config.layout = createLayoutFormat(config.layout)
       }
     return wrapper;
-}
+}

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

@@ -11,7 +11,7 @@ export const APISection = {
         widget: "SelectInputField",
       },
       config: {
-        layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+        layout: { xs: 11, sm: 11, md: 5.5, lg: 5.5 },
         main: {
           label: "Method",
           type: "text",
@@ -26,7 +26,7 @@ export const APISection = {
         widget: "InputField",
       },
       config: {
-        layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+        layout: { xs: 11, sm: 11, md: 5.5, lg: 5.5 },
         main: {
           label: "Path",
           type: "text",
@@ -35,28 +35,6 @@ export const APISection = {
         },
       },
     },
-    {
-      type: "Control",
-      scope: "#/properties/emptyBox",
-
-      options: {
-        widget: "EmptyBox",
-      },
-      config: {
-        layout: { xs: 0, sm: 4, md: 4, lg: 4 },
-      },
-    },
-    {
-      type: "Control",
-      scope: "#/properties/emptyBox",
-
-      options: {
-        widget: "EmptyBox",
-      },
-      config: {
-        layout: { xs: 0, sm: 4, md: 4, lg: 4 },
-      },
-    },
     {
       type: "Control",
       scope: "#/properties/headers",
@@ -73,7 +51,12 @@ export const APISection = {
                 widget: "InputField",
               },
               config: {
-                layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+                layout: {
+                  xs: 11,
+                  sm: 11,
+                  md: 5.5,
+                  lg: 5.5,
+                },
                 main: {
                   label: "Key",
                 },
@@ -87,23 +70,17 @@ export const APISection = {
                 widget: "InputField",
               },
               config: {
-                layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+                layout: {
+                  xs: 11,
+                  sm: 11,
+                  md: 5.5,
+                  lg: 5.5,
+                },
                 main: {
                   label: "Value",
                 },
               },
             },
-            {
-              type: "Control",
-              scope: "#/properties/emptyBox",
-        
-              options: {
-                widget: "EmptyBox",
-              },
-              config: {
-                layout: { xs: 0, sm: 4, md: 4, lg: 4 },
-              },
-            },
           ],
         },
       },
@@ -124,7 +101,12 @@ export const APISection = {
                 widget: "InputField",
               },
               config: {
-                layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+                layout: {
+                  xs: 11,
+                  sm: 11,
+                  md: 5.5,
+                  lg: 5.5,
+                },
                 main: {
                   label: "Key",
                 },
@@ -138,23 +120,18 @@ export const APISection = {
                 widget: "InputField",
               },
               config: {
-                layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+                layout: {
+                  xs: 11,
+                  sm: 11,
+                  md: 5.5,
+                  lg: 5.5,
+                },
                 main: {
                   label: "Value",
                 },
               },
             },
-            {
-              type: "Control",
-              scope: "#/properties/emptyBox",
-        
-              options: {
-                widget: "EmptyBox",
-              },
-              config: {
-                layout: { xs: 0, sm: 4, md: 4, lg: 4 },
-              },
-            },
+           
           ],
         },
       },

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

@@ -8,7 +8,12 @@ const EmptyBox = {
     widget: "EmptyBox",
   },
   config: {
-    layout: { xs: 0, sm: 4, md: 4, lg: 4 },
+    layout: {
+      xs: 11,
+      sm: 11,
+      md: 5.5,
+      lg: 5.5,
+    },
     main: {
 
     },
@@ -29,7 +34,12 @@ const cardLayout =  {
             widget: "SelectInputField",
           },
           config: {
-            layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+            layout: {
+              xs: 11,
+              sm: 11,
+              md: 5.5,
+              lg: 5.5,
+            },
             main: {
               label: "Screen Size",
             
@@ -44,7 +54,12 @@ const cardLayout =  {
             widget: "InputField",
           },
           config: {
-            layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+            layout: {
+              xs: 11,
+              sm: 11,
+              md: 5.5,
+              lg: 5.5,
+            },
             main: {
               label: "Value",
               type:"number",
@@ -55,7 +70,6 @@ const cardLayout =  {
             },
           },
         },
-        EmptyBox,
       ],
     },
   },
@@ -78,13 +92,17 @@ const getArrayControl = (parentScope: string, childScope: string, childLabel?: s
               widget: "InputField",
             },
             config: {
-              layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+              layout: {
+                xs: 11,
+                sm: 11,
+                md: 5.5,
+                lg: 5.5,
+              },
               main: {
                 label: childLabel || "Labels for Tab",
               },
             },
           },
-          EmptyBox,
           EmptyBox
         ],
       },
@@ -100,7 +118,12 @@ sizeHolder.options.detail.elements[1] = {
     widget: "InputField",
   },
   config: {
-    layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+    layout: {
+      xs: 11,
+      sm: 11,
+      md: 5.5,
+      lg: 5.5,
+    },
     main: {
       label: "Size",
     },
@@ -115,7 +138,12 @@ const getInputField = (scope: String, label: String) => {
       widget: "InputField",
     },
     config: {
-      layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+      layout: {
+        xs: 11,
+        sm: 11,
+        md: 5.5,
+        lg: 5.5,
+      },
       main: {
         label: label,
       },
@@ -132,7 +160,12 @@ const getRadioInputField = (scope: String, label: String, options: string[]) =>
       widget: "RadioInputField",
     },
     config: {
-      layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+      layout: {
+        xs: 11,
+        sm: 11,
+        md: 5.5,
+        lg: 5.5,
+      },
       main: {
         label: label,
 
@@ -183,7 +216,7 @@ export const getSelectField = (scope: string, label: string, options: { label: s
       widget: "SelectInputField",
     },
     config: {
-      layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+      layout: { xs: 11, sm: 11, md: 5.5, lg: 5.5 },
       main: {
         label: label,
         type: "text",
@@ -208,8 +241,6 @@ export const buildPropertiesSection = function (type: String) {
         getInputField("elevation", "Card Elevation"),
         getInputField("height", "Grid height"),
         getInputField("justifyContent", "justifyContent"),
-        EmptyBox,
-        EmptyBox,
         cardLayout,
       ]
       break;
@@ -223,7 +254,7 @@ export const buildPropertiesSection = function (type: String) {
           { label: "Horizontal", value: "horizontal" },
           { label: "Vertical", value: "vertical" },
         ]),
-        EmptyBox,
+
         getArrayControl("sectionLabels", "label")
 
       ]
@@ -240,15 +271,13 @@ export const buildPropertiesSection = function (type: String) {
       uiSchema.elements = [
         getInputField("placeholder", "Placeholder"),
         EmptyBox,
-        EmptyBox,
         getArrayControl("InputFormatingAndMasking", "formatElement", "Format Element")
       ]
       break;
     case "TextArea":
       uiSchema.elements = [
         getInputField("placeholder", "Placeholder"),
-        EmptyBox,
-        EmptyBox]
+        EmptyBox,]
       break;
 
     case "SpeedoMeter":
@@ -257,8 +286,7 @@ export const buildPropertiesSection = function (type: String) {
         getInputField("heading", "Container Heading"),
         getInputField("heading", "Container Heading"),
         getInputField("speedoCaption", "Speedometer Caption"),
-        getInputField("width", "Speedometer Width"),
-        EmptyBox
+        getInputField("width", "Speedometer Width")
       ]
       break;
     case "RankCard":
@@ -266,10 +294,7 @@ export const buildPropertiesSection = function (type: String) {
         getInputField("rank", "Rank"),
         getInputField("image", "Image Url"),
         getInputField("title", "Card Title"),
-        getInputField("description", "Card Description"),
-        EmptyBox,
-        EmptyBox
-      ];
+        getInputField("description", "Card Description")];
       break;
     case "LeaderBoard":
       uiSchema.elements = [
@@ -277,8 +302,6 @@ export const buildPropertiesSection = function (type: String) {
         getInputField("firstImage", "First Image url"),
         getInputField("secondImage", "Second Image url"),
         getInputField("thirdImage", "Third Image url"),
-        EmptyBox,
-        EmptyBox,
         getTextArea("functionCode", "Write Compare Code", false)
       ];
       break;
@@ -292,9 +315,7 @@ export const buildPropertiesSection = function (type: String) {
         getInputField("heading", "Heading"),
         getInputField("bottomLabel_1", "First BottomLabel"),
         getInputField("bottomLabel_2", "Second BottomLabel"),
-        getInputField("bottomLabel_3", "Third BottomLabel"),
-        EmptyBox,
-        EmptyBox
+        getInputField("bottomLabel_3", "Third BottomLabel")
       ];
       break;
     case "card":
@@ -337,7 +358,7 @@ export const buildPropertiesSection = function (type: String) {
       ];
       break;
     case "WrapperSection":
-      uiSchema.elements = [getRadioInputField("divider", "Divider", ["YES", "No"]), getRadioInputField("isAccordion", "Accordion", ["YES", "No"]), EmptyBox]
+      uiSchema.elements = [getRadioInputField("divider", "Divider", ["YES", "No"]), EmptyBox]
       break;
 
     case "TabSection":
@@ -367,13 +388,11 @@ export const buildPropertiesSection = function (type: String) {
       uiSchema.elements = [
         getRadioInputField("lazyLoading", "Lazy Loading", ["YES", "NO"]),
         getRadioInputField("freeSolo", "FreeSolo", ["YES", "NO"]),
-        EmptyBox
       ]
       break;
     case "MultipleSelect":
       uiSchema.elements = [
         getRadioInputField("lazyLoading", "Lazy Loading", ["YES", "NO"]),
-        EmptyBox,
         EmptyBox
       ]
       break;

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

@@ -4,15 +4,16 @@ export default {
       main: {
         rowSpacing: 0.5,
       },
-      
-      componentsBoxStyle: {
-        position : "relative",
-        color: "white",
-        height: {xs:"120px",md:"160px"},
-        width: "100%",
-        textAlign: "left",
-        background: "#3f51b5",
-        borderRadius: "20px",
+      style: {
+        wrapperStyle: {
+          position : "relative",
+          color: "white",
+          height: {xs:"120px",md:"160px"},
+          width: "100%",
+          textAlign: "left",
+          background: "#3f51b5",
+          borderRadius: "20px",
+        },
       },
    layout: { xs: 12, sm: 12,md: 6,lg: 6, },},
     elements: [

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

@@ -9,7 +9,7 @@ export const CoreSection = {
         widget: "SelectInputField",
       },
       config: {
-        layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+        layout: { xs: 12, sm: 12, md: 6, lg: 6 },
         main: {
           label: "Type",
           type: "text",
@@ -24,7 +24,12 @@ export const CoreSection = {
         widget: "InputField",
       },
       config: {
-        layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+        layout: {
+          xs: 12,
+          sm: 12,
+          md: 6,
+          lg: 6,
+        },
         main: {
           label: "Name",
         },
@@ -38,16 +43,31 @@ export const CoreSection = {
         widget: "InputField",
       },
       config: {
-        layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+        layout: {
+          xs: 12,
+          sm: 12,
+          md: 6,
+          lg: 6,
+        },
         main: {
           label: "Label",
         },
       },
     },
+    {
+      type: "Control",
+      scope: "#/properties/proc",
+      config: {
+        layout: { xs: 11, sm: 11, md: 6, lg: 6 },
+      },
+      options: {
+        widget: "EmptyBox",
+      },
+    },
     {
       type: "Control",
       scope: "#/properties/layout",
-      layout: 12,
+      layout: 11.5,
       options: {
         "elementLabelProp": "key",
         detail: {
@@ -61,7 +81,12 @@ export const CoreSection = {
                 widget: "SelectInputField",
               },
               config: {
-                layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+                layout: {
+                  xs: 11,
+                  sm: 11,
+                  md: 5.5,
+                  lg: 5.5,
+                },
                 main: {
                   label: "Screen Size",
 
@@ -76,7 +101,12 @@ export const CoreSection = {
                 widget: "InputField",
               },
               config: {
-                layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+                layout: {
+                  xs: 11,
+                  sm: 11,
+                  md: 5.5,
+                  lg: 5.5,
+                },
                 main: {
                   label: "Value",
                   type:"number",
@@ -86,16 +116,6 @@ export const CoreSection = {
                 },
               },
             },
-            {
-              type: 'Control',
-              scope: '#/properties/emptyBox',
-              options: {
-                widget: "EmptyBox"
-              },
-              config: {
-                layout: {xs: 0, sm: 4}
-              }
-            }
           ],
         },
       },

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

@@ -6,7 +6,12 @@ export default {
   },
 
   config: {
-    layout: { xs: 11, sm: 4, md: 4, lg: 4 },
+    layout: {
+      xs: 11,
+      sm: 11,
+      md: 5.5,
+      lg: 5.5,
+    },
     main: {
       label: "",
       type: "date",

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

@@ -6,7 +6,7 @@ export default {
   },
 
   config: {
-    layout: { xs: 0, sm: 4, md: 4, lg: 4 },
+    layout:{xs:12,sm:12,md:5.5,lg:5.5},
     main: {},
     style:{}
   },