yusur/coinstorge
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix tooltip ssr errors

Browse source
This commit is contained in:
Face 2025-06-28 17:37:23 +03:00
parent 107c78a5f2
commit 098db9f69a
2 changed files with 49 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

3
website/src/lib/components/ui/tooltip/tooltip-content.svelte
View file

@ -1,6 +1,7 @@
<script lang="ts"> <script lang="ts">
import { Tooltip as TooltipPrimitive } from "bits-ui"; import { Tooltip as TooltipPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js"; import { cn } from "$lib/utils.js";
import { browser } from '$app/environment';
let { let {
ref = $bindable(null), ref = $bindable(null),
@ -15,6 +16,7 @@
} = $props(); } = $props();
</script> </script>
{#if browser}
<TooltipPrimitive.Portal> <TooltipPrimitive.Portal>
<TooltipPrimitive.Content <TooltipPrimitive.Content
bind:ref bind:ref
@ -45,3 +47,4 @@
</TooltipPrimitive.Arrow> </TooltipPrimitive.Arrow>
</TooltipPrimitive.Content> </TooltipPrimitive.Content>
</TooltipPrimitive.Portal> </TooltipPrimitive.Portal>
{/if}

18
website/src/lib/components/ui/tooltip/tooltip-trigger.svelte
View file

@ -1,7 +1,21 @@
<script lang="ts"> <script lang="ts">
import { Tooltip as TooltipPrimitive } from "bits-ui"; import { Tooltip as TooltipPrimitive } from "bits-ui";
import { browser } from '$app/environment';
let { ref = $bindable(null), ...restProps }: TooltipPrimitive.TriggerProps = $props(); let { ref = $bindable(null), disabled = false, ...restProps }: TooltipPrimitive.TriggerProps = $props();
</script> </script>
<TooltipPrimitive.Trigger bind:ref data-slot="tooltip-trigger" {...restProps} /> {#if browser}
<TooltipPrimitive.Trigger bind:ref {disabled} data-slot="tooltip-trigger" {...restProps} />
{:else}
<!-- SSR fallback -->
<div
bind:this={ref}
data-slot="tooltip-trigger"
{...Object.fromEntries(
Object.entries(restProps).filter(
([key]) => !key.startsWith('on:') // Remove Svelte event handlers
)
)}
></div>
{/if}