npm - @mui/codemod - Versions diffs - 6.0.0-dev.240424162023-9968b4889d → 6.0.0 - Mend

@mui/codemod 6.0.0-dev.240424162023-9968b4889d → 6.0.0

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 (278) hide show

package/node/v5.0.0/jss-to-styled.test/sixth.actual.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
@@ -43,10 +42,11 @@ const styles = theme => ({
 });
 // eslint-disable-next-line react/display-name
-const LinkToCart = /*#__PURE__*/React.forwardRef((linkProps, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Link.default, (0, _extends2.default)({}, linkProps, {
+const LinkToCart = /*#__PURE__*/React.forwardRef((linkProps, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Link.default, {
+  ...linkProps,
   to: "/order-cart/",
   ref: ref
-})));
+}));
 function AppAppBarCart(props) {
   const {
     classes,

package/node/v5.0.0/jss-to-styled.test/sixth.expected.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _styles = require("@mui/material/styles");
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -52,10 +51,11 @@ const StyledIconButton = (0, _styles.styled)(_IconButton.default)(({
 }));
 // eslint-disable-next-line react/display-name
-const LinkToCart = /*#__PURE__*/React.forwardRef((linkProps, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Link.default, (0, _extends2.default)({}, linkProps, {
+const LinkToCart = /*#__PURE__*/React.forwardRef((linkProps, ref) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Link.default, {
+  ...linkProps,
   to: "/order-cart/",
   ref: ref
-})));
+}));
 function AppAppBarCart(props) {
   const {
     className,

package/node/v5.0.0/jss-to-styled.test/withCreateStyles.actual.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _createStyles = _interopRequireDefault(require("@material-ui/styles/createStyles"));
 var _makeStyles = _interopRequireDefault(require("@material-ui/styles/makeStyles"));
@@ -19,8 +18,9 @@ const useStyles = (0, _makeStyles.default)(theme => (0, _createStyles.default)({
 }));
 const MyComponent = props => {
   const classes = useStyles();
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    ...props,
     className: classes.root
-  }));
+  });
 };
 var _default = exports.default = MyComponent;

package/node/v5.0.0/jss-to-styled.test/withCreateStyles.expected.js CHANGED Viewed

@@ -1,11 +1,9 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _styles = require("@mui/material/styles");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -23,8 +21,9 @@ const Root = (0, _styles.styled)('div')(({
   }
 }));
 const MyComponent = props => {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, {
+    ...props,
     className: classes.root
-  }));
+  });
 };
 var _default = exports.default = MyComponent;

package/node/v5.0.0/jss-to-styled.test/withCreateStyles1.actual.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _createStyles = _interopRequireDefault(require("@material-ui/styles/createStyles"));
 var _withStyles = _interopRequireDefault(require("@material-ui/styles/withStyles"));
@@ -21,8 +20,9 @@ const MyComponent = props => {
   const {
     classes
   } = props;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    ...props,
     className: classes.root
-  }));
+  });
 };
 var _default = exports.default = (0, _withStyles.default)(styles)(MyComponent);

package/node/v5.0.0/jss-to-styled.test/withCreateStyles1.expected.js CHANGED Viewed

@@ -1,11 +1,9 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _styles = require("@mui/material/styles");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -24,8 +22,9 @@ const Root = (0, _styles.styled)('div')(({
 }));
 const MyComponent = props => {
   const {} = props;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, {
+    ...props,
     className: classes.root
-  }));
+  });
 };
 var _default = exports.default = MyComponent;

package/node/v5.0.0/jss-to-styled.test/withCreateStyles2.actual.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _createStyles = _interopRequireDefault(require("@material-ui/styles/createStyles"));
 var _withStyles = _interopRequireDefault(require("@material-ui/styles/withStyles"));
@@ -21,8 +20,9 @@ const MyComponent = props => {
   const {
     classes
   } = props;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    ...props,
     className: classes.root
-  }));
+  });
 };
 var _default = exports.default = (0, _withStyles.default)(styles)(MyComponent);

