A floating popover panel anchored to a trigger, built on Base UI primitives.
"use client"; import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover"; export default function Default() { return ( <div className="flex min-h-screen w-full items-center justify-center bg-background p-8"> <Popover> <PopoverTrigger className="rounded-lg border bg-popover px-5 py-3 text-base shadow-sm"> Open popover </PopoverTrigger> <PopoverContent className="w-72"> <div className="space-y-2"> <p className="font-medium">Popover content</p> <p className="text-sm text-muted-foreground">A floating panel anchored to its trigger.</p> </div> </PopoverContent> </Popover> </div> ); }