{
  "name": "preview-card",
  "type": "registry:ui",
  "title": "Preview Card",
  "description": "Optional profile, repository, term or product previews shown from a hoverable and focusable trigger.",
  "registryDependencies": [
    "@siteplane/base"
  ],
  "dependencies": [
    "@base-ui/react@1.5.0"
  ],
  "files": [
    {
      "path": "src/components/ui/preview-card.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { PreviewCard as PreviewCardPrimitive } from \"@base-ui/react/preview-card\";\nimport type React from \"react\";\nimport { SiteplaneUIPortalScope } from \"@/components/ui/siteplane-provider\";\nimport { surfaceClassNames } from \"@/components/ui/surface\";\nimport { cn } from \"@/lib/utils\";\n\nexport const PreviewCard: typeof PreviewCardPrimitive.Root =\n  PreviewCardPrimitive.Root;\n\nexport function PreviewCardTrigger({\n  ...props\n}: PreviewCardPrimitive.Trigger.Props): React.ReactElement {\n  return (\n    <PreviewCardPrimitive.Trigger data-slot=\"preview-card-trigger\" {...props} />\n  );\n}\n\nexport function PreviewCardPopup({\n  className,\n  children,\n  align = \"center\",\n  sideOffset = 4,\n  anchor,\n  portalProps,\n  ...props\n}: PreviewCardPrimitive.Popup.Props & {\n  align?: PreviewCardPrimitive.Positioner.Props[\"align\"];\n  sideOffset?: PreviewCardPrimitive.Positioner.Props[\"sideOffset\"];\n  anchor?: PreviewCardPrimitive.Positioner.Props[\"anchor\"];\n  portalProps?: PreviewCardPrimitive.Portal.Props;\n}): React.ReactElement {\n  return (\n    <PreviewCardPrimitive.Portal {...portalProps}>\n      <SiteplaneUIPortalScope>\n        <PreviewCardPrimitive.Positioner\n          align={align}\n          anchor={anchor}\n          className=\"z-50\"\n          data-slot=\"preview-card-positioner\"\n          sideOffset={sideOffset}\n        >\n          <PreviewCardPrimitive.Popup\n            className={cn(\n              surfaceClassNames.floatingOverlay,\n              \"flex w-64 origin-(--transform-origin) text-balance rounded-lg p-4 text-sm before:rounded-[inherit]\",\n              className,\n            )}\n            data-slot=\"preview-card-popup\"\n            {...props}\n          >\n            {children}\n          </PreviewCardPrimitive.Popup>\n        </PreviewCardPrimitive.Positioner>\n      </SiteplaneUIPortalScope>\n    </PreviewCardPrimitive.Portal>\n  );\n}\n\nexport { PreviewCardPrimitive };\n"
    }
  ],
  "categories": [
    "overlays"
  ],
  "docs": "# Preview Card\n\n> Siteplane UI release `0.1.1`.\n\n## Public Purpose\n\nUse Preview Card for optional supporting previews such as profiles, repositories, terms or products that appear from a hoverable and focusable trigger.\n\n## Import\n\n```tsx\nimport {\n  PreviewCard,\n  PreviewCardTrigger,\n  PreviewCardPopup,\n} from \"@/components/ui/preview-card\";\n```\n\n`import { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\";`\n\n`import { Badge } from \"@/components/ui/badge\";`\n\n`import { Button } from \"@/components/ui/button\";`\n\n## Public API\n\n- Compose `PreviewCard`, `PreviewCardTrigger` and `PreviewCardPopup`.\n- `PreviewCardTrigger` renders a link by default and accepts Base UI's `render` prop for another interactive element.\n- `PreviewCardPopup` accepts placement props including `side`, `align`, `sideOffset` and `anchor`; `anchor` can point at a different element or virtual position.\n- Keep popup content compact and non-essential because it is supplementary to the trigger's destination.\n\n## Public Motion\n\n- The popup uses the native Siteplane floating-panel scale and opacity transition.\n- Open delay, close behavior and reduced motion remain controlled by the Preview Card primitive and global motion layer.\n\n## Public Accessibility\n\n- The trigger must be an interactive element with its own accessible name and keyboard focus.\n- The preview opens from both hover and focus; preserve Escape behavior.\n- Images need useful alt text or a text fallback, and any popup action needs a clear accessible name.\n\n## Public Agent Guidance\n\n- Never put required instructions, validation or critical status only inside a Preview Card.\n- Do not render a popup without an interactive trigger or a deliberate `anchor` relationship.\n- Use Popover instead when the floating content itself is the primary interactive task.\n\n## Public Links\n\n- [Documentation and preview](https://ui.siteplane.io/docs/components/overlays/preview-card)\n\n- [Registry source](https://ui.siteplane.io/r/preview-card.json)\n",
  "meta": {
    "siteplane:agentContractVersion": 1,
    "siteplane:docs": "https://ui.siteplane.io/docs/components/overlays/preview-card",
    "siteplane:releaseVersion": "0.1.1",
    "siteplane:sourceOwned": true
  },
  "devDependencies": []
}