feat(TooltipItem): Add onclick, onpointerenter, onpointerleave …

…event callbacks
techniq · Feb 10, 2025 · 83a1933 · 83a1933
1 parent 8ed4684
commit 83a1933
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 1 deletion.
diff --git a/.changeset/ninety-timers-turn.md b/.changeset/ninety-timers-turn.md
@@ -0,0 +1,5 @@
+---
+'layerchart': patch
+---
+
+feat(TooltipItem): Add `onclick`, `onpointerenter`, `onpointerleave` event callbacks
diff --git a/packages/layerchart/src/lib/components/tooltip/TooltipItem.svelte b/packages/layerchart/src/lib/components/tooltip/TooltipItem.svelte
@@ -9,6 +9,10 @@
   export let valueAlign: 'left' | 'right' | 'center' = 'left';
   export let color: string | undefined = undefined;
 
+  export let onclick: ((e: MouseEvent) => void) | undefined = undefined;
+  export let onpointerenter: ((e: PointerEvent) => void) | undefined = undefined;
+  export let onpointerleave: ((e: PointerEvent) => void) | undefined = undefined;
+
   export let classes: {
     root?: string;
     label?: string;
@@ -17,7 +21,13 @@
   } = {};
 </script>
 
-<div class={cls('contents', classes.root, $$props.class)} {...$$restProps}>
+<div
+  class={cls('contents', classes.root, $$props.class)}
+  on:click={onclick}
+  on:pointerenter={onpointerenter}
+  on:pointerleave={onpointerleave}
+  {...$$restProps}
+>
   <div class={cls('label', 'flex items-center gap-2 whitespace-nowrap', classes.label)}>
     {#if color}
       <div