Popover

Overlays · Guide 10 of 46

Open the live Popover demo →

Purpose

Floating panel anchored to a trigger.

Import

<script lang="ts">
	import { Popover } from 'bits-ui';
</script>

The registry names Popover as this guide’s namespace. Copy the exact root and part composition from the live demo rather than guessing part names.

Usage checklist

• Give the trigger and surfaced content useful accessible names.
• Verify focus entry, Escape behavior, and focus restoration.
• Test viewport collisions, page scrolling, and stacking with other overlays.

Secondary reference

After using the local example, consult the upstream Bits UI reference for exhaustive API details.

Continue

• Previous: Alert Dialog
• Index: All component guides
• Next: Tooltip