Popover
Popover
Un Popover di Radix — contenuto fluttuante, non modale, ancorato a un trigger, chiuso da un click esterno. La base per Select, DateRangePicker e altri.
import { Popover, PopoverTrigger, PopoverContent } from "@pompeitech/vesuvius-ui";Default
API
Popover
| Prop | Tipo | Default | Descrizione |
|---|---|---|---|
open | boolean | Stato aperto controllato. | |
defaultOpen | boolean | false | Stato iniziale, non controllato. |
onOpenChange | (open: boolean) => void | ||
modal | boolean | false | true intrappola il focus e blocca l'interazione esterna come un dialog; il default false lascia che focus e interazione passino al resto della pagina. |
PopoverTrigger — ogni prop nativa di <button>, più asChild (boolean, default false).
PopoverContent
| Prop | Tipo | Default | Descrizione |
|---|---|---|---|
side | "top" | "right" | "bottom" | "left" | "bottom" | Su quale lato del trigger renderizzare. |
align | "start" | "center" | "end" | "center" | Allineamento lungo quel lato. |
sideOffset | number | 4 | Distanza dal trigger, in px. |
Più ogni prop nativa di <div>; renderizzato in un Portal, e si riposiziona automaticamente per restare dentro il viewport.
Accessibilità
Si chiude con Esc o un click/focus esterno per default e restituisce il focus al trigger. A differenza di Dialog, è non modale per default (modal={false}) — il focus non è intrappolato, quindi il contenuto fuori da esso resta operabile mentre è aperto; usalo per contenuto ausiliario (un form di filtro, un editor inline), non per un flusso di conferma completo.