{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "handoff-beacon",
  "type": "registry:component",
  "title": "Handoff Beacon",
  "description": "Attention-routing beacon with pulsing ring and optional source / message card for live canvases.",
  "dependencies": [
    "@vllnt/ui@^0.2.1"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/default/handoff-beacon/handoff-beacon.tsx",
      "content": "\"use client\";\n\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n} from \"react\";\n\nimport { cn } from \"@vllnt/ui\";\n\n/**\n * Beacon urgency.\n *\n * @public\n */\nexport type HandoffBeaconLevel = \"info\" | \"request\" | \"urgent\";\n\nconst LEVEL_RING: Record<HandoffBeaconLevel, string> = {\n  info: \"ring-blue-500\",\n  request: \"ring-amber-500\",\n  urgent: \"ring-red-500 animate-pulse\",\n};\n\nconst LEVEL_DOT: Record<HandoffBeaconLevel, string> = {\n  info: \"bg-blue-500\",\n  request: \"bg-amber-500\",\n  urgent: \"bg-red-500\",\n};\n\n/**\n * Localizable strings.\n *\n * @public\n */\nexport type HandoffBeaconLabels = {\n  /** Aria-label for the beacon. Defaults to `\"Attention\"`. */\n  region?: string;\n};\n\nconst DEFAULT_LABELS = {\n  region: \"Attention\",\n} as const satisfies Required<HandoffBeaconLabels>;\n\n/**\n * Props for {@link HandoffBeacon}.\n *\n * @public\n */\nexport type HandoffBeaconProps = {\n  /** Localizable strings. */\n  labels?: HandoffBeaconLabels;\n  /** Urgency level. Defaults to `\"info\"`. */\n  level?: HandoffBeaconLevel;\n  /** Optional message body rendered inside the beacon. */\n  message?: ReactNode;\n  /** Origin participant name (who is requesting attention). */\n  source?: ReactNode;\n  /** X coordinate in container px. */\n  x: number;\n  /** Y coordinate in container px. */\n  y: number;\n} & Omit<ComponentPropsWithoutRef<\"div\">, \"style\">;\n\n/**\n * Attention-routing beacon. Drop a beacon at the position a remote\n * participant wants to redirect attention to — the local user sees a\n * pulsing ring + optional message at that coordinate. Pure\n * presentation; the host pipes the request through your realtime\n * channel and unmounts the beacon on dismiss.\n *\n * @example\n * ```tsx\n * <HandoffBeacon\n *   x={120}\n *   y={80}\n *   level=\"urgent\"\n *   source=\"Sam\"\n *   message=\"Take this — schema mismatch\"\n * />\n * ```\n *\n * @public\n */\nexport const HandoffBeacon = forwardRef<HTMLDivElement, HandoffBeaconProps>(\n  (props, ref) => {\n    const {\n      className,\n      labels,\n      level = \"info\",\n      message,\n      source,\n      x,\n      y,\n      ...rest\n    } = props;\n    const resolvedLabels = { ...DEFAULT_LABELS, ...labels };\n    return (\n      <div\n        aria-label={resolvedLabels.region}\n        className={cn(\n          \"pointer-events-none absolute z-30 flex -translate-x-1/2 -translate-y-1/2 flex-col items-center gap-1\",\n          className,\n        )}\n        data-handoff-level={level}\n        ref={ref}\n        role=\"status\"\n        style={{ left: `${x.toString()}px`, top: `${y.toString()}px` }}\n        {...rest}\n      >\n        <span\n          aria-hidden=\"true\"\n          className={cn(\n            \"block size-3 rounded-full ring-2 ring-offset-2 ring-offset-background\",\n            LEVEL_DOT[level],\n            LEVEL_RING[level],\n          )}\n        />\n        {source || message ? (\n          <div\n            className=\"pointer-events-auto rounded-md border border-border bg-popover px-2 py-1 text-center text-[11px] font-medium shadow-md\"\n            data-handoff-card\n          >\n            {source ? (\n              <p className=\"text-foreground\">\n                <span className=\"font-semibold\">{source}</span>\n                {message ? (\n                  <span className=\"text-muted-foreground\"> · </span>\n                ) : null}\n                {message ? <span>{message}</span> : null}\n              </p>\n            ) : message ? (\n              <p className=\"text-foreground\">{message}</p>\n            ) : null}\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\nHandoffBeacon.displayName = \"HandoffBeacon\";\n",
      "type": "registry:component"
    }
  ],
  "version": "0.2.1",
  "stability": "stable"
}