Drawer is an overlay panel that slides in from the right side of the screen and keeps the current page as context. It can contain any custom side content, including forms, filters, record details, settings, previews, history, activity feeds, help content, quick actions, or another secondary workflow.
Use it when the main screen should stay visible as context while related content opens beside it. Drawer can show a backdrop or stay non-blocking with [showBackdrop]="false". Do not use it for a centered modal workflow, short confirmation, mobile bottom action panel, or primary persistent application navigation.
- Side overlay: Slides out from the right side of the screen.
- Custom content: Project any content needed for the secondary panel.
- Backdrop support: Use a blocking backdrop or a non-blocking drawer.
- Overlay integration: Built on Angular CDK Overlay with close behavior for backdrop, outside click, and Escape.