impaktapps-ui-builder 1.0.157 → 1.0.160

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

@@ -6258,7 +6258,6 @@ const ComponentSchema = {
         { title: "Timer", const: "Timer" },
         { title: "Upload", const: "UploadFile" },
         { title: "Tree ", const: "TreeMap" },
-        { title: "SegmentChart ", const: "SegmentChart" },
         { title: "Column Group", const: "ColumnGroup" },
         { title: "Thought of the day", const: "Thought" }
       ]
@@ -7961,9 +7960,8 @@ const buildPropertiesSection = function(type) {
         getInputField("bottomLabel_1", "First BottomLabel"),
         getInputField("bottomLabel_2", "Second BottomLabel"),
         getInputField("bottomLabel_3", "Third BottomLabel"),
-        getInputField("size", "Size"),
-        getRadioInputField("variant", "Variant", ["circular", "horizontal"]),
-        getArrayControl("pieArcColors", "color", "Color")
+        emptyBox$1("ProgressBarCardEmpty1"),
+        emptyBox$1("ProgressBarCardEmpty2")
       ];
       break;
     case "card":
@@ -8017,7 +8015,6 @@ const buildPropertiesSection = function(type) {
         getRadioInputField("isAccordion", "Accordion", ["YES", "No"]),
         getRadioInputField("defaultStyle", "Default Style", ["YES", "No"]),
         getInputField("rowSpacing", "Row Spacing"),
-        getRadioInputField("defaultClosed", "Default Closed", ["YES", "No"]),
         emptyBox$1("WrapperSectionEmpty1", { xs: 6, sm: 0, md: 4, lg: 4 }),
         emptyBox$1("WrapperSectionEmpty2")
       ];
