eewing
25 lines
829 B
Svelte
25 lines
829 B
Svelte
<script lang="ts">
|
|
import type { ScrollAreaThumbProps } from "../types.js";
|
|
import { ScrollAreaScrollbarVisibleContext } from "../scroll-area.svelte.js";
|
|
import ScrollAreaThumbImpl from "./scroll-area-thumb-impl.svelte";
|
|
import { createId } from "../../../internal/create-id.js";
|
|
import PresenceLayer from "../../utilities/presence-layer/presence-layer.svelte";
|
|
|
|
const uid = $props.id();
|
|
|
|
let {
|
|
id = createId(uid),
|
|
ref = $bindable(null),
|
|
forceMount = false,
|
|
...restProps
|
|
}: ScrollAreaThumbProps = $props();
|
|
|
|
const scrollbarState = ScrollAreaScrollbarVisibleContext.get();
|
|
</script>
|
|
|
|
<PresenceLayer open={forceMount || scrollbarState.hasThumb} ref={scrollbarState.scrollbar.opts.ref}>
|
|
{#snippet presence({ present })}
|
|
<ScrollAreaThumbImpl {...restProps} {id} bind:ref {present} />
|
|
{/snippet}
|
|
</PresenceLayer>
|