{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "separator",
  "title": "Separator",
  "author": "AniBT <https://anibt.net>",
  "description": "AniBT rule: the dashed stitch (horizontal or vertical) or the solid 1px edge, with Radix and Base UI orientation attributes.",
  "dependencies": [
    "class-variance-authority",
    "radix-ui"
  ],
  "registryDependencies": [
    "@anibt/theme"
  ],
  "files": [
    {
      "path": "registry/anibt/ui/separator.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { Separator as SeparatorPrimitive } from \"radix-ui\"\n\nimport { cn } from \"@/lib/utils\"\n\n/**\n * Separator — the AniBT 「贴纸手账」 rule.\n *\n * A's rule between rows and sections is the dashed stitch: 4px of the control\n * edge colour, 4px of nothing, 1px thick (`variant=\"stitch\"`, the default).\n * `variant=\"line\"` is the solid 1px panel edge, for the rare place a stitch\n * would read as a seam in the paper rather than a division.\n *\n * Vertical rules stretch to their row (`self-stretch`) and stitch downwards.\n * Decorative by default, as in shadcn: a screen reader skips it. Pass\n * `decorative={false}` when the rule separates two groups a reader should\n * hear as separate.\n *\n * The element carries Radix's `data-orientation` and Base UI's\n * `data-horizontal` / `data-vertical`, so a shadcn `base-*` component that\n * styles either keeps working. The orientation classes are plain utilities\n * picked from the `orientation` prop, so `cn` merges a caller's class over\n * them (the sidebar's `mx-2 w-auto`, a `h-4` on a vertical rule).\n */\nconst separatorVariants = cva(\"shrink-0\", {\n  variants: {\n    variant: {\n      stitch: \"\",\n      line: \"bg-border\",\n    },\n    orientation: {\n      horizontal: \"h-px w-full\",\n      vertical: \"w-px self-stretch\",\n    },\n  },\n  compoundVariants: [\n    { variant: \"stitch\", orientation: \"horizontal\", class: \"bg-(image:--anibt-stitch) bg-size-[8px_1px] bg-repeat-x\" },\n    { variant: \"stitch\", orientation: \"vertical\", class: \"bg-(image:--anibt-stitch-y) bg-size-[1px_8px] bg-repeat-y\" },\n  ],\n  defaultVariants: {\n    variant: \"stitch\",\n    orientation: \"horizontal\",\n  },\n})\n\ntype SeparatorProps = React.ComponentProps<typeof SeparatorPrimitive.Root> &\n  VariantProps<typeof separatorVariants>\n\nfunction Separator({\n  className,\n  orientation = \"horizontal\",\n  decorative = true,\n  variant,\n  ...props\n}: SeparatorProps) {\n  return (\n    <SeparatorPrimitive.Root\n      data-slot=\"separator\"\n      data-variant={variant ?? \"stitch\"}\n      data-horizontal={orientation === \"horizontal\" ? \"\" : undefined}\n      data-vertical={orientation === \"vertical\" ? \"\" : undefined}\n      decorative={decorative}\n      orientation={orientation}\n      className={cn(separatorVariants({ variant, orientation }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Separator, separatorVariants }\nexport type { SeparatorProps }\n",
      "type": "registry:ui"
    }
  ],
  "categories": [
    "layout"
  ],
  "type": "registry:ui"
}