@mui/codemod 5.11.12 → 5.11.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/codemod.js +0 -0
  2. package/node/v5.0.0/rename-css-variables.js +14 -5
  3. package/node/v5.0.0/rename-css-variables.test/actual.js +14 -1
  4. package/node/v5.0.0/rename-css-variables.test/expected.js +14 -1
  5. package/package.json +3 -3
package/codemod.js CHANGED
File without changes
package/node/v5.0.0/rename-css-variables.js CHANGED
@@ -7,7 +7,7 @@ exports.default = transformer;
7
7
  const capitalize = str => {
8
8
  return str.charAt(0).toUpperCase() + str.slice(1);
9
9
  };
10
- const JoyComponents = ['Alert', 'AspectRatio', 'Autocomplete', 'AutocompleteListbox', 'AutocompleteOption', 'Avatar', 'AvatarGroup', 'Badge', 'Box', 'Breadcrumbs', 'Button', 'Card', 'CardContent', 'CardCover', 'CardOverflow', 'Checkbox', 'Chip', 'ChipDelete', 'CircularProgress', 'Container', 'CssBaseline', 'Divider', 'FormControl', 'FormHelperText', 'FormLabel', 'Grid', 'IconButton', 'Input', 'LinearProgress', 'Link', 'List', 'ListDivider', 'ListItem', 'ListItemButton', 'ListItemContent', 'ListItemDecorator', 'ListSubheader', 'Menu', 'MenuItem', 'MenuList', 'Modal', 'ModalClose', 'ModalDialog', 'Option', 'Radio', 'RadioGroup', 'ScopedCssBaseline', 'Select', 'Sheet', 'Slider', 'Stack', 'SvgIcon', 'Switch', 'Tab', 'Table', 'TabList', 'TabPanel', 'Tabs', 'Textarea', 'TextField', 'Tooltip', 'Typography'];
10
+ const JoyComponents = ['Alert', 'AspectRatio', 'Autocomplete', 'AutocompleteListbox', 'AutocompleteOption', 'Avatar', 'AvatarGroup', 'Badge', 'Box', 'Breadcrumbs', 'Button', 'Card', 'CardContent', 'CardCover', 'CardOverflow', 'Checkbox', 'Chip', 'ChipDelete', 'CircularProgress', 'Container', 'CssBaseline', 'Divider', 'FormControl', 'FormHelperText', 'FormLabel', 'Grid', 'IconButton', 'Input', 'LinearProgress', 'Link', 'List', 'ListDivider', 'ListItem', 'ListItemButton', 'ListItemContent', 'ListItemDecorator', 'ListSubheader', 'Menu', 'MenuItem', 'MenuList', 'Modal', 'ModalClose', 'ModalDialog', 'Option', 'Radio', 'RadioGroup', 'ScopedCssBaseline', 'Select', 'Sheet', 'Slider', 'Stack', 'SvgIcon', 'Switch', 'Tab', 'Table', 'TableCell', 'TabList', 'TabPanel', 'Tabs', 'Textarea', 'TextField', 'Tooltip', 'Typography'];
11
11
 
