{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "labeled-separator",
  "title": "Labeled Separator",
  "description": "A horizontal divider broken by a centred label, such as an \"or\" rule between sign-in methods.",
  "dependencies": [
    "clsx",
    "tailwind-merge"
  ],
  "registryDependencies": [
    "https://ui.digital.nsw.gov.au/registry/r/theme.json",
    "https://ui.digital.nsw.gov.au/registry/r/separator.json"
  ],
  "files": [
    {
      "path": "src/components/labeled-separator.tsx",
      "content": "import type * as React from 'react'\n\nimport { Separator } from '@/components/separator'\nimport { cn } from '@/lib/utils'\n\n/**\n * A horizontal divider broken by a centred label — e.g. the \"or\" rule that\n * separates one sign-in method from another in a login form.\n *\n * Always renders a label (defaulting to \"or\"); it is not a plain horizontal\n * rule. For an unbroken divider, use the `Separator` component instead.\n *\n * The two flanking rules are rendered `decorative` (role=\"none\") because the\n * visible label already conveys the boundary to assistive tech; exposing two\n * `role=\"separator\"` elements either side of it would be redundant noise.\n */\nfunction LabeledSeparator({\n  className,\n  children = 'or',\n  ref,\n  ...props\n}: React.ComponentProps<'div'> & { children?: React.ReactNode }) {\n  return (\n    <div\n      ref={ref}\n      data-slot='labeled-separator'\n      className={cn('flex items-center gap-3', className)}\n      {...props}\n    >\n      <Separator decorative className='flex-1' />\n      <span\n        data-slot='labeled-separator-content'\n        className='shrink-0 text-sm text-muted-foreground'\n      >\n        {children}\n      </span>\n      <Separator decorative className='flex-1' />\n    </div>\n  )\n}\n\nexport { LabeledSeparator }\n\nexport type LabeledSeparatorProps = React.ComponentProps<typeof LabeledSeparator>\n",
      "type": "registry:ui",
      "target": "components/labeled-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"
  }
}