SpeedDial
When pressed, a floating action button can display three to six related actions in the form of a speed dial.
If more than six actions are needed, something other than a FAB should be used to present them.
Upon press, the FAB remains visible and emits a stack of related actions.
If the FAB is tapped in this state, it should either initiate its default action or close the speed dial actions.
Components
- SpeedDial.Action Adds Action to the SpeedDial. This, Receieve all Fab props.
Usage
Props
SpeedDial
SpeedDial.Action
None
Reference
SpeedDial
backdropPressableProps
Props for Backdrop Pressable
Type | Default |
---|---|
PressableProps | None |
children
SpeedDial Action as children.
Type | Default |
---|---|
any[] and ReactNode | None |
isOpen
Opens the action stack.
Type | Default |
---|---|
boolean | None |
onClose
Callback fired when the component requests to be closed.
Type | Default |
---|---|
Function | Function |
onOpen
Callback fired when the component requests to be open.
Type | Default |
---|---|
Function | Function |
openIcon
Icon shown on FAB when action stack is open.
Type | Default |
---|---|
any | None |
overlayColor
Add overlay color to the speed dial.
Type | Default |
---|---|
string | None |
transitionDuration
The duration for the transition, in milliseconds.
Type | Default |
---|---|
number | 150 |
SpeedDial.Action
None