@atlaskit/eslint-plugin-design-system 10.10.0 → 10.10.1

package/dist/es2019/rules/no-legacy-icons/helpers.js

@@ -19,7 +19,7 @@ export const getMigrationMapObject = iconPackage => {
  * @param iconPackage The name of the legacy icon package
  * @returns The unique identifier for the icon (the part after "@atlaskit/icon/glyph")
  */
-export const getIconKey = iconPackage => {
+const getIconKey = iconPackage => {
   const key = iconPackage.replace(/^@atlaskit\/icon\/glyph\//, '');
   return key;
 };
@@ -34,36 +34,43 @@ export const canAutoMigrateNewIconBasedOnSize = guidance => {
 /**
  * Creates the written guidance for migrating a legacy icon to a new icon
  */
-export const createGuidance = (iconPackage, size) => {
+export const createGuidance = (iconPackage, insideNewButton = false, size) => {
   const migrationMapObject = getMigrationMapObject(iconPackage);
   if (migrationMapObject) {
     const newIcon = migrationMapObject.newIcon;
     if (!newIcon) {
       return 'No equivalent icon in new set. An option is to contribute a custom icon into icon-labs package instead.\n';
     }
+    const buttonGuidanceStr = "Please set 'spacing' property of the new icon to 'none', to ensure appropriate spacing inside `@atlaskit/button`.\n";
+    let guidance = '';
     if (size) {
-      let guidance = `Fix: Use ${newIcon.name} from @atlaskit/${newIcon.library}/${newIcon.type}/${newIcon.name} instead.`;
-      if (migrationMapObject.sizeGuidance[size] in outcomeDescriptionMap) {
-        guidance += ` Please: ${outcomeDescriptionMap[migrationMapObject.sizeGuidance[size]]}\n`;
+      if (migrationMapObject.sizeGuidance[size] && canAutoMigrateNewIconBasedOnSize(migrationMapObject.sizeGuidance[size])) {
+        guidance += `Fix: Use ${newIcon.name} from @atlaskit/${newIcon.library}/${newIcon.type}/${newIcon.name} instead.`;
       } else {
-        guidance += ' No migration advice given.\n';
+        guidance += `No equivalent icon for this size, ${size}, in new set.`;
       }
-      return guidance;
+      guidance += `${migrationMapObject.sizeGuidance[size] in outcomeDescriptionMap ? ` Please: ${outcomeDescriptionMap[migrationMapObject.sizeGuidance[size]]}` : ' No migration size advice given.'}\n`;
     } else {
-      let guidance = `Use ${newIcon.name} from @atlaskit/${newIcon.library}/${newIcon.type}/${newIcon.name} instead.\nMigration suggestions, depending on the legacy icon size:\n`;
+      guidance = `Use ${newIcon.name} from @atlaskit/${newIcon.library}/${newIcon.type}/${newIcon.name} instead.\nMigration suggestions, depending on the legacy icon size:\n`;
       for (const [size, value] of Object.entries(migrationMapObject.sizeGuidance)) {
         guidance += `\t- ${size}: `;
         if (!(value in outcomeDescriptionMap)) {
           guidance += 'No migration advice given.\n';
         } else {
-          guidance += `${outcomeDescriptionMap[value]}\n`;
+          guidance += `${outcomeDescriptionMap[value]}.\n`;
         }
-        guidance;
       }
-      return guidance;
     }
+    if (insideNewButton) {
+      guidance += buttonGuidanceStr;
+    } else if (size && size === 'medium') {
+      guidance += "Setting the spacing property to 'spacious' will maintain the icon's box dimensions - but consider setting spacing='none' as it allows for easier control of spacing by parent elements.\n";
+    } else if (size) {
+      guidance += "In the new icon, please use spacing='none'.\n";
+    }
+    return guidance;
   } else {
-    return 'Migration suggestions not found\n';
+    return `Migration suggestions not found for "${iconPackage}".\n`;
   }
 };
 
@@ -139,13 +146,14 @@ export const createCantMigrateUnsafeProp = (node, propName, value, packageName,
   };
   pushManualError(locToString(node), errors, myError, packageName, iconName);
 };
-export const createCantFindSuitableReplacementError = (node, importSource, iconName, errors) => {
+export const createCantFindSuitableReplacementError = (node, importSource, iconName, errors, sizeIssue) => {
   const myError = {
     node,
     messageId: 'cantFindSuitableReplacement',
     data: {
       importSource,
-      iconName
+      iconName,
+      sizeGuidance: sizeIssue ? ' at the current size' : ''
     }
   };
   pushManualError(locToString(node), errors, myError, importSource, iconName);
@@ -188,18 +196,13 @@ export const createCantMigrateSizeUnknown = (node, errors, importSource, iconNam
   };
   pushManualError(locToString(node), errors, myError, importSource, iconName);
 };
-export const createAutoMigrationError = (node, importSource, iconName, newIcon, oldIconName, errors) => {
-  const migrationKey = newIcon.name === oldIconName ? newIcon.name : `${newIcon.name}--${oldIconName}`;
-  const newMigrationIconPackage = `@atlaskit/${newIcon.library}/${newIcon.type}/migration/${migrationKey}`;
+export const createAutoMigrationError = (node, importSource, iconName, errors) => {
   const myError = {
     node,
     messageId: 'noLegacyIconsAutoMigration',
     data: {
       importSource,
-      iconName,
-      newIcon: newIcon.name,
-      //TODO: provide size guidance
-      newPackage: newMigrationIconPackage
+      iconName
     }
   };
   errors[locToString(node)] = myError;

package/dist/es2019/rules/no-legacy-icons/index.js

@@ -27,17 +27,16 @@ const rule = createLintRule({
       additionalProperties: false
     }],
     messages: {
-      noLegacyIconsAutoMigration: `Auto Migration:\nLegacy icon '{{iconName}}' from '{{importSource}}' detected.\nAutomatic migration is possible to '{{newIcon}}' from '{{newPackage}}.\nAtlassians: See https://go.atlassian.com/icon-migration-guide for details.'`,
-      noLegacyIconsManualMigration: `Manual Migration:\nLegacy icon '{{iconName}}' from '{{importSource}}' detected.\nAutomatic migration not possible.{{quietModeGuidance}}.\nAtlassians: See https://go.atlassian.com/icon-migration-guide for details.`,
-      cantFindSuitableReplacement: `No suitable replacement found for '{{iconName}}' from '{{importSource}}' at the size listed. Please manually migrate this icon.`,
+      noLegacyIconsAutoMigration: `Auto Migration:\nLegacy icon '{{iconName}}' from '{{importSource}}' detected.\nAutomatic migration is possible.\n\n{{guidance}}\nAtlassians: See https://go.atlassian.com/icon-migration-guide for details.'`,
+      noLegacyIconsManualMigration: `Manual Migration:\nLegacy icon '{{iconName}}' from '{{importSource}}' detected.\nAutomatic migration not possible.\n\n{{guidance}}\nAtlassians: See https://go.atlassian.com/icon-migration-guide for details.`,
+      cantFindSuitableReplacement: `No suitable replacement found for '{{iconName}}' from '{{importSource}}'{{sizeGuidance}}. Please manually migrate this icon.`,
       cantMigrateReExport: `'{{exportName}}' is a re-export of icon from '{{packageName}}' and cannot be automatically migrated. Please utilize the export from icons directly.`,
       cantMigrateColor: `Primary Color prop has {{colorValue}} which cannot be automatically migrated to color prop in the new Icon API. Please use either an appropriate color.icon, color.link token, or currentColor (as a last resort).`,
       cantMigrateSpreadProps: `This usage of Icon uses spread props in a way that can't be automatically migrated. Please explicitly define the following props after spread: '{{missingProps}}' `,
       cantMigrateSizeUnknown: `This usage of Icon sets the size via a variable or function that can't be determined.`,
       cantMigrateFunctionUnknown: `'{{iconName}}' from legacy '{{importSource}}' is used in unknown function/component. Please manually migrate this icon.`,
       cantMigrateIdentifier: `This icon is passed to other components via a map or array, in a way that can't be automatically migrated. Please manually migrate wherever this expression is used and use the icon components directly.`,
-      cantMigrateUnsafeProp: `Property '{{propName}}' with value of '{{value}}' is unable to be auto-migrated to the new button. Please manually migrate this icon.`,
-      guidance: `Guidance:\n'{{guidance}}'`
+      cantMigrateUnsafeProp: `Property '{{propName}}' with value of '{{value}}' is unable to be auto-migrated to the new button. Please manually migrate this icon.`
     }
   },
   create(context) {

package/dist/esm/rules/no-legacy-icons/checks.js

@@ -3,7 +3,7 @@ function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 import { isNodeOfType } from 'eslint-codemod-utils';
-import { canAutoMigrateNewIconBasedOnSize, canMigrateColor, createAutoMigrationError, createCantFindSuitableReplacementError, createCantMigrateColorError, createCantMigrateFunctionUnknownError, createCantMigrateIdentifierError, createCantMigrateReExportError, createCantMigrateSizeUnknown, createCantMigrateSpreadPropsError, createCantMigrateUnsafeProp, createGuidance, createHelpers, findUNSAFEProp, getIconKey, getMigrationMapObject, locToString } from './helpers';
+import { canAutoMigrateNewIconBasedOnSize, canMigrateColor, createAutoMigrationError, createCantFindSuitableReplacementError, createCantMigrateColorError, createCantMigrateFunctionUnknownError, createCantMigrateIdentifierError, createCantMigrateReExportError, createCantMigrateSizeUnknown, createCantMigrateSpreadPropsError, createCantMigrateUnsafeProp, createGuidance, createHelpers, findUNSAFEProp, getMigrationMapObject, locToString } from './helpers';
 import { isSize } from './migration-map-temp';
 export var createChecks = function createChecks(context) {
   //create global variables to be shared by the checks
@@ -134,25 +134,36 @@ export var createChecks = function createChecks(context) {
       if (typeof moduleSource === 'string' && ['@atlaskit/icon/glyph/', '@atlaskit/icon-object/glyph/'].find(function (val) {
         return moduleSource.startsWith(val);
       }) && node.specifiers.length) {
-        createCantMigrateReExportError(node, moduleSource, node.specifiers[0].exported.name, errorsManual);
-        guidance[locToString(node)] = createGuidance(moduleSource);
+        var _iterator4 = _createForOfIteratorHelper(node.specifiers),
+          _step4;
+        try {
+          for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
+            var spec = _step4.value;
+            createCantMigrateReExportError(spec, moduleSource, spec.exported.name, errorsManual);
+            guidance[locToString(spec)] = createGuidance(moduleSource);
+          }
+        } catch (err) {
+          _iterator4.e(err);
+        } finally {
+          _iterator4.f();
+        }
       }
     } else if (node.declaration && isNodeOfType(node.declaration, 'VariableDeclaration')) {
       // export const Icon = AddIcon;
-      var _iterator4 = _createForOfIteratorHelper(node.declaration.declarations),
-        _step4;
+      var _iterator5 = _createForOfIteratorHelper(node.declaration.declarations),
+        _step5;
       try {
-        for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
-          var decl = _step4.value;
+        for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
+          var decl = _step5.value;
           if (isNodeOfType(decl, 'VariableDeclarator') && 'init' in decl && decl.init && isNodeOfType(decl.init, 'Identifier') && decl.init.name in legacyIconImports) {
             createCantMigrateReExportError(node, legacyIconImports[decl.init.name].packageName, decl.init.name, errorsManual);
-            guidance[locToString(node)] = createGuidance(createGuidance(legacyIconImports[decl.init.name].packageName));
+            guidance[locToString(node)] = createGuidance(legacyIconImports[decl.init.name].packageName);
           }
         }
       } catch (err) {
-        _iterator4.e(err);
+        _iterator5.e(err);
       } finally {
-        _iterator4.f();
+        _iterator5.f();
       }
     } else if (!node.source && node.specifiers && node.specifiers.length > 0) {
       /**
@@ -161,25 +172,25 @@ export var createChecks = function createChecks(context) {
        * const crossIcon = LegacyIcon2;
        * export { AddIcon, CrossIcon as default }
        */
-      var _iterator5 = _createForOfIteratorHelper(node.specifiers),
-        _step5;
+      var _iterator6 = _createForOfIteratorHelper(node.specifiers),
+        _step6;
       try {
-        for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
-          var spec = _step5.value;
-          if (spec.local.name in legacyIconImports) {
+        for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {
+          var _spec2 = _step6.value;
+          if (_spec2.local.name in legacyIconImports) {
             //update legacy imports to be exported
-            legacyIconImports[spec.local.name] = {
-              packageName: legacyIconImports[spec.local.name].packageName,
+            legacyIconImports[_spec2.local.name] = {
+              packageName: legacyIconImports[_spec2.local.name].packageName,
               exported: true
             };
-            createCantMigrateReExportError(spec, legacyIconImports[spec.local.name].packageName, spec.exported.name, errorsManual);
-            guidance[locToString(spec)] = createGuidance(legacyIconImports[spec.local.name].packageName);
+            createCantMigrateReExportError(_spec2, legacyIconImports[_spec2.local.name].packageName, _spec2.exported.name, errorsManual);
+            guidance[locToString(_spec2)] = createGuidance(legacyIconImports[_spec2.local.name].packageName);
           }
         }
       } catch (err) {
-        _iterator5.e(err);
+        _iterator6.e(err);
       } finally {
-        _iterator5.f();
+        _iterator6.f();
       }
     }
   };
@@ -226,18 +237,17 @@ export var createChecks = function createChecks(context) {
         UNSAFE_propName = result.UNSAFE_propName;
       }
       if (newIcon && isInNewButton && isNewIconMigratable && UNSAFE_size !== 'large' && UNSAFE_size !== 'xlarge') {
-        var iconKey = getIconKey(legacyIconImports[node.name].packageName);
-        createAutoMigrationError(node, legacyIconImports[node.name].packageName, node.name, newIcon, iconKey, errorsAuto);
-        guidance[locToString(node)] = createGuidance(legacyIconImports[node.name].packageName, 'medium');
+        createAutoMigrationError(node, legacyIconImports[node.name].packageName, node.name, errorsAuto);
+        guidance[locToString(node)] = createGuidance(legacyIconImports[node.name].packageName, isInNewButton, 'medium');
       } else if ((!newIcon || !isNewIconMigratable) && !UNSAFE_size) {
         createCantFindSuitableReplacementError(node, legacyIconImports[node.name].packageName, node.name, errorsManual);
-        guidance[locToString(node)] = createGuidance(legacyIconImports[node.name].packageName);
+        guidance[locToString(node)] = createGuidance(legacyIconImports[node.name].packageName, isInNewButton);
       } else if ((UNSAFE_size === 'large' || UNSAFE_size === 'xlarge') && UNSAFE_propName) {
         createCantMigrateUnsafeProp(node, UNSAFE_propName, UNSAFE_size, legacyIconImports[node.name].packageName, node.name, errorsManual);
-        guidance[locToString(node)] = createGuidance(legacyIconImports[node.name].packageName, UNSAFE_size);
+        guidance[locToString(node)] = createGuidance(legacyIconImports[node.name].packageName, isInNewButton, UNSAFE_size);
       } else if (!isInNewButton) {
         createCantMigrateFunctionUnknownError(node, legacyIconImports[node.name].packageName, node.name, errorsManual);
-        guidance[locToString(node)] = createGuidance(legacyIconImports[node.name].packageName);
+        guidance[locToString(node)] = createGuidance(legacyIconImports[node.name].packageName, isInNewButton);
       }
     }
   };
@@ -280,11 +290,11 @@ export var createChecks = function createChecks(context) {
       var requiredAttributesAfterSpread = new Set(['size', 'primaryColor', 'secondaryColor']);
       var hasSpread = false;
       var hasPrimaryColorProp = false;
-      var _iterator6 = _createForOfIteratorHelper(node.openingElement.attributes),
-        _step6;
+      var _iterator7 = _createForOfIteratorHelper(node.openingElement.attributes),
+        _step7;
       try {
-        for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {
-          var attr = _step6.value;
+        for (_iterator7.s(); !(_step7 = _iterator7.n()).done;) {
+          var attr = _step7.value;
           // Detect spread props
           if (isNodeOfType(attr, 'JSXSpreadAttribute')) {
             // In case there are more spread props
@@ -317,9 +327,9 @@ export var createChecks = function createChecks(context) {
           }
         }
       } catch (err) {
-        _iterator6.e(err);
+        _iterator7.e(err);
       } finally {
-        _iterator6.f();
+        _iterator7.f();
       }
       var hasManualMigration = false;
       if (primaryColor && !canMigrateColor(primaryColor) || hasPrimaryColorProp && !primaryColor) {
@@ -333,7 +343,6 @@ export var createChecks = function createChecks(context) {
         createCantMigrateSizeUnknown(node, errorsManual, legacyIconImports[name].packageName, name);
         hasManualMigration = true;
       }
-      guidance[locToString(node)] = createGuidance(legacyIconImports[name].packageName, size ? size : undefined);
       // Check for unsafe size
       if ((UNSAFE_size === 'large' || UNSAFE_size === 'xlarge') && (UNSAFE_propName === 'UNSAFE_iconAfter_size' || UNSAFE_propName === 'UNSAFE_iconBefore_size' || UNSAFE_propName === 'UNSAFE_size')) {
         createCantMigrateUnsafeProp(node, UNSAFE_propName, UNSAFE_size, legacyIconImports[name].packageName, name, errorsManual);
@@ -355,14 +364,14 @@ export var createChecks = function createChecks(context) {
         hasManualMigration = true;
       }
       var migrationMapObject = getMigrationMapObject(legacyIconImports[name].packageName);
-      var iconKey = getIconKey(legacyIconImports[name].packageName);
       var newIcon = migrationMapObject === null || migrationMapObject === void 0 ? void 0 : migrationMapObject.newIcon;
       var isNewIconMigratable = canAutoMigrateNewIconBasedOnSize(migrationMapObject === null || migrationMapObject === void 0 ? void 0 : migrationMapObject.sizeGuidance[(_size = size) !== null && _size !== void 0 ? _size : 'medium']);
       if (!hasManualMigration && newIcon && isNewIconMigratable) {
-        createAutoMigrationError(node, legacyIconImports[name].packageName, name, newIcon, iconKey, errorsAuto);
+        createAutoMigrationError(node, legacyIconImports[name].packageName, name, errorsAuto);
       } else if ((!newIcon || !isNewIconMigratable) && size) {
-        createCantFindSuitableReplacementError(node, legacyIconImports[name].packageName, name, errorsManual);
+        createCantFindSuitableReplacementError(node, legacyIconImports[name].packageName, name, errorsManual, migrationMapObject ? true : false);
       }
+      guidance[locToString(node)] = createGuidance(legacyIconImports[name].packageName, insideNewButton, size && isSize(size) ? size : undefined);
     }
   };
 
@@ -372,20 +381,20 @@ export var createChecks = function createChecks(context) {
    */
   var checkCallExpression = function checkCallExpression(node) {
     if ('arguments' in node && node.arguments.length) {
-      var _iterator7 = _createForOfIteratorHelper(node.arguments),
-        _step7;
+      var _iterator8 = _createForOfIteratorHelper(node.arguments),
+        _step8;
       try {
-        for (_iterator7.s(); !(_step7 = _iterator7.n()).done;) {
-          var arg = _step7.value;
+        for (_iterator8.s(); !(_step8 = _iterator8.n()).done;) {
+          var arg = _step8.value;
           if (isNodeOfType(arg, 'Identifier') && arg.name in legacyIconImports && legacyIconImports[arg.name].packageName) {
             createCantMigrateFunctionUnknownError(node, legacyIconImports[arg.name].packageName, arg.name, errorsManual);
             guidance[locToString(node)] = createGuidance(legacyIconImports[arg.name].packageName);
           }
         }
       } catch (err) {
-        _iterator7.e(err);
+        _iterator8.e(err);
       } finally {
-        _iterator7.f();
+        _iterator8.f();
       }
     }
   };
@@ -401,36 +410,28 @@ export var createChecks = function createChecks(context) {
           errorList = _Object$entries$_i[1];
         var node = 'node' in errorList.errors[0] ? errorList.errors[0].node : null;
         if (node) {
+          var guidanceMessage = _key in guidance ? guidance[_key] : '';
           context.report({
             node: node,
             messageId: 'noLegacyIconsManualMigration',
             data: {
               iconName: errorList.iconName,
               importSource: errorList.importSource,
-              quietModeGuidance: isQuietMode ? 'For more information see the below errors:' : ''
+              guidance: isQuietMode ? guidanceMessage : "".concat(guidanceMessage, "For more information see the below errors.\n")
             }
           });
           if (!isQuietMode) {
-            var _iterator8 = _createForOfIteratorHelper(errorList.errors),
-              _step8;
+            var _iterator9 = _createForOfIteratorHelper(errorList.errors),
+              _step9;
             try {
-              for (_iterator8.s(); !(_step8 = _iterator8.n()).done;) {
-                var error = _step8.value;
+              for (_iterator9.s(); !(_step9 = _iterator9.n()).done;) {
+                var error = _step9.value;
                 context.report(error);
               }
             } catch (err) {
-              _iterator8.e(err);
+              _iterator9.e(err);
             } finally {
-              _iterator8.f();
-            }
-            if (_key in guidance) {
-              context.report({
-                node: node,
-                messageId: 'guidance',
-                data: {
-                  guidance: guidance[_key]
-                }
-              });
+              _iterator9.f();
             }
           }
         }
@@ -449,16 +450,11 @@ export var createChecks = function createChecks(context) {
         }
         var _node = 'node' in _error ? _error.node : null;
         if (_node) {
-          context.report(_error);
-          if (_key2 in guidance && !isQuietMode) {
-            context.report({
-              node: _node,
-              messageId: 'guidance',
-              data: {
-                guidance: guidance[_key2]
-              }
-            });
+          var _guidanceMessage = _key2 in guidance ? guidance[_key2] : '';
+          if ('data' in _error && _error.data) {
+            _error.data.guidance = _guidanceMessage;
           }
+          context.report(_error);
         }
       }
     }

package/dist/esm/rules/no-legacy-icons/helpers.js

@@ -20,7 +20,7 @@ export var getMigrationMapObject = function getMigrationMapObject(iconPackage) {
  * @param iconPackage The name of the legacy icon package
  * @returns The unique identifier for the icon (the part after "@atlaskit/icon/glyph")
  */
-export var getIconKey = function getIconKey(iconPackage) {
+var getIconKey = function getIconKey(iconPackage) {
   var key = iconPackage.replace(/^@atlaskit\/icon\/glyph\//, '');
   return key;
 };
@@ -35,39 +35,48 @@ export var canAutoMigrateNewIconBasedOnSize = function canAutoMigrateNewIconBase
 /**
  * Creates the written guidance for migrating a legacy icon to a new icon
  */
-export var createGuidance = function createGuidance(iconPackage, size) {
+export var createGuidance = function createGuidance(iconPackage) {
+  var insideNewButton = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  var size = arguments.length > 2 ? arguments[2] : undefined;
   var migrationMapObject = getMigrationMapObject(iconPackage);
   if (migrationMapObject) {
     var newIcon = migrationMapObject.newIcon;
     if (!newIcon) {
       return 'No equivalent icon in new set. An option is to contribute a custom icon into icon-labs package instead.\n';
     }
+    var buttonGuidanceStr = "Please set 'spacing' property of the new icon to 'none', to ensure appropriate spacing inside `@atlaskit/button`.\n";
+    var guidance = '';
     if (size) {
-      var guidance = "Fix: Use ".concat(newIcon.name, " from @atlaskit/").concat(newIcon.library, "/").concat(newIcon.type, "/").concat(newIcon.name, " instead.");
-      if (migrationMapObject.sizeGuidance[size] in outcomeDescriptionMap) {
-        guidance += " Please: ".concat(outcomeDescriptionMap[migrationMapObject.sizeGuidance[size]], "\n");
+      if (migrationMapObject.sizeGuidance[size] && canAutoMigrateNewIconBasedOnSize(migrationMapObject.sizeGuidance[size])) {
+        guidance += "Fix: Use ".concat(newIcon.name, " from @atlaskit/").concat(newIcon.library, "/").concat(newIcon.type, "/").concat(newIcon.name, " instead.");
       } else {
-        guidance += ' No migration advice given.\n';
+        guidance += "No equivalent icon for this size, ".concat(size, ", in new set.");
       }
-      return guidance;
+      guidance += "".concat(migrationMapObject.sizeGuidance[size] in outcomeDescriptionMap ? " Please: ".concat(outcomeDescriptionMap[migrationMapObject.sizeGuidance[size]]) : ' No migration size advice given.', "\n");
     } else {
-      var _guidance = "Use ".concat(newIcon.name, " from @atlaskit/").concat(newIcon.library, "/").concat(newIcon.type, "/").concat(newIcon.name, " instead.\nMigration suggestions, depending on the legacy icon size:\n");
+      guidance = "Use ".concat(newIcon.name, " from @atlaskit/").concat(newIcon.library, "/").concat(newIcon.type, "/").concat(newIcon.name, " instead.\nMigration suggestions, depending on the legacy icon size:\n");
       for (var _i = 0, _Object$entries = Object.entries(migrationMapObject.sizeGuidance); _i < _Object$entries.length; _i++) {
         var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
           _size = _Object$entries$_i[0],
           value = _Object$entries$_i[1];
-        _guidance += "\t- ".concat(_size, ": ");
+        guidance += "\t- ".concat(_size, ": ");
         if (!(value in outcomeDescriptionMap)) {
-          _guidance += 'No migration advice given.\n';
+          guidance += 'No migration advice given.\n';
         } else {
-          _guidance += "".concat(outcomeDescriptionMap[value], "\n");
+          guidance += "".concat(outcomeDescriptionMap[value], ".\n");
         }
-        _guidance;
       }
-      return _guidance;
     }
+    if (insideNewButton) {
+      guidance += buttonGuidanceStr;
+    } else if (size && size === 'medium') {
+      guidance += "Setting the spacing property to 'spacious' will maintain the icon's box dimensions - but consider setting spacing='none' as it allows for easier control of spacing by parent elements.\n";
+    } else if (size) {
+      guidance += "In the new icon, please use spacing='none'.\n";
+    }
+    return guidance;
   } else {
-    return 'Migration suggestions not found\n';
+    return "Migration suggestions not found for \"".concat(iconPackage, "\".\n");
   }
 };
 
@@ -145,13 +154,14 @@ export var createCantMigrateUnsafeProp = function createCantMigrateUnsafeProp(no
   };
   pushManualError(locToString(node), errors, myError, packageName, iconName);
 };
-export var createCantFindSuitableReplacementError = function createCantFindSuitableReplacementError(node, importSource, iconName, errors) {
+export var createCantFindSuitableReplacementError = function createCantFindSuitableReplacementError(node, importSource, iconName, errors, sizeIssue) {
   var myError = {
     node: node,
     messageId: 'cantFindSuitableReplacement',
     data: {
       importSource: importSource,
-      iconName: iconName
+      iconName: iconName,
+      sizeGuidance: sizeIssue ? ' at the current size' : ''
     }
   };
   pushManualError(locToString(node), errors, myError, importSource, iconName);
@@ -194,18 +204,13 @@ export var createCantMigrateSizeUnknown = function createCantMigrateSizeUnknown(
   };
   pushManualError(locToString(node), errors, myError, importSource, iconName);
 };
-export var createAutoMigrationError = function createAutoMigrationError(node, importSource, iconName, newIcon, oldIconName, errors) {
-  var migrationKey = newIcon.name === oldIconName ? newIcon.name : "".concat(newIcon.name, "--").concat(oldIconName);
-  var newMigrationIconPackage = "@atlaskit/".concat(newIcon.library, "/").concat(newIcon.type, "/migration/").concat(migrationKey);
+export var createAutoMigrationError = function createAutoMigrationError(node, importSource, iconName, errors) {
   var myError = {
     node: node,
     messageId: 'noLegacyIconsAutoMigration',
     data: {
       importSource: importSource,
-      iconName: iconName,
-      newIcon: newIcon.name,
-      //TODO: provide size guidance
-      newPackage: newMigrationIconPackage
+      iconName: iconName
     }
   };
   errors[locToString(node)] = myError;

package/dist/esm/rules/no-legacy-icons/index.js

@@ -27,17 +27,16 @@ var rule = createLintRule({
       additionalProperties: false
     }],
     messages: {
-      noLegacyIconsAutoMigration: "Auto Migration:\nLegacy icon '{{iconName}}' from '{{importSource}}' detected.\nAutomatic migration is possible to '{{newIcon}}' from '{{newPackage}}.\nAtlassians: See https://go.atlassian.com/icon-migration-guide for details.'",
-      noLegacyIconsManualMigration: "Manual Migration:\nLegacy icon '{{iconName}}' from '{{importSource}}' detected.\nAutomatic migration not possible.{{quietModeGuidance}}.\nAtlassians: See https://go.atlassian.com/icon-migration-guide for details.",
-      cantFindSuitableReplacement: "No suitable replacement found for '{{iconName}}' from '{{importSource}}' at the size listed. Please manually migrate this icon.",
+      noLegacyIconsAutoMigration: "Auto Migration:\nLegacy icon '{{iconName}}' from '{{importSource}}' detected.\nAutomatic migration is possible.\n\n{{guidance}}\nAtlassians: See https://go.atlassian.com/icon-migration-guide for details.'",
+      noLegacyIconsManualMigration: "Manual Migration:\nLegacy icon '{{iconName}}' from '{{importSource}}' detected.\nAutomatic migration not possible.\n\n{{guidance}}\nAtlassians: See https://go.atlassian.com/icon-migration-guide for details.",
+      cantFindSuitableReplacement: "No suitable replacement found for '{{iconName}}' from '{{importSource}}'{{sizeGuidance}}. Please manually migrate this icon.",
       cantMigrateReExport: "'{{exportName}}' is a re-export of icon from '{{packageName}}' and cannot be automatically migrated. Please utilize the export from icons directly.",
       cantMigrateColor: "Primary Color prop has {{colorValue}} which cannot be automatically migrated to color prop in the new Icon API. Please use either an appropriate color.icon, color.link token, or currentColor (as a last resort).",
       cantMigrateSpreadProps: "This usage of Icon uses spread props in a way that can't be automatically migrated. Please explicitly define the following props after spread: '{{missingProps}}' ",
       cantMigrateSizeUnknown: "This usage of Icon sets the size via a variable or function that can't be determined.",
       cantMigrateFunctionUnknown: "'{{iconName}}' from legacy '{{importSource}}' is used in unknown function/component. Please manually migrate this icon.",
       cantMigrateIdentifier: "This icon is passed to other components via a map or array, in a way that can't be automatically migrated. Please manually migrate wherever this expression is used and use the icon components directly.",
-      cantMigrateUnsafeProp: "Property '{{propName}}' with value of '{{value}}' is unable to be auto-migrated to the new button. Please manually migrate this icon.",
-      guidance: "Guidance:\n'{{guidance}}'"
+      cantMigrateUnsafeProp: "Property '{{propName}}' with value of '{{value}}' is unable to be auto-migrated to the new button. Please manually migrate this icon."
     }
   },
   create: function create(context) {

package/dist/types/rules/no-legacy-icons/helpers.d.ts

@@ -33,12 +33,6 @@ export declare const getMigrationMapObject: (iconPackage: string) => {
         library: string;
     } | undefined;
 } | null;
-/**
- * Returns the key of a legacy icon
- * @param iconPackage The name of the legacy icon package
- * @returns The unique identifier for the icon (the part after "@atlaskit/icon/glyph")
- */
-export declare const getIconKey: (iconPackage: string) => string;
 /**
  * Checks if a new icon can be auto-migrated based on guidance from the migration map
  */
@@ -46,7 +40,7 @@ export declare const canAutoMigrateNewIconBasedOnSize: (guidance?: string) => bo
 /**
  * Creates the written guidance for migrating a legacy icon to a new icon
  */
-export declare const createGuidance: (iconPackage: string, size?: Size) => string;
+export declare const createGuidance: (iconPackage: string, insideNewButton?: boolean, size?: Size) => string;
 /**
  * Checks if the color can be migrated
  * @param color String representing the color to check
@@ -61,16 +55,12 @@ export declare const findUNSAFEProp: (iconAttr: JSXAttribute, button: JSXOpening
     UNSAFE_propName: "UNSAFE_iconAfter_size" | "UNSAFE_iconBefore_size" | "UNSAFE_size" | null;
 };
 export declare const createCantMigrateUnsafeProp: (node: Node, propName: string, value: string, packageName: string, iconName: string, errors: errorsListManual) => void;
-export declare const createCantFindSuitableReplacementError: (node: Node, importSource: string, iconName: string, errors: errorsListManual) => void;
+export declare const createCantFindSuitableReplacementError: (node: Node, importSource: string, iconName: string, errors: errorsListManual, sizeIssue?: boolean) => void;
 export declare const createCantMigrateFunctionUnknownError: (node: Node, importSource: string, iconName: string, errors: errorsListManual) => void;
 export declare const createCantMigrateColorError: (node: Node, colorValue: string, errors: errorsListManual, importSource: string, iconName: string) => void;
 export declare const createCantMigrateSpreadPropsError: (node: Node, missingProps: string[], errors: errorsListManual, importSource: string, iconName: string) => void;
 export declare const createCantMigrateSizeUnknown: (node: Node, errors: errorsListManual, importSource: string, iconName: string) => void;
-export declare const createAutoMigrationError: (node: Node, importSource: string, iconName: string, newIcon: {
-    name: string;
-    type: string;
-    library: string;
-}, oldIconName: string, errors: errorsListAuto) => void;
+export declare const createAutoMigrationError: (node: Node, importSource: string, iconName: string, errors: errorsListAuto) => void;
 export declare const getLiteralStringValue: (value: any) => string | undefined;
 export declare const createHelpers: (context: Rule.RuleContext) => {
     /**

package/dist/types-ts4.5/rules/no-legacy-icons/helpers.d.ts

@@ -33,12 +33,6 @@ export declare const getMigrationMapObject: (iconPackage: string) => {
         library: string;
     } | undefined;
 } | null;
-/**
- * Returns the key of a legacy icon
- * @param iconPackage The name of the legacy icon package
- * @returns The unique identifier for the icon (the part after "@atlaskit/icon/glyph")
- */
-export declare const getIconKey: (iconPackage: string) => string;
 /**
  * Checks if a new icon can be auto-migrated based on guidance from the migration map
  */
@@ -46,7 +40,7 @@ export declare const canAutoMigrateNewIconBasedOnSize: (guidance?: string) => bo
 /**
  * Creates the written guidance for migrating a legacy icon to a new icon
  */
-export declare const createGuidance: (iconPackage: string, size?: Size) => string;
+export declare const createGuidance: (iconPackage: string, insideNewButton?: boolean, size?: Size) => string;
 /**
  * Checks if the color can be migrated
  * @param color String representing the color to check
@@ -61,16 +55,12 @@ export declare const findUNSAFEProp: (iconAttr: JSXAttribute, button: JSXOpening
     UNSAFE_propName: "UNSAFE_iconAfter_size" | "UNSAFE_iconBefore_size" | "UNSAFE_size" | null;
 };
 export declare const createCantMigrateUnsafeProp: (node: Node, propName: string, value: string, packageName: string, iconName: string, errors: errorsListManual) => void;
-export declare const createCantFindSuitableReplacementError: (node: Node, importSource: string, iconName: string, errors: errorsListManual) => void;
+export declare const createCantFindSuitableReplacementError: (node: Node, importSource: string, iconName: string, errors: errorsListManual, sizeIssue?: boolean) => void;
 export declare const createCantMigrateFunctionUnknownError: (node: Node, importSource: string, iconName: string, errors: errorsListManual) => void;
 export declare const createCantMigrateColorError: (node: Node, colorValue: string, errors: errorsListManual, importSource: string, iconName: string) => void;
 export declare const createCantMigrateSpreadPropsError: (node: Node, missingProps: string[], errors: errorsListManual, importSource: string, iconName: string) => void;
 export declare const createCantMigrateSizeUnknown: (node: Node, errors: errorsListManual, importSource: string, iconName: string) => void;
-export declare const createAutoMigrationError: (node: Node, importSource: string, iconName: string, newIcon: {
-    name: string;
-    type: string;
-    library: string;
-}, oldIconName: string, errors: errorsListAuto) => void;
+export declare const createAutoMigrationError: (node: Node, importSource: string, iconName: string, errors: errorsListAuto) => void;
 export declare const getLiteralStringValue: (value: any) => string | undefined;
 export declare const createHelpers: (context: Rule.RuleContext) => {
     /**

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@atlaskit/eslint-plugin-design-system",
 	"description": "The essential plugin for use with the Atlassian Design System.",
-	"version": "10.10.0",
+	"version": "10.10.1",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
 	"publishConfig": {
@@ -67,7 +67,7 @@
 		"jscodeshift": "^0.13.0",
 		"outdent": "^0.5.0",
 		"react": "^16.8.0",
-		"ts-jest": "26.5.6",
+		"ts-jest": "29.1.2",
 		"ts-node": "^10.9.1",
 		"tsconfig-paths": "^4.2.0",
 		"typescript": "~5.4.2"