{
  "$schema": "https://uipkge.dev/schema/registry-item.json",
  "name": "separator",
  "title": "Separator",
  "type": "registry:ui",
  "files": [
    {
      "path": "packages/registry-svelte/components/separator/Separator.svelte",
      "content": "<script lang=\"ts\" module>\n  import type { HTMLAttributes } from 'svelte/elements'\n\n  export interface SeparatorProps extends HTMLAttributes<HTMLDivElement> {\n    orientation?: 'horizontal' | 'vertical'\n    /** Presentational only: hides from assistive tech. Set false for a semantic landmark. */\n    decorative?: boolean\n    ref?: HTMLDivElement | null\n  }\n</script>\n\n<script lang=\"ts\">\n  import { cn } from '$lib/utils'\n\n  let { class: className, orientation = 'horizontal', decorative = true, ref = $bindable(null), ...restProps }: SeparatorProps = $props()\n</script>\n\n<div\n  bind:this={ref}\n  data-uipkge=\"\"\n  data-slot=\"separator\"\n  data-orientation={orientation}\n  role={decorative ? undefined : 'separator'}\n  aria-orientation={decorative ? undefined : orientation}\n  aria-hidden={decorative ? 'true' : undefined}\n  class={cn(\n    'bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px',\n    className,\n  )}\n  {...restProps}\n></div>\n",
      "type": "registry:ui",
      "target": "~/src/lib/components/ui/separator/Separator.svelte"
    },
    {
      "path": "packages/registry-svelte/components/separator/index.ts",
      "content": "export { default as Separator, type SeparatorProps } from './Separator.svelte'\n",
      "type": "registry:ui",
      "target": "~/src/lib/components/ui/separator/index.ts"
    }
  ],
  "dependencies": [],
  "devDependencies": [],
  "registryDependencies": [],
  "description": "Horizontal or vertical visual divider — a `<div>` with the right ARIA role and a registry-token border color. Use between sections, list rows, and toolbar groups.",
  "categories": [
    "layout"
  ]
}