package/node/v5.0.0/jss-to-styled.test/withCreateStyles2.expected.js CHANGED Viewed

@@ -1,11 +1,9 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _styles = require("@mui/material/styles");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -22,8 +20,9 @@ const Root = (0, _styles.styled)('div')({
 });
 const MyComponent = props => {
   const {} = props;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, {
+    ...props,
     className: classes.root
-  }));
+  });
 };
 var _default = exports.default = MyComponent;

package/node/v5.0.0/jss-to-styled.test/withCreateStyles3.actual.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _createStyles = _interopRequireDefault(require("@material-ui/styles/createStyles"));
 var _makeStyles = _interopRequireDefault(require("@material-ui/styles/makeStyles"));
@@ -19,8 +18,9 @@ const useStyles = (0, _makeStyles.default)((0, _createStyles.default)({
 }));
 const MyComponent = props => {
   const classes = useStyles();
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    ...props,
     className: classes.root
-  }));
+  });
 };
 var _default = exports.default = MyComponent;

package/node/v5.0.0/jss-to-styled.test/withCreateStyles3.expected.js CHANGED Viewed

@@ -1,11 +1,9 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _styles = require("@mui/material/styles");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -21,8 +19,9 @@ const Root = (0, _styles.styled)('div')({
   }
 });
 const MyComponent = props => {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, {
+    ...props,
     className: classes.root
-  }));
+  });
 };
 var _default = exports.default = MyComponent;

package/node/v5.0.0/jss-to-tss-react.js CHANGED Viewed

