sag_components 2.0.0-beta78 → 2.0.0-beta79

package/dist/index.js

@@ -31612,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;
@@ -31726,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"
@@ -31782,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"
@@ -31805,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"
     }]
@@ -31818,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;
@@ -31920,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, {
@@ -31942,7 +31945,7 @@ const SingleChart = props => {
     width: "100%",
     height: "40px",
     legendData: [{
-      iconColor: "#CCDCDD",
+      iconColor: color,
       iconType: "Square",
       title: "INC Units"
     }]
@@ -31951,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;
@@ -31972,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", {
@@ -31988,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", {
@@ -32112,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"
     }]
@@ -32132,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, {
@@ -32150,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
   })));
 };