{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "popover",
  "type": "registry:ui",
  "dependencies": [
    "@base-ui/react",
    "clsx",
    "tailwind-merge"
  ],
  "registryDependencies": [
    "https://usva.build/r/overlay-core.json"
  ],
  "files": [
    {
      "path": "popover.tsx",
      "target": "components/ui/popover.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\nimport { Popover as Base } from \"@base-ui/react/popover\";\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\nimport { useScopedTheme } from \"./use-scoped-theme\";\n\nexport type PopoverProps = Base.Root.Props;\n\nfunction PopoverRoot(props: PopoverProps) {\n  return <Base.Root {...props} />;\n}\nPopoverRoot.displayName = \"Popover\";\n\nexport const PopoverTrigger = Base.Trigger;\n\nexport type PopoverContentProps = React.ComponentPropsWithoutRef<\n  typeof Base.Popup\n> & {\n  side?: Base.Positioner.Props[\"side\"];\n  align?: Base.Positioner.Props[\"align\"];\n  sideOffset?: number;\n};\n\nexport const PopoverContent = React.forwardRef<\n  HTMLDivElement,\n  PopoverContentProps\n>(({ className, side, align, sideOffset = 8, children, ...props }, ref) => {\n  const [probe, theme] = useScopedTheme();\n\n  return (\n    <>\n      <span ref={probe} hidden />\n      <Base.Portal>\n        <Base.Positioner\n          data-theme={theme}\n          side={side}\n          align={align}\n          sideOffset={sideOffset}\n          className=\"z-overlay\"\n        >\n          <Base.Popup\n            ref={ref}\n            className={cn(\n              \"rim-light rounded-xl border border-border bg-surface-2 p-4 text-ink shadow-floating outline-none\",\n              \"origin-[var(--transform-origin)] transition-enter duration-base ease-spring motion-reduce:transition-none motion-reduce:transform-none\",\n              \"data-[starting-style]:translate-y-1 data-[starting-style]:scale-[0.97] data-[starting-style]:opacity-0 data-[starting-style]:blur-[2px]\",\n              \"data-[ending-style]:scale-[0.98] data-[ending-style]:opacity-0 data-[ending-style]:duration-fast data-[ending-style]:ease-soft\",\n              className,\n            )}\n            {...props}\n          >\n            {children}\n          </Base.Popup>\n        </Base.Positioner>\n      </Base.Portal>\n    </>\n  );\n});\nPopoverContent.displayName = \"PopoverContent\";\n\nexport const PopoverTitle = React.forwardRef<\n  HTMLHeadingElement,\n  React.ComponentPropsWithoutRef<typeof Base.Title>\n>(({ className, ...props }, ref) => (\n  <Base.Title\n    ref={ref}\n    className={cn(\"text-sm font-semibold text-ink\", className)}\n    {...props}\n  />\n));\nPopoverTitle.displayName = \"PopoverTitle\";\n\nexport const PopoverDescription = React.forwardRef<\n  HTMLParagraphElement,\n  React.ComponentPropsWithoutRef<typeof Base.Description>\n>(({ className, ...props }, ref) => (\n  <Base.Description\n    ref={ref}\n    className={cn(\"text-sm text-muted\", className)}\n    {...props}\n  />\n));\nPopoverDescription.displayName = \"PopoverDescription\";\n\nexport const PopoverClose = React.forwardRef<\n  HTMLButtonElement,\n  React.ComponentPropsWithoutRef<typeof Base.Close>\n>(({ className, ...props }, ref) => (\n  <Base.Close\n    ref={ref}\n    className={cn(\n      \"inline-flex items-center justify-center rounded-md text-muted outline-none\",\n      \"transition-tint duration-fast ease-soft\",\n      \"hover:text-ink focus-visible:ring-focus\",\n      className,\n    )}\n    {...props}\n  />\n));\nPopoverClose.displayName = \"PopoverClose\";\n\nexport const Popover = Object.assign(PopoverRoot, {\n  Trigger: PopoverTrigger,\n  Content: PopoverContent,\n  Title: PopoverTitle,\n  Description: PopoverDescription,\n  Close: PopoverClose,\n});\n"
    }
  ]
}