impaktapps-ui-builder 0.0.101-alpha.11 → 0.0.101-alpha.13

package/dist/impaktapps-ui-builder.es.js

@@ -6644,8 +6644,6 @@ const componentBasicUiSchema = (theme) => {
                   layout: { xs: 12, sm: 6, md: 4, lg: 3 },
                   main: {
                     label: "Component ID",
-                    options: [],
-                    color: "secondary",
                     required: true
                   }
                 }
@@ -6746,48 +6744,58 @@ const componentBasicUiSchema = (theme) => {
         ]
       },
       {
-        type: "Control",
-        scope: "#/properties/btn",
-        options: {
-          widget: "Button"
-        },
+        type: "WrapperLayout",
         config: {
-          layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
           main: {
-            name: "Ok",
-            variant: "contained",
-            type: "text",
-            onClick: "okHandler",
-            size: "medium"
+            gap: "8px"
           }
-        }
-      },
-      {
-        type: "Control",
-        scope: "#/properties/btnSubmit",
-        options: {
-          widget: "Button"
         },
-        config: {
-          layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
-          main: {
-            name: "Save & Exit",
-            variant: "contained",
-            type: "text",
-            onClick: "saveHandler",
-            size: "medium"
+        elements: [
+          {
+            type: "Control",
+            scope: "#/properties/btn",
+            options: {
+              widget: "Button"
+            },
+            config: {
+              layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
+              main: {
+                name: "Ok",
+                variant: "contained",
+                type: "text",
+                onClick: "okHandler",
+                size: "medium"
+              }
+            }
+          },
+          {
+            type: "Control",
+            scope: "#/properties/btnSubmit",
+            options: {
+              widget: "Button"
+            },
+            config: {
+              layout: { xs: 4, sm: 2.5, md: 2, lg: 1.5 },
+              main: {
+                name: "Save & Exit",
+                variant: "contained",
+                type: "text",
+                onClick: "saveHandler",
+                size: "medium"
+              }
+            }
+          },
+          {
+            type: "Control",
+            scope: "#/properties/EmptyBox",
+            config: {
+              layout: { xs: 4, sm: 7, md: 8, lg: 9 }
+            },
+            options: {
+              widget: "EmptyBox"
+            }
           }
-        }
-      },
-      {
-        type: "Control",
-        scope: "#/properties/EmptyBox",
-        config: {
-          layout: { xs: 4, sm: 7, md: 8, lg: 9 }
-        },
-        options: {
-          widget: "EmptyBox"
-        }
+        ]
       },
       {
         type: "Control",
@@ -7086,7 +7094,13 @@ const componentBasicUiSchema = (theme) => {
   return uiSchema;
 };
 const CoreSection = {
-  type: "HorizontalLayout",
+  type: "WrapperLayout",
+  config: {
+    main: {
+      label: " ",
+      gap: "8px"
+    }
+  },
   elements: [
     {
       type: "Control",
@@ -7095,7 +7109,7 @@ const CoreSection = {
         widget: "SelectInputField"
       },
       config: {
-        layout: { xs: 6, sm: 6, md: 4, lg: 4 },
+        layout: { xs: 6, sm: 6, md: 4, lg: 3 },
         main: {
           label: "Type",
           type: "text"
@@ -7104,40 +7118,39 @@ const CoreSection = {
     },
     {
       type: "Control",
-      scope: "#/properties/name",
-      options: {
-        widget: "InputField"
-      },
+      scope: "#/properties/proc",
       config: {
-        layout: { xs: 6, sm: 6, md: 4, lg: 4 },
-        main: {
-          label: "Name"
-        }
+        layout: { xs: 6, sm: 0, md: 0, lg: 0 }
+      },
+      options: {
+        widget: "EmptyBox"
       }
     },
     {
       type: "Control",
-      scope: "#/properties/label",
+      scope: "#/properties/name",
       options: {
         widget: "InputField"
       },
       config: {
-        layout: { xs: 6, sm: 6, md: 4, lg: 4 },
+        layout: { xs: 12, sm: 6, md: 4, lg: 3 },
         main: {
-          label: "Label"
+          label: "Component ID",
+          required: true
         }
       }
     },
     {
       type: "Control",
-      scope: "#/properties/columnFormat",
+      scope: "#/properties/label",
       options: {
-        widget: "SelectInputField"
+        widget: "InputField"
       },
       config: {
-        layout: { xs: 6, sm: 6, md: 4, lg: 4 },
+        layout: { xs: 6, sm: 6, md: 4, lg: 3 },
         main: {
-          label: "Column Format"
+          label: "Label",
+          required: true
         }
       }
     },
@@ -7145,17 +7158,7 @@ const CoreSection = {
       type: "Control",
       scope: "#/properties/proc",
       config: {
-        layout: { xs: 0, sm: 0, md: 4, lg: 4 }
-      },
-      options: {
-        widget: "EmptyBox"
-      }
-    },
-    {
-      type: "Control",
-      scope: "#/properties/proc",
-      config: {
-        layout: { xs: 0, sm: 0, md: 4, lg: 4 }
+        layout: { xs: 6, sm: 6, md: 0, lg: 3 }
       },
       options: {
         widget: "EmptyBox"
@@ -7164,54 +7167,67 @@ const CoreSection = {
     {
       type: "Control",
       scope: "#/properties/layout",
-      layout: 12,
       options: {
-        "elementLabelProp": "key",
-        detail: {
-          type: "HorizontalLayout",
-          elements: [
-            {
-              type: "Control",
-              scope: "#/properties/key",
-              options: {
-                widget: "SelectInputField"
-              },
-              config: {
-                layout: { xs: 6, sm: 6, md: 4, lg: 4 },
-                main: {
-                  label: "Screen Size"
-                }
-              }
-            },
-            {
-              type: "Control",
-              scope: "#/properties/value",
-              options: {
-                widget: "InputField"
-              },
-              config: {
-                layout: { xs: 6, sm: 6, md: 4, lg: 4 },
-                main: {
-                  label: "Value",
-                  type: "number",
-                  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."
-                }
-              }
-            },
-            {
-              type: "Control",
-              scope: "#/properties/proc",
-              config: {
-                layout: { xs: 0, sm: 0, md: 4, lg: 4 }
-              },
-              options: {
-                widget: "EmptyBox"
-              }
+        widget: "Array"
+      },
+      config: {
+        layout: 12,
+        main: {
+          label: "Layout",
+          childElementLabel: "Layout"
+        },
+        style: {
+          marginLeft: "-24px",
+          marginBottom: "24px !important",
+          labelStyle: {
+            marginLeft: "24px"
+          },
+          detailsStyle: {
+            marginLeft: "24px"
+          }
+        }
+      },
+      elements: [
+        {
+          type: "Control",
+          scope: "#/properties/key",
+          options: {
+            widget: "SelectInputField"
+          },
+          config: {
+            layout: { xs: 6, sm: 6, md: 4, lg: 4 },
+            main: {
+              label: "Screen Size"
             }
-          ]
+          }
+        },
+        {
+          type: "Control",
+          scope: "#/properties/value",
+          options: {
+            widget: "InputField"
+          },
+          config: {
+            layout: { xs: 6, sm: 6, md: 4, lg: 4 },
+            main: {
+              label: "Value",
+              type: "number",
+              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."
+            }
+          }
+        },
+        {
+          type: "Control",
+          scope: "#/properties/proc",
+          config: {
+            layout: { xs: 0, sm: 0, md: 4, lg: 4 }
+          },
+          options: {
+            widget: "EmptyBox"
+          }
         }
-      }
+      ]
     }
   ]
 };