@@ -7,8 +7,7 @@ exports.default = transformer;
 const ruleEndRegEx = /[^a-zA-Z0-9_]+/;
 function transformNestedKeys(j, comments, propValueNode, ruleRegEx, nestedKeys) {
   propValueNode.properties.forEach(prop => {
-    var _prop$value, _prop$value2;
-    if (((_prop$value = prop.value) == null ? void 0 : _prop$value.type) === 'ObjectExpression') {
+    if (prop.value?.type === 'ObjectExpression') {
       if (typeof prop.key.value === 'string' && ruleRegEx !== null) {
         let ruleIndex = prop.key.value.search(ruleRegEx);
         let searchStartIndex = 0;
@@ -45,7 +44,7 @@ function transformNestedKeys(j, comments, propValueNode, ruleRegEx, nestedKeys)
         }
       }
       transformNestedKeys(j, comments, prop.value, ruleRegEx, nestedKeys);
-    } else if (((_prop$value2 = prop.value) == null ? void 0 : _prop$value2.type) === 'ArrowFunctionExpression') {
+    } else if (prop.value?.type === 'ArrowFunctionExpression') {
       comments.push(j.commentLine(' TODO jss-to-tss-react codemod: Unable to handle style definition reliably. ArrowFunctionExpression in CSS prop.', true));
     }
   });
@@ -68,10 +67,9 @@ function transformStylesExpression(j, comments, stylesExpression, nestedKeys, se
   }
   if (objectExpression !== undefined) {
     objectExpression.properties.forEach(prop => {
-      var _prop$key, _prop$key2;
-      if ((_prop$key = prop.key) != null && _prop$key.name) {
+      if (prop.key?.name) {
         ruleNames.push(prop.key.name);
-      } else if (((_prop$key2 = prop.key) == null ? void 0 : _prop$key2.value) === '@global') {
+      } else if (prop.key?.value === '@global') {
         comments.push(j.commentLine(` TODO jss-to-tss-react codemod: '@global' is not supported by tss-react.`, true));
         comments.push(j.commentLine(` See https://mui.com/material-ui/customization/how-to-customize/#4-global-css-override for alternatives.`, true));
       }

package/node/v5.0.0/jss-to-tss-react.test/actual-mixins-pattern.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = ComponentUsingStyles;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _react = _interopRequireDefault(require("react"));
 var _styles = require("@material-ui/core/styles");
@@ -28,10 +27,12 @@ function cssProps() {
 const useStyles = (0, _styles.makeStyles)(theme => {
   return mixins();
 });
-const useStyles2 = (0, _styles.makeStyles)(theme => (0, _extends2.default)({}, mixins(), {
-  test2: (0, _extends2.default)({
-    color: "red"
-  }, cssProps())
+const useStyles2 = (0, _styles.makeStyles)(theme => ({
+  ...mixins(),
+  test2: {
+    color: "red",
+    ...cssProps()
+  }
 }));
 function ComponentUsingStyles(props) {
   const classes = useStyles();

package/node/v5.0.0/jss-to-tss-react.test/actual-withStyles.js CHANGED Viewed

@@ -9,7 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 var _core = require("@material-ui/core");
 var _clsx = _interopRequireDefault(require("clsx"));
 var _jsxRuntime = require("react/jsx-runtime");
-var _StyledComp, _StyledComp2, _StyledComp3a, _StyledComp3b, _StyledComp3c;
+var _StyledComp, _Fragment2;
 const styles1 = {
   test: {
     backgroundColor: "purple",
@@ -101,7 +101,7 @@ const styles3c = theme => {
 };
 const StyledComp3c = (0, _core.withStyles)(styles3c)(Comp3);
 function App() {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [_StyledComp2 || (_StyledComp2 = /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp2, {})), _StyledComp3a || (_StyledComp3a = /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3a, {})), _StyledComp3b || (_StyledComp3b = /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3b, {})), _StyledComp3c || (_StyledComp3c = /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3c, {}))]
-  });
+  return _Fragment2 || (_Fragment2 = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp2, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3a, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3b, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3c, {})]
+  }));
 }

package/node/v5.0.0/jss-to-tss-react.test/expected-mixins-pattern.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = ComponentUsingStyles;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
 var _mui = require("tss-react/mui");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -27,10 +26,12 @@ function cssProps() {
 const useStyles = (0, _mui.makeStyles)()(theme => {
   return mixins();
 });
-const useStyles2 = (0, _mui.makeStyles)()(theme => (0, _extends2.default)({}, mixins(), {
-  test2: (0, _extends2.default)({
-    color: "red"
-  }, cssProps())
+const useStyles2 = (0, _mui.makeStyles)()(theme => ({
+  ...mixins(),
+  test2: {
+    color: "red",
+    ...cssProps()
+  }
 }));
 function ComponentUsingStyles(props) {
   const {

package/node/v5.0.0/jss-to-tss-react.test/expected-withStyles.js CHANGED Viewed

@@ -9,7 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 var _mui = require("tss-react/mui");
 var _clsx = _interopRequireDefault(require("clsx"));
 var _jsxRuntime = require("react/jsx-runtime");
-var _StyledComp, _StyledComp2, _StyledComp3a, _StyledComp3b, _StyledComp3c;
+var _StyledComp, _Fragment2;
 const styles1 = {
   test: {
     backgroundColor: "purple",
@@ -101,7 +101,7 @@ const styles3c = (theme, _params, classes) => {
 };
 const StyledComp3c = (0, _mui.withStyles)(Comp3, styles3c);
 function App() {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [_StyledComp2 || (_StyledComp2 = /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp2, {})), _StyledComp3a || (_StyledComp3a = /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3a, {})), _StyledComp3b || (_StyledComp3b = /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3b, {})), _StyledComp3c || (_StyledComp3c = /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3c, {}))]
-  });
+  return _Fragment2 || (_Fragment2 = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp2, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3a, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3b, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComp3c, {})]
+  }));
 }

package/node/v5.0.0/link-underline-hover.js CHANGED Viewed

