@atlaskit/codemod-cli 0.24.0 → 0.24.2

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/codemod-cli
 
+## 0.24.2
+
+### Patch Changes
+
+-   [#102800](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/102800)
+    [`868e9aebf5af`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/868e9aebf5af) -
+    Fix icon buttons with loading being converted to default buttons
+
+## 0.24.1
+
+### Patch Changes
+
+-   [#100948](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100948)
+    [`28061857f2cd`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/28061857f2cd) -
+    Prevent migration of buttons where icon component might be wrapped.
+
 ## 0.24.0
 
 ### Minor Changes

package/dist/cjs/main.js

@@ -305,7 +305,7 @@ function _main() {
         case 4:
           _yield$parseArgs = _context5.sent;
           packages = _yield$parseArgs.packages;
-          _process$env$_PACKAGE = "0.24.0", _PACKAGE_VERSION_ = _process$env$_PACKAGE === void 0 ? '0.0.0-dev' : _process$env$_PACKAGE;
+          _process$env$_PACKAGE = "0.24.2", _PACKAGE_VERSION_ = _process$env$_PACKAGE === void 0 ? '0.0.0-dev' : _process$env$_PACKAGE;
           logger.log(_chalk.default.bgBlue(_chalk.default.black("\uD83D\uDCDA Atlassian-Frontend codemod library @ ".concat(_PACKAGE_VERSION_, " \uD83D\uDCDA"))));
           if (packages && packages.length > 0) {
             logger.log(_chalk.default.gray("Searching for codemods for newer versions of the following packages: ".concat(packages.map(function (pkg) {

package/dist/cjs/presets/migrate-to-new-buttons/codemods/next-migrate-to-new-button-variants.js

@@ -13,9 +13,11 @@ var _ifVariantAlreadyImported = require("../utils/if-variant-already-imported");
 var _renameDefaultButtonToLegacyButton = require("../utils/rename-default-button-to-legacy-button");
 var _migrateFitContainerIconButton = require("../utils/migrate-fit-container-icon-button");
 var _importTypesFromNewEntryPoint = require("../utils/import-types-from-new-entry-point");
+var _addCommentForCustomThemeButtons = require("../utils/add-comment-for-custom-theme-buttons");
 var transformer = function transformer(file, api) {
   var j = api.jscodeshift;
   var fileSource = j(file.source);
+  (0, _addCommentForCustomThemeButtons.addCommentForCustomThemeButtons)(fileSource, j);
   var buttonImports = fileSource.find(j.ImportDeclaration).filter(function (path) {
     return path.node.source.value === _constants.entryPointsMapping.Button || path.node.source.value === _constants.entryPointsMapping.LoadingButton || path.node.source.value === _constants.NEW_BUTTON_ENTRY_POINT;
   });
@@ -32,6 +34,7 @@ var transformer = function transformer(file, api) {
   var hasLinkIconButton = (0, _ifVariantAlreadyImported.checkIfVariantAlreadyImported)(_constants.NEW_BUTTON_VARIANTS.linkIcon, fileSource, j);
   var hasLinkButton = (0, _ifVariantAlreadyImported.checkIfVariantAlreadyImported)(_constants.NEW_BUTTON_VARIANTS.link, fileSource, j);
   var hasIconButton = (0, _ifVariantAlreadyImported.checkIfVariantAlreadyImported)(_constants.NEW_BUTTON_VARIANTS.icon, fileSource, j);
+  var hasDefaultLoadingButton = false;
   var allButtons = fileSource.find(j.JSXElement).filter(function (path) {
     return path.value.openingElement.name.type === 'JSXIdentifier' && path.value.openingElement.name.name === specifierIdentifier;
   });
@@ -78,7 +81,8 @@ var transformer = function transformer(file, api) {
       hasLinkButton = true;
       j(element).replaceWith((0, _generateNewButtonElement.generateNewElement)(_constants.NEW_BUTTON_VARIANTS.link, element.value, j));
     }
-    if (isLoadingButton) {
+    if (isLoadingButton && !isIconButton) {
+      hasDefaultLoadingButton = true;
       j(element).replaceWith((0, _generateNewButtonElement.generateNewElement)(_constants.NEW_BUTTON_VARIANTS.default, element.value, j));
     }
     var linkAppearanceAttribute = attributes.find(function (node) {
@@ -117,7 +121,11 @@ var transformer = function transformer(file, api) {
         path.node.name = _constants.NEW_BUTTON_VARIANTS.default;
       }
     });
-    specifiers.push(j.importDefaultSpecifier(j.identifier(_constants.NEW_BUTTON_VARIANTS.default)));
+
+    // Only add the Button import if we found a default button, not icon only
+    if (hasDefaultLoadingButton) {
+      specifiers.push(j.importDefaultSpecifier(j.identifier(_constants.NEW_BUTTON_VARIANTS.default)));
+    }
   }
   if (!specifiers.find(function (specifier) {
     return specifier.type === 'ImportDefaultSpecifier';

package/dist/cjs/presets/migrate-to-new-buttons/codemods/next-remove-unsafe-size.js

@@ -62,17 +62,27 @@ function _default(file, api) {
 
         // Check if render prop or bounded API
         iconAttributes.forEach(function (iconAttribute) {
-          var _newButtonJXSElement$2, _iconAttribute$value;
+          var _newButtonJXSElement$2, _iconAttribute$value, _iconAttribute$value$;
           var unsafeSizeAttribute = (_newButtonJXSElement$2 = newButtonJXSElement.value.openingElement.attributes) === null || _newButtonJXSElement$2 === void 0 ? void 0 : _newButtonJXSElement$2.find(function (attribute) {
             return attribute.type === 'JSXAttribute' && attribute.name.name === unsafeSizeProp;
           });
           if (iconAttribute.type !== 'JSXAttribute' || ((_iconAttribute$value = iconAttribute.value) === null || _iconAttribute$value === void 0 ? void 0 : _iconAttribute$value.type) !== 'JSXExpressionContainer' || !unsafeSizeAttribute || unsafeSizeAttribute.type !== 'JSXAttribute') {
             return;
           }
+          var safeSizeAttribute = j.jsxAttribute.from({
+            name: j.jsxIdentifier('size'),
+            value: unsafeSizeAttribute.value
+          });
           switch (iconAttribute.value.expression.type) {
             // We have a render prop, move the UNSAFE prop to the render prop
             case 'ArrowFunctionExpression':
-              // TODO: we have an existing render prop, move size to there
+              // Prefer existing size on icon over UNSAFE size on button
+              if (iconAttribute.value.expression.body.type === 'JSXElement' && !((_iconAttribute$value$ = iconAttribute.value.expression.body.openingElement.attributes) !== null && _iconAttribute$value$ !== void 0 && _iconAttribute$value$.some(function (attribute) {
+                return attribute.type === 'JSXAttribute' && attribute.name.name === 'size';
+              }))) {
+                var _iconAttribute$value$2;
+                (_iconAttribute$value$2 = iconAttribute.value.expression.body.openingElement.attributes) === null || _iconAttribute$value$2 === void 0 || _iconAttribute$value$2.push(safeSizeAttribute);
+              }
               break;
 
             // We have a bounded API, move to render prop
@@ -88,10 +98,7 @@ function _default(file, api) {
                     selfClosing: true,
                     attributes: [j.jsxSpreadAttribute.from({
                       argument: j.identifier('iconProps')
-                    }), j.jsxAttribute.from({
-                      name: j.jsxIdentifier('size'),
-                      value: unsafeSizeAttribute.value
-                    })]
+                    }), safeSizeAttribute]
                   })
                 })
               }));

package/dist/cjs/presets/migrate-to-new-buttons/codemods/next-split-imports.js

@@ -23,6 +23,8 @@ var transformer = function transformer(file, api) {
     var _node$node = node.node,
       specifiers = _node$node.specifiers,
       source = _node$node.source;
+
+    // Return early if the import is not a named import
     if ([].concat((0, _toConsumableArray2.default)(Object.values(_constants.entryPointsMapping)), [_constants.NEW_BUTTON_ENTRY_POINT, '@atlaskit/button/types']).includes(source.value)) {
       return fileSource.toSource(_constants.PRINT_SETTINGS);
     }
@@ -33,13 +35,13 @@ var transformer = function transformer(file, api) {
       var defaultButtonImport = j.importDeclaration([j.importDefaultSpecifier(j.identifier(defaultSpecifier.local.name))], j.stringLiteral(_constants.entryPointsMapping.Button));
       j(node).insertAfter(defaultButtonImport);
     }
-    var valueSpecifiers = specifiers === null || specifiers === void 0 ? void 0 : specifiers.filter(function (specifier) {
+    var namedSpecifiers = specifiers === null || specifiers === void 0 ? void 0 : specifiers.filter(function (specifier) {
       return specifier.type === 'ImportSpecifier';
     });
-    var newTypeSpecifier = valueSpecifiers === null || valueSpecifiers === void 0 ? void 0 : valueSpecifiers.filter(function (specifier) {
+    var newTypeSpecifier = namedSpecifiers === null || namedSpecifiers === void 0 ? void 0 : namedSpecifiers.filter(function (specifier) {
       return specifier.type === 'ImportSpecifier' && (specifier.imported.name === 'Appearance' || specifier.imported.name === 'Spacing');
     });
-    var otherTypeSpecifiers = valueSpecifiers === null || valueSpecifiers === void 0 ? void 0 : valueSpecifiers.filter(function (specifier) {
+    var otherTypeSpecifiers = namedSpecifiers === null || namedSpecifiers === void 0 ? void 0 : namedSpecifiers.filter(function (specifier) {
       return _constants.BUTTON_TYPES.includes(specifier.imported.name);
     });
     if (newTypeSpecifier !== null && newTypeSpecifier !== void 0 && newTypeSpecifier.length) {
@@ -50,8 +52,8 @@ var transformer = function transformer(file, api) {
       var _typeImport = j.importDeclaration(otherTypeSpecifiers, j.stringLiteral('@atlaskit/button'));
       j(node).insertAfter(_typeImport);
     }
-    if (valueSpecifiers !== null && valueSpecifiers !== void 0 && valueSpecifiers.length) {
-      valueSpecifiers.forEach(function (specifier) {
+    if (namedSpecifiers !== null && namedSpecifiers !== void 0 && namedSpecifiers.length) {
+      namedSpecifiers.forEach(function (specifier) {
         if (specifier.local && specifier.type === 'ImportSpecifier' && specifier.local.name && _constants.entryPointsMapping[specifier.imported.name]) {
           var newImport = j.importDeclaration([j.importDefaultSpecifier(j.identifier(specifier.local.name))], j.stringLiteral(_constants.entryPointsMapping[specifier.imported.name]));
           j(node).insertAfter(newImport);

package/dist/cjs/presets/migrate-to-new-buttons/utils/add-comment-for-custom-theme-buttons.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.addCommentForCustomThemeButtons = void 0;
+var _codemodUtils = require("@atlaskit/codemod-utils");
+var _constants = require("./constants");
+var addCommentForCustomThemeButtons = exports.addCommentForCustomThemeButtons = function addCommentForCustomThemeButtons(fileSource, j) {
+  var _fileSource$find$filt;
+  var customThemeButtonImportName;
+  (_fileSource$find$filt = fileSource.find(j.ImportDeclaration).filter(function (path) {
+    return path.node.source.value === _constants.entryPointsMapping.CustomThemeButton;
+  })) === null || _fileSource$find$filt === void 0 || _fileSource$find$filt.forEach(function (path) {
+    var _path$node$specifiers;
+    (_path$node$specifiers = path.node.specifiers) === null || _path$node$specifiers === void 0 || _path$node$specifiers.forEach(function (specifier) {
+      if (specifier.type === 'ImportDefaultSpecifier') {
+        var _specifier$local;
+        customThemeButtonImportName = (_specifier$local = specifier.local) === null || _specifier$local === void 0 ? void 0 : _specifier$local.name;
+      }
+    });
+  });
+  if (!customThemeButtonImportName) {
+    return;
+  }
+  var customThemeButtonElement = fileSource.find(j.JSXElement).filter(function (path) {
+    return path.value.openingElement.name.type === 'JSXIdentifier' && path.value.openingElement.name.name === customThemeButtonImportName;
+  });
+  if (!customThemeButtonElement.length) {
+    return;
+  }
+  (0, _codemodUtils.addCommentBefore)(j, j(customThemeButtonElement.get(0).node.openingElement), _constants.customThemeButtonComment, 'line');
+};

package/dist/cjs/presets/migrate-to-new-buttons/utils/constants.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.unsupportedProps = exports.migrateFitContainerButtonToIconButtonComment = exports.migrateFitContainerButtonToDefaultButtonComment = exports.linkButtonMissingHrefComment = exports.entryPointsMapping = exports.buttonPropsNoLongerSupportedComment = exports.UNSAFE_SIZE_PROPS_MAP = exports.PRINT_SETTINGS = exports.NEW_BUTTON_VARIANTS = exports.NEW_BUTTON_ENTRY_POINT = exports.BUTTON_TYPES = void 0;
+exports.unsupportedProps = exports.migrateFitContainerButtonToIconButtonComment = exports.migrateFitContainerButtonToDefaultButtonComment = exports.linkButtonMissingHrefComment = exports.entryPointsMapping = exports.customThemeButtonComment = exports.buttonPropsNoLongerSupportedComment = exports.UNSAFE_SIZE_PROPS_MAP = exports.PRINT_SETTINGS = exports.NEW_BUTTON_VARIANTS = exports.NEW_BUTTON_ENTRY_POINT = exports.BUTTON_TYPES = void 0;
 var PRINT_SETTINGS = exports.PRINT_SETTINGS = {
   quote: 'single'
 };
@@ -30,4 +30,5 @@ var unsupportedProps = exports.unsupportedProps = ['component', 'css', 'style'];
 var linkButtonMissingHrefComment = exports.linkButtonMissingHrefComment = "\"link\" and \"subtle-link\" appearances are only available in LinkButton, please either provide a href prop then migrate to LinkButton, or remove the appearance from the default button.";
 var buttonPropsNoLongerSupportedComment = exports.buttonPropsNoLongerSupportedComment = "Buttons with \"component\", \"css\" or \"style\" prop can't be automatically migrated with codemods. Please migrate it manually.";
 var migrateFitContainerButtonToDefaultButtonComment = exports.migrateFitContainerButtonToDefaultButtonComment = "Migrated to a default button with text which is from the icon label.";
-var migrateFitContainerButtonToIconButtonComment = exports.migrateFitContainerButtonToIconButtonComment = "\"shouldFitContainer\" is not available in icon buttons, please consider using a default button with text.";
+var migrateFitContainerButtonToIconButtonComment = exports.migrateFitContainerButtonToIconButtonComment = "\"shouldFitContainer\" is not available in icon buttons, please consider using a default button with text.";
+var customThemeButtonComment = exports.customThemeButtonComment = "CustomThemeButton will be deprecated. Please consider migrating to Pressable or Anchor Primitives with custom styles.";

package/dist/cjs/presets/migrate-to-new-buttons/utils/generate-new-button-element.js

@@ -57,7 +57,10 @@ var handleIconAttributes = exports.handleIconAttributes = function handleIconAtt
     var buttonAlreadyHasLabelProp = buttonAttributes === null || buttonAttributes === void 0 ? void 0 : buttonAttributes.find(function (buttonAttribute) {
       return buttonAttribute.type === 'JSXAttribute' && buttonAttribute.name.name === 'label';
     });
-    if (!buttonAlreadyHasLabelProp) {
+    var buttonAlreadyHasAriaLabelProp = buttonAttributes === null || buttonAttributes === void 0 ? void 0 : buttonAttributes.find(function (buttonAttribute) {
+      return buttonAttribute.type === 'JSXAttribute' && buttonAttribute.name.name === 'aria-label';
+    });
+    if (!buttonAlreadyHasLabelProp && !buttonAlreadyHasAriaLabelProp) {
       var labelAttribute = iconAttributes.find(function (attribute) {
         return attribute.type === 'JSXAttribute' && attribute.name.name === 'label';
       });
@@ -123,12 +126,18 @@ var generateNewElement = exports.generateNewElement = function generateNewElemen
         return attribute.type === 'JSXAttribute' && attribute.name.name === 'label';
       }));
       if (hasNoLabelProp && attributes) {
-        attributes.push(j.jsxAttribute(j.jsxIdentifier('label'), ariaLabelAttr.get().node.value));
+        attributes.unshift(j.jsxAttribute.from({
+          name: j.jsxIdentifier('label'),
+          value: j.literal(ariaLabelAttr.get().value.value.value)
+        }));
       }
       ariaLabelAttr.remove();
     }
   }
-  return j.jsxElement(
-  // self closing if it's an icon button or icon link button
-  j.jsxOpeningElement(j.jsxIdentifier(variant), attributes, isIconOrLinkIcon), isIconOrLinkIcon ? null : j.jsxClosingElement(j.jsxIdentifier(variant)), element.children);
+  return j.jsxElement.from({
+    openingElement: j.jsxOpeningElement(j.jsxIdentifier(variant), attributes, isIconOrLinkIcon),
+    // self closing if it's an icon button or icon link button
+    closingElement: isIconOrLinkIcon ? null : j.jsxClosingElement(j.jsxIdentifier(variant)),
+    children: element.children
+  });
 };

package/dist/cjs/presets/migrate-to-new-buttons/utils/has-unsupported-props.js

@@ -6,7 +6,32 @@ Object.defineProperty(exports, "__esModule", {
 exports.ifHasUnsupportedProps = void 0;
 var _constants = require("./constants");
 var ifHasUnsupportedProps = exports.ifHasUnsupportedProps = function ifHasUnsupportedProps(attributes) {
-  return Boolean(attributes && (attributes === null || attributes === void 0 ? void 0 : attributes.some(function (node) {
+  var hasUnsupportedProps = Boolean(attributes && (attributes === null || attributes === void 0 ? void 0 : attributes.some(function (node) {
     return node.type === 'JSXAttribute' && _constants.unsupportedProps.includes(String(node.name.name));
   })));
+  var hasUnmigratableIcon = function hasUnmigratableIcon() {
+    var oldIconProps = ['iconBefore', 'iconAfter'];
+    var hasUnmigratableIcon = false;
+    if (!(attributes !== null && attributes !== void 0 && attributes.some(function (attribute) {
+      return attribute.type === 'JSXAttribute' && attribute.name.type === 'JSXIdentifier' && oldIconProps.includes(attribute.name.name);
+    }))) {
+      return hasUnmigratableIcon;
+    }
+    oldIconProps.forEach(function (oldIconProp) {
+      var _iconAttribute$value;
+      var iconAttribute = attributes.find(function (attribute) {
+        return attribute.type === 'JSXAttribute' && attribute.name.name === oldIconProp;
+      });
+      if (!iconAttribute) {
+        return;
+      }
+
+      // check to see if the element is self closing, otherwise assume it's not an icon (may contain wrapper)
+      if (iconAttribute.type === 'JSXAttribute' && ((_iconAttribute$value = iconAttribute.value) === null || _iconAttribute$value === void 0 ? void 0 : _iconAttribute$value.type) === 'JSXExpressionContainer' && iconAttribute.value.expression.type === 'JSXElement' && !iconAttribute.value.expression.openingElement.selfClosing) {
+        hasUnmigratableIcon = true;
+      }
+    });
+    return hasUnmigratableIcon;
+  };
+  return hasUnsupportedProps || hasUnmigratableIcon();
 };

package/dist/es2019/presets/migrate-to-new-buttons/codemods/next-migrate-to-new-button-variants.js

@@ -7,9 +7,11 @@ import { checkIfVariantAlreadyImported } from '../utils/if-variant-already-impor
 import { renameDefaultButtonToLegacyButtonImport } from '../utils/rename-default-button-to-legacy-button';
 import { migrateFitContainerIconButton } from '../utils/migrate-fit-container-icon-button';
 import { importTypesFromNewEntryPoint } from '../utils/import-types-from-new-entry-point';
+import { addCommentForCustomThemeButtons } from '../utils/add-comment-for-custom-theme-buttons';
 const transformer = (file, api) => {
   const j = api.jscodeshift;
   const fileSource = j(file.source);
+  addCommentForCustomThemeButtons(fileSource, j);
   const buttonImports = fileSource.find(j.ImportDeclaration).filter(path => path.node.source.value === entryPointsMapping.Button || path.node.source.value === entryPointsMapping.LoadingButton || path.node.source.value === NEW_BUTTON_ENTRY_POINT);
   if (!buttonImports.length) {
     return fileSource.toSource();
@@ -22,6 +24,7 @@ const transformer = (file, api) => {
   let hasLinkIconButton = checkIfVariantAlreadyImported(NEW_BUTTON_VARIANTS.linkIcon, fileSource, j);
   let hasLinkButton = checkIfVariantAlreadyImported(NEW_BUTTON_VARIANTS.link, fileSource, j);
   let hasIconButton = checkIfVariantAlreadyImported(NEW_BUTTON_VARIANTS.icon, fileSource, j);
+  let hasDefaultLoadingButton = false;
   const allButtons = fileSource.find(j.JSXElement).filter(path => path.value.openingElement.name.type === 'JSXIdentifier' && path.value.openingElement.name.name === specifierIdentifier);
   const buttonsWithoutUnsupportedProps = allButtons.filter(path => !ifHasUnsupportedProps(path.value.openingElement.attributes));
   const loadingButtonImportName = getDefaultImportSpecifierName(j, fileSource, entryPointsMapping.LoadingButton);
@@ -64,7 +67,8 @@ const transformer = (file, api) => {
       hasLinkButton = true;
       j(element).replaceWith(generateNewElement(NEW_BUTTON_VARIANTS.link, element.value, j));
     }
-    if (isLoadingButton) {
+    if (isLoadingButton && !isIconButton) {
+      hasDefaultLoadingButton = true;
       j(element).replaceWith(generateNewElement(NEW_BUTTON_VARIANTS.default, element.value, j));
     }
     const linkAppearanceAttribute = attributes.find(node => {
@@ -95,7 +99,11 @@ const transformer = (file, api) => {
         path.node.name = NEW_BUTTON_VARIANTS.default;
       }
     });
-    specifiers.push(j.importDefaultSpecifier(j.identifier(NEW_BUTTON_VARIANTS.default)));
+
+    // Only add the Button import if we found a default button, not icon only
+    if (hasDefaultLoadingButton) {
+      specifiers.push(j.importDefaultSpecifier(j.identifier(NEW_BUTTON_VARIANTS.default)));
+    }
   }
   if (!specifiers.find(specifier => specifier.type === 'ImportDefaultSpecifier') && remainingDefaultButtons) {
     specifiers.push(j.importDefaultSpecifier(j.identifier(NEW_BUTTON_VARIANTS.default)));

package/dist/es2019/presets/migrate-to-new-buttons/codemods/next-remove-unsafe-size.js

@@ -46,15 +46,23 @@ export default function (file, api) {
 
       // Check if render prop or bounded API
       iconAttributes.forEach(iconAttribute => {
-        var _newButtonJXSElement$2, _iconAttribute$value;
+        var _newButtonJXSElement$2, _iconAttribute$value, _iconAttribute$value$;
         const unsafeSizeAttribute = (_newButtonJXSElement$2 = newButtonJXSElement.value.openingElement.attributes) === null || _newButtonJXSElement$2 === void 0 ? void 0 : _newButtonJXSElement$2.find(attribute => attribute.type === 'JSXAttribute' && attribute.name.name === unsafeSizeProp);
         if (iconAttribute.type !== 'JSXAttribute' || ((_iconAttribute$value = iconAttribute.value) === null || _iconAttribute$value === void 0 ? void 0 : _iconAttribute$value.type) !== 'JSXExpressionContainer' || !unsafeSizeAttribute || unsafeSizeAttribute.type !== 'JSXAttribute') {
           return;
         }
+        const safeSizeAttribute = j.jsxAttribute.from({
+          name: j.jsxIdentifier('size'),
+          value: unsafeSizeAttribute.value
+        });
         switch (iconAttribute.value.expression.type) {
           // We have a render prop, move the UNSAFE prop to the render prop
           case 'ArrowFunctionExpression':
-            // TODO: we have an existing render prop, move size to there
+            // Prefer existing size on icon over UNSAFE size on button
+            if (iconAttribute.value.expression.body.type === 'JSXElement' && !((_iconAttribute$value$ = iconAttribute.value.expression.body.openingElement.attributes) !== null && _iconAttribute$value$ !== void 0 && _iconAttribute$value$.some(attribute => attribute.type === 'JSXAttribute' && attribute.name.name === 'size'))) {
+              var _iconAttribute$value$2;
+              (_iconAttribute$value$2 = iconAttribute.value.expression.body.openingElement.attributes) === null || _iconAttribute$value$2 === void 0 ? void 0 : _iconAttribute$value$2.push(safeSizeAttribute);
+            }
             break;
 
           // We have a bounded API, move to render prop
@@ -70,10 +78,7 @@ export default function (file, api) {
                   selfClosing: true,
                   attributes: [j.jsxSpreadAttribute.from({
                     argument: j.identifier('iconProps')
-                  }), j.jsxAttribute.from({
-                    name: j.jsxIdentifier('size'),
-                    value: unsafeSizeAttribute.value
-                  })]
+                  }), safeSizeAttribute]
                 })
               })
             }));

package/dist/es2019/presets/migrate-to-new-buttons/codemods/next-split-imports.js

@@ -14,6 +14,8 @@ const transformer = (file, api) => {
       specifiers,
       source
     } = node.node;
+
+    // Return early if the import is not a named import
     if ([...Object.values(entryPointsMapping), NEW_BUTTON_ENTRY_POINT, '@atlaskit/button/types'].includes(source.value)) {
       return fileSource.toSource(PRINT_SETTINGS);
     }
@@ -22,9 +24,9 @@ const transformer = (file, api) => {
       const defaultButtonImport = j.importDeclaration([j.importDefaultSpecifier(j.identifier(defaultSpecifier.local.name))], j.stringLiteral(entryPointsMapping.Button));
       j(node).insertAfter(defaultButtonImport);
     }
-    const valueSpecifiers = specifiers === null || specifiers === void 0 ? void 0 : specifiers.filter(specifier => specifier.type === 'ImportSpecifier');
-    const newTypeSpecifier = valueSpecifiers === null || valueSpecifiers === void 0 ? void 0 : valueSpecifiers.filter(specifier => specifier.type === 'ImportSpecifier' && (specifier.imported.name === 'Appearance' || specifier.imported.name === 'Spacing'));
-    const otherTypeSpecifiers = valueSpecifiers === null || valueSpecifiers === void 0 ? void 0 : valueSpecifiers.filter(specifier => BUTTON_TYPES.includes(specifier.imported.name));
+    const namedSpecifiers = specifiers === null || specifiers === void 0 ? void 0 : specifiers.filter(specifier => specifier.type === 'ImportSpecifier');
+    const newTypeSpecifier = namedSpecifiers === null || namedSpecifiers === void 0 ? void 0 : namedSpecifiers.filter(specifier => specifier.type === 'ImportSpecifier' && (specifier.imported.name === 'Appearance' || specifier.imported.name === 'Spacing'));
+    const otherTypeSpecifiers = namedSpecifiers === null || namedSpecifiers === void 0 ? void 0 : namedSpecifiers.filter(specifier => BUTTON_TYPES.includes(specifier.imported.name));
     if (newTypeSpecifier !== null && newTypeSpecifier !== void 0 && newTypeSpecifier.length) {
       const typeImport = j.importDeclaration(newTypeSpecifier, j.stringLiteral('@atlaskit/button/types'));
       j(node).insertAfter(typeImport);
@@ -33,8 +35,8 @@ const transformer = (file, api) => {
       const typeImport = j.importDeclaration(otherTypeSpecifiers, j.stringLiteral('@atlaskit/button'));
       j(node).insertAfter(typeImport);
     }
-    if (valueSpecifiers !== null && valueSpecifiers !== void 0 && valueSpecifiers.length) {
-      valueSpecifiers.forEach(specifier => {
+    if (namedSpecifiers !== null && namedSpecifiers !== void 0 && namedSpecifiers.length) {
+      namedSpecifiers.forEach(specifier => {
         if (specifier.local && specifier.type === 'ImportSpecifier' && specifier.local.name && entryPointsMapping[specifier.imported.name]) {
           const newImport = j.importDeclaration([j.importDefaultSpecifier(j.identifier(specifier.local.name))], j.stringLiteral(entryPointsMapping[specifier.imported.name]));
           j(node).insertAfter(newImport);

package/dist/es2019/presets/migrate-to-new-buttons/utils/add-comment-for-custom-theme-buttons.js

@@ -0,0 +1,23 @@
+import { addCommentBefore } from '@atlaskit/codemod-utils';
+import { entryPointsMapping, customThemeButtonComment } from './constants';
+export const addCommentForCustomThemeButtons = (fileSource, j) => {
+  var _fileSource$find$filt;
+  let customThemeButtonImportName;
+  (_fileSource$find$filt = fileSource.find(j.ImportDeclaration).filter(path => path.node.source.value === entryPointsMapping.CustomThemeButton)) === null || _fileSource$find$filt === void 0 ? void 0 : _fileSource$find$filt.forEach(path => {
+    var _path$node$specifiers;
+    (_path$node$specifiers = path.node.specifiers) === null || _path$node$specifiers === void 0 ? void 0 : _path$node$specifiers.forEach(specifier => {
+      if (specifier.type === 'ImportDefaultSpecifier') {
+        var _specifier$local;
+        customThemeButtonImportName = (_specifier$local = specifier.local) === null || _specifier$local === void 0 ? void 0 : _specifier$local.name;
+      }
+    });
+  });
+  if (!customThemeButtonImportName) {
+    return;
+  }
+  const customThemeButtonElement = fileSource.find(j.JSXElement).filter(path => path.value.openingElement.name.type === 'JSXIdentifier' && path.value.openingElement.name.name === customThemeButtonImportName);
+  if (!customThemeButtonElement.length) {
+    return;
+  }
+  addCommentBefore(j, j(customThemeButtonElement.get(0).node.openingElement), customThemeButtonComment, 'line');
+};

package/dist/es2019/presets/migrate-to-new-buttons/utils/constants.js

@@ -24,4 +24,5 @@ export const unsupportedProps = ['component', 'css', 'style'];
 export const linkButtonMissingHrefComment = `"link" and "subtle-link" appearances are only available in LinkButton, please either provide a href prop then migrate to LinkButton, or remove the appearance from the default button.`;
 export const buttonPropsNoLongerSupportedComment = `Buttons with "component", "css" or "style" prop can't be automatically migrated with codemods. Please migrate it manually.`;
 export const migrateFitContainerButtonToDefaultButtonComment = `Migrated to a default button with text which is from the icon label.`;
-export const migrateFitContainerButtonToIconButtonComment = `"shouldFitContainer" is not available in icon buttons, please consider using a default button with text.`;
+export const migrateFitContainerButtonToIconButtonComment = `"shouldFitContainer" is not available in icon buttons, please consider using a default button with text.`;
+export const customThemeButtonComment = `CustomThemeButton will be deprecated. Please consider migrating to Pressable or Anchor Primitives with custom styles.`;

package/dist/es2019/presets/migrate-to-new-buttons/utils/generate-new-button-element.js

@@ -48,7 +48,8 @@ export const handleIconAttributes = (element, j, iconRenamed = false) => {
     // takes precedence over icon label.
 
     const buttonAlreadyHasLabelProp = buttonAttributes === null || buttonAttributes === void 0 ? void 0 : buttonAttributes.find(buttonAttribute => buttonAttribute.type === 'JSXAttribute' && buttonAttribute.name.name === 'label');
-    if (!buttonAlreadyHasLabelProp) {
+    const buttonAlreadyHasAriaLabelProp = buttonAttributes === null || buttonAttributes === void 0 ? void 0 : buttonAttributes.find(buttonAttribute => buttonAttribute.type === 'JSXAttribute' && buttonAttribute.name.name === 'aria-label');
+    if (!buttonAlreadyHasLabelProp && !buttonAlreadyHasAriaLabelProp) {
       const labelAttribute = iconAttributes.find(attribute => attribute.type === 'JSXAttribute' && attribute.name.name === 'label');
       if (labelAttribute && labelAttribute.type === 'JSXAttribute' && iconRenamed) {
         buttonAttributes === null || buttonAttributes === void 0 ? void 0 : buttonAttributes.unshift(labelAttribute);
@@ -108,12 +109,18 @@ export const generateNewElement = (variant, element, j) => {
     if (ariaLabelAttr.length) {
       const hasNoLabelProp = !(attributes !== null && attributes !== void 0 && attributes.find(attribute => attribute.type === 'JSXAttribute' && attribute.name.name === 'label'));
       if (hasNoLabelProp && attributes) {
-        attributes.push(j.jsxAttribute(j.jsxIdentifier('label'), ariaLabelAttr.get().node.value));
+        attributes.unshift(j.jsxAttribute.from({
+          name: j.jsxIdentifier('label'),
+          value: j.literal(ariaLabelAttr.get().value.value.value)
+        }));
       }
       ariaLabelAttr.remove();
     }
   }
-  return j.jsxElement(
-  // self closing if it's an icon button or icon link button
-  j.jsxOpeningElement(j.jsxIdentifier(variant), attributes, isIconOrLinkIcon), isIconOrLinkIcon ? null : j.jsxClosingElement(j.jsxIdentifier(variant)), element.children);
+  return j.jsxElement.from({
+    openingElement: j.jsxOpeningElement(j.jsxIdentifier(variant), attributes, isIconOrLinkIcon),
+    // self closing if it's an icon button or icon link button
+    closingElement: isIconOrLinkIcon ? null : j.jsxClosingElement(j.jsxIdentifier(variant)),
+    children: element.children
+  });
 };

package/dist/es2019/presets/migrate-to-new-buttons/utils/has-unsupported-props.js

@@ -1,2 +1,25 @@
 import { unsupportedProps } from './constants';
-export const ifHasUnsupportedProps = attributes => Boolean(attributes && (attributes === null || attributes === void 0 ? void 0 : attributes.some(node => node.type === 'JSXAttribute' && unsupportedProps.includes(String(node.name.name)))));
+export const ifHasUnsupportedProps = attributes => {
+  let hasUnsupportedProps = Boolean(attributes && (attributes === null || attributes === void 0 ? void 0 : attributes.some(node => node.type === 'JSXAttribute' && unsupportedProps.includes(String(node.name.name)))));
+  const hasUnmigratableIcon = () => {
+    const oldIconProps = ['iconBefore', 'iconAfter'];
+    let hasUnmigratableIcon = false;
+    if (!(attributes !== null && attributes !== void 0 && attributes.some(attribute => attribute.type === 'JSXAttribute' && attribute.name.type === 'JSXIdentifier' && oldIconProps.includes(attribute.name.name)))) {
+      return hasUnmigratableIcon;
+    }
+    oldIconProps.forEach(oldIconProp => {
+      var _iconAttribute$value;
+      const iconAttribute = attributes.find(attribute => attribute.type === 'JSXAttribute' && attribute.name.name === oldIconProp);
+      if (!iconAttribute) {
+        return;
+      }
+
+      // check to see if the element is self closing, otherwise assume it's not an icon (may contain wrapper)
+      if (iconAttribute.type === 'JSXAttribute' && ((_iconAttribute$value = iconAttribute.value) === null || _iconAttribute$value === void 0 ? void 0 : _iconAttribute$value.type) === 'JSXExpressionContainer' && iconAttribute.value.expression.type === 'JSXElement' && !iconAttribute.value.expression.openingElement.selfClosing) {
+        hasUnmigratableIcon = true;
+      }
+    });
+    return hasUnmigratableIcon;
+  };
+  return hasUnsupportedProps || hasUnmigratableIcon();
+};

package/dist/esm/main.js

@@ -298,7 +298,7 @@ function _main() {
         case 4:
           _yield$parseArgs = _context5.sent;
           packages = _yield$parseArgs.packages;
-          _process$env$_PACKAGE = "0.24.0", _PACKAGE_VERSION_ = _process$env$_PACKAGE === void 0 ? '0.0.0-dev' : _process$env$_PACKAGE;
+          _process$env$_PACKAGE = "0.24.2", _PACKAGE_VERSION_ = _process$env$_PACKAGE === void 0 ? '0.0.0-dev' : _process$env$_PACKAGE;
           logger.log(chalk.bgBlue(chalk.black("\uD83D\uDCDA Atlassian-Frontend codemod library @ ".concat(_PACKAGE_VERSION_, " \uD83D\uDCDA"))));
           if (packages && packages.length > 0) {
             logger.log(chalk.gray("Searching for codemods for newer versions of the following packages: ".concat(packages.map(function (pkg) {

package/dist/esm/presets/migrate-to-new-buttons/codemods/next-migrate-to-new-button-variants.js

@@ -7,9 +7,11 @@ import { checkIfVariantAlreadyImported } from '../utils/if-variant-already-impor
 import { renameDefaultButtonToLegacyButtonImport } from '../utils/rename-default-button-to-legacy-button';
 import { migrateFitContainerIconButton } from '../utils/migrate-fit-container-icon-button';
 import { importTypesFromNewEntryPoint } from '../utils/import-types-from-new-entry-point';
+import { addCommentForCustomThemeButtons } from '../utils/add-comment-for-custom-theme-buttons';
 var transformer = function transformer(file, api) {
   var j = api.jscodeshift;
   var fileSource = j(file.source);
+  addCommentForCustomThemeButtons(fileSource, j);
   var buttonImports = fileSource.find(j.ImportDeclaration).filter(function (path) {
     return path.node.source.value === entryPointsMapping.Button || path.node.source.value === entryPointsMapping.LoadingButton || path.node.source.value === NEW_BUTTON_ENTRY_POINT;
   });
@@ -26,6 +28,7 @@ var transformer = function transformer(file, api) {
   var hasLinkIconButton = checkIfVariantAlreadyImported(NEW_BUTTON_VARIANTS.linkIcon, fileSource, j);
   var hasLinkButton = checkIfVariantAlreadyImported(NEW_BUTTON_VARIANTS.link, fileSource, j);
   var hasIconButton = checkIfVariantAlreadyImported(NEW_BUTTON_VARIANTS.icon, fileSource, j);
+  var hasDefaultLoadingButton = false;
   var allButtons = fileSource.find(j.JSXElement).filter(function (path) {
     return path.value.openingElement.name.type === 'JSXIdentifier' && path.value.openingElement.name.name === specifierIdentifier;
   });
@@ -72,7 +75,8 @@ var transformer = function transformer(file, api) {
       hasLinkButton = true;
       j(element).replaceWith(generateNewElement(NEW_BUTTON_VARIANTS.link, element.value, j));
     }
-    if (isLoadingButton) {
+    if (isLoadingButton && !isIconButton) {
+      hasDefaultLoadingButton = true;
       j(element).replaceWith(generateNewElement(NEW_BUTTON_VARIANTS.default, element.value, j));
     }
     var linkAppearanceAttribute = attributes.find(function (node) {
@@ -111,7 +115,11 @@ var transformer = function transformer(file, api) {
         path.node.name = NEW_BUTTON_VARIANTS.default;
       }
     });
-    specifiers.push(j.importDefaultSpecifier(j.identifier(NEW_BUTTON_VARIANTS.default)));
+
+    // Only add the Button import if we found a default button, not icon only
+    if (hasDefaultLoadingButton) {
+      specifiers.push(j.importDefaultSpecifier(j.identifier(NEW_BUTTON_VARIANTS.default)));
+    }
   }
   if (!specifiers.find(function (specifier) {
     return specifier.type === 'ImportDefaultSpecifier';

package/dist/esm/presets/migrate-to-new-buttons/codemods/next-remove-unsafe-size.js

@@ -56,17 +56,27 @@ export default function (file, api) {
 
         // Check if render prop or bounded API
         iconAttributes.forEach(function (iconAttribute) {
-          var _newButtonJXSElement$2, _iconAttribute$value;
+          var _newButtonJXSElement$2, _iconAttribute$value, _iconAttribute$value$;
           var unsafeSizeAttribute = (_newButtonJXSElement$2 = newButtonJXSElement.value.openingElement.attributes) === null || _newButtonJXSElement$2 === void 0 ? void 0 : _newButtonJXSElement$2.find(function (attribute) {
             return attribute.type === 'JSXAttribute' && attribute.name.name === unsafeSizeProp;
           });
           if (iconAttribute.type !== 'JSXAttribute' || ((_iconAttribute$value = iconAttribute.value) === null || _iconAttribute$value === void 0 ? void 0 : _iconAttribute$value.type) !== 'JSXExpressionContainer' || !unsafeSizeAttribute || unsafeSizeAttribute.type !== 'JSXAttribute') {
             return;
           }
+          var safeSizeAttribute = j.jsxAttribute.from({
+            name: j.jsxIdentifier('size'),
+            value: unsafeSizeAttribute.value
+          });
           switch (iconAttribute.value.expression.type) {
             // We have a render prop, move the UNSAFE prop to the render prop
             case 'ArrowFunctionExpression':
-              // TODO: we have an existing render prop, move size to there
+              // Prefer existing size on icon over UNSAFE size on button
+              if (iconAttribute.value.expression.body.type === 'JSXElement' && !((_iconAttribute$value$ = iconAttribute.value.expression.body.openingElement.attributes) !== null && _iconAttribute$value$ !== void 0 && _iconAttribute$value$.some(function (attribute) {
+                return attribute.type === 'JSXAttribute' && attribute.name.name === 'size';
+              }))) {
+                var _iconAttribute$value$2;
+                (_iconAttribute$value$2 = iconAttribute.value.expression.body.openingElement.attributes) === null || _iconAttribute$value$2 === void 0 || _iconAttribute$value$2.push(safeSizeAttribute);
+              }
               break;
 
             // We have a bounded API, move to render prop
@@ -82,10 +92,7 @@ export default function (file, api) {
                     selfClosing: true,
                     attributes: [j.jsxSpreadAttribute.from({
                       argument: j.identifier('iconProps')
-                    }), j.jsxAttribute.from({
-                      name: j.jsxIdentifier('size'),
-                      value: unsafeSizeAttribute.value
-                    })]
+                    }), safeSizeAttribute]
                   })
                 })
               }));

package/dist/esm/presets/migrate-to-new-buttons/codemods/next-split-imports.js

@@ -16,6 +16,8 @@ var transformer = function transformer(file, api) {
     var _node$node = node.node,
       specifiers = _node$node.specifiers,
       source = _node$node.source;
+
+    // Return early if the import is not a named import
     if ([].concat(_toConsumableArray(Object.values(entryPointsMapping)), [NEW_BUTTON_ENTRY_POINT, '@atlaskit/button/types']).includes(source.value)) {
       return fileSource.toSource(PRINT_SETTINGS);
     }
@@ -26,13 +28,13 @@ var transformer = function transformer(file, api) {
       var defaultButtonImport = j.importDeclaration([j.importDefaultSpecifier(j.identifier(defaultSpecifier.local.name))], j.stringLiteral(entryPointsMapping.Button));
       j(node).insertAfter(defaultButtonImport);
     }
-    var valueSpecifiers = specifiers === null || specifiers === void 0 ? void 0 : specifiers.filter(function (specifier) {
+    var namedSpecifiers = specifiers === null || specifiers === void 0 ? void 0 : specifiers.filter(function (specifier) {
       return specifier.type === 'ImportSpecifier';
     });
-    var newTypeSpecifier = valueSpecifiers === null || valueSpecifiers === void 0 ? void 0 : valueSpecifiers.filter(function (specifier) {
+    var newTypeSpecifier = namedSpecifiers === null || namedSpecifiers === void 0 ? void 0 : namedSpecifiers.filter(function (specifier) {
       return specifier.type === 'ImportSpecifier' && (specifier.imported.name === 'Appearance' || specifier.imported.name === 'Spacing');
     });
-    var otherTypeSpecifiers = valueSpecifiers === null || valueSpecifiers === void 0 ? void 0 : valueSpecifiers.filter(function (specifier) {
+    var otherTypeSpecifiers = namedSpecifiers === null || namedSpecifiers === void 0 ? void 0 : namedSpecifiers.filter(function (specifier) {
       return BUTTON_TYPES.includes(specifier.imported.name);
     });
     if (newTypeSpecifier !== null && newTypeSpecifier !== void 0 && newTypeSpecifier.length) {
@@ -43,8 +45,8 @@ var transformer = function transformer(file, api) {
       var _typeImport = j.importDeclaration(otherTypeSpecifiers, j.stringLiteral('@atlaskit/button'));
       j(node).insertAfter(_typeImport);
     }
-    if (valueSpecifiers !== null && valueSpecifiers !== void 0 && valueSpecifiers.length) {
-      valueSpecifiers.forEach(function (specifier) {
+    if (namedSpecifiers !== null && namedSpecifiers !== void 0 && namedSpecifiers.length) {
+      namedSpecifiers.forEach(function (specifier) {
         if (specifier.local && specifier.type === 'ImportSpecifier' && specifier.local.name && entryPointsMapping[specifier.imported.name]) {
           var newImport = j.importDeclaration([j.importDefaultSpecifier(j.identifier(specifier.local.name))], j.stringLiteral(entryPointsMapping[specifier.imported.name]));
           j(node).insertAfter(newImport);

package/dist/esm/presets/migrate-to-new-buttons/utils/add-comment-for-custom-theme-buttons.js

@@ -0,0 +1,27 @@
+import { addCommentBefore } from '@atlaskit/codemod-utils';
+import { entryPointsMapping, customThemeButtonComment } from './constants';
+export var addCommentForCustomThemeButtons = function addCommentForCustomThemeButtons(fileSource, j) {
+  var _fileSource$find$filt;
+  var customThemeButtonImportName;
+  (_fileSource$find$filt = fileSource.find(j.ImportDeclaration).filter(function (path) {
+    return path.node.source.value === entryPointsMapping.CustomThemeButton;
+  })) === null || _fileSource$find$filt === void 0 || _fileSource$find$filt.forEach(function (path) {
+    var _path$node$specifiers;
+    (_path$node$specifiers = path.node.specifiers) === null || _path$node$specifiers === void 0 || _path$node$specifiers.forEach(function (specifier) {
+      if (specifier.type === 'ImportDefaultSpecifier') {
+        var _specifier$local;
+        customThemeButtonImportName = (_specifier$local = specifier.local) === null || _specifier$local === void 0 ? void 0 : _specifier$local.name;
+      }
+    });
+  });
+  if (!customThemeButtonImportName) {
+    return;
+  }
+  var customThemeButtonElement = fileSource.find(j.JSXElement).filter(function (path) {
+    return path.value.openingElement.name.type === 'JSXIdentifier' && path.value.openingElement.name.name === customThemeButtonImportName;
+  });
+  if (!customThemeButtonElement.length) {
+    return;
+  }
+  addCommentBefore(j, j(customThemeButtonElement.get(0).node.openingElement), customThemeButtonComment, 'line');
+};

package/dist/esm/presets/migrate-to-new-buttons/utils/constants.js

@@ -24,4 +24,5 @@ export var unsupportedProps = ['component', 'css', 'style'];
 export var linkButtonMissingHrefComment = "\"link\" and \"subtle-link\" appearances are only available in LinkButton, please either provide a href prop then migrate to LinkButton, or remove the appearance from the default button.";
 export var buttonPropsNoLongerSupportedComment = "Buttons with \"component\", \"css\" or \"style\" prop can't be automatically migrated with codemods. Please migrate it manually.";
 export var migrateFitContainerButtonToDefaultButtonComment = "Migrated to a default button with text which is from the icon label.";
-export var migrateFitContainerButtonToIconButtonComment = "\"shouldFitContainer\" is not available in icon buttons, please consider using a default button with text.";
+export var migrateFitContainerButtonToIconButtonComment = "\"shouldFitContainer\" is not available in icon buttons, please consider using a default button with text.";
+export var customThemeButtonComment = "CustomThemeButton will be deprecated. Please consider migrating to Pressable or Anchor Primitives with custom styles.";

package/dist/esm/presets/migrate-to-new-buttons/utils/generate-new-button-element.js

@@ -51,7 +51,10 @@ export var handleIconAttributes = function handleIconAttributes(element, j) {
     var buttonAlreadyHasLabelProp = buttonAttributes === null || buttonAttributes === void 0 ? void 0 : buttonAttributes.find(function (buttonAttribute) {
       return buttonAttribute.type === 'JSXAttribute' && buttonAttribute.name.name === 'label';
     });
-    if (!buttonAlreadyHasLabelProp) {
+    var buttonAlreadyHasAriaLabelProp = buttonAttributes === null || buttonAttributes === void 0 ? void 0 : buttonAttributes.find(function (buttonAttribute) {
+      return buttonAttribute.type === 'JSXAttribute' && buttonAttribute.name.name === 'aria-label';
+    });
+    if (!buttonAlreadyHasLabelProp && !buttonAlreadyHasAriaLabelProp) {
       var labelAttribute = iconAttributes.find(function (attribute) {
         return attribute.type === 'JSXAttribute' && attribute.name.name === 'label';
       });
@@ -117,12 +120,18 @@ export var generateNewElement = function generateNewElement(variant, element, j)
         return attribute.type === 'JSXAttribute' && attribute.name.name === 'label';
       }));
       if (hasNoLabelProp && attributes) {
-        attributes.push(j.jsxAttribute(j.jsxIdentifier('label'), ariaLabelAttr.get().node.value));
+        attributes.unshift(j.jsxAttribute.from({
+          name: j.jsxIdentifier('label'),
+          value: j.literal(ariaLabelAttr.get().value.value.value)
+        }));
       }
       ariaLabelAttr.remove();
     }
   }
-  return j.jsxElement(
-  // self closing if it's an icon button or icon link button
-  j.jsxOpeningElement(j.jsxIdentifier(variant), attributes, isIconOrLinkIcon), isIconOrLinkIcon ? null : j.jsxClosingElement(j.jsxIdentifier(variant)), element.children);
+  return j.jsxElement.from({
+    openingElement: j.jsxOpeningElement(j.jsxIdentifier(variant), attributes, isIconOrLinkIcon),
+    // self closing if it's an icon button or icon link button
+    closingElement: isIconOrLinkIcon ? null : j.jsxClosingElement(j.jsxIdentifier(variant)),
+    children: element.children
+  });
 };

package/dist/esm/presets/migrate-to-new-buttons/utils/has-unsupported-props.js

@@ -1,6 +1,31 @@
 import { unsupportedProps } from './constants';
 export var ifHasUnsupportedProps = function ifHasUnsupportedProps(attributes) {
-  return Boolean(attributes && (attributes === null || attributes === void 0 ? void 0 : attributes.some(function (node) {
+  var hasUnsupportedProps = Boolean(attributes && (attributes === null || attributes === void 0 ? void 0 : attributes.some(function (node) {
     return node.type === 'JSXAttribute' && unsupportedProps.includes(String(node.name.name));
   })));
+  var hasUnmigratableIcon = function hasUnmigratableIcon() {
+    var oldIconProps = ['iconBefore', 'iconAfter'];
+    var hasUnmigratableIcon = false;
+    if (!(attributes !== null && attributes !== void 0 && attributes.some(function (attribute) {
+      return attribute.type === 'JSXAttribute' && attribute.name.type === 'JSXIdentifier' && oldIconProps.includes(attribute.name.name);
+    }))) {
+      return hasUnmigratableIcon;
+    }
+    oldIconProps.forEach(function (oldIconProp) {
+      var _iconAttribute$value;
+      var iconAttribute = attributes.find(function (attribute) {
+        return attribute.type === 'JSXAttribute' && attribute.name.name === oldIconProp;
+      });
+      if (!iconAttribute) {
+        return;
+      }
+
+      // check to see if the element is self closing, otherwise assume it's not an icon (may contain wrapper)
+      if (iconAttribute.type === 'JSXAttribute' && ((_iconAttribute$value = iconAttribute.value) === null || _iconAttribute$value === void 0 ? void 0 : _iconAttribute$value.type) === 'JSXExpressionContainer' && iconAttribute.value.expression.type === 'JSXElement' && !iconAttribute.value.expression.openingElement.selfClosing) {
+        hasUnmigratableIcon = true;
+      }
+    });
+    return hasUnmigratableIcon;
+  };
+  return hasUnsupportedProps || hasUnmigratableIcon();
 };

package/dist/types/presets/migrate-to-new-buttons/utils/add-comment-for-custom-theme-buttons.d.ts

@@ -0,0 +1,2 @@
+import type { API, Collection } from 'jscodeshift';
+export declare const addCommentForCustomThemeButtons: (fileSource: Collection<any>, j: API['jscodeshift']) => void;

package/dist/types/presets/migrate-to-new-buttons/utils/constants.d.ts

@@ -15,3 +15,4 @@ export declare const linkButtonMissingHrefComment = "\"link\" and \"subtle-link\
 export declare const buttonPropsNoLongerSupportedComment = "Buttons with \"component\", \"css\" or \"style\" prop can't be automatically migrated with codemods. Please migrate it manually.";
 export declare const migrateFitContainerButtonToDefaultButtonComment = "Migrated to a default button with text which is from the icon label.";
 export declare const migrateFitContainerButtonToIconButtonComment = "\"shouldFitContainer\" is not available in icon buttons, please consider using a default button with text.";
+export declare const customThemeButtonComment = "CustomThemeButton will be deprecated. Please consider migrating to Pressable or Anchor Primitives with custom styles.";

package/dist/types-ts4.5/presets/migrate-to-new-buttons/utils/add-comment-for-custom-theme-buttons.d.ts

@@ -0,0 +1,2 @@
+import type { API, Collection } from 'jscodeshift';
+export declare const addCommentForCustomThemeButtons: (fileSource: Collection<any>, j: API['jscodeshift']) => void;

package/dist/types-ts4.5/presets/migrate-to-new-buttons/utils/constants.d.ts

@@ -15,3 +15,4 @@ export declare const linkButtonMissingHrefComment = "\"link\" and \"subtle-link\
 export declare const buttonPropsNoLongerSupportedComment = "Buttons with \"component\", \"css\" or \"style\" prop can't be automatically migrated with codemods. Please migrate it manually.";
 export declare const migrateFitContainerButtonToDefaultButtonComment = "Migrated to a default button with text which is from the icon label.";
 export declare const migrateFitContainerButtonToIconButtonComment = "\"shouldFitContainer\" is not available in icon buttons, please consider using a default button with text.";
+export declare const customThemeButtonComment = "CustomThemeButton will be deprecated. Please consider migrating to Pressable or Anchor Primitives with custom styles.";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/codemod-cli",
-  "version": "0.24.0",
+  "version": "0.24.2",
   "description": "A cli for distributing codemods for atlassian-frontend components and services",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -40,7 +40,7 @@
   "bin": "./bin/codemod-cli.js",
   "dependencies": {
     "@atlaskit/codemod-utils": "^4.2.0",
-    "@atlaskit/tokens": "^1.48.0",
+    "@atlaskit/tokens": "^1.49.0",
     "@babel/runtime": "^7.0.0",
     "@codeshift/utils": "^0.2.4",
     "@hypermod/utils": "^0.4.2",