Popconfirm - Svelte Pure Admin

Basic Popconfirms

Compact Variant

Are you sure you want to delete this item? This action cannot be undone.

Archive this item? It will be moved to the archive folder.

Reset all settings to default values?

Delete this item?

Remove this item?

Confirm this action?

This action is destructive and cannot be undone.

Please review this action carefully before proceeding.

This will update your preferences. Continue?

ID	Name	Status
1	John Doe	Active
2	Jane Smith	Pending
3	Bob Johnson	Inactive

Delete John Doe?

Delete Jane Smith?

Delete Bob Johnson?

Since v1.5.1, Popconfirm automatically handles triggers inside Shadow DOM (e.g. web-grid toolbar buttons). No extra code needed — just pass the trigger element from the event detail. Hover a row below and click the delete button to see it in action.

Key Points

Single instance — one <Popconfirm> for all rows, driven by reactive state
Shadow DOM — web-grid toolbar buttons live inside Shadow DOM; the triggerElement from the event detail is passed directly and positioning works automatically
Dynamic callback — store the delete callback in state so onconfirm calls the right handler per row
No extra config — the Shadow DOM proxy (v1.5.1) creates a light-DOM mirror element for Floating UI positioning

Settings

John Doe

Popconfirm Component

Basic Popconfirms

Compact Variant

Position Variants

Icon Variants

Table with Popconfirms

WebGrid Integration (Shadow DOM)

Key Points

Settings

John Doe

Popconfirm Component

Basic Popconfirms

Compact Variant

Position Variants

Icon Variants

Table with Popconfirms

WebGrid Integration (Shadow DOM)

Key Points

Keyboard Shortcuts