@@ -41,10 +41,7 @@ function transformer(file, api, options) {
     root.findJSXElements(name).forEach(({
       node
     }) => {
-      const hasUnderlineProp = node.openingElement.attributes.find(attr => {
-        var _attr$name;
-        return (attr == null || (_attr$name = attr.name) == null ? void 0 : _attr$name.name) === 'underline';
-      });
+      const hasUnderlineProp = node.openingElement.attributes.find(attr => attr?.name?.name === 'underline');
       if (!hasUnderlineProp) {
         node.openingElement.attributes.push(j.jsxAttribute(j.jsxIdentifier('underline'), j.literal('hover')));
       }

package/node/v5.0.0/pagination-round-circular.js CHANGED Viewed

@@ -13,18 +13,13 @@ function transformer(file, api, options) {
   const printOptions = options.printOptions;
   const source = j(file.source).find(j.JSXElement).filter(({
     node
-  }) => {
-    var _node$openingElement$;
-    return (_node$openingElement$ = node.openingElement.name.name) == null ? void 0 : _node$openingElement$.match(/^(Pagination|PaginationItem)$/);
-  }).forEach(path => {
+  }) => node.openingElement.name.name?.match(/^(Pagination|PaginationItem)$/)).forEach(path => {
     path.node.openingElement.attributes.forEach(node => {
-      var _node$value$expressio;
-      if (node.type === 'JSXAttribute' && node.name.name === 'shape' && (node.value.value === 'round' || ((_node$value$expressio = node.value.expression) == null ? void 0 : _node$value$expressio.value) === 'round')) {
+      if (node.type === 'JSXAttribute' && node.name.name === 'shape' && (node.value.value === 'round' || node.value.expression?.value === 'round')) {
         node.value = j.literal('circular');
       }
       if (node.type === 'JSXAttribute' && node.name.name === 'classes') {
-        var _node$value;
-        (((_node$value = node.value) == null || (_node$value = _node$value.expression) == null ? void 0 : _node$value.properties) || []).forEach(subNode => {
+        (node.value?.expression?.properties || []).forEach(subNode => {
           if (subNode.key.name === 'round') {
             subNode.key.name = 'circular';
           }

package/node/v5.0.0/preset-safe.test/actual.js CHANGED Viewed

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _styles = require("@material-ui/core/styles");
 var _CssBaseline2 = _interopRequireDefault(require("@material-ui/core/CssBaseline"));
@@ -122,10 +121,11 @@ const Header = () => {
         className: classes.autocomplete,
         options: top100Films,
         getOptionLabel: option => option.title,
-        renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, (0, _extends2.default)({}, params, {
+        renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+          ...params,
           label: "Combo box",
           variant: "outlined"
-        })),
+        }),
         closeIcon: _Box2 || (_Box2 = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box4.default, {
           fontSize: 12,
           width: 20,
@@ -244,7 +244,9 @@ const withThemeProvider = Component => props => {
       injectFirst: true,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MuiThemeProvider, {
         theme: theme,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, (0, _extends2.default)({}, props))
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
+          ...props
+        })
       })
     })
   });

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

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _styles = require("@mui/material/styles");
 var _makeStyles = _interopRequireDefault(require("@mui/styles/makeStyles"));
@@ -34,9 +33,10 @@ 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
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const withWidth = () => WrappedComponent => props => /*#__PURE__*/(0, _jsxRuntime.jsx)(WrappedComponent, (0, _extends2.default)({}, props, {
+const withWidth = () => WrappedComponent => props => /*#__PURE__*/(0, _jsxRuntime.jsx)(WrappedComponent, {
+  ...props,
   width: "xs"
-}));
+});
 const DarkContext = /*#__PURE__*/React.createContext();
 const Test = withWidth()(props => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box4.default, {
   p: 2,
@@ -126,10 +126,11 @@ const Header = () => {
         className: classes.autocomplete,
         options: top100Films,
         getOptionLabel: option => option.title,
-        renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, (0, _extends2.default)({}, params, {
+        renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+          ...params,
           label: "Combo box",
           variant: "outlined"
-        })),
+        }),
         clearIcon: _Box2 || (_Box2 = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box4.default, {
           fontSize: 12,
           width: 20,
@@ -251,7 +252,9 @@ const withThemeProvider = Component => props => {
         injectFirst: true,
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ThemeProvider, {
           theme: theme,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, (0, _extends2.default)({}, props))
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {
+            ...props
+          })
         })
       })
     })

package/node/v5.0.0/root-ref.test/expected.js CHANGED Viewed

@@ -1,13 +1,13 @@
 "use strict";
 var _jsxRuntime = require("react/jsx-runtime");
-var _Typography, _CssBaseline;
+var _Fragment;
 //
 // import {  Button } from '@material-ui/core';
 // import { Tooltip,  Button } from '@material-ui/core';
 function App() {
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [_Typography || (_Typography = /*#__PURE__*/(0, _jsxRuntime.jsx)(Typography, {})), _CssBaseline || (_CssBaseline = /*#__PURE__*/(0, _jsxRuntime.jsx)(CssBaseline, {}))]
-  });
+  return _Fragment || (_Fragment = /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Typography, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(CssBaseline, {})]
+  }));
 }

