{
	"$schema": "https://shadcn-svelte.com/schema/registry-item.json",
	"name": "scroll-area",
	"title": "Scroll Area",
	"type": "registry:ui",
	"description": "Kura Scroll Area component source.",
	"devDependencies": [
		"bits-ui@^2.18.1",
		"@internationalized/date@^3.12.2"
	],
	"registryDependencies": [
		"utils"
	],
	"files": [
		{
			"content": "import Scrollbar from './scroll-area-scrollbar.svelte';\nimport Root from './scroll-area.svelte';\n\nexport {\n  Root,\n  Scrollbar,\n  //,\n  Root as ScrollArea,\n  Scrollbar as ScrollAreaScrollbar\n};\n",
			"type": "registry:file",
			"target": "scroll-area/index.ts"
		},
		{
			"content": "<script lang=\"ts\">\n  import { ScrollArea as ScrollAreaPrimitive } from 'bits-ui';\n  import { cn, type WithoutChild } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    orientation = 'vertical',\n    children,\n    ...restProps\n  }: WithoutChild<ScrollAreaPrimitive.ScrollbarProps> = $props();\n</script>\n\n<ScrollAreaPrimitive.Scrollbar\n  bind:ref\n  data-slot=\"scroll-area-scrollbar\"\n  data-orientation={orientation}\n  {orientation}\n  class={cn(\n    'flex touch-none bg-[#09090b] p-px transition-colors select-none data-horizontal:h-2.5 data-horizontal:flex-col data-horizontal:border-t data-horizontal:border-t-[#222225] data-vertical:h-full data-vertical:w-2.5 data-vertical:border-l data-vertical:border-l-[#222225]',\n    className\n  )}\n  {...restProps}\n>\n  {@render children?.()}\n  <ScrollAreaPrimitive.Thumb\n    data-slot=\"scroll-area-thumb\"\n    class=\"relative flex-1 rounded-none bg-[#3f3f46] hover:bg-[#d0e891]\"\n  />\n</ScrollAreaPrimitive.Scrollbar>\n",
			"type": "registry:file",
			"target": "scroll-area/scroll-area-scrollbar.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { ScrollArea as ScrollAreaPrimitive } from 'bits-ui';\n  import { Scrollbar } from './index.js';\n  import { cn, type WithoutChild } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    viewportRef = $bindable(null),\n    class: className,\n    orientation = 'vertical',\n    scrollbarXClasses = '',\n    scrollbarYClasses = '',\n    children,\n    ...restProps\n  }: WithoutChild<ScrollAreaPrimitive.RootProps> & {\n    orientation?: 'vertical' | 'horizontal' | 'both' | undefined;\n    scrollbarXClasses?: string | undefined;\n    scrollbarYClasses?: string | undefined;\n    viewportRef?: HTMLElement | null;\n  } = $props();\n</script>\n\n<ScrollAreaPrimitive.Root\n  bind:ref\n  data-slot=\"scroll-area\"\n  class={cn('relative [--scrollbar-track:#09090b]', className)}\n  {...restProps}\n>\n  <ScrollAreaPrimitive.Viewport\n    bind:ref={viewportRef}\n    data-slot=\"scroll-area-viewport\"\n    class=\"cn-scroll-area-viewport size-full rounded-[inherit] outline-none transition-[color,box-shadow] focus-visible:ring-2 focus-visible:ring-zinc-300/60 focus-visible:outline-1\"\n  >\n    {@render children?.()}\n  </ScrollAreaPrimitive.Viewport>\n  {#if orientation === 'vertical' || orientation === 'both'}\n    <Scrollbar orientation=\"vertical\" class={scrollbarYClasses} />\n  {/if}\n  {#if orientation === 'horizontal' || orientation === 'both'}\n    <Scrollbar orientation=\"horizontal\" class={scrollbarXClasses} />\n  {/if}\n  <ScrollAreaPrimitive.Corner />\n</ScrollAreaPrimitive.Root>\n",
			"type": "registry:file",
			"target": "scroll-area/scroll-area.svelte"
		}
	]
}