SpeedDialAction API
Documentação da API para o componente React SpeedDialAction . Aprenda sobre as propriedades disponíveis e a API CSS.
Importação
import SpeedDialAction from '@mui/material/SpeedDialAction';
// ou
import { SpeedDialAction } from '@mui/material';Nome do componente
The nameMuiSpeedDialAction can be used when providing default props or style overrides in the theme.Propriedades
Props of the Tooltip component are also available.
| Nome | Tipo | Padrão | Descrição |
|---|---|---|---|
| classes | object | Sobrescreve ou extende os estilos aplicados para o componente. Veja a API CSS abaixo para maiores detalhes. | |
| delay | number | 0 | Adds a transition delay, to allow a series of SpeedDialActions to be animated. |
| FabProps | object | {} | Props applied to the Fab component. |
| icon | node | The Icon to display in the SpeedDial Fab. | |
| id | string | This prop is used to help implement the accessibility logic. If you don't provide this prop. It falls back to a randomly generated id. | |
| open | bool | false | Control the popup` open state. |
| sx | func | object | The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details. | |
| TooltipClasses | object | classes prop applied to the Tooltip element. | |
| tooltipOpen | bool | false | Make the tooltip always visible when the SpeedDial is open. |
| tooltipPlacement | 'bottom-end' | 'bottom-start' | 'bottom' | 'left-end' | 'left-start' | 'left' | 'right-end' | 'right-start' | 'right' | 'top-end' | 'top-start' | 'top' | 'left' | Placement of the tooltip. |
| tooltipTitle | node | Label to display in the tooltip. |
O
ref é encaminhado para o elemento raiz.Herança
Embora não explicitamente documentado acima, as propriedades do componente Tooltip também estão disponíveis em SpeedDialAction. Você pode tirar vantagem disso para manipular componentes aninhados.CSS
| Nome da regra | Classe global | Descrição |
|---|---|---|
| fab | .MuiSpeedDialAction-fab | Estilos aplicados a the Fab component. |
| fabClosed | .MuiSpeedDialAction-fabClosed | Estilos aplicados para the Fab component se open={false}. |
| staticTooltip | .MuiSpeedDialAction-staticTooltip | Estilos aplicados para o elemento raiz se tooltipOpen={true}. |
| staticTooltipClosed | .MuiSpeedDialAction-staticTooltipClosed | Estilos aplicados para o elemento raiz se tooltipOpen={true} and open={false}. |
| staticTooltipLabel | .MuiSpeedDialAction-staticTooltipLabel | Estilos aplicados para the static tooltip label se tooltipOpen={true}. |
| tooltipPlacementLeft | .MuiSpeedDialAction-tooltipPlacementLeft | Styles applied to the root element if `tooltipOpen={true}` and `tooltipPlacement="left"`` |
| tooltipPlacementRight | .MuiSpeedDialAction-tooltipPlacementRight | Styles applied to the root element if `tooltipOpen={true}` and `tooltipPlacement="right"`` |
Você pode sobrescrever o estilo do componente usando uma dessas opções de customização:
- With a global class name.
- With a rule name as part of the component's
styleOverridesproperty in a custom theme.