sag_components 2.0.0-beta83 → 2.0.0-beta85

package/dist/index.d.ts

@@ -1074,7 +1074,7 @@ declare function LinkButton({ text, type, size, height, width, disabled, textCol
     width?: string;
     disabled?: boolean;
     textColor?: string;
-    onClick?: () => void;
+    onClick: any;
     leftIcon?: string;
     rightIcon?: string;
 }): react_jsx_runtime.JSX.Element;

package/dist/index.esm.js

@@ -3047,7 +3047,7 @@ const LinkButton = _ref => {
     width = '',
     disabled = false,
     textColor = '',
-    onClick = () => {},
+    onClick,
     leftIcon = 'none',
     rightIcon = 'none'
   } = _ref;
@@ -13197,14 +13197,14 @@ const DialogOverlay = props => {
     modal.close();
     onDialogClose();
   };
-  return /*#__PURE__*/React$1.createElement(ModalWrapper, {
+  return /*#__PURE__*/React.createElement(ModalWrapper, {
     className: className
-  }, /*#__PURE__*/React$1.createElement(Modal, null, /*#__PURE__*/React$1.createElement(ModalHeader, null, /*#__PURE__*/React$1.createElement(ModalTitle, null, title), /*#__PURE__*/React$1.createElement(ModalClose, {
+  }, /*#__PURE__*/React.createElement(Modal, null, /*#__PURE__*/React.createElement(ModalHeader, null, /*#__PURE__*/React.createElement(ModalTitle, null, title), /*#__PURE__*/React.createElement(ModalClose, {
     type: "button",
     onClick: closeModal
-  }, /*#__PURE__*/React$1.createElement(CloseXIcon, {
+  }, /*#__PURE__*/React.createElement(CloseXIcon, {
     fill: "white"
-  }))), /*#__PURE__*/React$1.createElement(ModalBody, {
+  }))), /*#__PURE__*/React.createElement(ModalBody, {
     id: "modalBody"
   }, children)));
 };
@@ -30338,7 +30338,8 @@ const BubbleChart = _ref => {
     // Calculate domains based on median-centered logic
     const calculateDomainBasedOnMedian = (min, max, median) => {
       const distance = Math.max(Math.abs(max - median), Math.abs(min - median));
-      return [median - distance, median + distance];
+      const padding = distance * 0.01 || 0.01; // Add 1% padding or minimum 0.01
+      return [median - distance - padding, median + distance + padding];
     };
 
     // const calculateDomainBasedOnMedian = (min, max, median) => {
@@ -30838,7 +30839,23 @@ const BubbleChart = _ref => {
     range: [0, 7000],
     domain: [0, Math.max(...data.map(item => item.size || 0))],
     "data-testid": "z-axis"
-  }), /*#__PURE__*/React$1.createElement(ReferenceLine, {
+  }), /*#__PURE__*/React$1.createElement(Scatter, {
+    name: "Bubble Chart",
+    data: visibleData,
+    shape: "circle",
+    fill: "transparent",
+    isAnimationActive: false,
+    animationBegin: 0,
+    animationDuration: 0,
+    "data-testid": "scatter"
+  }, visibleData.map((entry, index) => /*#__PURE__*/React$1.createElement(Cell, {
+    key: entry.key,
+    fill: entry.fill,
+    stroke: "rgba(255,255,255,0.6)",
+    strokeWidth: 1.5,
+    filter: "url(#bubble-blur)",
+    "data-testid": `cell-${index}`
+  }))), /*#__PURE__*/React$1.createElement(ReferenceLine, {
     x: xMedian,
     stroke: "#D0D0D0",
     strokeDasharray: "4 4",
@@ -30957,23 +30974,7 @@ const BubbleChart = _ref => {
       y: false
     },
     "data-testid": "tooltip"
-  }), /*#__PURE__*/React$1.createElement(Scatter, {
-    name: "Bubble Chart",
-    data: visibleData,
-    shape: "circle",
-    fill: "transparent",
-    isAnimationActive: false,
-    animationBegin: 0,
-    animationDuration: 0,
-    "data-testid": "scatter"
-  }, visibleData.map((entry, index) => /*#__PURE__*/React$1.createElement(Cell, {
-    key: entry.key,
-    fill: entry.fill,
-    stroke: "rgba(255,255,255,0.6)",
-    strokeWidth: 1.5,
-    filter: "url(#bubble-blur)",
-    "data-testid": `cell-${index}`
-  }))), isMiddleValueVisible && /*#__PURE__*/React$1.createElement(ReferenceLine, {
+  }), isMiddleValueVisible && /*#__PURE__*/React$1.createElement(ReferenceLine, {
     x: xMedian,
     y: yMedian,
     stroke: "transparent",
@@ -30984,27 +30985,8 @@ const BubbleChart = _ref => {
         viewBox
       } = _ref8;
       // Calculate the exact position of the median point in the SVG
-      const xPos = viewBox.x + (xMedian - viewDomain.x[0]) / (viewDomain.x[1] - viewDomain.x[0]) * viewBox.width;
-      const yPos = viewBox.y + (1 - (yMedian - viewDomain.y[0]) / (viewDomain.y[1] - viewDomain.y[0])) * viewBox.height;
-
-      // Calculate normalized position of median in domain
-      // const xNorm = (xMedian - viewDomain.x[0]) / (viewDomain.x[1] - viewDomain.x[0]);
-      // const yNorm = (yMedian - viewDomain.y[0]) / (viewDomain.y[1] - viewDomain.y[0]);
-
-      // // If median is within 2% of the edge, center the label
-      // const isXEdge = xNorm < 0.02 || xNorm > 0.98;
-      // const isYEdge = yNorm < 0.02 || yNorm > 0.98;
-
-      // let xPos, yPos;
-      // if (isXEdge || isYEdge) {
-      //     // Center of SVG
-      //     xPos = viewBox.x + viewBox.width / 2;
-      //     yPos = viewBox.y + viewBox.height / 2;
-      // } else {
-      //     // Median's data position
-      //     xPos = viewBox.x + xNorm * viewBox.width;
-      //     yPos = viewBox.y + (1 - yNorm) * viewBox.height;
-      // }
+      const xPos = viewDomain.x[1] - viewDomain.x[0] === 0 ? viewBox.x + viewBox.width / 2 : viewBox.x + (xMedian - viewDomain.x[0]) / (viewDomain.x[1] - viewDomain.x[0]) * viewBox.width;
+      const yPos = viewDomain.y[1] - viewDomain.y[0] === 0 ? viewBox.y + viewBox.height / 2 : viewBox.y + (1 - (yMedian - viewDomain.y[0]) / (viewDomain.y[1] - viewDomain.y[0])) * viewBox.height;
       return /*#__PURE__*/React$1.createElement("text", {
         x: xPos,
         y: yPos,
@@ -31671,7 +31653,7 @@ const BarLine = props => {
       inc_sales,
       inc_roi
     } = payload[0].payload;
-    return /*#__PURE__*/React$1.createElement(TooltipContainer, null, /*#__PURE__*/React$1.createElement(TooltipTitle$4, null, label), /*#__PURE__*/React$1.createElement(TooltipText, null, description), /*#__PURE__*/React$1.createElement(TooltipText, null, `INC Sales: ${getFormattedValue(inc_sales)}${getFormattedUnits(inc_sales)}`), /*#__PURE__*/React$1.createElement(TooltipText, null, `INC Sales ROI:  ${getFormattedValue(inc_roi)}${getFormattedUnits(inc_roi)}`));
+    return /*#__PURE__*/React$1.createElement(TooltipContainer, null, /*#__PURE__*/React$1.createElement(TooltipTitle$4, null, label), /*#__PURE__*/React$1.createElement(TooltipText, null, description), /*#__PURE__*/React$1.createElement(TooltipText, null, `INC Sales: $${getFormattedValue(inc_sales)}${getFormattedUnits(inc_sales)}`), /*#__PURE__*/React$1.createElement(TooltipText, null, `INC Sales ROI:  ${getFormattedValue(inc_roi)}${getFormattedUnits(inc_roi)}`));
   });
   return /*#__PURE__*/React$1.createElement("div", {
     style: {
@@ -31719,7 +31701,7 @@ const BarLine = props => {
   }, /*#__PURE__*/React$1.createElement(LabelList, {
     dataKey: "inc_roi",
     position: "top",
-    formatter: value => `$${getFormattedValue(value)}${getFormattedUnits(value)}`,
+    formatter: value => `${getFormattedValue(value)}${getFormattedUnits(value)}`,
     fill: "#212121",
     fontSize: 15,
     fontWeight: "400",
@@ -31801,7 +31783,8 @@ const BarLine = props => {
 const SingleChart = props => {
   const {
     barData,
-    color
+    color,
+    legendLabel
   } = props;
   const MAX_CHARS_PER_LINE = getMaxCharsPerLine(barData.length);
   const MAX_LINES = 2;
@@ -31909,7 +31892,7 @@ const SingleChart = props => {
   }, /*#__PURE__*/React$1.createElement(LabelList, {
     dataKey: "value",
     position: "top",
-    formatter: value => `$${getFormattedValue(value)}${getFormattedUnits(value)}`,
+    formatter: value => `${legendLabel === "INC Units" ? "" : "$"}${getFormattedValue(value)}${getFormattedUnits(value)}`,
     fill: "#212121",
     fontSize: 16,
     fontWeight: "400",
@@ -31927,7 +31910,7 @@ const SingleChart = props => {
     legendData: [{
       iconColor: color,
       iconType: "Square",
-      title: "INC Units"
+      title: legendLabel
     }]
   }));
 };
@@ -32147,10 +32130,12 @@ const BrushChart = props => {
     brushAreaBarData: brushAreaBarData
   }), selectedOption === "INC Units" && /*#__PURE__*/React$1.createElement(SingleChart, {
     color: barChartColor,
-    barData: brushBarIncData
+    barData: brushBarIncData,
+    legendLabel: "INC Units"
   }), selectedOption === "Basket Lift" && /*#__PURE__*/React$1.createElement(SingleChart, {
     color: barChartColor,
-    barData: brushBarBasketData
+    barData: brushBarBasketData,
+    legendLabel: "Basket Lift"
   })));
 };