@mui/codemod 6.0.0-alpha.11 → 6.0.0-alpha.14

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

@@ -26,9 +26,11 @@ var _modalProps = _interopRequireDefault(require("../modal-props"));
 var _outlinedInputProps = _interopRequireDefault(require("../outlined-input-props"));
 var _paginationItemClasses = _interopRequireDefault(require("../pagination-item-classes"));
 var _speedDialProps = _interopRequireDefault(require("../speed-dial-props"));
+var _tableSortLabelClasses = _interopRequireDefault(require("../table-sort-label-classes"));
 var _stepConnectorClasses = _interopRequireDefault(require("../step-connector-classes"));
 var _stepLabelProps = _interopRequireDefault(require("../step-label-props"));
 var _textFieldProps = _interopRequireDefault(require("../text-field-props"));
+var _tabClasses = _interopRequireDefault(require("../tab-classes"));
 var _toggleButtonGroupClasses = _interopRequireDefault(require("../toggle-button-group-classes"));
 /**
  * @param {import('jscodeshift').FileInfo} file
@@ -58,7 +60,9 @@ function deprecationsAll(file, api, options) {
   file.source = (0, _speedDialProps.default)(file, api, options);
   file.source = (0, _stepConnectorClasses.default)(file, api, options);
   file.source = (0, _stepLabelProps.default)(file, api, options);
+  file.source = (0, _tableSortLabelClasses.default)(file, api, options);
   file.source = (0, _textFieldProps.default)(file, api, options);
+  file.source = (0, _tabClasses.default)(file, api, options);
   file.source = (0, _toggleButtonGroupClasses.default)(file, api, options);
   return file.source;
 }

package/node/deprecations/all/postcss.config.js

@@ -27,6 +27,12 @@ const {
 const {
   plugin: circularProgressClassesPlugin
 } = require('../circular-progress-classes/postcss-plugin');
+const {
+  plugin: tabClassesPlugin
+} = require('../tab-classes/postcss-plugin');
+const {
+  plugin: tableSortLabelClassesPlugin
+} = require('../table-sort-label-classes/postcss-plugin');
 module.exports = {
-  plugins: [accordionSummaryClassesPlugin, alertClassesPlugin, buttonClassesPlugin, buttonGroupClassesPlugin, chipClassesPlugin, circularProgressClassesPlugin, paginationItemClassesPlugin, stepConnectorClassesPlugin, toggleButtonGroupClassesPlugin]
+  plugins: [accordionSummaryClassesPlugin, alertClassesPlugin, buttonClassesPlugin, buttonGroupClassesPlugin, chipClassesPlugin, circularProgressClassesPlugin, paginationItemClassesPlugin, stepConnectorClassesPlugin, toggleButtonGroupClassesPlugin, tabClassesPlugin, tableSortLabelClassesPlugin]
 };

package/node/deprecations/tab-classes/index.js

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

package/node/deprecations/tab-classes/postcss-plugin.js

@@ -0,0 +1,30 @@
+"use strict";
+
+const classes = [{
+  deprecatedClass: ' .MuiTab-iconWrapper',
+  replacementSelector: ' .MuiTab-icon'
+}];
+const plugin = () => {
+  return {
+    postcssPlugin: `Replace deprecated Tab classes with new classes`,
+    Rule(rule) {
+      const {
+        selector
+      } = rule;
+      classes.forEach(({
+        deprecatedClass,
+        replacementSelector
+      }) => {
+        const selectorRegex = new RegExp(`${deprecatedClass}$`);
+        if (selector.match(selectorRegex)) {
+          rule.selector = selector.replace(selectorRegex, replacementSelector);
+        }
+      });
+    }
+  };
+};
+plugin.postcss = true;
+module.exports = {
+  plugin,
+  classes
+};

package/node/deprecations/tab-classes/postcss.config.js

@@ -0,0 +1,8 @@
+"use strict";
+
+const {
+  plugin
+} = require('./postcss-plugin');
+module.exports = {
+  plugins: [plugin]
+};

package/node/deprecations/tab-classes/tab-classes.js

@@ -0,0 +1,53 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = transformer;
+var _postcssPlugin = require("./postcss-plugin");
+/**
+ * @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;
+  _postcssPlugin.classes.forEach(({
+    deprecatedClass,
+    replacementSelector
+  }) => {
+    const replacementSelectorPrefix = '&';
+    root.find(j.ImportDeclaration).filter(path => path.node.source.value.match(/^@mui\/material\/Tab$/)).forEach(path => {
+      path.node.specifiers.forEach(specifier => {
+        if (specifier.type === 'ImportSpecifier' && specifier.imported.name === 'tabClasses') {
+          const deprecatedAtomicClass = deprecatedClass.replace(`${deprecatedClass.split('-')[0]}-`, '');
+          root.find(j.MemberExpression, {
+            object: {
+              name: specifier.local.name
+            },
+            property: {
+              name: deprecatedAtomicClass
+            }
+          }).forEach(memberExpression => {
+            const parent = memberExpression.parentPath.parentPath.value;
+            if (parent.type === j.TemplateLiteral.name) {
+              const memberExpressionIndex = parent.expressions.findIndex(expression => expression === memberExpression.value);
+              const precedingTemplateElement = parent.quasis[memberExpressionIndex];
+              const atomicClasses = ['icon'];
+              if (precedingTemplateElement.value.raw.endsWith(deprecatedClass.startsWith(' ') ? `${replacementSelectorPrefix} .` : `${replacementSelectorPrefix}.`)) {
+                const atomicClassesArgs = [memberExpressionIndex, 1, ...atomicClasses.map(atomicClass => j.memberExpression(memberExpression.value.object, j.identifier(atomicClass)))];
+                parent.expressions.splice(...atomicClassesArgs);
+              }
+            }
+          });
+        }
+      });
+    });
+    const selectorRegex = new RegExp(`${replacementSelectorPrefix}${deprecatedClass}$`);
+    root.find(j.Literal, literal => typeof literal.value === 'string' && literal.value.match(selectorRegex)).forEach(path => {
+      path.replace(j.literal(path.value.value.replace(selectorRegex, `${replacementSelectorPrefix}${replacementSelector}`)));
+    });
+  });
+  return root.toSource(printOptions);
+}

package/node/deprecations/tab-classes/test-cases/actual.js

@@ -0,0 +1,5 @@
+"use strict";
+
+var _Tab = require("@mui/material/Tab");
+'& .MuiTab-iconWrapper';
+`& .${_Tab.tabClasses.iconWrapper}`;

package/node/deprecations/tab-classes/test-cases/expected.js

@@ -0,0 +1,5 @@
+"use strict";
+
+var _Tab = require("@mui/material/Tab");
+"& .MuiTab-icon";
+`& .${_Tab.tabClasses.icon}`;

package/node/deprecations/table-sort-label-classes/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _tableSortLabelClasses.default;
+  }
+});
+var _tableSortLabelClasses = _interopRequireDefault(require("./table-sort-label-classes"));

package/node/deprecations/table-sort-label-classes/postcss-plugin.js

@@ -0,0 +1,33 @@
+"use strict";
+
+const classes = [{
+  deprecatedClass: ' .MuiTableSortLabel-iconDirectionDesc',
+  replacementSelector: '.MuiTableSortLabel-directionDesc > .MuiTableSortLabel-icon'
+}, {
+  deprecatedClass: ' .MuiTableSortLabel-iconDirectionAsc',
+  replacementSelector: '.MuiTableSortLabel-directionAsc > .MuiTableSortLabel-icon'
+}];
+const plugin = () => {
+  return {
+    postcssPlugin: `Replace deprecated TableSortLabel classes with new classes`,
+    Rule(rule) {
+      const {
+        selector
+      } = rule;
+      classes.forEach(({
+        deprecatedClass,
+        replacementSelector
+      }) => {
+        const selectorRegex = new RegExp(`${deprecatedClass}$`);
+        if (selector.match(selectorRegex)) {
+          rule.selector = selector.replace(selectorRegex, replacementSelector);
+        }
+      });
+    }
+  };
+};
+plugin.postcss = true;
+module.exports = {
+  plugin,
+  classes
+};

package/node/deprecations/table-sort-label-classes/postcss.config.js

@@ -0,0 +1,8 @@
+"use strict";
+
+const {
+  plugin
+} = require('./postcss-plugin');
+module.exports = {
+  plugins: [plugin]
+};

package/node/deprecations/table-sort-label-classes/table-sort-label-classes.js

@@ -0,0 +1,77 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = transformer;
+var _postcssPlugin = require("./postcss-plugin");
+/**
+ * @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;
+  _postcssPlugin.classes.forEach(({
+    deprecatedClass,
+    replacementSelector
+  }) => {
+    const replacementSelectorPrefix = '&';
+    root.find(j.ImportDeclaration).filter(path => path.node.source.value.match(/^@mui\/material\/TableSortLabel$/)).forEach(path => {
+      path.node.specifiers.forEach(specifier => {
+        if (specifier.type === 'ImportSpecifier' && specifier.imported.name === 'tableSortLabelClasses') {
+          const deprecatedAtomicClass = deprecatedClass.replace(`${deprecatedClass.split('-')[0]}-`, '');
+          root.find(j.MemberExpression, {
+            object: {
+              name: specifier.local.name
+            },
+            property: {
+              name: deprecatedAtomicClass
+            }
+          }).forEach(memberExpression => {
+            const parent = memberExpression.parentPath.parentPath.value;
+            if (parent.type === j.TemplateLiteral.name) {
+              const memberExpressionIndex = parent.expressions.findIndex(expression => expression === memberExpression.value);
+              const precedingTemplateElement = parent.quasis[memberExpressionIndex];
+              const atomicClasses = replacementSelector.replaceAll('MuiTableSortLabel-', '').replaceAll(replacementSelectorPrefix, '').replaceAll(' > ', '').split('.').filter(Boolean);
+              if (precedingTemplateElement.value.raw.endsWith(deprecatedClass.startsWith(' ') ? `${replacementSelectorPrefix} .` : `${replacementSelectorPrefix}.`)) {
+                const atomicClassesArgs = [memberExpressionIndex, 1, ...atomicClasses.map(atomicClass => j.memberExpression(memberExpression.value.object, j.identifier(atomicClass)))];
+                parent.expressions.splice(...atomicClassesArgs);
+                if (replacementSelector.includes(' > ')) {
+                  const quasisArgs = [memberExpressionIndex, 1, j.templateElement({
+                    raw: precedingTemplateElement.value.raw.replace(' ', ''),
+                    cooked: precedingTemplateElement.value.cooked.replace(' ', '')
+                  }, false), j.templateElement({
+                    raw: ' > .',
+                    cooked: ' > .'
+                  }, false)];
+                  if (atomicClasses.length === 3) {
+                    quasisArgs.splice(3, 0, j.templateElement({
+                      raw: '.',
+                      cooked: '.'
+                    }, false));
+                  }
+                  parent.quasis.splice(...quasisArgs);
+                } else {
+                  parent.quasis.splice(memberExpressionIndex, 1, j.templateElement({
+                    raw: precedingTemplateElement.value.raw,
+                    cooked: precedingTemplateElement.value.cooked
+                  }, false), j.templateElement({
+                    raw: '.',
+                    cooked: '.'
+                  }, false));
+                }
+              }
+            }
+          });
+        }
+      });
+    });
+    const selectorRegex = new RegExp(`${replacementSelectorPrefix}${deprecatedClass}$`);
+    root.find(j.Literal, literal => typeof literal.value === 'string' && literal.value.match(selectorRegex)).forEach(path => {
+      path.replace(j.literal(path.value.value.replace(selectorRegex, `${replacementSelectorPrefix}${replacementSelector}`)));
+    });
+  });
+  return root.toSource(printOptions);
+}

package/node/deprecations/table-sort-label-classes/test-cases/actual.js

@@ -0,0 +1,7 @@
+"use strict";
+
+var _TableSortLabel = require("@mui/material/TableSortLabel");
+'& .MuiTableSortLabel-iconDirectionDesc';
+'& .MuiTableSortLabel-iconDirectionAsc';
+`& .${_TableSortLabel.tableSortLabelClasses.iconDirectionDesc}`;
+`& .${_TableSortLabel.tableSortLabelClasses.iconDirectionAsc}`;

package/node/deprecations/table-sort-label-classes/test-cases/expected.js

@@ -0,0 +1,7 @@
+"use strict";
+
+var _TableSortLabel = require("@mui/material/TableSortLabel");
+"&.MuiTableSortLabel-directionDesc > .MuiTableSortLabel-icon";
+"&.MuiTableSortLabel-directionAsc > .MuiTableSortLabel-icon";
+`&.${_TableSortLabel.tableSortLabelClasses.directionDesc} > .${_TableSortLabel.tableSortLabelClasses.icon}`;
+`&.${_TableSortLabel.tableSortLabelClasses.directionAsc} > .${_TableSortLabel.tableSortLabelClasses.icon}`;

package/node/util/migrateToVariants.js

@@ -331,25 +331,32 @@ function migrateToVariants(j, styles) {
     } else if (style.body.type === 'ConditionalExpression') {
       // skip ConditionalExpression
     } else {
-      let objectExpression = style.body;
-      let counter = 0;
-      while (objectExpression.type !== 'ObjectExpression' && counter < MAX_DEPTH) {
-        counter += 1;
-        if (objectExpression.type === 'BlockStatement') {
-          objectExpression = objectExpression.body.find(item => item.type === 'ReturnStatement').argument;
-        }
+      const expressions = [];
+      if (style.body.type === 'ArrayExpression') {
+        expressions.push(...style.body.elements);
+      } else {
+        expressions.push(style.body);
       }
-      recurseObjectExpression({
-        node: objectExpression,
-        buildStyle: createBuildStyle()
+      expressions.forEach(objectExpression => {
+        let counter = 0;
+        while (objectExpression.type !== 'ObjectExpression' && counter < MAX_DEPTH) {
+          counter += 1;
+          if (objectExpression.type === 'BlockStatement') {
+            objectExpression = objectExpression.body.find(item => item.type === 'ReturnStatement').argument;
+          }
+        }
+        recurseObjectExpression({
+          node: objectExpression,
+          buildStyle: createBuildStyle()
+        });
+        if (variants.length && objectExpression.type === 'ObjectExpression') {
+          objectExpression.properties.push(j.objectProperty(j.identifier('variants'), j.arrayExpression(variants.filter(variant => {
+            const props = variant.properties.find(prop => prop.key.name === 'props');
+            const styleVal = variant.properties.find(prop => prop.key.name === 'style');
+            return props && styleVal && (!styleVal.value.properties || styleVal.value.properties.length > 0) && (props.value.type === 'ArrowFunctionExpression' || props.value.properties.length > 0);
+          }))));
+        }
       });
-      if (variants.length) {
-        objectExpression.properties.push(j.objectProperty(j.identifier('variants'), j.arrayExpression(variants.filter(variant => {
-          const props = variant.properties.find(prop => prop.key.name === 'props');
-          const styleVal = variant.properties.find(prop => prop.key.name === 'style');
-          return props && styleVal && (!styleVal.value.properties || styleVal.value.properties.length > 0) && (props.value.type === 'ArrowFunctionExpression' || props.value.properties.length > 0);
-        }))));
-      }
     }
     function recurseObjectExpression(data) {
       if (data.node.type === 'ObjectExpression') {
@@ -477,7 +484,6 @@ function migrateToVariants(j, styles) {
             leftName = (_getObjectKey5 = getObjectKey(data.node.test.argument)) == null ? void 0 : _getObjectKey5.name;
           }
           if (parameters.has(leftName) && leftName !== 'theme') {
-            var _data$parentNode;
             let props = buildProps(data.node.test);
             if (data.props) {
               props = mergeProps(data.props, props);
@@ -488,32 +494,37 @@ function migrateToVariants(j, styles) {
               style: styleVal
             };
             variants.push(buildObjectAST(variant));
-
-            // create another variant with inverted condition
-            let props2 = buildProps(inverseBinaryExpression(data.node.test));
-            if (data.props) {
-              props2 = mergeProps(data.props, props2);
-            }
-            const styleVal2 = data.buildStyle(data.node.alternate);
-            const variant2 = {
-              props: props2,
-              style: styleVal2
-            };
-            variants.push(buildObjectAST(variant2));
-            if (((_data$parentNode = data.parentNode) == null ? void 0 : _data$parentNode.type) === 'ObjectExpression') {
-              removeProperty(data.parentNode, data.node);
+            if (data.node.consequent.type === 'ObjectExpression' && data.node.alternate.type === 'ObjectExpression') {
+              var _data$parentNode;
+              // create another variant with inverted condition
+              let props2 = buildProps(inverseBinaryExpression(data.node.test));
+              if (data.props) {
+                props2 = mergeProps(data.props, props2);
+              }
+              const styleVal2 = data.buildStyle(data.node.alternate);
+              const variant2 = {
+                props: props2,
+                style: styleVal2
+              };
+              variants.push(buildObjectAST(variant2));
+              if (((_data$parentNode = data.parentNode) == null ? void 0 : _data$parentNode.type) === 'ObjectExpression') {
+                removeProperty(data.parentNode, data.node);
+              }
+            } else {
+              var _data$replaceValue;
+              (_data$replaceValue = data.replaceValue) == null || _data$replaceValue.call(data, data.node.alternate);
             }
           }
           if (leftName === 'theme' && ((_data$parentNode2 = data.parentNode) == null ? void 0 : _data$parentNode2.type) === 'ObjectExpression' && ((_data$node$test = data.node.test) == null ? void 0 : _data$node$test.type) === 'BinaryExpression' && isThemePaletteMode(data.node.test.left)) {
             if (data.node.consequent.type !== 'ObjectExpression' && data.node.alternate.type !== 'ObjectExpression') {
-              var _data$replaceValue;
+              var _data$replaceValue2;
               if (data.modeStyles) {
                 if (!data.modeStyles[data.node.test.right.value]) {
                   data.modeStyles[data.node.test.right.value] = [];
                 }
                 data.modeStyles[data.node.test.right.value].push(j.objectProperty(data.key, data.node.consequent));
               }
-              (_data$replaceValue = data.replaceValue) == null || _data$replaceValue.call(data, data.node.alternate);
+              (_data$replaceValue2 = data.replaceValue) == null || _data$replaceValue2.call(data, data.node.alternate);
             }
           }
         }
@@ -549,10 +560,10 @@ function migrateToVariants(j, styles) {
               data.modeStyles[mode].push(j.objectProperty(data.key, clonedNode));
             });
             if (data.key) {
-              var _data$replaceValue2;
+              var _data$replaceValue3;
               // to remove the arrow function
               // { ...: theme => `1px solid...` } to { ...: `1px solid...` }
-              (_data$replaceValue2 = data.replaceValue) == null || _data$replaceValue2.call(data, data.node);
+              (_data$replaceValue3 = data.replaceValue) == null || _data$replaceValue3.call(data, data.node);
             }
           }
         }

package/node/v5.0.0/theme-spacing.test/large-actual.js

@@ -24,7 +24,7 @@ var _GlobalStyles = _interopRequireDefault(require("@mui/material/GlobalStyles")
 var _styles = require("@mui/material/styles");
 var _config = require("docs/config");
 var _Link = _interopRequireDefault(require("docs/src/modules/components/Link"));
-var _i18n = require("docs/src/modules/utils/i18n");
+var _i18n = require("@mui/docs/i18n");
 var _useLazyCSS = _interopRequireDefault(require("docs/src/modules/utils/useLazyCSS"));
 var _getUrlProduct = _interopRequireDefault(require("docs/src/modules/utils/getUrlProduct"));
 var _jsxRuntime = require("react/jsx-runtime");

package/node/v5.0.0/theme-spacing.test/large-expected.js

@@ -24,7 +24,7 @@ var _GlobalStyles = _interopRequireDefault(require("@mui/material/GlobalStyles")
 var _styles = require("@mui/material/styles");
 var _config = require("docs/config");
 var _Link = _interopRequireDefault(require("docs/src/modules/components/Link"));
-var _i18n = require("docs/src/modules/utils/i18n");
+var _i18n = require("@mui/docs/i18n");
 var _useLazyCSS = _interopRequireDefault(require("docs/src/modules/utils/useLazyCSS"));
 var _getUrlProduct = _interopRequireDefault(require("docs/src/modules/utils/getUrlProduct"));
 var _jsxRuntime = require("react/jsx-runtime");

package/node/v6.0.0/grid-v2-props/grid-v2-props.js

@@ -0,0 +1,149 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = gridV2Props;
+const possibleDefaultImports = ['@mui/material/Unstable_Grid2', '@mui/system/Unstable_Grid', '@mui/joy/Grid'];
+const possibleNamedImports = {
+  '@mui/material': 'Unstable_Grid2',
+  '@mui/system': 'Unstable_Grid',
+  '@mui/joy': 'Grid'
+};
+const defaultBreakpoints = ['xs', 'sm', 'md', 'lg', 'xl'];
+
+/**
+ * @param {import('jscodeshift').FileInfo} file
+ * @param {import('jscodeshift').API} api
+ */
+function gridV2Props(file, api, options) {
+  var _file$path, _file$path2, _options$muiBreakpoin;
+  if ((_file$path = file.path) != null && _file$path.endsWith('.json') || (_file$path2 = file.path) != null && _file$path2.endsWith('.d.ts')) {
+    return file.source;
+  }
+  const j = api.jscodeshift;
+  const root = j(file.source);
+  const breakpoints = ((_options$muiBreakpoin = options.muiBreakpoints) == null ? void 0 : _options$muiBreakpoin.split(',')) || defaultBreakpoints;
+  const printOptions = options.printOptions;
+  const gridLocalNames = [];
+  root.find(j.ImportDeclaration, decl => possibleDefaultImports.includes(decl.source.value)).forEach(decl => {
+    decl.node.specifiers.forEach(spec => {
+      if (spec.type === 'ImportDefaultSpecifier') {
+        gridLocalNames.push(spec.local.name);
+      }
+    });
+  });
+  root.find(j.ImportDeclaration, decl => Object.keys(possibleNamedImports).includes(decl.source.value)).forEach(decl => {
+    decl.node.specifiers.forEach(spec => {
+      if (spec.type === 'ImportSpecifier') {
+        if (possibleNamedImports[decl.node.source.value] === spec.imported.name) {
+          gridLocalNames.push(spec.local.name);
+        }
+      }
+    });
+  });
+  root.find(j.JSXElement, {
+    openingElement: {
+      name: {
+        name: name => gridLocalNames.includes(name)
+      }
+    }
+  }).forEach(el => {
+    const size = j.objectExpression([]);
+    const spreadProps = [];
+    const attributesToPrune = [];
+    el.node.openingElement.attributes.forEach(attr => {
+      if (attr.type === 'JSXSpreadAttribute') {
+        spreadProps.push(attr);
+      }
+    });
+    const breakpointNodes = j(el).find(j.JSXAttribute).filter(path => path.parent.parent.node === el.node && breakpoints.includes(path.node.name.name));
+    breakpointNodes.nodes().forEach(node => {
+      const breakpoint = node.name.name;
+      const nodeValue = node.value;
+      let value;
+      if (nodeValue === null) {
+        value = j.stringLiteral('grow');
+      } else if (nodeValue.type === 'JSXExpressionContainer') {
+        if (nodeValue.expression.value === true) {
+          value = j.stringLiteral('grow');
+        } else {
+          value = nodeValue.expression;
+        }
+      } else {
+        value = nodeValue;
+      }
+      size.properties.push(j.property('init', j.identifier(breakpoint), value));
+    });
+    spreadProps.forEach(spreadProp => {
+      const spreadPropArgument = spreadProp.argument;
+      if (spreadPropArgument.type === 'ObjectExpression') {
+        const propertiesToPrune = [];
+        spreadPropArgument.properties.forEach(property => {
+          if (breakpoints.includes(property.key.name)) {
+            size.properties.push(j.property('init', property.key, property.value));
+            propertiesToPrune.push(property.key.name);
+          }
+        });
+        spreadPropArgument.properties = spreadPropArgument.properties.filter(prop => !propertiesToPrune.includes(prop.key.name));
+        if (spreadPropArgument.properties.length === 0) {
+          attributesToPrune.push(spreadProp);
+        }
+      }
+    });
+    if (size.properties.length) {
+      let sizePropValue = size;
+      if (size.properties.length === 1 && size.properties[0].key.name === 'xs') {
+        sizePropValue = size.properties[0].value;
+      }
+      if (sizePropValue.type !== 'StringLiteral') {
+        sizePropValue = j.jsxExpressionContainer(sizePropValue);
+      }
+      el.node.openingElement.attributes.push(j.jsxAttribute(j.jsxIdentifier('size'), sizePropValue));
+    }
+    el.node.openingElement.attributes = el.node.openingElement.attributes.filter(attr => {
+      var _attr$name;
+      return !breakpoints.includes(attr == null || (_attr$name = attr.name) == null ? void 0 : _attr$name.name);
+    });
+    const offset = j.objectExpression([]);
+    const offsetNodes = j(el).find(j.JSXAttribute).filter(path => path.parent.parent.node === el.node && path.node.name.name.endsWith('Offset') && breakpoints.includes(path.node.name.name.replace('Offset', '')));
+    offsetNodes.nodes().forEach(node => {
+      const breakpoint = node.name.name.replace('Offset', '');
+      const value = node.value.type === 'JSXExpressionContainer' ? node.value.expression : node.value;
+      offset.properties.push(j.property('init', j.identifier(breakpoint), value));
+    });
+    spreadProps.forEach(spreadProp => {
+      const spreadPropArgument = spreadProp.argument;
+      if (spreadPropArgument.type === 'ObjectExpression') {
+        const propertiesToPrune = [];
+        spreadPropArgument.properties.forEach(property => {
+          const breakpoint = property.key.name.replace('Offset', '');
+          if (property.key.name.endsWith('Offset') && breakpoints.includes(breakpoint)) {
+            offset.properties.push(j.property('init', j.identifier(breakpoint), property.value));
+            propertiesToPrune.push(property.key.name);
+          }
+        });
+        spreadPropArgument.properties = spreadPropArgument.properties.filter(prop => !propertiesToPrune.includes(prop.key.name));
+        if (spreadPropArgument.properties.length === 0) {
+          attributesToPrune.push(spreadProp);
+        }
+      }
+    });
+    if (offset.properties.length) {
+      let offsetPropValue = offset;
+      if (offset.properties.length === 1 && offset.properties[0].key.name === 'xs') {
+        offsetPropValue = offset.properties[0].value;
+      }
+      if (offsetPropValue.type !== 'StringLiteral') {
+        offsetPropValue = j.jsxExpressionContainer(offsetPropValue);
+      }
+      el.node.openingElement.attributes.push(j.jsxAttribute(j.jsxIdentifier('offset'), offsetPropValue));
+    }
+    el.node.openingElement.attributes = el.node.openingElement.attributes.filter(attr => {
+      var _attr$name2;
+      return !breakpoints.includes(attr == null || (_attr$name2 = attr.name) == null ? void 0 : _attr$name2.name.replace('Offset', ''));
+    });
+    el.node.openingElement.attributes = el.node.openingElement.attributes.filter(attr => !attributesToPrune.includes(attr));
+  });
+  return root.toSource(printOptions);
+}

package/node/v6.0.0/grid-v2-props/index.js

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