impaktapps-ui-builder 1.0.61 → 1.0.63-alpha.1

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

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

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

@@ -0,0 +1,13 @@
+declare const _default: {
+    type: string;
+    config: {
+        layout: number;
+        main: {
+            rowSpacing: number;
+            divider: boolean;
+        };
+        defaultStyle: boolean;
+    };
+    elements: any[];
+};
+export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "impaktapps-ui-builder",
-    "version": "1.0.61",
+    "version": "1.0.63-alpha.1",
     "scripts": {
         "dev": "vite",
         "build": "tsc && vite build",

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

@@ -10,6 +10,9 @@ export const buildDate = (config:any,componentScope:string)=> {
     if(config.layout){
         dateInputField.config.layout = createLayoutFormat(config.layout)
       }
+    if (config.variant) {
+      dateInputField.config.main.variant = config.variant;
+    }
     return dateInputField;
 }
 export const buildDateTime = (config:any,componentScope:string)=>{
@@ -20,5 +23,8 @@ export const buildDateTime = (config:any,componentScope:string)=>{
   if(config.layout){
     dateTimeInputField.config.layout = createLayoutFormat(config.layout)
     }
+  if (config.variant) {
+    dateTimeInputField.config.main.variant = config.variant;
+  }
   return dateTimeInputField;
 }

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

@@ -0,0 +1,21 @@
+import { createLayoutFormat } from "./buildConfig";
+import horizontalLayout from "./uischema/horizontalLayout";
+import _ from "lodash";
+
+export const buildHorizontalLayout = (config, componentScope) => {
+  const horizontal: any = _.cloneDeep(horizontalLayout);
+  horizontal.scope = componentScope;
+//   horizontal.config.main.label = config.label;
+//   horizontal.config.main.divider = config.divider === "YES" ? true : false;
+//   horizontal.config.main.isAccordion = config.isAccordion === "No" ? false : true;
+//   if(config.defaultStyle){
+//   horizontal.config.defaultStyle = config.defaultStyle ==="YES" ? true : false;
+//   }
+//   if (config.style) {
+//     wrapper.config.style = JSON.parse(config.style)
+//   }
+  if (config.layout) {
+    horizontal.config.layout = createLayoutFormat(config.layout, config.type)
+  }
+  return horizontal;
+}

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

@@ -37,7 +37,7 @@ export const buildPopUp = (config,componentScope) =>{
       popup.config.layout = createLayoutFormat(config.layout, config.type)
     }
     if (config.style) {
-      PopUP.config.style = JSON.parse(config.style)
+      popup.config.style = JSON.parse(config.style)
   }
     return popup;
 }

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

@@ -40,6 +40,7 @@ import { buildDataGrid } from "./buildDataGrid";
 import { buildInputSlider } from "./buildInputSlider";
 import { buildTreeMap } from "./buildTreeMap";
 import { buildThoughtOfTheDay } from "./buildThoughtOfTheDay";
+import { buildHorizontalLayout } from "./buildHorizontalLayout";
 export let schema = {
   type: "object",
   properties: {},
@@ -206,6 +207,9 @@ const buildUiSchema = (config: any, store?: any) => {
     case "WrapperSection":
       elements = buildWrapperSection(config, componentScope);
       break;
+    case "HorizontalLayout":
+      elements = buildHorizontalLayout(config, componentScope);
+      break;
     case "Text":
       elements = buildTextField(config, componentScope);
       break;

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

@@ -514,6 +514,26 @@ export const buildPropertiesSection = function (type: String) {
         emptyBox("MultipleSelectEmpty2")
       ]
       break;
+    case "Date": 
+      uiSchema.elements = [
+        getSelectField("variant", "Variant", [
+          { label: "Outlined", value: "outlined" },
+          { label: "Filled", value: "filled" },
+          { label: "Standard", value: "standard" },
+        ]),
+        emptyBox("DateEmpty1", { xs: 6, sm: 6, md: 8, lg: 9 }),
+      ]
+      break;
+    case "DateTime": 
+      uiSchema.elements = [
+        getSelectField("variant", "Variant", [
+          { label: "Outlined", value: "outlined" },
+          { label: "Filled", value: "filled" },
+          { label: "Standard", value: "standard" },
+        ]),
+        emptyBox("DateTimeEmpty1", { xs: 6, sm: 6, md: 8, lg: 9 }),
+      ]
+      break;
     case "Thought":
       uiSchema.elements = [
         getTextArea("thought", "Today's thought", false),

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

@@ -0,0 +1,11 @@
+export default {
+    type: "HorizontalLayout",
+    config: {
+      layout: 12,
+      main: {
+        rowSpacing: 3,
+        divider: false,
+      },
+      defaultStyle: true,
+    },
+    elements: []}

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

@@ -10,6 +10,7 @@ export const ComponentSchema: any = {
         { title: "Data Card", const: "card" },
         { title: "Check Box", const: "CheckBox" },
         { title: "Container", const: "WrapperSection" },
+        { title: "Tab Container", const: "HorizontalLayout" },
         { title: "Data Grid", const: "DataGrid" },
         { title: "Date", const: "Date" },
         { title: "Time Stamp", const: "DateTime" },

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

@@ -50,11 +50,26 @@ export const PageMasterUiSchema: any = (theme) => {
               },
             },
           },
+          {
+            type: "Control",
+            scope: "#/properties/hasBackIcon",
+
+            options: {
+              widget: "RadioInputField",
+            },
+            config: {
+              layout: { xs: 12, sm: 6, md: 4, lg: 3 },
+              main: {
+                label: "Back Icon",
+                options: [{label: "Yes",const: "YES"}, {label: "No",const: "NO"}],
+              },
+            },
+          },
           {
             type: "Control",
             scope: "#/properties/EmptyBox",
             config: {
-              layout: { xs: 0, sm: 0, md: 4, lg: 6 },
+              layout: { xs: 0, sm: 6, md: 0, lg: 3 },
             },
             options: {
               widget: "EmptyBox",

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

@@ -39,7 +39,9 @@ const sectionLabels = {
   InputSlider: ["Core", "Properties", "Events", "Style", "Validation"],
   TreeMap: ["Core", "Components", "Properties", "Events", "Style"],
   ColumnGroup: ["Core", "Components"],
-  Thought: ["Core", "Properties", "Events", "Style", "Validation"]
+  Thought: ["Core", "Properties", "Events", "Style", "Validation"],
+  Date: ["Core", "Properties", "Events", "Style", "Validation"],
+  DateTime: ["Core", "Properties", "Events", "Style", "Validation"]
 }
 
 export function refreshPage(type: string, store: any) {

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

@@ -80,116 +80,10 @@ export default (funcParams: funcParamsProps) => {
       const config = pageData?.config;
       const uiSchema = pageData?.uiSchema;
       const event = new CustomEvent('pageNameChanged', {
-        detail: { pageName: config.label, hasBackIcon: true }
+        detail: { pageName: config.label, hasBackIcon: config.hasBackIcon === "NO" ? false : true }
       });
       window.dispatchEvent(event)
       const theme = funcParams?.store?.theme?.myTheme;
-      uiSchema.elements.push(
-        {
-          type: "HorizontalLayout",
-          config: {
-            main: {
-              direction: "row",
-            },
-            style: {
-              flexDirection: "row",
-              position: "absolute",
-              bottom: 0,
-              height: "fit-content",
-              overflow: "hidden",
-              zIndex: 1000,
-              width: "inherit",
-            },
-          },
-          elements: [
-            {
-              type: "Control",
-              scope: "#/properties/FooterText",
-              options: {
-                widget: "Box",
-              },
-              config: {
-                main: {
-                  heading: "Copywriter@ACT21.IO",
-                },
-                style: {
-                  color: theme?.palette?.text?.disabled || "#AFAFAF",
-                  fontSize: "11px",
-                  textAlign: "center",
-                  lineHeight: 2,
-                  width: "fit-content",
-                  left: "50%",
-                  position: "relative",
-                  margin: 0,
-                  flexGrow: 1,
-                  height: 0,
-                  transform: "translate(-50%, 0%)",
-                },
-              },
-            },
-            {
-              type: "Control",
-              scope: "#/properties/FooterBackIcon",
-              options: {
-                widget: "Box",
-              },
-              config: {
-                main: {
-                  iconName: "PrevIcon",
-                  onClick: "backHandler",
-                  width: "fit-content",
-                },
-                style: {
-                  fill: theme?.palette?.primary?.main,
-                  width: 20,
-                  height: 0,
-                  top: 0,
-                  right: { xs: "12px", sm: "84px" },
-                  position: "absolute",
-                  fontSize: "12px",
-                  cursor: "pointer",
-                  ":hover": {
-                    fill: theme?.palette?.primary?.dark,
-                  },
-                  marginRight: "20px",
-                },
-              },
-            },
-            {
-              type: "Control",
-              scope: "#/properties/FooterBackHandlerText",
-              options: {
-                widget: "Box",
-              },
-              config: {
-                main: {
-                  heading: "Previous Page",
-                  onClick: "backHandler",
-                },
-                style: {
-                  display: { xs: "none", sm: "flex" },
-                  textAlign: "left",
-                  lineHeight: 1,
-                  height: 0,
-                  width: "fit-content",
-                  color: theme?.palette?.primary?.main,
-                  fontSize: "12px",
-                  cursor: "pointer",
-                  marginLeft: "2px",
-
-                  top: 3,
-                  right: "12px",
-                  position: "absolute",
-                  ":hover": {
-                    color: theme?.palette?.primary?.dark,
-                  },
-                  marginRight: "4px",
-                },
-              },
-            },
-          ],
-        }
-      );
       const schema = pageData?.schema ?? { type: "object", properties: {} };
       eventGroups = extractEvents(config);
       executeEventsParameters = {