sag_components 2.0.0-beta85 → 2.0.0-beta87

package/dist/index.esm.js

@@ -30416,7 +30416,7 @@ const BubbleChart = _ref => {
         "data-testid": "tooltip-description"
       }, /*#__PURE__*/React$1.createElement("span", null, data.tooltip.description)), /*#__PURE__*/React$1.createElement(TooltipMetric, {
         "data-testid": "tooltip-cost"
-      }, /*#__PURE__*/React$1.createElement("span", null, "Total cost:"), /*#__PURE__*/React$1.createElement("span", null, formatCurrency(data.tooltip.cost))), /*#__PURE__*/React$1.createElement(TooltipMetric, {
+      }, /*#__PURE__*/React$1.createElement("span", null, "Total cost:"), /*#__PURE__*/React$1.createElement("span", null, data.tooltip.allSizesEmpty ? 'N/A' : formatCurrency(data.tooltip.cost))), /*#__PURE__*/React$1.createElement(TooltipMetric, {
         "data-testid": "tooltip-sales"
       }, /*#__PURE__*/React$1.createElement("span", null, "INC Sales:"), /*#__PURE__*/React$1.createElement("span", null, formatCurrency(data.tooltip.incSales))), /*#__PURE__*/React$1.createElement(TooltipMetric, {
         "data-testid": "tooltip-roi"
@@ -30429,6 +30429,10 @@ const BubbleChart = _ref => {
 
   // Process all chart data - use original data values
   const allChartData = useMemo(() => {
+    // Check if all size values are empty (0, null, undefined)
+    const allSizesEmpty = data.every(item => !item.size || item.size === 0);
+    const defaultSize = allSizesEmpty ? 10 : null; // Use 10 as default size when all are empty
+
     return data.map((item, index) => {
       if (item.x === undefined || item.y === undefined || item.size === undefined) {
         console.warn('Skipping data item with missing values:', item);
@@ -30441,6 +30445,7 @@ const BubbleChart = _ref => {
         units: item.units || 0,
         roi: item.x || 0,
         incSales: item.y || 0,
+        allSizesEmpty: allSizesEmpty,
         ...(item.tooltip || {})
       };
       return {
@@ -30448,8 +30453,8 @@ const BubbleChart = _ref => {
         // Use original x value
         y: item.y,
         // Use original y value
-        z: item.size,
-        // Use original size value
+        z: defaultSize || item.size,
+        // Use default size if all sizes are empty, otherwise use original
         tooltip: tooltipInfo,
         fill: getFill(item.x, item.y),
         key: `bubble-${index}` // Use index for stable keys
@@ -31504,7 +31509,7 @@ SegmentedButton.defaultProps = {
 const Container = styled.div`
   width: ${props => props.width};
   height: ${props => props.height};
-  margin: 10px;
+  padding: 10px;
   gap: 10px;
   display: flex;
   flex-direction: column;
@@ -31576,7 +31581,8 @@ const BarLine = props => {
   const {
     brushAreaBarData,
     color,
-    lineColor
+    lineColor,
+    hideBrush
   } = props;
   const MAX_CHARS_PER_LINE = getMaxCharsPerLine(brushAreaBarData.length);
   const MAX_LINES = 2;
@@ -31706,7 +31712,7 @@ const BarLine = props => {
     fontSize: 15,
     fontWeight: "400",
     fontFamily: "Poppins"
-  })), /*#__PURE__*/React$1.createElement(Brush, {
+  })), !hideBrush && /*#__PURE__*/React$1.createElement(Brush, {
     dataKey: "label",
     height: 30,
     stroke: "#212121",
@@ -31758,7 +31764,7 @@ const BarLine = props => {
     fontSize: 16,
     fontWeight: "400",
     fontFamily: "Poppins"
-  })), /*#__PURE__*/React$1.createElement(Brush, {
+  })), !hideBrush && /*#__PURE__*/React$1.createElement(Brush, {
     height: 30,
     fill: "#EFEFEF",
     travellerWidth: 10,
@@ -31784,7 +31790,8 @@ const SingleChart = props => {
   const {
     barData,
     color,
-    legendLabel
+    legendLabel,
+    hideBrush
   } = props;
   const MAX_CHARS_PER_LINE = getMaxCharsPerLine(barData.length);
   const MAX_LINES = 2;
@@ -31897,7 +31904,7 @@ const SingleChart = props => {
     fontSize: 16,
     fontWeight: "400",
     fontFamily: "Poppins"
-  })), /*#__PURE__*/React$1.createElement(Brush, {
+  })), !hideBrush && /*#__PURE__*/React$1.createElement(Brush, {
     height: 30,
     fill: "#EFEFEF",
     travellerWidth: 10,
@@ -31919,7 +31926,8 @@ const InnerBar = props => {
   const {
     brushInnerBarData,
     color,
-    backgroundColor
+    backgroundColor,
+    hideBrush
   } = props;
   const MAX_CHARS_PER_LINE = getMaxCharsPerLine(brushInnerBarData.length);
   const MAX_LINES = 2;
@@ -32069,7 +32077,7 @@ const InnerBar = props => {
     dataKey: "total",
     shape: /*#__PURE__*/React$1.createElement(BarWithInner, null),
     barSize: 55
-  }), /*#__PURE__*/React$1.createElement(Brush, {
+  }), !hideBrush && /*#__PURE__*/React$1.createElement(Brush, {
     height: 30,
     fill: "#EFEFEF",
     travellerWidth: 10,
@@ -32099,6 +32107,10 @@ const BrushChart = props => {
     brushBarIncData,
     brushBarBasketData,
     brushAreaBarData,
+    hideFirstBrush,
+    hideSecondBrush,
+    hideThirdBrush,
+    hideLastBrush,
     segmentedbuttonOptions,
     title,
     lineChartColor,
@@ -32123,19 +32135,23 @@ const BrushChart = props => {
   }), /*#__PURE__*/React$1.createElement(ChartContainer, null, selectedOption === "New Shoppers & Repeaters" && /*#__PURE__*/React$1.createElement(InnerBar, {
     color: innerChartColor,
     backgroundColor: barChartColor,
-    brushInnerBarData: brushInnerBarData
+    brushInnerBarData: brushInnerBarData,
+    hideBrush: hideFirstBrush
   }), selectedOption === "INC Sales & ROI" && /*#__PURE__*/React$1.createElement(BarLine, {
     color: barChartColor,
     lineColor: lineChartColor,
-    brushAreaBarData: brushAreaBarData
+    brushAreaBarData: brushAreaBarData,
+    hideBrush: hideSecondBrush
   }), selectedOption === "INC Units" && /*#__PURE__*/React$1.createElement(SingleChart, {
     color: barChartColor,
     barData: brushBarIncData,
-    legendLabel: "INC Units"
+    legendLabel: "INC Units",
+    hideBrush: hideThirdBrush
   }), selectedOption === "Basket Lift" && /*#__PURE__*/React$1.createElement(SingleChart, {
     color: barChartColor,
     barData: brushBarBasketData,
-    legendLabel: "Basket Lift"
+    legendLabel: "Basket Lift",
+    hideBrush: hideLastBrush
   })));
 };