{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "separator",
  "title": "Separator",
  "description": "A semantic or decorative divider built on the Base UI separator primitive.",
  "dependencies": [
    "@base-ui/react",
    "clsx",
    "tailwind-merge"
  ],
  "registryDependencies": [
    "https://ui.digital.nsw.gov.au/registry/r/theme.json"
  ],
  "files": [
    {
      "path": "src/components/separator.tsx",
      "content": "'use client'\n\nimport type * as React from 'react'\n\nimport { Separator as SeparatorPrimitive } from '@base-ui/react/separator'\n\nimport { cn } from '@/lib/utils'\n\ntype SeparatorProps = SeparatorPrimitive.Props & {\n  /**\n   * When true, the separator is purely presentational and is hidden from\n   * assistive tech by setting `role=\"none\"`. Defaults to `false`, in which\n   * case Base UI's default `role=\"separator\"` is left intact so AT users\n   * hear it as a region boundary.\n   */\n  decorative?: boolean\n}\n\nfunction Separator({\n  className,\n  orientation = 'horizontal',\n  decorative = false,\n  role,\n  ref,\n  ...props\n}: SeparatorProps) {\n  // Base UI's Separator emits `data-orientation=\"horizontal|vertical\"` for\n  // CSS targeting AND `aria-orientation` for assistive tech. The previous\n  // `data-horizontal:` / `data-vertical:` selectors targeted non-existent\n  // boolean attributes and never matched, leaving the separator with no\n  // explicit axis sizing.\n  const sharedClassName = cn(\n    'shrink-0 bg-border data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px data-[orientation=vertical]:self-stretch',\n    className,\n  )\n\n  // A consumer passing `role=\"none\"` / `\"presentation\"` is asking for a\n  // presentational separator just as `decorative` does — treat them the same.\n  // Otherwise Base UI would still emit `aria-orientation` (which it sets from\n  // the orientation prop regardless of role), recreating the axe\n  // `aria-allowed-attr` violation that `decorative` exists to avoid.\n  const isPresentational = decorative || role === 'none' || role === 'presentation'\n\n  if (isPresentational) {\n    // Render a plain <div> for presentational separators. Bypass the\n    // primitive so the rendered element carries no ARIA semantics at all\n    // (no `aria-orientation`).\n    return (\n      <div\n        ref={ref as React.Ref<HTMLDivElement>}\n        data-slot='separator'\n        data-orientation={orientation}\n        role='none'\n        className={sharedClassName}\n        {...(props as React.HTMLAttributes<HTMLDivElement>)}\n      />\n    )\n  }\n\n  return (\n    <SeparatorPrimitive\n      ref={ref}\n      data-slot='separator'\n      orientation={orientation}\n      role={role ?? 'separator'}\n      className={sharedClassName}\n      {...props}\n    />\n  )\n}\n\nexport { Separator }\nexport type { SeparatorProps }\n",
      "type": "registry:ui",
      "target": "components/separator.tsx"
    },
    {
      "path": "src/lib/utils.ts",
      "content": "import { clsx, type ClassValue } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n",
      "type": "registry:lib",
      "target": "lib/utils.ts"
    }
  ],
  "type": "registry:ui",
  "meta": {
    "nswdsVersion": "5.1.0"
  }
}