feat: tooltip

Co-Authored-By: Jannik S. <69747628+jannikstdl@users.noreply.github.com>
This commit is contained in:
Timothy J. Baek 2024-03-02 01:00:20 -08:00
parent edb63c2280
commit 63c0927022
2 changed files with 139 additions and 95 deletions

View file

@ -0,0 +1,31 @@
<script lang="ts">
import { onDestroy } from 'svelte';
import tippy from 'tippy.js';
export let placement = 'top';
export let content = `I'm a tooltip!`;
let tooltipElement;
let tooltipInstance;
$: if (tooltipElement && content) {
if (tooltipInstance) {
tooltipInstance[0]?.destroy();
}
tooltipInstance = tippy(tooltipElement, {
content: content,
placement: placement,
allowHTML: true
});
}
onDestroy(() => {
if (tooltipInstance) {
tooltipInstance[0]?.destroy();
}
});
</script>
<div bind:this={tooltipElement}>
<slot />
</div>