@mui/codemod 5.8.3 → 5.8.4

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/README.md +1 -1
  2. package/node/v5.0.0/jss-to-tss-react.js +2 -2
  3. package/node/v5.0.0/jss-to-tss-react.test/actual-from-mui-styles-makeStyles.js +53 -0
  4. package/node/v5.0.0/jss-to-tss-react.test/expected-from-mui-styles-makeStyles.js +57 -0
  5. package/package.json +2 -2
package/README.md CHANGED
@@ -437,7 +437,7 @@ You can find more details about this breaking change in [the migration guide](ht
437
437
 
438
438
  #### `emotion-prepend-cache`
439
439
 
440
- Adds `prepend: true` to emotion `createCache`
440
+ Adds `prepend: true` to Emotion `createCache`
441
441
 
442
442
  ```diff
443
443
  const cache = emotionCreateCache({
package/node/v5.0.0/jss-to-tss-react.js CHANGED
@@ -237,11 +237,11 @@ function transformer(file, api, options) {
237
237
  path.replace(j.importDeclaration(specifiersToMove, j.stringLiteral('tss-react/mui')), specifiersToStay.length > 0 ? j.importDeclaration(specifiersToStay, j.stringLiteral(importSource)) : undefined);
238
238
  importsChanged = true;
239
239
  }
240
- } else if (importSource === '@material-ui/styles/makeStyles') {
240
+ } else if (importSource === '@material-ui/styles/makeStyles' || importSource === '@mui/styles/makeStyles') {
241
241
  foundMakeStyles = true;
242
242
  path.replace(j.importDeclaration([j.importSpecifier(j.identifier('makeStyles'))], j.stringLiteral('tss-react/mui')));
243
243
  importsChanged = true;
244
- } else if (importSource === '@material-ui/styles/withStyles') {
244
+ } else if (importSource === '@material-ui/styles/withStyles' || importSource === '@mui/styles/withStyles') {
245
245
  foundWithStyles = true;
246
246
  path.replace(j.importDeclaration([j.importSpecifier(j.identifier('withStyles'))], j.stringLiteral('tss-react/mui')));
247
247
  importsChanged = true;
package/node/v5.0.0/jss-to-tss-react.test/actual-from-mui-styles-makeStyles.js ADDED
@@ -0,0 +1,53 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = ComponentUsingStyles;
9
+
10
+ var _react = _interopRequireDefault(require("react"));
11
+
12
+ var _makeStyles = _interopRequireDefault(require("@mui/styles/makeStyles"));
13
+
14
+ var _jsxRuntime = require("react/jsx-runtime");
15
+
16
+ var _InnerComponent;
17
+
18
+ const useStyles = (0, _makeStyles.default)({
19
+ test: {
20
+ backgroundColor: "purple",
21
+ color: "white"
22
+ }
23
+ });
24
+ const useStyles2 = (0, _makeStyles.default)({
25
+ test: {
26
+ backgroundColor: "purple",
27
+ color: "white",
28
+ "& $test2": {
29
+ backgroundColor: "lime",
30
+ color: "blue"
31
+ }
32
+ },
33
+ test2: {
34
+ backgroundColor: "blue",
35
+ color: "lime"
36
+ }
37
+ });
38
+
39
+ function InnerComponent() {
40
+ const classes = useStyles2();
41
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
42
+ className: classes.test2,
43
+ children: "Inner Test"
44
+ });
45
+ }
46
+
47
+ function ComponentUsingStyles(props) {
48
+ const classes = useStyles();
49
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
50
+ className: classes.test,
51
+ children: ["Test", _InnerComponent || (_InnerComponent = /*#__PURE__*/(0, _jsxRuntime.jsx)(InnerComponent, {}))]
52
+ });
53
+ }
package/node/v5.0.0/jss-to-tss-react.test/expected-from-mui-styles-makeStyles.js ADDED
@@ -0,0 +1,57 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = ComponentUsingStyles;
9
+
10
+ var _react = _interopRequireDefault(require("react"));
11
+
12
+ var _mui = require("tss-react/mui");
13
+
14
+ var _jsxRuntime = require("react/jsx-runtime");
15
+
16
+ var _InnerComponent;
17
+
18
+ const useStyles = (0, _mui.makeStyles)()({
19
+ test: {
20
+ backgroundColor: "purple",
21
+ color: "white"
22
+ }
23
+ });
24
+ const useStyles2 = (0, _mui.makeStyles)()((_theme, _params, classes) => ({
25
+ test: {
26
+ backgroundColor: "purple",
27
+ color: "white",
28
+ [`& .${classes.test2}`]: {
29
+ backgroundColor: "lime",
30
+ color: "blue"
31
+ }
32
+ },
33
+ test2: {
34
+ backgroundColor: "blue",
35
+ color: "lime"
36
+ }
37
+ }));
38
+
39
+ function InnerComponent() {
40
+ const {
41
+ classes
42
+ } = useStyles2();
43
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
44
+ className: classes.test2,
45
+ children: "Inner Test"
46
+ });
47
+ }
48
+
49
+ function ComponentUsingStyles(props) {
50
+ const {
51
+ classes
52
+ } = useStyles();
53
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
54
+ className: classes.test,
55
+ children: ["Test", _InnerComponent || (_InnerComponent = /*#__PURE__*/(0, _jsxRuntime.jsx)(InnerComponent, {}))]
56
+ });
57
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mui/codemod",
3
- "version": "5.8.3",
3
+ "version": "5.8.4",
4
4
  "bin": "./codemod.js",
5
5
  "private": false,
6
6
  "author": "MUI Team",
@@ -35,7 +35,7 @@
35
35
  "@babel/traverse": "^7.17.3",
36
36
  "jscodeshift": "^0.13.1",
37
37
  "jscodeshift-add-imports": "^1.0.10",
38
- "yargs": "^17.4.1"
38
+ "yargs": "^17.5.1"
39
39
  },
40
40
  "devDependencies": {
41
41
  "@types/jscodeshift": "0.11.5"