@splunk/visualizations 28.0.0 → 28.1.0

package/Timeline.js

@@ -855,7 +855,7 @@ var withFixedSizeContainer = (Viz) => {
       FixSizeItem,
       {
         "data-test": "fix-size-item",
-        "data-splunk-visualization-version": "28.0.0 - 0c5f07712",
+        "data-splunk-visualization-version": "28.1.0 - 4a1bff08b",
         width,
         height,
         backgroundColor
@@ -921,7 +921,7 @@ var Cover = styled_components_default.div`
     bottom: 0;
 `;
 var Blocker = styled_components_default.div.attrs({
-  "data-splunk-visualization-version": "28.0.0 - 0c5f07712"
+  "data-splunk-visualization-version": "28.1.0 - 4a1bff08b"
 })`
     position: relative;
     width: 100%;
@@ -1635,7 +1635,7 @@ var withDashboardViz = (opts) => {
         }
         eventCallbackProps[eventCallbackPropName] = (ev) => {
           if (ev && ev.payload) {
-            payload = ev.payload;
+            payload = __spreadValues({}, ev.payload);
           }
           return onEventTrigger({
             originalEvent: ev,
@@ -1964,36 +1964,65 @@ var uplot_react_default = "default" in defaultImport33 ? defaultImport33.default
 // src/Timeline/PureTimeline/src/CursorPlugin.tsx
 var currentScaleFactor = 1;
 var canvasScaleObserver = null;
-var updateScaleFactor = () => {
-  const canvasElement = document.querySelector('[data-test="canvas"]');
-  if (canvasElement) {
-    const computedStyle = window.getComputedStyle(canvasElement);
-    const transformMatrix = computedStyle.getPropertyValue("transform");
-    if (transformMatrix && transformMatrix !== "none") {
-      const matrixValues = transformMatrix.match(/matrix(?:3d)?\((.+)\)/);
-      if (matrixValues) {
-        const values = matrixValues[1].split(", ");
-        currentScaleFactor = parseFloat(values[0]);
-      }
-    } else {
-      currentScaleFactor = 1;
-    }
-  } else {
+var updateScaleFactor = (root) => {
+  var _a;
+  const fullscreenEl = document.fullscreenElement;
+  if (fullscreenEl && fullscreenEl.tagName !== "BODY") {
+    currentScaleFactor = 1;
+    return;
+  }
+  const scope = root || document;
+  const canvasElement = scope.querySelector('[data-test="canvas"]');
+  if (!canvasElement) {
     canvasScaleObserver == null ? void 0 : canvasScaleObserver.disconnect();
+    return;
+  }
+  const scaleAttr = (_a = canvasElement == null ? void 0 : canvasElement.getAttribute) == null ? void 0 : _a.call(canvasElement, "data-test-scale");
+  if (scaleAttr) {
+    currentScaleFactor = parseFloat(scaleAttr) || 1;
+    return;
   }
+  const transformMatrix = window.getComputedStyle(canvasElement).getPropertyValue("transform");
+  if (transformMatrix && transformMatrix !== "none") {
+    const matrixValues = transformMatrix.match(/matrix(?:3d)?\((.+)\)/);
+    if (matrixValues) {
+      const values = matrixValues[1].split(", ");
+      currentScaleFactor = parseFloat(values[0]);
+      return;
+    }
+  }
+  currentScaleFactor = 1;
 };
 var resetScaleFactorOnFullscreen = () => {
   document.addEventListener("fullscreenchange", () => {
+    updateScaleFactor();
     if (document.fullscreenElement) {
-      currentScaleFactor = 1;
-    } else {
-      updateScaleFactor();
+      if (canvasScaleObserver) {
+        canvasScaleObserver.disconnect();
+      }
     }
   });
 };
 var initObserver = () => {
+  const gridElement = document.querySelector('[data-test="grid-layout"]');
   const canvasElement = document.querySelector('[data-test="canvas"]');
-  if (canvasElement) {
+  if (gridElement) {
+    canvasScaleObserver = new MutationObserver((mutationsList) => {
+      mutationsList.forEach((mutation) => {
+        if (mutation.type === "attributes" && mutation.attributeName === "data-test-scale") {
+          if (!document.fullscreenElement) {
+            updateScaleFactor();
+          } else {
+            currentScaleFactor = 1;
+          }
+        }
+      });
+    });
+    canvasScaleObserver.observe(gridElement, {
+      attributes: true,
+      attributeFilter: ["data-test-scale"]
+    });
+  } else if (canvasElement) {
     canvasScaleObserver = new MutationObserver((mutationsList) => {
       mutationsList.forEach((mutation) => {
         if (mutation.type === "attributes" && mutation.attributeName === "style") {
@@ -2057,11 +2086,22 @@ var CursorPlugin = ({
       init: (u) => {
         const chartContainer = u.root;
         chartContainer.addEventListener("click", handleClick);
-        if (!isSafari()) {
-          chartContainer.addEventListener("mouseleave", () => handleMouseLeave(u));
-        }
+        updateScaleFactor();
+        const pointerLeaveHandler = (e) => {
+          if (!chartContainer.contains(e.relatedTarget)) {
+            handleMouseLeave(u);
+          }
+        };
+        chartContainer.addEventListener("pointerleave", pointerLeaveHandler);
+        const pointerOutHandler = (e) => {
+          if (!chartContainer.contains(e.relatedTarget)) {
+            handleMouseLeave(u);
+          }
+        };
+        document.addEventListener("pointerout", pointerOutHandler, true);
         return () => {
-          chartContainer.removeEventListener("mouseleave", () => handleMouseLeave(u));
+          chartContainer.removeEventListener("pointerleave", pointerLeaveHandler);
+          document.removeEventListener("pointerout", pointerOutHandler, true);
           chartContainer.removeEventListener("click", handleClick);
         };
       },