Pular para o conteúdo

FormHelperText API

Documentação da API para o componente React FormHelperText . Aprenda sobre as propriedades disponíveis e a API CSS.

Importação

import FormHelperText from '@mui/material/FormHelperText';
// ou
import { FormHelperText } from '@mui/material';
Você pode aprender sobre a diferença lendo este guia sobre como minimizar o tamanho do pacote.

Nome do componente

The name MuiFormHelperText can be used when providing default props or style overrides in the theme.

Propriedades

Props of the nativo component are also available.

NomeTipoPadrãoDescrição
childrennode
The content of the component.
If ' ' is provided, the component reserves one line height for displaying a future message.
classesobject
Sobrescreve ou extende os estilos aplicados para o componente. Veja a API CSS abaixo para maiores detalhes.
componentelementType
The component used for the root node. Either a string to use a HTML element or a component.
disabledboolfalse
If true, the helper text should be displayed in a disabled state.
errorboolfalse
If true, helper text should be displayed in an error state.
filledboolfalse
If true, the helper text should use filled classes key.
focusedboolfalse
If true, the helper text should use focused classes key.
margin'dense'
If dense, will adjust vertical spacing. This is normally obtained via context from FormControl.
requiredboolfalse
If true, the helper text should use required classes key.
sxfunc
| object
The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details.
variant'filled'
| 'outlined'
| 'standard'
A variante a usar.

O ref é encaminhado para o elemento raiz.

CSS

Nome da regraClasse globalDescrição
root.MuiFormHelperText-rootEstilos aplicados ao elemento raiz.
error.Mui-errorPseudo-class aplicada a o elemento raiz se error={true}.
disabled.Mui-disabledPseudo-class aplicada a o elemento raiz se disabled={true}.
sizeSmall.MuiFormHelperText-sizeSmallEstilos aplicados para o elemento raiz se size="small".
contained.MuiFormHelperText-containedEstilos aplicados para o elemento raiz se variant="filled" or variant="outlined".
focused.Mui-focusedPseudo-class aplicada a o elemento raiz se focused={true}.
filled.MuiFormHelperText-filledPseudo-class aplicada a o elemento raiz se filled={true}.
required.Mui-requiredPseudo-class aplicada a o elemento raiz se required={true}.

Você pode sobrescrever o estilo do componente usando uma dessas opções de customização:

Demonstrações