@mui/codemod 5.12.2 → 5.13.3

package/README.md

@@ -62,6 +62,19 @@ npx @mui/codemod <transform> <path> --jscodeshift="--printOptions='{\"quote\":\"
 
 ### v5.0.0
 
+### `base-remove-unstyled-suffix`
+
+The `Unstyled` suffix has been removed from all Base UI component names, including names of types and other related identifiers.
+
+```diff
+-  <Input component='a' href='url' />;
++  <Input slots={{ root: 'a' }} href='url' />;
+```
+
+```sh
+npx @mui/codemod v5.0.0/base-remove-unstyled-suffix <path>
+```
+
 #### `base-remove-component-prop`
 
 Remove `component` prop from all Base UI components by transferring its value into `slots.root`.

package/node/v5.0.0/grid-list-component.test/actual.js

@@ -7,7 +7,6 @@ var _other = _interopRequireDefault(require("./other"));
 var _jsxRuntime = require("react/jsx-runtime");
 // import GridList from '@material-ui/core/GridList';
 // import GridListTile from '@material-ui/core/GridListTile';
-
 /*#__PURE__*/(0, _jsxRuntime.jsxs)(_core.GridList, {
   cellHeight: "auto",
   cols: numOfCols,

package/node/v5.0.0/grid-list-component.test/expected.js

@@ -7,7 +7,6 @@ var _other = _interopRequireDefault(require("./other"));
 var _jsxRuntime = require("react/jsx-runtime");
 // import ImageList from '@material-ui/core/ImageList';
 // import ImageListItem from '@material-ui/core/ImageListItem';
-
 /*#__PURE__*/(0, _jsxRuntime.jsxs)(_core.ImageList, {
   cellHeight: "auto",
   cols: numOfCols,

package/node/v5.0.0/jss-to-tss-react.test/actual-from-material-ui-core-styles.js

@@ -14,7 +14,6 @@ Sandboxes for verifying correct behavior:
 JSS - https://codesandbox.io/s/case1-jss-dedp2f?file=/src/App.js
 TSS - https://codesandbox.io/s/case1-tss-s0z7tx?file=/src/App.js
  */
-
 const useStyles = (0, _styles.makeStyles)({
   test: {
     backgroundColor: "purple",

package/node/v5.0.0/jss-to-tss-react.test/actual-from-material-ui-core.js

@@ -10,6 +10,13 @@ var _core = require("@material-ui/core");
 var _clsx = _interopRequireDefault(require("clsx"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _InnerComponent;
+/*
+Test makeStyles comment
+ */
+/*
+clsx comment that will not be preserved since the import is being removed (not just replaced)
+and is not at the beginning of the file.
+ */
 const useStyles = (0, _core.makeStyles)(() => ({
   test: {
     backgroundColor: "purple",

package/node/v5.0.0/jss-to-tss-react.test/actual-todo-comments.js

@@ -10,6 +10,13 @@ var React = _interopRequireWildcard(require("react"));
 var _core = require("@material-ui/core");
 var _jsxRuntime = require("react/jsx-runtime");
 var _InnerComponent;
+/*
+Comments to be preserved when clsx import is removed. These comments should come before
+any comments that they get combined with.
+ */
+/*
+Comments that should not be lost when the clsx import comments are preserved.
+ */
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 const useStyles = (0, _core.makeStyles)(() => ({

package/node/v5.0.0/jss-to-tss-react.test/actual-typescript.js

@@ -14,9 +14,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 Sandboxes for verifying correct behavior:
 JSS - https://codesandbox.io/s/typescript-case-bt065c?file=/demo.tsx
 TSS - https://codesandbox.io/s/typescript-case-7jwpms?file=/demo.tsx
- */
-
-const useStyles = (0, _styles.makeStyles)(theme => (0, _styles.createStyles)({
+ */const useStyles = (0, _styles.makeStyles)(theme => (0, _styles.createStyles)({
   test: {
     backgroundColor: "purple",
     color: "white",

package/node/v5.0.0/jss-to-tss-react.test/expected-from-material-ui-core-styles.js

@@ -14,7 +14,6 @@ Sandboxes for verifying correct behavior:
 JSS - https://codesandbox.io/s/case1-jss-dedp2f?file=/src/App.js
 TSS - https://codesandbox.io/s/case1-tss-s0z7tx?file=/src/App.js
  */
-
 const useStyles = (0, _mui.makeStyles)({
   name: "TestName"
 })({

package/node/v5.0.0/jss-to-tss-react.test/expected-from-material-ui-core.js

@@ -9,6 +9,9 @@ var _react = _interopRequireDefault(require("react"));
 var _mui = require("tss-react/mui");
 var _jsxRuntime = require("react/jsx-runtime");
 var _InnerComponent;
+/*
+Test makeStyles comment
+ */
 const useStyles = (0, _mui.makeStyles)()((_theme, _params, classes) => ({
   test: {
     backgroundColor: "purple",

package/node/v5.0.0/jss-to-tss-react.test/expected-todo-comments.js

@@ -8,9 +8,16 @@ var React = _interopRequireWildcard(require("react"));
 var _mui = require("tss-react/mui");
 var _jsxRuntime = require("react/jsx-runtime");
 var _InnerComponent;
+/*
+Comments to be preserved when clsx import is removed. These comments should come before
+any comments that they get combined with.
+ */
+/*
+Comments that should not be lost when the clsx import comments are preserved.
+ */
+// TODO jss-to-tss-react codemod: Unable to handle style definition reliably. ArrowFunctionExpression in CSS prop.
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-// TODO jss-to-tss-react codemod: Unable to handle style definition reliably. ArrowFunctionExpression in CSS prop.
 const useStyles = (0, _mui.makeStyles)()((_theme, _params, classes) => ({
   test: {
     backgroundColor: "purple",

package/node/v5.0.0/mui-replace.test/actual.js

@@ -55,4 +55,10 @@ const tsconfig = {
   }
 };
 
-// types
+// types
+
+// private-theming
+
+// Pickers does not change
+
+// DataGrid does not change

package/node/v5.0.0/mui-replace.test/expected.js

@@ -55,4 +55,10 @@ const tsconfig = {
   }
 };
 
-// types
+// types
+
+// private-theming
+
+// Pickers does not change
+
+// DataGrid does not change

package/node/v5.0.0/preset-safe.test/expected.js

@@ -31,8 +31,7 @@ var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
 var _TextField = _interopRequireDefault(require("@mui/material/TextField"));
 var _colors = require("@mui/material/colors");
 var _jsxRuntime = require("react/jsx-runtime");
-var _Box, _Box2, _CssBaseline, _Header, _Box3, _Grid, _DialogTitle, _DialogContent;
-// FIXME checkout https://mui.com/components/use-media-query/#migrating-from-withwidth
+var _Box, _Box2, _CssBaseline, _Header, _Box3, _Grid, _DialogTitle, _DialogContent; // FIXME checkout https://mui.com/components/use-media-query/#migrating-from-withwidth
 const withWidth = () => WrappedComponent => props => /*#__PURE__*/(0, _jsxRuntime.jsx)(WrappedComponent, (0, _extends2.default)({}, props, {
   width: "xs"
 }));

package/node/v5.0.0/root-ref.test/actual.js

@@ -3,11 +3,9 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 var _RootRef = _interopRequireDefault(require("@material-ui/core/RootRef"));
 var _jsxRuntime = require("react/jsx-runtime");
-var _Typography, _CssBaseline;
-// import { RootRef } from '@material-ui/core';
+var _Typography, _CssBaseline; // import { RootRef } from '@material-ui/core';
 // import { RootRef, Button } from '@material-ui/core';
 // import { Tooltip, RootRef, Button } from '@material-ui/core';
-
 function App() {
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_RootRef.default, {
     rootRef: this.container,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/codemod",
-  "version": "5.12.2",
+  "version": "5.13.3",
   "bin": "./codemod.js",
   "private": false,
   "author": "MUI Team",
@@ -30,12 +30,12 @@
     "url": "https://opencollective.com/mui"
   },
   "dependencies": {
-    "@babel/core": "^7.21.3",
+    "@babel/core": "^7.21.4",
     "@babel/runtime": "^7.21.0",
-    "@babel/traverse": "^7.21.3",
+    "@babel/traverse": "^7.21.4",
     "jscodeshift": "^0.13.1",
     "jscodeshift-add-imports": "^1.0.10",
-    "yargs": "^17.7.1"
+    "yargs": "^17.7.2"
   },
   "devDependencies": {
     "@types/jscodeshift": "0.11.5"