2024-05-16 16:24:50 +02:00
|
|
|
<script lang="ts">
|
2025-06-21 21:07:36 +02:00
|
|
|
import { setContext, type Snippet } from 'svelte';
|
|
|
|
|
import { CollapsibleTreeState } from './utils.svelte';
|
2024-05-16 16:24:50 +02:00
|
|
|
|
2025-06-21 21:07:36 +02:00
|
|
|
const {
|
|
|
|
|
defaultState = 'open',
|
|
|
|
|
side = 'right',
|
|
|
|
|
nohover = false,
|
|
|
|
|
slotInsideTrigger = true,
|
|
|
|
|
children,
|
|
|
|
|
}: {
|
|
|
|
|
defaultState?: 'open' | 'closed';
|
|
|
|
|
side?: 'left' | 'right';
|
|
|
|
|
nohover?: boolean;
|
|
|
|
|
slotInsideTrigger?: boolean;
|
|
|
|
|
children: Snippet;
|
|
|
|
|
} = $props();
|
2024-05-16 18:18:42 +02:00
|
|
|
|
2025-06-21 21:07:36 +02:00
|
|
|
let open = $state(new CollapsibleTreeState(defaultState));
|
2024-05-16 16:24:50 +02:00
|
|
|
|
2025-02-02 11:17:22 +01:00
|
|
|
setContext('collapsible-tree-state', open);
|
|
|
|
|
setContext('collapsible-tree-side', side);
|
|
|
|
|
setContext('collapsible-tree-nohover', nohover);
|
|
|
|
|
setContext('collapsible-tree-parent-id', 'root');
|
|
|
|
|
setContext('collapsible-tree-slot-inside-trigger', slotInsideTrigger);
|
2024-05-16 16:24:50 +02:00
|
|
|
</script>
|
|
|
|
|
|
2025-06-21 21:07:36 +02:00
|
|
|
{@render children()}
|