package/node/v5.0.0/skeleton-variant.js CHANGED Viewed

@@ -14,17 +14,15 @@ function transformer(file, api, options) {
   const source = j(file.source).findJSXElements('Skeleton').forEach(path => {
     path.node.openingElement.attributes.forEach(node => {
       if (node.type === 'JSXAttribute' && node.name.name === 'variant') {
-        var _node$value$expressio, _node$value$expressio2;
-        if (node.value.value === 'circle' || ((_node$value$expressio = node.value.expression) == null ? void 0 : _node$value$expressio.value) === 'circle') {
+        if (node.value.value === 'circle' || node.value.expression?.value === 'circle') {
           node.value = j.literal('circular');
         }
-        if (node.value.value === 'rect' || ((_node$value$expressio2 = node.value.expression) == null ? void 0 : _node$value$expressio2.value) === 'rect') {
+        if (node.value.value === 'rect' || node.value.expression?.value === 'rect') {
           node.value = j.literal('rectangular');
         }
       }
       if (node.type === 'JSXAttribute' && node.name.name === 'classes') {
-        var _node$value;
-        (_node$value = node.value) == null || (_node$value = _node$value.expression) == null || (_node$value = _node$value.properties) == null || _node$value.forEach(subNode => {
+        node.value?.expression?.properties?.forEach(subNode => {
           if (subNode.key.name === 'circle') {
             subNode.key.name = 'circular';
           }

package/node/v5.0.0/table-props.js CHANGED Viewed

@@ -14,15 +14,11 @@ function transformer(file, api, options) {
   const printOptions = options.printOptions;
   root.find(j.JSXElement).filter(({
     node
-  }) => {
-    var _node$openingElement$;
-    return (_node$openingElement$ = node.openingElement.name.name) == null ? void 0 : _node$openingElement$.match(/^(Table|TableCell)$/);
-  }).forEach(({
+  }) => node.openingElement.name.name?.match(/^(Table|TableCell)$/)).forEach(({
     node
   }) => {
     node.openingElement.attributes.forEach(attr => {
-      var _attr$name, _attr$value, _attr$value2;
-      if (((_attr$name = attr.name) == null ? void 0 : _attr$name.name) === 'padding' && (((_attr$value = attr.value) == null ? void 0 : _attr$value.value) === 'default' || ((_attr$value2 = attr.value) == null || (_attr$value2 = _attr$value2.expression) == null ? void 0 : _attr$value2.value) === 'default')) {
+      if (attr.name?.name === 'padding' && (attr.value?.value === 'default' || attr.value?.expression?.value === 'default')) {
         attr.value = j.literal('normal');
       }
     });
@@ -31,14 +27,13 @@ function transformer(file, api, options) {
     node
   }) => {
     node.openingElement.attributes.forEach(attr => {
-      var _attr$name2, _attr$name3;
       if (attr.type === 'JSXAttribute' && attr.name.name === 'onChangeRowsPerPage') {
         attr.name.name = 'onRowsPerPageChange';
       }
-      if (attr.type === 'JSXAttribute' && ((_attr$name2 = attr.name) == null ? void 0 : _attr$name2.name) === 'onChangePage') {
+      if (attr.type === 'JSXAttribute' && attr.name?.name === 'onChangePage') {
         attr.name.name = 'onPageChange';
       }
-      if (attr.type === 'JSXAttribute' && ((_attr$name3 = attr.name) == null ? void 0 : _attr$name3.name) === 'classes') {
+      if (attr.type === 'JSXAttribute' && attr.name?.name === 'classes') {
         (attr.value.expression.properties || []).forEach(subNode => {
           if (subNode.key.name === 'input') {
             subNode.key.name = 'select';

package/node/v5.0.0/table-props.test/actual.js CHANGED Viewed

@@ -1,7 +1,5 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _jsxRuntime = require("react/jsx-runtime");
 /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
   children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(TablePagination, {
@@ -19,8 +17,9 @@ var _jsxRuntime = require("react/jsx-runtime");
     padding: "default"
   }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TableCell, {
     padding: "default"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TablePagination, (0, _extends2.default)({
+  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TablePagination, {
     onChangeRowsPerPage: () => {},
-    onChangePage: () => {}
-  }, props))]
+    onChangePage: () => {},
+    ...props
+  })]
 });

package/node/v5.0.0/table-props.test/expected.js CHANGED Viewed

@@ -1,7 +1,5 @@
 "use strict";
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _jsxRuntime = require("react/jsx-runtime");
 /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
   children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(TablePagination, {
@@ -19,8 +17,9 @@ var _jsxRuntime = require("react/jsx-runtime");
     padding: "normal"
   }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TableCell, {
     padding: "normal"
-  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TablePagination, (0, _extends2.default)({
+  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(TablePagination, {
     onRowsPerPageChange: () => {},
-    onPageChange: () => {}
-  }, props))]
+    onPageChange: () => {},
+    ...props
+  })]
 });

package/node/v5.0.0/tabs-scroll-buttons.js CHANGED Viewed

@@ -19,13 +19,12 @@ function transformer(file, api, options) {
     node.openingElement.attributes.forEach(attr => {
       if (attr.name && attr.name.name === 'scrollButtons') {
         if (attr.value) {
-          var _attr$value$expressio, _attr$value$expressio2, _attr$value$expressio3, _attr$value$expressio4;
-          prevScrollButtonValue = attr.value.value || ((_attr$value$expressio = attr.value.expression) == null ? void 0 : _attr$value$expressio.value);
-          if (attr.value.value === 'on' || ((_attr$value$expressio2 = attr.value.expression) == null ? void 0 : _attr$value$expressio2.value) === 'on') {
+          prevScrollButtonValue = attr.value.value || attr.value.expression?.value;
+          if (attr.value.value === 'on' || attr.value.expression?.value === 'on') {
             delete attr.value;
-          } else if (attr.value.value === 'desktop' || ((_attr$value$expressio3 = attr.value.expression) == null ? void 0 : _attr$value$expressio3.value) === 'desktop') {
+          } else if (attr.value.value === 'desktop' || attr.value.expression?.value === 'desktop') {
             delete attr.value;
-          } else if (attr.value.value === 'off' || ((_attr$value$expressio4 = attr.value.expression) == null ? void 0 : _attr$value$expressio4.value) === 'off') {
+          } else if (attr.value.value === 'off' || attr.value.expression?.value === 'off') {
             attr.value = j.jsxExpressionContainer(j.literal(false));
           }
         }