@mui/codemod 6.1.8 → 6.2.0

package/README.md

@@ -1107,6 +1107,32 @@ npx @mui/codemod@latest deprecations/form-control-label-props <path>
 npx @mui/codemod@latest deprecations/list-item-props <path>
 ```
 
+#### `list-item-text-props`
+
+```diff
+ <ListItemText
+-  primaryTypographyProps={primaryTypographyProps}
++  slotProps={{ primary: primaryTypographyProps }}
+-  secondaryTypographyProps={secondaryTypographyProps}
++  slotProps={{ secondary: secondaryTypographyProps }}
+ />
+```
+
+```diff
+ MuiListItemText: {
+   defaultProps: {
+-  primaryTypographyProps:primaryTypographyProps
++  slotProps:{ primary: primaryTypographyProps }
+-  secondaryTypographyProps:secondaryTypographyProps
++  slotProps:{ secondary: secondaryTypographyProps }
+  },
+ },
+```
+
+```bash
+npx @mui/codemod@latest deprecations/list-item-text-props <path>
+```
+
 #### `image-list-item-bar-classes`
 
 JS transforms:
@@ -1669,6 +1695,13 @@ npx @mui/codemod@latest deprecations/table-sort-label-classes <path>
  />
 ```
 
+```diff
+ <Typography
+-  paragraph={isTypographyParagraph}
++  sx={isTypographyParagraph ? { marginBottom: '16px' } : undefined}
+ />
+```
+
 ```diff
  MuiTypography: {
    defaultProps: {

package/node/deprecations/all/deprecations-all.js

@@ -22,6 +22,7 @@ var _formControlLabelProps = _interopRequireDefault(require("../form-control-lab
 var _imageListItemBarClasses = _interopRequireDefault(require("../image-list-item-bar-classes"));
 var _inputBaseProps = _interopRequireDefault(require("../input-base-props"));
 var _inputProps = _interopRequireDefault(require("../input-props"));
+var _listItemTextProps = _interopRequireDefault(require("../list-item-text-props"));
 var _modalProps = _interopRequireDefault(require("../modal-props"));
 var _outlinedInputProps = _interopRequireDefault(require("../outlined-input-props"));
 var _paginationItemClasses = _interopRequireDefault(require("../pagination-item-classes"));
@@ -55,6 +56,7 @@ function deprecationsAll(file, api, options) {
   file.source = (0, _imageListItemBarClasses.default)(file, api, options);
   file.source = (0, _inputBaseProps.default)(file, api, options);
   file.source = (0, _inputProps.default)(file, api, options);
+  file.source = (0, _listItemTextProps.default)(file, api, options);
   file.source = (0, _modalProps.default)(file, api, options);
   file.source = (0, _outlinedInputProps.default)(file, api, options);
   file.source = (0, _paginationItemClasses.default)(file, api, options);

package/node/deprecations/list-item-text-props/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _listItemTextProps.default;
+  }
+});
+var _listItemTextProps = _interopRequireDefault(require("./list-item-text-props"));

package/node/deprecations/list-item-text-props/list-item-text-props.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = transformer;
+var _replaceComponentsWithSlots = _interopRequireDefault(require("../utils/replaceComponentsWithSlots"));
+var _movePropIntoSlotProps = _interopRequireDefault(require("../utils/movePropIntoSlotProps"));
+/**
+ * @param {import('jscodeshift').FileInfo} file
+ * @param {import('jscodeshift').API} api
+ */
+function transformer(file, api, options) {
+  const j = api.jscodeshift;
+  const root = j(file.source);
+  const printOptions = options.printOptions;
+  (0, _replaceComponentsWithSlots.default)(j, {
+    root,
+    componentName: 'ListItemText'
+  });
+  (0, _movePropIntoSlotProps.default)(j, {
+    root,
+    componentName: 'ListItemText',
+    propName: 'primaryTypographyProps',
+    slotName: 'primary'
+  });
+  (0, _movePropIntoSlotProps.default)(j, {
+    root,
+    componentName: 'ListItemText',
+    propName: 'secondaryTypographyProps',
+    slotName: 'secondary'
+  });
+  return root.toSource(printOptions);
+}

package/node/deprecations/list-item-text-props/test-cases/actual.js

@@ -0,0 +1,21 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _ListItemText = _interopRequireDefault(require("@mui/material/ListItemText"));
+var _jsxRuntime = require("react/jsx-runtime");
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+  secondaryTypographyProps: secondaryTypographyProps
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+  primaryTypographyProps: primaryTypographyProps
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+  primaryTypographyProps: primaryTypographyProps,
+  secondaryTypographyProps: secondaryTypographyProps
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+  slotProps: {
+    primary: primarySlotProps
+  },
+  secondaryTypographyProps: secondaryTypographyProps
+});

package/node/deprecations/list-item-text-props/test-cases/expected.js

@@ -0,0 +1,27 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _ListItemText = _interopRequireDefault(require("@mui/material/ListItemText"));
+var _jsxRuntime = require("react/jsx-runtime");
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+  slotProps: {
+    secondary: secondaryTypographyProps
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+  slotProps: {
+    primary: primaryTypographyProps
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+  slotProps: {
+    primary: primaryTypographyProps,
+    secondary: secondaryTypographyProps
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_ListItemText.default, {
+  slotProps: {
+    primary: primarySlotProps,
+    secondary: secondaryTypographyProps
+  }
+});

package/node/deprecations/list-item-text-props/test-cases/theme.actual.js

@@ -0,0 +1,34 @@
+"use strict";
+
+fn({
+  MuiListItemText: {
+    defaultProps: {
+      primaryTypographyProps: primaryTypographyProps
+    }
+  }
+});
+fn({
+  MuiListItemText: {
+    defaultProps: {
+      secondaryTypographyProps: secondaryTypographyProps
+    }
+  }
+});
+fn({
+  MuiListItemText: {
+    defaultProps: {
+      primaryTypographyProps: primaryTypographyProps,
+      secondaryTypographyProps: secondaryTypographyProps
+    }
+  }
+});
+fn({
+  MuiListItemText: {
+    defaultProps: {
+      slotProps: {
+        primary: primarySlotProps
+      },
+      secondaryTypographyProps: secondaryTypographyProps
+    }
+  }
+});

package/node/deprecations/list-item-text-props/test-cases/theme.expected.js

@@ -0,0 +1,40 @@
+"use strict";
+
+fn({
+  MuiListItemText: {
+    defaultProps: {
+      slotProps: {
+        primary: primaryTypographyProps
+      }
+    }
+  }
+});
+fn({
+  MuiListItemText: {
+    defaultProps: {
+      slotProps: {
+        secondary: secondaryTypographyProps
+      }
+    }
+  }
+});
+fn({
+  MuiListItemText: {
+    defaultProps: {
+      slotProps: {
+        primary: primaryTypographyProps,
+        secondary: secondaryTypographyProps
+      }
+    }
+  }
+});
+fn({
+  MuiListItemText: {
+    defaultProps: {
+      slotProps: {
+        primary: primarySlotProps,
+        secondary: secondaryTypographyProps
+      }
+    }
+  }
+});

package/node/deprecations/typography-props/test-cases/actual.js

@@ -34,6 +34,14 @@ var _jsxRuntime = require("react/jsx-runtime");
   paragraph: false,
   className: "my-class"
 });
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+  paragraph: true,
+  className: "my-class"
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+  paragraph: true,
+  className: "my-class"
+});
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
   paragraph: paragraph,
   className: "my-class"

package/node/deprecations/typography-props/test-cases/expected.js

@@ -52,6 +52,18 @@ var _jsxRuntime = require("react/jsx-runtime");
     marginBottom: "16px"
   }
 });
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+  className: "my-class",
+  sx: paragraph ? {
+    marginBottom: "16px"
+  } : undefined
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+  className: "my-class",
+  sx: paragraph ? {
+    marginBottom: "16px"
+  } : undefined
+});
 /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
   sx: {
     marginBottom: "32px"

package/node/deprecations/typography-props/typography-props.js

@@ -30,16 +30,18 @@ function transformer(file, api, options) {
       }
       return true;
     });
-    const isParagraphPropTruthy = paragraphProp.value?.expression.value !== false;
-    if (!isParagraphPropTruthy) {
+    const isParagraphPropPresent = paragraphProp.value?.expression.value !== false;
+    if (!isParagraphPropPresent) {
       return;
     }
+    const isParagraphPropTrue = paragraphProp.value == null || paragraphProp.value.expression.value === true;
+    const paragraphExpression = expression => isParagraphPropTrue ? expression : j.conditionalExpression(paragraphProp.value.expression, expression, j.identifier('undefined'));
     const sxIndex = elementPath.node.openingElement.attributes.findIndex(attr => attr.type === 'JSXAttribute' && attr.name.name === 'sx');
     if (sxIndex === -1) {
       (0, _appendAttribute.default)(j, {
         target: elementPath.node,
         attributeName: 'sx',
-        expression: j.objectExpression([j.objectProperty(j.identifier('marginBottom'), j.literal('16px'))])
+        expression: paragraphExpression(j.objectExpression([j.objectProperty(j.identifier('marginBottom'), j.literal('16px'))]))
       });
     } else {
       const hasMarginBottom = elementPath.node.openingElement.attributes[sxIndex].value.expression.properties.some(key => key.key.name === 'marginBottom' || key.key.name === 'mb');
@@ -47,7 +49,7 @@ function transformer(file, api, options) {
         (0, _assignObject.default)(j, {
           target: elementPath.node.openingElement.attributes[sxIndex],
           key: 'marginBottom',
-          expression: j.literal('16px')
+          expression: paragraphExpression(j.literal('16px'))
         });
       }
     }

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

@@ -8,5 +8,7 @@ exports.default = transformer;
  * @param {import('jscodeshift').FileInfo} file
  */
 function transformer(file) {
-  return file.source.replace(/\n?import.*core\/RootRef['"];?/gm, '').replace(/\n?import {\s?RootRef\s?} from ['"]@material-ui\/core\/?['"];?/gm, '').replace(/({.*)(RootRef,?)(.*})/gm, '$1$3').replace(/<RootRef.*>/gm, '<>').replace(/<\/RootRef>/gm, '</>');
+  // The regexes below have a negative lookahead to prevent ReDoS
+  // See https://github.com/mui/material-ui/issues/44078
+  return file.source.replace(/\n?import(?!import).*core\/RootRef['"];?/gm, '').replace(/\n?import {\s?RootRef\s?} from ['"]@material-ui\/core\/?['"];?/gm, '').replace(/({.*)(RootRef,?)(.*})/gm, '$1$3').replace(/<RootRef(?!<RootRef).*>/gm, '<>').replace(/<\/RootRef>/gm, '</>');
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/codemod",
-  "version": "6.1.8",
+  "version": "6.2.0",
   "bin": "./codemod.js",
   "private": false,
   "author": "MUI Team",