Popover

Floating content panel anchored to a trigger element. Built on Radix Popover — ideal for settings, filters, and inline forms.

Import

import {
  Popover,
  PopoverContent,
  PopoverTrigger,
} from "poyraz-ui/molecules";

Default

Click the trigger to open a popover panel.

<Popover>
  <PopoverTrigger asChild>
    <Button variant="outline">Open Popover</Button>
  </PopoverTrigger>
  <PopoverContent className="w-80">
    <div className="grid gap-4">
      <div className="space-y-2">
        <h4 className="font-medium leading-none">Dimensions</h4>
        <p className="text-sm text-slate-500">
          Set the dimensions for the layer.
        </p>
      </div>
    </div>
  </PopoverContent>
</Popover>

pnpm dlx shadcn@latest add @poyraz/popover

Runtime dependencies

@radix-ui/react-popover@^1.1.15

Registry dependencies

@poyraz/poyraz-utils, @poyraz/poyraz-theme, @poyraz/poyraz-recipes

Installed files

@ui/molecules/popover.tsx