StepContent API
Demos
For examples and details on the usage of this React component, visit the component demo pages:
Import
import StepContent from '@mui/material/StepContent';
// or
import { StepContent } from '@mui/material';Props
Props of the native component are also available.
| Name | Type | Default | Description | 
|---|---|---|---|
| children | node | The content of the component.  | |
| classes | object | Override or extend the styles applied to the component. See CSS API below for more details.  | |
| sx | Array<func | object | bool> | func | object  | The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details.  | |
| TransitionComponent | elementType | Collapse | The component used for the transition. Follow this guide to learn more about the requirements for this component.  | 
| transitionDuration | 'auto' | number | { appear?: number, enter?: number, exit?: number }  | 'auto' | Adjust the duration of the content expand transition. Passed as a prop to the transition component. Set to 'auto' to automatically calculate transition time based on height.  | 
| TransitionProps | object | Props applied to the transition element. By default, the element is based on this  Transition component. | 
The
ref is forwarded to the root element.Theme default props
You can useMuiStepContent to change the default props of this component with the theme.CSS
| Rule name | Global class | Description | 
|---|---|---|
| root | .MuiStepContent-root | Styles applied to the root element. | 
| last | .MuiStepContent-last | Styles applied to the root element if last={true} (controlled by Step). | 
| transition | .MuiStepContent-transition | Styles applied to the Transition component. | 
You can override the style of the component using one of these customization options:
- With a global class name.
 - With a rule name as part of the component's 
styleOverridesproperty in a custom theme.