<wa-popup>

Popups declaratively anchor one element to another and keep them positioned together as the page scrolls or resizes. Primarily a low-level building block for popovers, dropdowns, and tooltips.

Category

Overlays

Built with

Lit

Library

Web Awesome

Author

Web Awesome

Package

@awesome.me/webawesome

Component size

14.1 kB JS (minified + gzipped, JS includes dependencies beyond the library)

Library size

8.2 kB JS (shared by every Web Awesome component, loaded once per page)

Popular

5 out of 5

Downloads

364,100/week · jsDelivr 33,855,650 hits/month (whole @awesome.me/webawesome package)

GitHub stars

1,348

Latest stable version

3.14.0

Last published

Sep 24, 2026

Component last changed

Dec 16, 2025 (in 3.1.0)

License

MIT

Status

stable

• Documentation
• Demo
• Source code

Attributes

• anchor
• active
• placement
• boundary
• distance
• skidding
• arrow
• arrow-placement
• arrow-padding
• flip
• flip-fallback-placements
• flip-fallback-strategy
• flipBoundary
• flip-padding
• shift
• shiftBoundary
• shift-padding
• auto-size
• sync
• autoSizeBoundary
• auto-size-padding
• hover-bridge
• dir
• lang
• did-ssr

Slots

• anchor

Events

• wa-reposition

CSS Parts

• arrow
• popup
• hover-bridge