Popover

Displays rich content in a portal, triggered by a button.

Installation

npx shadcn@latest add https://spoke.georgedrury.co.uk/r/popover

Lineage

Spoke

Anatomy

import {
	Popover,
	PopoverTrigger,
	PopoverContent,
} from "@/components/ui/popover"

export default () => (
	<Popover>
		<PopoverTrigger />
		<PopoverContent />
	</Popover>
)

Spoke utility classes

Class	Fallback chain	Description
`--popover-content`	`var(--popover)`	Colour for content popover variant
`--popover-content-foreground`	`var(--popover-foreground)`	Text/icon colour for content popover variant
`--popover-border`	`var(--border)`	Border colour for popover
`--popover-radius`	`var(--radius-md)`	Border radius for popover
`--shadow-popover`	`var(--shadow-md)`	Box shadow for popover