Angular Action Sheet | ng-hub-ui-action-sheet
Angular action sheet opened from a service: actions with roles, grouped or flat, handlers that can refuse to close, and dismissal by backdrop, keyboard or a drag of the sheet.
Interactive examples
Explore live examples that show how the library behaves in common Angular use cases.
Opening a sheet
The sheet is opened from a service and answers once, so nothing about it sits in the page while it is closed.
Opening a sheet
Roles and handlers
A role decides where an action sits and how it reads; a handler decides whether the sheet may close at all.
Roles and a handler that refuses
Grouped actions
Blocks with their own titles, for a sheet long enough that a flat list would stop reading as one.
Grouped actions
pdfAccent and tokens
One semantic accent for the whole sheet, and a CSS variable for every visual decision under it.
Accent and tokens
The accent colours the selected action; the branded sheet also changes its radius, its touch targets and the width it is allowed to take.