12
12
  /**
13
13
  * @param {import('jscodeshift').FileInfo} file
@@ -16,15 +16,24 @@ function transformer(file) {
16
16
  return file.source
17
17
  // from `--<Component>-<slot>-<property>` to `--<Component>-<slot><Property>`
18
18
  .replace(/--([a-zA-Z]+)([-_])([a-zA-Z]+)-([a-zA-Z]+)/gm, (matched, capture1, capture2, capture3, capture4) => {
19
- if (!JoyComponents.includes(capture1) && !['internal', 'unstable'].includes(capture1)) {
19
+ if (!JoyComponents.includes(capture1) && !['internal', 'unstable', 'private'].includes(capture1)) {
20
20
  return matched;
21
21
  }
22
22
  // turn `--List-item-...` and `--List-divider-...` to `--ListItem-...` and `--ListDivider-...`
23
23
  if (capture1 === 'List' && ['divider', 'item'].includes(capture3)) {
24
24
  return `--${capture1}${capitalize(capture3)}-${capture4}`;
25
25
  }
26
- return `--${capture1}${capture2}${capture3}${capitalize(capture4)}`;
27
- })
26
+ // turn `--List-decorator-...` to `--ListItemDecorator-...`
27
+ if (capture1 === 'List' && ['decorator'].includes(capture3)) {
28
+ return `--${capture1}Item${capitalize(capture3)}-${capture4}`;
29
+ }
30
+ if (!JoyComponents.includes(capture3)) {
31
+ return `--${capture1}${capture2}${capture3}${capitalize(capture4)}`;
32
+ }
33
+ return matched;
34
+ }).replace(/--List-decoratorSize/gm, '--ListItemDecorator-size').replace(/--List-decoratorColor/gm, '--ListItemDecorator-color')
28
35
  // from `--internal-...` to `--unstable_...`
29
- .replace(/--internal-/gm, '--unstable_');
36
+ .replace(/--internal-/gm, '--unstable_')
37
+ // from `--private_...` to `--unstable_...`
38
+ .replace(/--private_/gm, '--unstable_');
30
39
  }
package/node/v5.0.0/rename-css-variables.test/actual.js CHANGED
@@ -4,7 +4,12 @@ var _jsxRuntime = require("react/jsx-runtime");
4
4
  /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
5
5
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(List, {
6
6
  sx: {
7
- py: 'var(--ListDivider-gap)'
7
+ py: 'var(--ListDivider-gap)',
8
+ '--List-decorator-size': '24px'
9
+ }
10
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(List, {
11
+ sx: {
12
+ '--List-decoratorSize': '24px'
8
13
  }
9
14
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(ListItem, {
10
15
  sx: {
@@ -14,6 +19,10 @@ var _jsxRuntime = require("react/jsx-runtime");
14
19
  sx: {
15
20
  '--Input-decoratorChildHeight': '10px'
16
21
  }
22
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(ModalDialog, {
23
+ sx: {
24
+ '--unstable_ModalDialog-descriptionOffset': '12px'
25
+ }
17
26
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Autocomplete, {
18
27
  sx: {
19
28
  '--Autocomplete-wrapperGap': '10px'
@@ -26,6 +35,10 @@ var _jsxRuntime = require("react/jsx-runtime");
26
35
  sx: {
27
36
  py: 'var(--internal-action-radius)'
28
37
  }
38
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Item, {
39
+ sx: {
40
+ py: 'var(--private_action-radius)'
41
+ }
29
42
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Item, {
30
43
  sx: {
31
44
  py: 'var(--unstable_action-radius)'
package/node/v5.0.0/rename-css-variables.test/expected.js CHANGED
@@ -4,7 +4,12 @@ var _jsxRuntime = require("react/jsx-runtime");
4
4
  /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
5
5
  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(List, {
6
6
  sx: {
7
- py: 'var(--ListDivider-gap)'
7
+ py: 'var(--ListDivider-gap)',
8
+ '--ListItemDecorator-size': '24px'
9
+ }
10
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(List, {
11
+ sx: {
12
+ '--ListItemDecorator-size': '24px'
8
13
  }
9
14
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(ListItem, {
10
15
  sx: {
@@ -14,6 +19,10 @@ var _jsxRuntime = require("react/jsx-runtime");
14
19
  sx: {
15
20
  '--Input-decoratorChildHeight': '10px'
16
21
  }
22
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(ModalDialog, {
23
+ sx: {
24
+ '--unstable_ModalDialog-descriptionOffset': '12px'
25
+ }
17
26
  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Autocomplete, {
18
27
  sx: {
19
28
  '--Autocomplete-wrapperGap': '10px'
@@ -30,5 +39,9 @@ var _jsxRuntime = require("react/jsx-runtime");
30
39
  sx: {
31
40
  py: 'var(--unstable_actionRadius)'
32
41
  }
42
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Item, {
43
+ sx: {
44
+ py: 'var(--unstable_actionRadius)'
45
+ }
33
46
  })]
34
47
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mui/codemod",
3
- "version": "5.11.12",
3
+ "version": "5.11.14",
4
4
  "bin": "./codemod.js",
5
5
  "private": false,
6
6
  "author": "MUI Team",
@@ -30,9 +30,9 @@
30
30
  "url": "https://opencollective.com/mui"
31
31
  },
32
32
  "dependencies": {
33
- "@babel/core": "^7.21.0",
33
+ "@babel/core": "^7.21.3",
34
34
  "@babel/runtime": "^7.21.0",
35
- "@babel/traverse": "^7.21.2",
35
+ "@babel/traverse": "^7.21.3",
36
36
  "jscodeshift": "^0.13.1",
37
37
  "jscodeshift-add-imports": "^1.0.10",
38
38
  "yargs": "^17.7.1"