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

fix collapsible on ssr

Browse source
This commit is contained in:
Face 2025-06-29 00:21:40 +03:00
parent 2c1dacbc2f
commit 934706961d
3 changed files with 35 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

13
website/src/lib/components/ui/collapsible/collapsible-content.svelte
View file

@ -1,7 +1,18 @@
<script lang="ts">
import { Collapsible as CollapsiblePrimitive } from "bits-ui";
import { browser } from "$app/environment";
let { ref = $bindable(null), ...restProps }: CollapsiblePrimitive.ContentProps = $props();
let {
ref = $bindable(null),
children,
...restProps
}: CollapsiblePrimitive.ContentProps = $props();
</script>
{#if browser}
<CollapsiblePrimitive.Content bind:ref data-slot="collapsible-content" {...restProps} />
{:else}
<div data-slot="collapsible-content" {...restProps}>
{@render children?.()}
</div>
{/if}

13
website/src/lib/components/ui/collapsible/collapsible-trigger.svelte
View file

@ -1,7 +1,18 @@
<script lang="ts">
import { Collapsible as CollapsiblePrimitive } from "bits-ui";
import { browser } from "$app/environment";
let { ref = $bindable(null), ...restProps }: CollapsiblePrimitive.TriggerProps = $props();
let {
ref = $bindable(null),
children,
...restProps
}: CollapsiblePrimitive.TriggerProps = $props();
</script>
{#if browser}
<CollapsiblePrimitive.Trigger bind:ref data-slot="collapsible-trigger" {...restProps} />
{:else}
<button data-slot="collapsible-trigger" {...restProps}>
{@render children?.()}
</button>
{/if}

8
website/src/lib/components/ui/collapsible/collapsible.svelte
View file

@ -1,11 +1,19 @@
<script lang="ts">
import { Collapsible as CollapsiblePrimitive } from "bits-ui";
import { browser } from "$app/environment";
let {
ref = $bindable(null),
open = $bindable(false),
children,
...restProps
}: CollapsiblePrimitive.RootProps = $props();
</script>
{#if browser}
<CollapsiblePrimitive.Root bind:ref bind:open data-slot="collapsible" {...restProps} />
{:else}
<div data-slot="collapsible">
{@render children?.()}
</div>
{/if}