Interaction Modes
The ActionSheet enables you to set its initial expanded state and change it on demand by using the available API options.
Setting the Initial State
By default, the ActionSheet is collapsed. To expand it, set the expanded
property to true
. The property supports a two-way binding and can be programmatically updated to immediately expand or collapse the ActionSheet without triggering the animation
.
Toggling between States
You can switch between the expanded and collapsed states of the ActionSheet with the toggle
method. This method triggers the animation
of the ActionSheet, as opposed to setting the expanded state initially.
Closing on Overlay Click
By default, the ActionSheet component does not collapse when clicking its overlay. To close the ActionSheet on overlay click, set the overlayClickClose
property of the component to true
.