sag_components 2.0.0-beta67 → 2.0.0-beta68

package/dist/index.esm.js

@@ -9480,70 +9480,67 @@ const DropdownMain = styled.div`
 `;
 
 /* eslint-disable react/prop-types */
-const DropdownNew = _ref => {
-  let {
-    isMulti,
-    label,
-    labelEmptyValue,
-    options,
-    selectedValue,
-    placeHolder,
-    onChange,
-    required,
-    disabled,
-    width,
-    error,
-    errorMessage,
-    labelColor,
-    checkBoxColor,
-    xIconShow,
-    showLabelOnTop,
-    orderBy,
-    elementType
-  } = _ref;
-  return /*#__PURE__*/React$1.createElement(DropdownMain, {
-    className: "DropdownMain",
-    width: width
-  }, isMulti ? /*#__PURE__*/React$1.createElement(DropdownMultiNew, {
-    className: "DropdownMultiNew",
-    placeHolder: placeHolder,
-    label: label,
-    labelEmptyValue: labelEmptyValue,
-    labelColor: labelColor,
-    checkBoxColor: checkBoxColor,
-    required: required,
-    options: options,
-    width: width,
-    disabled: disabled,
-    error: error,
-    errorMessage: errorMessage,
-    selectedValue: selectedValue,
-    xIconShow: xIconShow,
-    onChange: onChange,
-    showLabelOnTop: showLabelOnTop,
-    orderBy: orderBy,
-    elementType: elementType
-  }) : /*#__PURE__*/React$1.createElement(DropdownSingleNew, {
-    className: "DropdownSingleNew",
-    placeHolder: placeHolder,
-    label: label,
-    labelEmptyValue: labelEmptyValue,
-    labelColor: labelColor,
-    checkBoxColor: checkBoxColor,
-    required: required,
-    options: options,
-    width: width,
-    disabled: disabled,
-    error: error,
-    errorMessage: errorMessage,
-    selectedValue: selectedValue,
-    xIconShow: xIconShow,
-    onChange: onChange,
-    showLabelOnTop: showLabelOnTop,
-    orderBy: orderBy,
-    elementType: elementType
-  }));
-};
+const DropdownNew = ({
+  isMulti,
+  label,
+  labelEmptyValue,
+  options,
+  selectedValue,
+  placeHolder,
+  onChange,
+  required,
+  disabled,
+  width,
+  error,
+  errorMessage,
+  labelColor,
+  checkBoxColor,
+  xIconShow,
+  showLabelOnTop,
+  orderBy,
+  elementType
+}) => /*#__PURE__*/React$1.createElement(DropdownMain, {
+  className: "DropdownMain",
+  width: width
+}, isMulti ? /*#__PURE__*/React$1.createElement(DropdownMultiNew, {
+  className: "DropdownMultiNew",
+  placeHolder: placeHolder,
+  label: label,
+  labelEmptyValue: labelEmptyValue,
+  labelColor: labelColor,
+  checkBoxColor: checkBoxColor,
+  required: required,
+  options: options,
+  width: width,
+  disabled: disabled,
+  error: error,
+  errorMessage: errorMessage,
+  selectedValue: selectedValue,
+  xIconShow: xIconShow,
+  onChange: onChange,
+  showLabelOnTop: showLabelOnTop,
+  orderBy: orderBy,
+  elementType: elementType
+}) : /*#__PURE__*/React$1.createElement(DropdownSingleNew, {
+  className: "DropdownSingleNew",
+  placeHolder: placeHolder,
+  label: label,
+  labelEmptyValue: labelEmptyValue,
+  labelColor: labelColor,
+  checkBoxColor: checkBoxColor,
+  required: required,
+  options: options,
+  width: width,
+  disabled: disabled,
+  error: error,
+  errorMessage: errorMessage,
+  selectedValue: selectedValue,
+  xIconShow: xIconShow,
+  onChange: onChange,
+  showLabelOnTop: showLabelOnTop,
+  orderBy: orderBy,
+  elementType: elementType
+}));
 DropdownNew.propTypes = {
   placeHolder: PropTypes.string,
   label: PropTypes.string,
@@ -24130,22 +24127,21 @@ const DeleteIcon = styled.div`
   position: absolute;
 `;
 
-const QuickFilterDropdownSingle = _ref => {
-  let {
-    label,
-    hoverColor,
-    options,
-    selectedValue,
-    placeHolder,
-    onChange,
-    disabled,
-    width,
-    error,
-    errorMessage,
-    xIconShow,
-    labelColor,
-    showLabelOnTop
-  } = _ref;
+const QuickFilterDropdownSingle = ({
+  label,
+  hoverColor,
+  options,
+  selectedValue,
+  placeHolder,
+  onChange,
+  disabled,
+  width,
+  error,
+  errorMessage,
+  xIconShow,
+  labelColor,
+  showLabelOnTop
+}) => {
   const [isFocused, setIsFocused] = useState(false);
   const [showOptions, setShowOptions] = useState(false);
   const [inputValue, setInputValue] = useState("");
@@ -24543,24 +24539,23 @@ const IconContainer$2 = styled.div`
   cursor:  pointer;  
 `;
 
-const QuickFilterDropdownMultiSelection = _ref => {
-  let {
-    label,
-    labelEmptyValue,
-    options,
-    selectedValue,
-    placeHolder,
-    onChange,
-    required,
-    disabled,
-    width,
-    error,
-    errorMessage,
-    labelColor,
-    xIconShow,
-    checkBoxColor,
-    showLabelOnTop
-  } = _ref;
+const QuickFilterDropdownMultiSelection = ({
+  label,
+  labelEmptyValue,
+  options,
+  selectedValue,
+  placeHolder,
+  onChange,
+  required,
+  disabled,
+  width,
+  error,
+  errorMessage,
+  labelColor,
+  xIconShow,
+  checkBoxColor,
+  showLabelOnTop
+}) => {
   const [isFocused, setIsFocused] = useState(false);
   const [showOptions, setShowOptions] = useState(false);
   const [inputValue, setInputValue] = useState('');
@@ -30430,6 +30425,8 @@ const BubbleChart = _ref => {
     backgroundColor = 'white',
     showAxis = false
   } = _ref;
+  const [curosrMouse, setCurosrMouse] = useState("default");
+
   // Calculate the medians and domain for raw X, Y, and Z values
   const {
     xMedian,
@@ -30514,6 +30511,7 @@ const BubbleChart = _ref => {
   // Refs for the chart container
   const containerRef = useRef(null);
   const scatterChartRef = useRef(null);
+  const scatterFullChartRef = useRef(null);
 
   // Set up initial domain
   useEffect(() => {
@@ -30686,9 +30684,9 @@ const BubbleChart = _ref => {
       e.preventDefault();
     }
   }, [viewDomain]); // Add viewDomain as dependency to capture current value
-
   // Handle mouse move for dragging
   const handleMouseMove = useCallback(e => {
+    /* cursor feedback */
     if (!isDragging) return;
     const dx = e.clientX - dragStart.x;
     const dy = e.clientY - dragStart.y;
@@ -30797,6 +30795,7 @@ const BubbleChart = _ref => {
 
   // Handle mouse wheel
   const handleWheel = useCallback(e => {
+    if (!e.ctrlKey) return; // Only zoom with Ctrl key
     e.preventDefault();
     if (e.deltaY < 0) {
       handleZoomIn();
@@ -30885,7 +30884,11 @@ const BubbleChart = _ref => {
     const formattedY = formatUnits(yMedian);
     return `${formattedX}, ${formattedY}`;
   }, [xMedian, yMedian]);
-
+  const handleChartMouseMove = e => {
+    if (!scatterFullChartRef.current) return;
+    const temp = isDragging ? 'move' : 'zoom-in';
+    setCurosrMouse(temp);
+  };
   // Render the component
   return /*#__PURE__*/React$1.createElement(BubbleChartContainer, {
     width: width,
@@ -30910,6 +30913,9 @@ const BubbleChart = _ref => {
     height: "100%",
     "data-testid": "responsive-container"
   }, /*#__PURE__*/React$1.createElement(ScatterChart, {
+    ref: scatterFullChartRef,
+    onMouseMove: handleChartMouseMove,
+    cursor: curosrMouse,
     margin: {
       top: 60,
       right: 190,