BwBottomSheet | bw-bottom-sheet
Overview
The bottom sheet component is a modal that slides up from the bottom of the screen.
Properties
| Property | Attribute | Description | Type | Default |
|---|---|---|---|---|
destroy | destroy | Optionally execute a promise before closing begins | () => void | Promise<void> | undefined |
init | init | Optionally execute a promise before presentation begins | () => void | Promise<void> | undefined |
maxPercent | max-percent | Maximum height (expanded fullscreen). | number | 90 |
midPercent | mid-percent | Intermediate height (mid state). | number | 60 |
minPercent | min-percent | Minimum height (collapsed state). | number | 30 |
open | open | Opens and closes modal | boolean | false |
Events
| Event | Description | Type |
|---|---|---|
openChange | Emits when the bottom sheet is toggled | CustomEvent<boolean> |
ready | The event emitted when the component has completed it's first render | CustomEvent<any> |
sheetDismiss | The event emitted when the bottom sheet is dismissed | CustomEvent<{ role?: string; data?: any; }> |
sheetPresent | The event emitted when the bottom sheet is presented | CustomEvent<any> |
Methods
dismiss(role?: string, data?: any) => Promise<void>
Dismisses the bottom sheet
Parameters
| Name | Type | Description |
|---|---|---|
role | string | - The role of the dismiss |
data | any | - The data of the dismiss |
Returns
Type: Promise<void>
present() => Promise<void>
Presents the bottom sheet
Returns
Type: Promise<void>
Slots
| Slot | Description |
|---|---|
| The content of the bottom sheet | |
"trigger" | The trigger element of the bottom sheet |
Shadow Parts
| Part | Description |
|---|---|
"dialog" | The dialog element of the bottom sheet |
"inner-container" | The inner container of the bottom sheet |
Dependencies
Used by
Graph
© 2025 United Systems & Software - All Rights Reserved.