Skip to content

[StepConnector][StepContent][StepLabel] Remove deprecated props and classes#48058

Merged
siriwatknp merged 12 commits intomui:masterfrom
siriwatknp:remove-deprecated-step-props
Mar 23, 2026
Merged

[StepConnector][StepContent][StepLabel] Remove deprecated props and classes#48058
siriwatknp merged 12 commits intomui:masterfrom
siriwatknp:remove-deprecated-step-props

Conversation

@siriwatknp
Copy link
Member

Summary

Remove all deprecated props and classes from Step* components:

  • StepConnector: Remove deprecated classes lineHorizontal and lineVertical
  • StepContent: Remove deprecated props TransitionComponent and TransitionProps
  • StepLabel: Remove deprecated props componentsProps, StepIconComponent, and StepIconProps

Breaking changes

StepConnector

  • lineHorizontal class removed — combine .MuiStepConnector-horizontal and .MuiStepConnector-line instead
  • lineVertical class removed — combine .MuiStepConnector-vertical and .MuiStepConnector-line instead

StepContent

  • TransitionComponent prop removed — use slots.transition instead
  • TransitionProps prop removed — use slotProps.transition instead

StepLabel

  • componentsProps prop removed — use slotProps instead
  • StepIconComponent prop removed — use slots.stepIcon instead
  • StepIconProps prop removed — use slotProps.stepIcon instead

Codemods available:

npx @mui/codemod@latest deprecations/step-connector-classes <path>
npx @mui/codemod@latest deprecations/step-content-props <path>
npx @mui/codemod@latest deprecations/step-label-props <path>

Relates to #47987

@siriwatknp siriwatknp added breaking change Introduces changes that are not backward compatible. package: material-ui Specific to Material UI. labels Mar 23, 2026
@mui-bot
Copy link

mui-bot commented Mar 23, 2026

Netlify deploy preview

Bundle size report

Bundle Parsed size Gzip size
@mui/material ▼-244B(-0.05%) ▼-105B(-0.07%)
@mui/lab 0B(0.00%) 0B(0.00%)
@mui/system 0B(0.00%) 0B(0.00%)
@mui/utils 0B(0.00%) 0B(0.00%)

Details of bundle changes

Generated by 🚫 dangerJS against e36a6b5


if (transitionDurationProp === 'auto' && !TransitionComponent.muiSupportAuto) {
const TransitionSlotComponent = slots.transition ?? StepContentTransition;
if (transitionDurationProp === 'auto' && !TransitionSlotComponent.muiSupportAuto) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

StepContentTransition.muiSupportAuto will always be undefined in this check because it's checking a styled wrapper as opposed to the raw Collapse component like before

The Claude code suggested fix is to follow Popover and pass Collapse as the elementType param of useSlot:

const [TransitionSlot, transitionSlotProps] = useSlot('transition', {
elementType: Grow,

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you check again, I simplify it without removing the StepContentTransition styled component.

@github-actions github-actions bot added the PR: out-of-date The pull request has merge conflicts and can't be merged. label Mar 23, 2026
@github-actions github-actions bot removed the PR: out-of-date The pull request has merge conflicts and can't be merged. label Mar 23, 2026
Copy link
Member

@mj12albert mj12albert left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good ~

@siriwatknp siriwatknp enabled auto-merge (squash) March 23, 2026 08:16
@siriwatknp siriwatknp merged commit 04816a1 into mui:master Mar 23, 2026
23 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

breaking change Introduces changes that are not backward compatible. package: material-ui Specific to Material UI.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants