-
-
Notifications
You must be signed in to change notification settings - Fork 32.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge remote-tracking branch 'upstream/next' into feat/sx-prop-docs-page
- Loading branch information
Showing
34 changed files
with
816 additions
and
300 deletions.
There are no files selected for viewing
This file contains 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
This file contains 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
This file contains 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
This file contains 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
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains 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
This file contains 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
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,115 @@ | ||
| const boxProps = [ | ||
| 'border', | ||
| 'borderTop', | ||
| 'borderRight', | ||
| 'borderBottom', | ||
| 'borderLeft', | ||
| 'borderColor', | ||
| 'borderRadius', | ||
| 'displayPrint', | ||
| 'display', | ||
| 'overflow', | ||
| 'textOverflow', | ||
| 'visibility', | ||
| 'whiteSpace', | ||
| 'flexDirection', | ||
| 'flexWrap', | ||
| 'justifyContent', | ||
| 'alignItems', | ||
| 'alignContent', | ||
| 'order', | ||
| 'flex', | ||
| 'flexGrow', | ||
| 'flexShrink', | ||
| 'alignSelf', | ||
| 'color', | ||
| 'bgcolor', | ||
| 'position', | ||
| 'zIndex', | ||
| 'top', | ||
| 'right', | ||
| 'bottom', | ||
| 'left', | ||
| 'boxShadow', | ||
| 'width', | ||
| 'maxWidth', | ||
| 'minWidth', | ||
| 'height', | ||
| 'maxHeight', | ||
| 'minHeight', | ||
| 'boxSizing', | ||
| 'm', | ||
| 'mt', | ||
| 'mr', | ||
| 'mb', | ||
| 'ml', | ||
| 'mx', | ||
| 'my', | ||
| 'p', | ||
| 'pt', | ||
| 'pr', | ||
| 'pb', | ||
| 'pl', | ||
| 'px', | ||
| 'py', | ||
| 'margin', | ||
| 'marginTop', | ||
| 'marginRight', | ||
| 'marginBottom', | ||
| 'marginLeft', | ||
| 'marginX', | ||
| 'marginY', | ||
| 'padding', | ||
| 'paddingTop', | ||
| 'paddingRight', | ||
| 'paddingBottom', | ||
| 'paddingLeft', | ||
| 'paddingX', | ||
| 'paddingY', | ||
| 'fontFamily', | ||
| 'fontSize', | ||
| 'fontStyle', | ||
| 'fontWeight', | ||
| 'letterSpacing', | ||
| 'lineHeight', | ||
| 'textAlign', | ||
| ]; | ||
|
|
||
| export default function transformer(file, api) { | ||
| const j = api.jscodeshift; | ||
|
|
||
| function buildSxValue(node, value) { | ||
| value.push( | ||
| j.objectProperty( | ||
| j.identifier(node.name.name), | ||
| node.value.expression ? node.value.expression : node.value, | ||
| false, | ||
| false, | ||
| ), | ||
| ); | ||
| return value; | ||
| } | ||
|
|
||
| return j(file.source) | ||
| .findJSXElements('Box') | ||
| .forEach((path) => { | ||
| let sxValue = []; | ||
| const attributes = path.node.openingElement.attributes; | ||
| attributes.forEach((node, index) => { | ||
| // Only transform whitelisted props | ||
| if (boxProps.includes(node.name.name)) { | ||
| sxValue = buildSxValue(node, sxValue); | ||
| delete attributes[index]; | ||
| } | ||
| }); | ||
| if (sxValue.length > 0) { | ||
| attributes.push( | ||
| j.jsxAttribute( | ||
| j.jsxIdentifier('sx'), | ||
| j.jsxExpressionContainer(j.objectExpression(sxValue)), | ||
| ), | ||
| ); | ||
| } | ||
| }) | ||
| .toSource(); | ||
| } |
43 changes: 43 additions & 0 deletions
43
packages/material-ui-codemod/src/v5.0.0/box-sx-prop.test.js
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,43 @@ | ||
| import fs from 'fs'; | ||
| import path from 'path'; | ||
| import { expect } from 'chai'; | ||
| import jscodeshift from 'jscodeshift'; | ||
| import transform from './box-sx-prop'; | ||
|
|
||
| function read(fileName) { | ||
| return fs.readFileSync(path.join(__dirname, fileName), 'utf8').toString(); | ||
| } | ||
|
|
||
| describe('@material-ui/codemod', () => { | ||
| describe('v5.0.0', () => { | ||
| describe('box-sx-prop', () => { | ||
| it('transforms props as needed', () => { | ||
| const actual = transform( | ||
| { | ||
| source: read('./box-sx-prop.test/actual.js'), | ||
| path: require.resolve('./box-sx-prop.test/actual.js'), | ||
| }, | ||
| { jscodeshift: jscodeshift }, | ||
| {}, | ||
| ); | ||
|
|
||
| const expected = read('./box-sx-prop.test/expected.js'); | ||
| expect(actual).to.equal(expected, 'The transformed version should be correct'); | ||
| }); | ||
|
|
||
| it('should be idempotent', () => { | ||
| const actual = transform( | ||
| { | ||
| source: read('./box-sx-prop.test/expected.js'), | ||
| path: require.resolve('./box-sx-prop.test/expected.js'), | ||
| }, | ||
| { jscodeshift: jscodeshift }, | ||
| {}, | ||
| ); | ||
|
|
||
| const expected = read('./box-sx-prop.test/expected.js'); | ||
| expect(actual).to.equal(expected, 'The transformed version should be correct'); | ||
| }); | ||
| }); | ||
| }); | ||
| }); |
13 changes: 13 additions & 0 deletions
13
packages/material-ui-codemod/src/v5.0.0/box-sx-prop.test/actual.js
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| import * as React from 'react'; | ||
| import Box from '@material-ui/core/Box'; | ||
| import Button from '@material-ui/core/Button'; | ||
|
|
||
| export default function BoxComponent() { | ||
| return ( | ||
| <Box border="1px dashed grey" p={[2, 3, 4]}> | ||
| <Box component="span" clone p={{ xs: 2, sm: 3, md: 4 }} m={2} border="1px dashed grey"> | ||
| <Button component="span">Save</Button> | ||
| </Box> | ||
| </Box> | ||
| ); | ||
| } |
24 changes: 24 additions & 0 deletions
24
packages/material-ui-codemod/src/v5.0.0/box-sx-prop.test/expected.js
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,24 @@ | ||
| import * as React from 'react'; | ||
| import Box from '@material-ui/core/Box'; | ||
| import Button from '@material-ui/core/Button'; | ||
|
|
||
| export default function BoxComponent() { | ||
| return ( | ||
| <Box | ||
| sx={{ | ||
| border: "1px dashed grey", | ||
| p: [2, 3, 4] | ||
| }}> | ||
| <Box | ||
| component="span" | ||
| clone | ||
| sx={{ | ||
| p: { xs: 2, sm: 3, md: 4 }, | ||
| m: 2, | ||
| border: "1px dashed grey" | ||
| }}> | ||
| <Button component="span">Save</Button> | ||
| </Box> | ||
| </Box> | ||
| ); | ||
| } |
8 changes: 5 additions & 3 deletions
8
packages/material-ui-lab/src/ClockPicker/ClockPickerStandalone.test.tsx
This file contains 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
Oops, something went wrong.