sag_components 2.0.0-beta78 → 2.0.0-beta79

package/dist/index.esm.js

@@ -31602,7 +31602,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;
@@ -31716,11 +31718,11 @@ const BarLine = props => {
   }), /*#__PURE__*/React$1.createElement(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"
@@ -31772,7 +31774,7 @@ const BarLine = props => {
     cursor: brushAreaBarData.length > 80
   }), /*#__PURE__*/React$1.createElement(Bar, {
     dataKey: "inc_sales",
-    fill: "#CCDCDD",
+    fill: color,
     gap: 4,
     barSize: 53,
     name: "INC Sales"
@@ -31795,11 +31797,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"
     }]
@@ -31808,7 +31810,8 @@ const BarLine = props => {
 
 const SingleChart = props => {
   const {
-    barData
+    barData,
+    color
   } = props;
   const MAX_CHARS_PER_LINE = getMaxCharsPerLine(barData.length);
   const MAX_LINES = 2;
@@ -31910,7 +31913,7 @@ const SingleChart = props => {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
   }), /*#__PURE__*/React$1.createElement(Bar, {
     dataKey: "value",
-    fill: "#CCDCDD",
+    fill: color,
     barSize: 53,
     name: "INC Sales"
   }, /*#__PURE__*/React$1.createElement(LabelList, {
@@ -31932,7 +31935,7 @@ const SingleChart = props => {
     width: "100%",
     height: "40px",
     legendData: [{
-      iconColor: "#CCDCDD",
+      iconColor: color,
       iconType: "Square",
       title: "INC Units"
     }]
@@ -31941,7 +31944,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;
@@ -31962,7 +31967,7 @@ const InnerBar = props => {
       y: y,
       width: width,
       height: height,
-      fill: "#d0e6ea",
+      fill: backgroundColor,
       rx: 4,
       ry: 4
     }), /*#__PURE__*/React$1.createElement("text", {
@@ -31978,7 +31983,7 @@ const InnerBar = props => {
       y: innerY,
       width: width * 0.6,
       height: innerHeight,
-      fill: "#07575b",
+      fill: color,
       rx: 2,
       ry: 2
     }), innerHeight > 16 && /*#__PURE__*/React$1.createElement("text", {
@@ -32102,11 +32107,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"
     }]
@@ -32122,7 +32127,10 @@ const BrushChart = props => {
     brushBarBasketData,
     brushAreaBarData,
     segmentedbuttonOptions,
-    title
+    title,
+    lineChartColor,
+    innerChartColor,
+    barChartColor
   } = props;
   const [selectedOption, setSelectedOption] = useState(segmentedbuttonOptions[0]);
   return /*#__PURE__*/React$1.createElement(Container, {
@@ -32140,12 +32148,18 @@ const BrushChart = props => {
       return setSelectedOption(value);
     }
   }), /*#__PURE__*/React$1.createElement(ChartContainer, null, selectedOption === "New Shoppers & Repeaters" && /*#__PURE__*/React$1.createElement(InnerBar, {
+    color: innerChartColor,
+    backgroundColor: barChartColor,
     brushInnerBarData: brushInnerBarData
   }), selectedOption === "INC Sales & ROI" && /*#__PURE__*/React$1.createElement(BarLine, {
+    color: barChartColor,
+    lineColor: lineChartColor,
     brushAreaBarData: brushAreaBarData
   }), selectedOption === "INC Units" && /*#__PURE__*/React$1.createElement(SingleChart, {
+    color: barChartColor,
     barData: brushBarIncData
   }), selectedOption === "Basket Lift" && /*#__PURE__*/React$1.createElement(SingleChart, {
+    color: barChartColor,
     barData: brushBarBasketData
   })));
 };