[material-ui][system] Remove deprecated system props from Box, Stack, Typography by siriwatknp · Pull Request #48072 · mui/material-ui (original) (raw)

… Typography

Remove extendSxProp from Box (createBox), Stack (createStack), Typography. Remove SystemProps from type definitions (BoxOwnProps, StackOwnProps, StackProps, TypographyOwnProps). Remove internal_createExtendSxProp from zero-styled. Update all tests, docs demos, and type specs to use sx prop. Update migration guide.

marked this pull request as draft

March 23, 2026 14:43

Co-Authored-By: Claude Opus 4.6 (1M context) noreply@anthropic.com

…eline demos

Co-Authored-By: Claude Opus 4.6 (1M context) noreply@anthropic.com

System props are removed, so color is now only a component prop handled by styled variants in TypographyRoot.

Co-Authored-By: Claude Opus 4.6 (1M context) noreply@anthropic.com

System props are removed, so the v5 color prop escape hatch that allowed arbitrary strings is no longer needed.

Co-Authored-By: Claude Opus 4.6 (1M context) noreply@anthropic.com

…it to Link color type

Co-Authored-By: Claude Opus 4.6 (1M context) noreply@anthropic.com

Link now moves color="text.secondary", color="text.primary", etc. to sx while keeping named colors (primary, secondary, inherit) as component props.

Co-Authored-By: Claude Opus 4.6 (1M context) noreply@anthropic.com

The v6 codemod is for v5→v6 migration (system props deprecated). The v9 codemod is for v6→v9 migration (system props removed).

Co-Authored-By: Claude Opus 4.6 (1M context) noreply@anthropic.com

…cases to v9 codemod

Co-Authored-By: Claude Opus 4.6 (1M context) noreply@anthropic.com

Add ?. to .startsWith() and .match() calls in typographyColorMatcher and Link matcher to prevent crashes when color prop is an expression (e.g., color={someVar}) where val.value is undefined.

Co-Authored-By: Claude Opus 4.6 (1M context) noreply@anthropic.com

This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.Learn more about bidirectional Unicode characters

[ Show hidden characters]({{ revealButtonHref }})