sag_components 2.0.0-beta77 → 2.0.0-beta79

package/dist/index.js

@@ -23894,7 +23894,6 @@ const Label$2 = styled__default["default"].label`
   font-size: 14px;
   font-weight: 500;
   color: ${props => props.disabled ? '#D0D0D0' : '212121'};
-  font-family: "Poppins";
   white-space: nowrap;
 `;
 const InputContainer$1 = styled__default["default"].div`
@@ -23906,7 +23905,6 @@ const InputContainer$1 = styled__default["default"].div`
   overflow: hidden;
   padding: 6px 16px;
   margin-bottom: 8px;
-  width: 256px;
   height: 24px;
   border: 1px solid
     ${props => props.disabled ? '#bdbdbd' : props.error ? 'red' : '#B1B1B1'};
@@ -23966,7 +23964,6 @@ const OptionsSubContainer$1 = styled__default["default"].ul`
   left: 0;
   z-index: 101;
   width: calc(100% - 23px);
-  font-family: "Poppins";
   border-radius: 4px;
   background-color: white;
   display: ${props => props.showoptions && props.filteredoptions?.length > 0 ? 'block' : 'none'};
@@ -23978,9 +23975,7 @@ const OptionItem$1 = styled__default["default"].li`
   padding: 10px;
   cursor: pointer;
   color: #212121;
-  font-family: "Poppins";
   font-size: 14px;
-  font-style: normal;
   font-weight: 400;
   transition: background-color 0.3s;
   background-color: ${props => props.selected ? '#C7E4FF' : '#fff'};
@@ -31617,7 +31612,9 @@ styleInject(css_248z);
 
 const BarLine = props => {
   const {
-    brushAreaBarData
+    brushAreaBarData,
+    color,
+    lineColor
   } = props;
   const MAX_CHARS_PER_LINE = getMaxCharsPerLine(brushAreaBarData.length);
   const MAX_LINES = 2;
@@ -31731,11 +31728,11 @@ const BarLine = props => {
   }), /*#__PURE__*/React__default["default"].createElement(recharts.Line, {
     type: "monotone",
     dataKey: "inc_roi",
-    stroke: "#F8CD00",
+    stroke: lineColor,
     strokeWidth: 2,
     dot: {
       r: 4,
-      fill: "#F8CD00"
+      fill: lineColor
     },
     activeDot: false,
     name: "INC Sales ROI"
@@ -31787,7 +31784,7 @@ const BarLine = props => {
     cursor: brushAreaBarData.length > 80
   }), /*#__PURE__*/React__default["default"].createElement(recharts.Bar, {
     dataKey: "inc_sales",
-    fill: "#CCDCDD",
+    fill: color,
     gap: 4,
     barSize: 53,
     name: "INC Sales"
@@ -31810,11 +31807,11 @@ const BarLine = props => {
     width: "100%",
     height: "40px",
     legendData: [{
-      iconColor: "#CCDCDD",
+      iconColor: color,
       iconType: "Square",
       title: "INC Sales"
     }, {
-      iconColor: "#F8CD00",
+      iconColor: lineColor,
       iconType: "LegendUnionIcon",
       title: "INC Sales ROI"
     }]
@@ -31823,7 +31820,8 @@ const BarLine = props => {
 
 const SingleChart = props => {
   const {
-    barData
+    barData,
+    color
   } = props;
   const MAX_CHARS_PER_LINE = getMaxCharsPerLine(barData.length);
   const MAX_LINES = 2;
@@ -31925,7 +31923,7 @@ const SingleChart = props => {
     content: /*#__PURE__*/React__default["default"].createElement(CustomTooltip, null)
   }), /*#__PURE__*/React__default["default"].createElement(recharts.Bar, {
     dataKey: "value",
-    fill: "#CCDCDD",
+    fill: color,
     barSize: 53,
     name: "INC Sales"
   }, /*#__PURE__*/React__default["default"].createElement(recharts.LabelList, {
@@ -31947,7 +31945,7 @@ const SingleChart = props => {
     width: "100%",
     height: "40px",
     legendData: [{
-      iconColor: "#CCDCDD",
+      iconColor: color,
       iconType: "Square",
       title: "INC Units"
     }]
@@ -31956,7 +31954,9 @@ const SingleChart = props => {
 
 const InnerBar = props => {
   const {
-    brushInnerBarData
+    brushInnerBarData,
+    color,
+    backgroundColor
   } = props;
   const MAX_CHARS_PER_LINE = getMaxCharsPerLine(brushInnerBarData.length);
   const MAX_LINES = 2;
@@ -31977,7 +31977,7 @@ const InnerBar = props => {
       y: y,
       width: width,
       height: height,
-      fill: "#d0e6ea",
+      fill: backgroundColor,
       rx: 4,
       ry: 4
     }), /*#__PURE__*/React__default["default"].createElement("text", {
@@ -31993,7 +31993,7 @@ const InnerBar = props => {
       y: innerY,
       width: width * 0.6,
       height: innerHeight,
-      fill: "#07575b",
+      fill: color,
       rx: 2,
       ry: 2
     }), innerHeight > 16 && /*#__PURE__*/React__default["default"].createElement("text", {
@@ -32117,11 +32117,11 @@ const InnerBar = props => {
     width: "100%",
     height: "40px",
     legendData: [{
-      iconColor: "#CCDCDD",
+      iconColor: backgroundColor,
       iconType: "Square",
       title: "New Shoppers"
     }, {
-      iconColor: "#07575b",
+      iconColor: color,
       iconType: "Square",
       title: "Repeaters"
     }]
@@ -32137,7 +32137,10 @@ const BrushChart = props => {
     brushBarBasketData,
     brushAreaBarData,
     segmentedbuttonOptions,
-    title
+    title,
+    lineChartColor,
+    innerChartColor,
+    barChartColor
   } = props;
   const [selectedOption, setSelectedOption] = React$1.useState(segmentedbuttonOptions[0]);
   return /*#__PURE__*/React__default["default"].createElement(Container, {
@@ -32155,12 +32158,18 @@ const BrushChart = props => {
       return setSelectedOption(value);
     }
   }), /*#__PURE__*/React__default["default"].createElement(ChartContainer, null, selectedOption === "New Shoppers & Repeaters" && /*#__PURE__*/React__default["default"].createElement(InnerBar, {
+    color: innerChartColor,
+    backgroundColor: barChartColor,
     brushInnerBarData: brushInnerBarData
   }), selectedOption === "INC Sales & ROI" && /*#__PURE__*/React__default["default"].createElement(BarLine, {
+    color: barChartColor,
+    lineColor: lineChartColor,
     brushAreaBarData: brushAreaBarData
   }), selectedOption === "INC Units" && /*#__PURE__*/React__default["default"].createElement(SingleChart, {
+    color: barChartColor,
     barData: brushBarIncData
   }), selectedOption === "Basket Lift" && /*#__PURE__*/React__default["default"].createElement(SingleChart, {
+    color: barChartColor,
     barData: brushBarBasketData
   })));
 };