refactor ClientOnly component to simplify a bit

This commit is contained in:
2026-02-07 21:13:15 -08:00
parent 6f36ec0c62
commit 7b8ccb0e83

View File

@@ -1,5 +1,6 @@
<script lang="ts">
import { onMount } from "svelte";
import type { Snippet } from "svelte";
import { browser } from "$app/environment";
type ClientOnlyProps = {
/**
@@ -11,24 +12,18 @@
/**
* Main content to render once mounted (client-only).
*/
children: import("svelte").Snippet;
children: Snippet;
/**
* Optional fallback content to render during SSR / before mount.
*/
fallback?: import("svelte").Snippet;
fallback?: Snippet;
};
let { showFallback = true, children, fallback }: ClientOnlyProps = $props();
let mounted = $state(false);
onMount(() => {
mounted = true;
});
</script>
{#if mounted}
{#if browser}
{@render children()}
{:else if showFallback && fallback}
{@render fallback()}