Skip to content

[Stack] Ensure that marginundefined doesn't occur in styling #33548

Merged
hbjORbj merged 7 commits intomui:masterfrom
hbjORbj:fix/stack-direction-prop
Jul 20, 2022
Merged

[Stack] Ensure that marginundefined doesn't occur in styling #33548
hbjORbj merged 7 commits intomui:masterfrom
hbjORbj:fix/stack-direction-prop

Conversation

@hbjORbj
Copy link
Copy Markdown
Contributor

@hbjORbj hbjORbj commented Jul 17, 2022

Closes #32196

Problem:

  • If direction prop receives a responsive value such that it doesn't start with the smallest breakpoint, such as direction={{ lg: 'row' }}, for the breakpoints below lg, "marginundefined": "0px"is being used in styling instead of "marginLeft": "0px" (for row direction) or "marginTop": "0px" (for column direction).
  • This function in line 86 results in undefined because directionValues[breakpoint] in the next line, line 87, is undefined.

Solution:

  • Ensure that this function in line 86 never results in undefined, by ensuring that directionValues[breakpoint] in the next line, line 87, is not undefined.

Codesandboxes:

@mui-bot
Copy link
Copy Markdown

mui-bot commented Jul 17, 2022

Details of bundle changes

Generated by 🚫 dangerJS against 73cc0a6

@hbjORbj hbjORbj added type: bug It doesn't behave as expected. package: material component: Stack The React component. labels Jul 17, 2022
@hbjORbj hbjORbj self-assigned this Jul 17, 2022
Comment thread packages/mui-material/src/Stack/Stack.test.js
Comment thread packages/mui-material/src/Stack/Stack.js
Comment thread packages/mui-material/src/Stack/Stack.test.js
@hbjORbj hbjORbj requested a review from mnajdova July 19, 2022 10:16
Comment thread packages/mui-material/src/Stack/Stack.test.js Outdated
Copy link
Copy Markdown
Member

@mnajdova mnajdova left a comment

Choose a reason for hiding this comment

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

LGTM

@hbjORbj hbjORbj force-pushed the fix/stack-direction-prop branch from 7d49ca8 to f4d3d6f Compare July 19, 2022 15:52
@hbjORbj hbjORbj merged commit 21dbf22 into mui:master Jul 20, 2022
@hbjORbj hbjORbj mentioned this pull request Jul 20, 2022
1 task
daniel-rabe pushed a commit to daniel-rabe/material-ui that referenced this pull request Nov 29, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

component: Stack The React component. type: bug It doesn't behave as expected.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Stack] direction prop with array notation breaks spacing prop

3 participants