mirror of
https://github.com/gpxstudio/gpx.studio.git
synced 2026-03-15 09:12:59 +00:00
35 lines
1.2 KiB
Svelte
35 lines
1.2 KiB
Svelte
<script lang="ts">
|
|
import { ScrollArea as ScrollAreaPrimitive } from 'bits-ui';
|
|
import { Scrollbar } from './index.js';
|
|
import { cn } from '$lib/utils.js';
|
|
|
|
type $$Props = ScrollAreaPrimitive.Props & {
|
|
orientation?: 'vertical' | 'horizontal' | 'both';
|
|
scrollbarXClasses?: string;
|
|
scrollbarYClasses?: string;
|
|
viewportClasses?: string;
|
|
};
|
|
|
|
let className: $$Props['class'] = undefined;
|
|
export { className as class };
|
|
export let orientation = 'vertical';
|
|
export let scrollbarXClasses: string = '';
|
|
export let scrollbarYClasses: string = '';
|
|
export let viewportClasses: string = '';
|
|
</script>
|
|
|
|
<ScrollAreaPrimitive.Root {...$$restProps} class={cn('relative overflow-hidden', className)}>
|
|
<ScrollAreaPrimitive.Viewport class={cn('h-full w-full rounded-[inherit]', viewportClasses)}>
|
|
<ScrollAreaPrimitive.Content>
|
|
<slot />
|
|
</ScrollAreaPrimitive.Content>
|
|
</ScrollAreaPrimitive.Viewport>
|
|
{#if orientation === 'vertical' || orientation === 'both'}
|
|
<Scrollbar orientation="vertical" class={scrollbarYClasses} />
|
|
{/if}
|
|
{#if orientation === 'horizontal' || orientation === 'both'}
|
|
<Scrollbar orientation="horizontal" class={scrollbarXClasses} />
|
|
{/if}
|
|
<ScrollAreaPrimitive.Corner />
|
|
</ScrollAreaPrimitive.Root>
|