@@ -8594,24 +8591,23 @@ function okHandler(store2) {
 const sectionLabels = {
   Select: ["Core", "Properties", "Value", "Events", "Style", "Validation"],
   MultipleSelect: ["Core", "Properties", "Value", "Events", "Style", "Validation"],
-  Table: ["Core", "Components", "Properties", "Events", "Style"],
-  LeaderBoard: ["Core", "Components", "Properties", "Events", "Style"],
-  WrapperSection: ["Core", "Components", "Properties", "Style"],
-  HorizontalLayout: ["Core", "Components", "Properties", "Style"],
+  Table: ["Core", "Components", "Properties", "Events", "Style", "Validation"],
+  LeaderBoard: ["Core", "Components", "Properties", "Events", "Style", "Validation"],
+  WrapperSection: ["Core", "Components", "Properties", "Style", "Validation"],
+  HorizontalLayout: ["Core", "Components", "Properties", "Style", "Validation"],
   TabSection: ["Core", "Components", "Properties", "Style", "Validation"],
-  SpeedoMeter: ["Core", "Properties", "Events", "Style"],
+  SpeedoMeter: ["Core", "Properties", "Events", "Style", "Validation"],
   card: ["Core", "Properties", "Events", "Style", "Validation"],
   UploadFile: ["Core", "Events", "Style", "Validation"],
   Graph: ["Core", "Properties", "Events", "Style", "Validation"],
   DownloadFile: ["Core", "Events", "Style", "Validation"],
   Box: ["Core", "Properties", "Events", "Style", "Validation"],
   Properties: ["Core", "Properties", "Events", "Style", "Validation"],
-  ProgressBarCard: ["Core", "Properties", "Events", "Style"],
-  ProgressBar: ["Core", "Properties", "Events", "Style"],
-  RankCard: ["Core", "Properties", "Events", "Style"],
+  ProgressBarCard: ["Core", "Properties", "Events", "Style", "Validation"],
+  RankCard: ["Core", "Properties", "Events", "Style", "Validation"],
   Slider: ["Core", "Components", "Events", "Style", "Validation"],
-  Timer: ["Core", "Events", "Style"],
-  Rank: ["Core", "Events", "Style"],
+  Timer: ["Core", "Events", "Style", "Validation"],
+  Rank: ["Core", "Events", "Style", "Validation"],
   Button: ["Core", "Properties", "Events", "Style", "Validation"],
   Array: ["Core", "Components", "Properties", "Events", "Validation"],
   Radio: ["Core", "Properties", "Events", "Style", "Validation"],
@@ -8623,7 +8619,7 @@ const sectionLabels = {
   InputSlider: ["Core", "Properties", "Events", "Style", "Validation"],
   TreeMap: ["Core", "Components", "Properties", "Events", "Style"],
   ColumnGroup: ["Core", "Components"],
-  Thought: ["Core", "Properties", "Events", "Style"],
+  Thought: ["Core", "Properties", "Events", "Style", "Validation"],
   Date: ["Core", "Properties", "Events", "Style", "Validation"],
   DateTime: ["Core", "Properties", "Events", "Style", "Validation"],
   Image: ["Core", "Properties", "Style"],
@@ -10847,15 +10843,6 @@ const buildProgressBar = (config2, componentScope2) => {
     ProgressBar.config.layout = config2.layout;
   }
   ProgressBar.config.main.heading = config2.label;
-  if (config2.variant) {
-    ProgressBar.config.main.variant = config2.variant;
-  }
-  if (config2.pieArcColors) {
-    ProgressBar.config.main.colorRange = flatObjectValueInArray(config2.pieArcColors);
-  }
-  if (config2.size) {
-    ProgressBar.config.main.size = Number(config2.size);
-  }
   if (config2.bottomLabel_3) {
     ProgressBar.config.main.bottomLabel_3 = config2.bottomLabel_3;
   }
@@ -11210,7 +11197,6 @@ const buildWrapperSection = (config2, componentScope2) => {
   wrapper.config.main.label = config2.label;
   wrapper.config.main.divider = config2.divider === "YES" ? true : false;
   wrapper.config.main.isAccordion = config2.isAccordion === "No" ? false : true;
-  wrapper.config.main.defaultClosed = config2.defaultClosed === "YES" ? true : false;
   if (config2.defaultStyle) {
     wrapper.config.defaultStyle = config2.defaultStyle === "YES" ? true : false;
   }
@@ -11455,9 +11441,6 @@ const buildTable = (config2, componentScope2) => {
   if (config2.initialDensity) {
     table.config.main.initialDensity = config2.initialDensity;
   }
-  if (config2.layout) {
-    table.config.layout = createLayoutFormat(config2.layout);
-  }
   return table;
 };
 const Box = {
@@ -11567,158 +11550,210 @@ function Card(theme) {
     type: "WrapperLayout",
     config: {
       main: {},
-      style: {
-        wrapperStyle: {
-          position: "relative",
-          top: "50%",
-          transform: "translateY(-50%)",
-          marginBottom: 0,
-          borderRadius: "12px",
-          fontFamily: "poppins"
-        },
-        componentsBoxStyle: {
-          boxShadow: "0 0 6px 1px rgba(149, 147, 147, 0.25)",
-          flexDirection: "column",
-          overflow: "hidden",
-          flexWrap: "nowrap",
-          width: "100% !important",
-          background: "transparent",
-          borderRadius: "12px",
-          padding: "20px 20px 20px 14px",
-          height: "100%",
-          minHeight: "100px",
-          position: "relative",
-          marginLeft: "0px",
-          "&: hover": {
-            background: `${theme.palette.primary.main}`,
-            color: `${theme.palette.primary.contrastText}`
+      wrapperStyle: {
+        position: "relative",
+        top: "50%",
+        transform: "translateY(-50%)",
+        marginBottom: 0
+      },
+      componentsBoxStyle: {
+        boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.1)",
+        flexDirection: "row",
+        flexWrap: "nowrap",
+        width: "100% !important",
+        background: "transparent",
+        border: `1.5px solid ${theme.palette.primary.light}`,
+        borderRadius: "8px",
+        padding: "0px 4px",
+        height: "100%",
+        alignItems: "center",
+        marginLeft: "0px",
+        "&: hover": {
+          background: `${theme.palette.primary.main}`,
+          border: `1.5px solid black`,
+          "& p": {
+            color: "white"
           }
         }
       },
-      layout: { xs: 12, sm: 12, md: 3, lg: 3 }
+      layout: { xs: 12, sm: 12, md: 6, lg: 6 }
     },
     elements: [
       {
-        type: "Control",
-        scope: "#/properties/initilCardScope",
+        type: "HorizontalLayout",
         config: {
-          main: {
-            url: "https://www.svgrepo.com/show/500606/loading.svg"
-          },
-          style: {
-            containerStyle: {
-              position: "absolute",
-              color: "inherit",
-              top: "4px",
-              right: "4px",
-              display: "flex",
-              justifyContent: "flex-end",
-              alignItems: "flex-start"
-            },
-            imageStyle: {
-              color: "inherit",
-              width: "32px",
-              height: "32px",
-              padding: "0px",
-              margin: "0px"
-            }
-          }
+          layout: 9
         },
-        options: {
-          widget: "Image"
-        }
-      },
-      {
-        type: "Control",
-        scope: "#/properties/initilCardScope",
-        config: {
-          main: {
-            heading: "Total Earnings"
-          },
-          style: {
-            color: "inherit",
-            fontSize: "16px",
-            fontWeight: 300,
-            fontFamily: "Poppins",
-            justifyContent: "flex-start",
-            background: "inherit",
-            position: "absolute",
-            top: "8px",
-            left: "12px",
-            display: "flex",
-            maxWidth: "200px",
-            whiteSpace: "nowrap",
-            overflowX: "auto",
-            scrollbarWidth: "none",
-            "&::-webkit-scrollbar": {
-              display: "none"
-            }
+        elements: [
+          {
+            type: "WrapperLayout",
+            config: {
+              main: {
+                columnSpacing: 0,
+                gap: 0
+              },
+              wrapperStyle: {
+                background: "transparent",
+                marginBottom: 0
+              },
+              componentsBoxStyle: {
+                flexDirection: "column",
+                flexWrap: "nowrap",
+                width: "100%",
+                height: "inherit",
+                background: "transparent",
+                borderRadius: "0px",
+                paddingRight: 0
+              },
+              layout: 12
+            },
+            elements: [
+              {
+                type: "WrapperLayout",
+                config: {
+                  main: {
+                    columnSpacing: 0,
+                    gap: 0
+                  },
+                  wrapperStyle: {
+                    background: "transparent",
+                    marginBottom: 0
+                  },
+                  componentsBoxStyle: {
+                    flexDirection: "row",
+                    flexWrap: "nowrap",
+                    width: "100%",
+                    height: "0",
+                    background: "transparent",
+                    borderRadius: "0px",
+                    marginLeft: "-10px",
+                    marginTop: "-8px",
+                    justifyContent: "start",
+                    position: "relative"
+                  },
+                  layout: 12
+                },
+                elements: [
+                  {
+                    type: "Control",
+                    scope: "#/properties/programType",
+                    config: {
+                      main: {
+                        heading: ""
+                      },
+                      style: {
+                        color: "black",
+                        display: "flex",
+                        fontSize: { xs: "24px", md: "28px" },
+                        fontWeight: "bold",
+                        background: "inherit",
+                        justifyContent: "flex-start",
+                        width: "auto",
+                        margin: "-8px",
+                        marginLeft: "-24px",
+                        height: 0
+                      }
+                    },
+                    options: {
+                      widget: "Box"
+                    }
+                  },
+                  {
+                    type: "Control",
+                    scope: "#/properties/programType",
+                    config: {
+                      main: {
+                        heading: "5000.00"
+                      },
+                      style: {
+                        color: "black",
+                        display: "flex",
+                        fontSize: { xs: "21px", md: "22px" },
+                        fontWeight: "500",
+                        background: "inherit",
+                        justifyContent: "flex-start",
+                        width: "auto",
+                        margin: "-8px",
+                        marginTop: "-6px",
+                        position: "absolute",
+                        left: "7px",
+                        whiteSpace: "nowrap",
+                        overflowX: "auto",
+                        overflowY: "hidden",
+                        scrollbarWidth: "none",
+                        msOverflowStyle: "none",
+                        maxWidth: "calc(100% + 20px)",
+                        "&::-webkit-scrollbar": {
+                          display: "none"
+                        }
+                      }
+                    },
+                    options: {
+                      widget: "Box"
+                    }
+                  }
+                ]
+              },
+              {
+                type: "Control",
+                scope: "#/properties/programType",
+                config: {
+                  main: {
+                    heading: "Total Earnings"
+                  },
+                  style: {
+                    color: "black",
+                    fontSize: "16px",
+                    fontWeight: "400",
+                    justifyContent: "center",
+                    whiteSpace: "nowrap",
+                    overflowX: "auto",
+                    overflowY: "hidden",
+                    scrollbarWidth: "none",
+                    msOverflowStyle: "none",
+                    background: "inherit",
+                    width: "calc(100% + 8px)",
+                    margin: "-8px",
+                    marginTop: { xs: "16px", md: "20px" },
+                    "&::-webkit-scrollbar": {
+                      display: "none"
+                    }
+                  },
+                  layout: 12
+                },
+                options: {
+                  widget: "Box"
+                }
+              }
+            ]
           }
-        },
-        options: {
-          widget: "Box"
-        }
+        ]
       },
       {
         type: "Control",
-        scope: "#/properties/initilCardScope",
+        scope: "#/properties/programType",
         config: {
           main: {
-            heading: "5000.00"
+            url: "https://www.svgrepo.com/show/500606/loading.svg"
           },
           style: {
-            color: "inherit",
-            display: "flex",
-            fontSize: { xs: "22px", md: "40px" },
-            fontWeight: 600,
-            background: "inherit",
-            justifyContent: "flex-start",
-            width: "100%",
-            margin: "0px",
-            marginBottom: "4px",
-            marginTop: "8px",
-            lineHeight: "1",
-            maxWidth: "300px",
-            whiteSpace: "nowrap",
-            overflowX: "auto",
-            overflowY: "hidden",
-            scrollbarWidth: "none",
-            "&::-webkit-scrollbar": {
-              display: "none"
+            containerStyle: {
+              height: "100%",
+              display: "flex",
+              justifyContent: "end"
+            },
+            imageStyle: {
+              width: "unset",
+              fontSize: "none",
+              padding: "4px",
+              margin: "0px 0px 0px 8px",
+              height: "64px"
             }
-          }
-        },
-        options: {
-          widget: "Box"
-        }
-      },
-      {
-        type: "Control",
-        scope: "#/properties/initilCardScope",
-        config: {
-          main: {
-            heading: "Increased from last month"
           },
-          style: {
-            color: "inherit",
-            fontSize: "12px",
-            fontWeight: "400",
-            justifyContent: "flex-start",
-            background: "inherit",
-            margin: "0px",
-            paddingLeft: "2px",
-            marginBottom: "8px",
-            maxWidth: "200px",
-            whiteSpace: "nowrap",
-            overflowX: "auto",
-            scrollbarWidth: "none",
-            "&::-webkit-scrollbar": {
-              display: "none"
-            }
-          }
+          layout: 3
         },
         options: {
-          widget: "Box"
+          widget: "Image"
         }
       }
     ]
@@ -11730,10 +11765,9 @@ const buildCard = (config, componentScope, store) => {
   if (config.style) {
     card.config.wrapperStyle = JSON.parse(config.style);
   }
-  card.elements[0].scope = `#/properties/${config.name}/properties/url`;
-  card.elements[1].scope = `#/properties/${config.name}/properties/label`;
-  card.elements[2].scope = `#/properties/${config.name}/properties/value`;
-  card.elements[3].scope = `#/properties/${config.name}/properties/description`;
+  card.elements[0].elements[0].elements[0].elements[1].scope = `#/properties/${config.name}/properties/value`;
+  card.elements[1].scope = `#/properties/${config.name}/properties/url`;
+  card.elements[0].elements[0].elements[1].scope = `#/properties/${config.name}/properties/description`;
   if (config.layout) {
     card.config.layout = createLayoutFormat(config.layout);
   }
@@ -11742,13 +11776,13 @@ const buildCard = (config, componentScope, store) => {
     card.elements[0].elements[0].elements[0].elements[1].config.style.left = "24px";
   }
   if (config.label) {
-    card.elements[1].config.main.heading = config.label;
+    card.elements[0].elements[0].elements[0].elements[1].config.main.heading = config.label;
   }
   if (config.url) {
-    card.elements[0].config.main.url = config.url;
+    card.elements[1].config.main.url = config.url;
   }
   if (config.description) {
-    card.elements[3].config.main.heading = config.description;
+    card.elements[0].elements[0].elements[1].config.main.heading = config.description;
   }
   return card;
 };
@@ -12553,31 +12587,6 @@ const buildImage = (config2, componentScope2) => {
   }
   return image;
 };
-const segmentUISchema = {
-  type: "Control",
-  scope: "#/properties/SegmentChart",
-  options: {
-    widget: "SegmentChart"
-  },
-  config: {
-    layout: { xs: 12, sm: 12, md: 12, lg: 12 },
-    main: {}
-  }
-};
-const buildSegmentChart = (config2, componentScope2) => {
-  const segment = _.cloneDeep(segmentUISchema);
-  segment.scope = componentScope2;
-  if (config2.layout) {
-    segment.config.layout = createLayoutFormat(config2.layout);
-  }
-  if (config2.pieArcColors) {
-    segment.config.main.colorRange = flatObjectValueInArray(config2.pieArcColors);
-  }
-  if (config2.style) {
-    segment.config.style = JSON.parse(config2.style);
-  }
-  return segment;
-};
 let schema = {
   type: "object",
   properties: {},
@@ -12790,9 +12799,6 @@ const buildUiSchema = (config2, store2) => {
     case "Image":
       elements = buildImage(config2, componentScope2);
       break;
-    case "SegmentChart":
-      elements = buildSegmentChart(config2, componentScope2);
-      break;
     default:
       schema = {
         type: "object",