{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "anchor-port",
  "type": "registry:component",
  "title": "Anchor Port",
  "description": "Port marker for object inputs, outputs, and bidirectional links on the canvas.",
  "dependencies": [
    "@vllnt/ui@^0.2.1"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/default/anchor-port/anchor-port.tsx",
      "content": "import { forwardRef } from \"react\";\n\nimport { cn } from \"@vllnt/ui\";\n\nexport type AnchorPortProps = React.ComponentPropsWithoutRef<\"span\"> & {\n  side?: \"bottom\" | \"left\" | \"right\" | \"top\";\n  state?: \"active\" | \"blocked\" | \"idle\";\n  tone?: \"bidirectional\" | \"input\" | \"output\";\n};\n\nconst toneClasses: Record<NonNullable<AnchorPortProps[\"tone\"]>, string> = {\n  bidirectional:\n    \"border-violet-500/40 bg-violet-500/15 text-violet-700 dark:text-violet-300\",\n  input: \"border-sky-500/40 bg-sky-500/15 text-sky-700 dark:text-sky-300\",\n  output:\n    \"border-emerald-500/40 bg-emerald-500/15 text-emerald-700 dark:text-emerald-300\",\n};\n\nconst stateClasses: Record<NonNullable<AnchorPortProps[\"state\"]>, string> = {\n  active: \"scale-100 opacity-100\",\n  blocked: \"opacity-60 saturate-50\",\n  idle: \"opacity-80\",\n};\n\nconst sideClasses: Record<NonNullable<AnchorPortProps[\"side\"]>, string> = {\n  bottom: \"self-end\",\n  left: \"self-start\",\n  right: \"self-end\",\n  top: \"self-start\",\n};\n\nconst AnchorPort = forwardRef<HTMLSpanElement, AnchorPortProps>(\n  (\n    {\n      className,\n      side = \"right\",\n      state = \"idle\",\n      tone = \"bidirectional\",\n      ...props\n    },\n    ref,\n  ) => (\n    <span\n      aria-label={props[\"aria-label\"] ?? `${tone} ${side} port ${state}`}\n      className={cn(\n        \"inline-flex size-7 items-center justify-center rounded-full border shadow-sm\",\n        toneClasses[tone],\n        stateClasses[state],\n        sideClasses[side],\n        className,\n      )}\n      data-side={side}\n      data-state={state}\n      data-tone={tone}\n      ref={ref}\n      role=\"img\"\n      {...props}\n    >\n      <span className=\"size-2.5 rounded-full bg-current\" />\n    </span>\n  ),\n);\n\nAnchorPort.displayName = \"AnchorPort\";\n\nexport { AnchorPort };\n",
      "type": "registry:component"
    }
  ],
  "version": "0.2.1",
  "stability": "stable"
}