{
  "name": "Separator",
  "type": "component",
  "description": "Horizontal or vertical divider line, wrapping the Base UI Separator primitive.",
  "export": "Separator",
  "path": "@gtmi/strix-react/atoms/separator",
  "figma": null,
  "figmaAbsent": "Base UI primitive. Figma draws rules inside components but no separator component; `.transfer-agent-animation`’s rule is a 2px gradient, not this.",
  "props": [
    {
      "name": "orientation",
      "type": "horizontal | vertical",
      "default": "horizontal",
      "description": "Rule direction. Sets aria-orientation and swaps which border edge is drawn."
    },
    {
      "name": "size",
      "type": "xs | sm | md | lg | xl",
      "description": "Optional margin step. Applied on the axis the rule divides: vertical margin when horizontal, horizontal margin when vertical. Omit for a rule with no spacing of its own."
    },
    {
      "name": "className",
      "type": "string",
      "description": "Merged through cn(), so a caller can restyle the border."
    }
  ],
  "ai_tags": ["separator", "divider", "rule", "primitive"],
  "since": "0.2.0",
  "tokens_used": ["--color-border-neutral-soft"],
  "notes": "role=\"separator\" and aria-orientation come from Base UI, not from this wrapper. Upstream applied `my-*` for both orientations; Strix uses `mx-*` when vertical, since a vertical rule needs its space on the x axis."
}