fix(TooltipContext): Call hideTooltip() for all tooltip modes on `p…

…ointerleave` to fix `band` (BarChart) and `voronoi` (ScatterPlot) modes not always closing on chart pointerleave due to recent chart delay / tooltip hover changes
techniq · Feb 19, 2025 · e9f5e8c · e9f5e8c
1 parent aefcd3e
commit e9f5e8c
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 5 deletions.
diff --git a/.changeset/strong-worms-rhyme.md b/.changeset/strong-worms-rhyme.md
@@ -0,0 +1,5 @@
+---
+'layerchart': patch
+---
+
+fix(TooltipContext): Call `hideTooltip()` for all tooltip modes on `pointerleave` to fix `band` (BarChart) and `voronoi` (ScatterPlot) modes not always closing on chart pointerleave due to recent chart delay / tooltip hover changes
diff --git a/packages/layerchart/src/lib/components/tooltip/TooltipContext.svelte b/packages/layerchart/src/lib/components/tooltip/TooltipContext.svelte
@@ -411,13 +411,15 @@
       showTooltip(e);
     }
   }}
-  on:pointermove={triggerPointerEvents ? showTooltip : undefined}
-  on:pointerleave={(e) => {
-    isHoveringTooltip = false;
+  on:pointermove={(e) => {
     if (triggerPointerEvents) {
-      hideTooltip();
+      showTooltip(e);
     }
   }}
+  on:pointerleave={(e) => {
+    isHoveringTooltip = false;
+    hideTooltip();
+  }}
   on:click={(e) => {
     if (triggerPointerEvents) {
       onclick(e, { data: $tooltip?.data });

diff --git a/packages/layerchart/src/routes/docs/components/AreaChart/+page.svelte b/packages/layerchart/src/routes/docs/components/AreaChart/+page.svelte
@@ -896,7 +896,7 @@
       ]}
       {renderContext}
       {debug}
-      tooltip={{ hideDelay: 1000 }}
+      tooltip={{ hideDelay: 500 }}
     >
       <svelte:fragment slot="tooltip" let:x let:y let:series let:height let:setHighlightSeriesKey>
         <Tooltip.Root x="data" y={height + 24} pointerEvents let:data>