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.
API reference
Here's the full contract for action-sheet: everything you can bind, listen to, project and theme, gathered in one place. Wire up what you need and style what you want — it's standalone and signal-friendly.
Inputs
Dial action-sheet in with 10 inputs. Bind them like any Angular @Input.
| Name | Type | Default | Description |
|---|---|---|---|
buttonsRequired | (HubActionSheetButton | HubActionSheetGroup)[] | — | The actions, flat or in titled groups. |
header | string | — | Title of the sheet, and its accessible name. |
subHeader | string | — | Secondary line under the header. |
variant | string | — | Semantic accent, read as --hub-sys-color-<variant>. |
backdropDismiss | boolean | true | Clicking the backdrop dismisses the sheet. |
keyboard | boolean | true | Escape dismisses the sheet. |
swipeToClose | boolean | true | Dragging the sheet down past its threshold dismisses it. |
animation | boolean | true | Animate entry and exit. Ignored under prefers-reduced-motion. |
panelClass | string | string[] | — | Extra classes on the sheet element, for theming one sheet. |
ariaLabel | string | — | Accessible name when there is no header to give one. |
Outputs
No outputs documented yet.
Methods
Drive action-sheet from code — 5 methods on its programmatic surface.
| Name | Signature | Returns | Description |
|---|---|---|---|
HubActionSheet.open | open<D>(options: HubActionSheetOptions<D>): HubActionSheetRef<D> | — | Mounts a sheet on the document and returns the handle to its outcome. |
HubActionSheetRef.result | result: Promise<HubActionSheetResult<D>> | — | Resolves once: with the role and data of the chosen action, or with how the sheet was dismissed. |
HubActionSheetRef.closed$ | closed$: Observable<HubActionSheetResult<D>> | — | The same value as result, for callers living in streams. |
HubActionSheetRef.dismiss | dismiss(role?: 'backdrop' | 'escape' | 'swipe' | string): void | — | Closes the sheet from the outside, reporting the given role. |
provideHubActionSheet | provideHubActionSheet(config: Partial<HubActionSheetConfig>): EnvironmentProviders | — | Sets the application-wide defaults every sheet starts from. |
Templates
No templates documented yet.