{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"popover","type":"registry:ui","title":"Popover","description":"A small panel anchored to a trigger for quick settings or details.","dependencies":["@radix-ui/react-popover","clsx","tailwind-merge"],"registryDependencies":["https://caliperui.site/r/styles.json"],"files":[{"path":"ui/lib/cn.ts","type":"registry:ui","target":"components/ui/lib/cn.ts","content":"import { clsx, type ClassValue } from \"clsx\";\nimport { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMerge = extendTailwindMerge({\n  extend: { theme: { radius: [\"control\", \"surface\", \"overlay\"], shadow: [\"overlay\"] } },\n});\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n"},{"path":"ui/popover.tsx","type":"registry:ui","target":"components/ui/popover.tsx","content":"\"use client\";\n\nimport * as Primitive from \"@radix-ui/react-popover\";\nimport type { ComponentProps } from \"react\";\nimport { cn } from \"./lib/cn\";\nimport \"./shared/popover-content.css\";\nimport \"./popover.css\";\n\nexport const Popover = Primitive.Root;\nexport const PopoverTrigger = Primitive.Trigger;\nexport const PopoverClose = Primitive.Close;\nexport const PopoverAnchor = Primitive.Anchor;\n\nexport function PopoverContent({\n  className,\n  sideOffset = 8,\n  collisionPadding = 16,\n  arrow = false,\n  children,\n  ...props\n}: ComponentProps<typeof Primitive.Content> & {\n  /** Points at the trigger and follows collision shifts. */\n  arrow?: boolean;\n}) {\n  return (\n    <Primitive.Portal>\n      <Primitive.Content\n        data-slot=\"popover-content\"\n        sideOffset={sideOffset}\n        collisionPadding={collisionPadding}\n        className={cn(\n          \"z-50 w-80 max-w-[calc(100vw-2rem)] max-h-[var(--radix-popover-content-available-height)] overflow-y-auto rounded-surface border border-border bg-elevated p-3.5 text-sm text-foreground shadow-overlay outline-none\",\n          arrow && \"overflow-visible\",\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        {arrow && <Primitive.Arrow data-slot=\"popover-arrow\" width={14} height={7} />}\n      </Primitive.Content>\n    </Primitive.Portal>\n  );\n}\n"},{"path":"ui/shared/popover-content.css","type":"registry:file","target":"components/ui/shared/popover-content.css","content":"/* Shared by date-input.tsx, popover.tsx; each imports it. Edit freely. */\n@layer theme, base, components, utilities;\n\n@layer components {\n  [data-slot=\"popover-content\"] {\n    transform-origin: var(--radix-popover-content-transform-origin);\n  }\n  [data-slot=\"popover-content\"][data-state=\"open\"] {\n    animation: caliper-dialog-enter var(--duration-normal) var(--ease-settle);\n  }\n  [data-slot=\"popover-content\"][data-state=\"closed\"] {\n    animation: caliper-fade-out var(--duration-fast) var(--ease-in) forwards;\n    pointer-events: none;\n  }\n\n  @media (prefers-reduced-motion: reduce) {\n    [data-slot=\"popover-content\"] {\n      animation: none;\n    }\n    /* Preserve the exit name for Radix Presence's completion matcher, including\n       a preference changed during exit. No visual motion or unmount timer. */\n    [data-slot=\"popover-content\"][data-state=\"closed\"] {\n      animation: caliper-fade-out var(--duration-instant) var(--ease-in) forwards !important;\n    }\n  }\n}\n\n[data-slot=\"popover-content\"] {\n  background-color: var(--elevated-glass);\n  border-color: color-mix(in srgb, var(--edge-light) 45%, var(--border));\n  backdrop-filter: blur(var(--blur-overlay));\n  box-shadow:\n    var(--shadow-overlay),\n    0 0 40px var(--edge-glow),\n    inset 0 1px 0 var(--edge-light);\n}\n"},{"path":"ui/popover.css","type":"registry:file","target":"components/ui/popover.css","content":"/* popover.tsx's styles; it imports this file. Edit freely. */\n@layer theme, base, components, utilities;\n\n@layer components {\n  [data-slot=\"popover-arrow\"] {\n    fill: var(--elevated);\n  }\n}\n"}],"categories":["overlays"],"meta":{"tier":"free","license":"MIT","family":"overlays-and-tabs","docs":"/docs/components/popover"}}