@atlaskit/eslint-plugin-design-system 13.14.2 → 13.16.0

package/dist/es2019/rules/no-utility-icons/checks.js

@@ -0,0 +1,164 @@
+import { isNodeOfType } from 'eslint-codemod-utils';
+const specialCases = {
+  '@atlaskit/icon/utility/cross': '@atlaskit/icon/core/close',
+  '@atlaskit/icon/utility/migration/cross--editor-close': '@atlaskit/icon/core/migration/close--editor-close'
+};
+const iconPropsinNewButton = ['icon', 'iconBefore', 'iconAfter'];
+export const createChecks = context => {
+  const importStatementsUtility = {};
+  const importStatementsCore = {};
+  const newButtonImports = new Set();
+  const errors = {};
+  const checkImportDeclarations = node => {
+    const moduleSource = node.source.value;
+    if (typeof moduleSource !== 'string') {
+      return;
+    }
+    if (moduleSource.startsWith('@atlaskit/icon/utility/')) {
+      for (const specifier of node.specifiers) {
+        if (specifier.type === 'ImportDefaultSpecifier') {
+          importStatementsUtility[specifier.local.name] = node;
+        }
+      }
+    } else if (moduleSource.startsWith('@atlaskit/icon/core/')) {
+      for (const specifier of node.specifiers) {
+        if (specifier.type === 'ImportDefaultSpecifier') {
+          importStatementsCore[moduleSource] = {
+            node,
+            localName: specifier.local.name
+          };
+        }
+      }
+    } else if (moduleSource.startsWith('@atlaskit/button/')) {
+      for (const specifier of node.specifiers) {
+        newButtonImports.add(specifier.local.name);
+      }
+    }
+  };
+  const checkJSXElement = node => {
+    if (!(isNodeOfType(node, 'JSXElement') && isNodeOfType(node.openingElement.name, 'JSXIdentifier') && importStatementsUtility.hasOwnProperty(node.openingElement.name.name) && typeof importStatementsUtility[node.openingElement.name.name].source.value === 'string')) {
+      return;
+    }
+    if (!errors.hasOwnProperty(node.openingElement.name.name)) {
+      errors[node.openingElement.name.name] = [];
+    }
+    errors[node.openingElement.name.name].push({
+      node,
+      messageId: 'noUtilityIconsJSXElement',
+      localName: node.openingElement.name.name,
+      fixable: true,
+      inNewButton: false
+    });
+  };
+
+  // Cases: As Props, In Function Calls, In Arrays, In Maps, In Exports
+  const checkIconReference = node => {
+    //if this is an import statement then exit early
+    if (node.parent && (isNodeOfType(node.parent, 'ImportSpecifier') || isNodeOfType(node.parent, 'ImportDefaultSpecifier'))) {
+      return;
+    }
+
+    //check the reference to see if it's a utility icon, if not exit early
+    if (!importStatementsUtility.hasOwnProperty(node.name)) {
+      return;
+    }
+
+    // if it is in new Button then we can fix it
+    if (node.parent && node.parent.parent && node.parent.parent.parent && isNodeOfType(node.parent, 'JSXExpressionContainer') && isNodeOfType(node.parent.parent, 'JSXAttribute') && isNodeOfType(node.parent.parent.name, 'JSXIdentifier') && iconPropsinNewButton.includes(node.parent.parent.name.name) && isNodeOfType(node.parent.parent.parent, 'JSXOpeningElement') && isNodeOfType(node.parent.parent.parent.name, 'JSXIdentifier') && newButtonImports.has(node.parent.parent.parent.name.name)) {
+      // if it is in new Button then we can fix it
+      if (!errors.hasOwnProperty(node.name)) {
+        errors[node.name] = [];
+      }
+      errors[node.name].push({
+        node,
+        messageId: 'noUtilityIconsReference',
+        localName: node.name,
+        fixable: true,
+        inNewButton: true
+      });
+      return;
+    }
+
+    // manually error
+    if (!errors.hasOwnProperty(node.name)) {
+      errors[node.name] = [];
+    }
+    errors[node.name].push({
+      node,
+      messageId: 'noUtilityIconsReference',
+      localName: node.name,
+      fixable: false,
+      inNewButton: false
+    });
+  };
+
+  /**
+   * Throws the relevant errors in the correct order.
+   */
+  const throwErrors = () => {
+    for (const utilityIcon of Object.keys(errors)) {
+      const allFixable = errors[utilityIcon].every(x => x.fixable); // Check if ALL errors for a giving import are fixable
+      const originalImportNode = importStatementsUtility[utilityIcon];
+      const oldImportName = importStatementsUtility[utilityIcon].source.value;
+      const newImportName = specialCases.hasOwnProperty(oldImportName) ? specialCases[oldImportName] : oldImportName.replace('@atlaskit/icon/utility/', '@atlaskit/icon/core/');
+      const existingImport = importStatementsCore.hasOwnProperty(newImportName) ? importStatementsCore[newImportName].localName : null;
+      let replacementImportName = existingImport ? existingImport : allFixable ? utilityIcon : `${utilityIcon}Core`;
+      let importFixAdded = false;
+      for (const [index, error] of errors[utilityIcon].entries()) {
+        if (error.fixable) {
+          context.report({
+            node: error.node,
+            messageId: error.messageId,
+            fix: fixer => {
+              const fixes = [];
+
+              // Add a new import statement if it doesn't already exist
+              if (!existingImport && !importFixAdded) {
+                importFixAdded = true;
+                fixes.push(fixer.insertTextBeforeRange([0, 0], `import ${replacementImportName} from '${newImportName}';\n`));
+              }
+
+              // Handle JSX elements differently if they are in a "new Button"
+              if (error.inNewButton) {
+                // Replace the icon with a function that wraps it with iconProps and size="small"
+                const wrappedIcon = `(iconProps) => <${replacementImportName} label="" {...iconProps} size="small" />`;
+                fixes.push(fixer.replaceText(error.node, wrappedIcon));
+              } else if (isNodeOfType(error.node, 'JSXElement') && isNodeOfType(error.node.openingElement.name, 'JSXIdentifier')) {
+                // Replace the JSX element's closing tag with size="small"
+                const newOpeningElementText = context.sourceCode.getText(error.node.openingElement).replace(/\s*\/\s*>$/, ` size="small"\/>`).replace(new RegExp('<\s*' + error.node.openingElement.name.name), `<${replacementImportName}`);
+                fixes.push(fixer.replaceText(error.node.openingElement, newOpeningElementText));
+              }
+
+              // Handle the first fixable error for import removal if all fixable for this import
+              if (index === 0 && allFixable) {
+                fixes.push(fixer.remove(originalImportNode));
+              }
+              return fixes;
+            }
+          });
+        } else {
+          // Report non-fixable errors
+          context.report({
+            node: error.node,
+            messageId: error.messageId
+          });
+        }
+      }
+    }
+
+    // If other utility icons are imported but there were no errors for them - (this should only be unused imports but good to have as a backup), report them
+    const otherUtilityImportsWithoutErrors = Object.keys(importStatementsUtility).filter(utilityIcon => !errors.hasOwnProperty(utilityIcon));
+    for (const utilityIcon of otherUtilityImportsWithoutErrors) {
+      context.report({
+        node: importStatementsUtility[utilityIcon],
+        messageId: 'noUtilityIconsImport'
+      });
+    }
+  };
+  return {
+    checkImportDeclarations,
+    checkJSXElement,
+    checkIconReference,
+    throwErrors
+  };
+};

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

@@ -0,0 +1,35 @@
+import { createLintRule } from '../utils/create-rule';
+import { createChecks } from './checks';
+const rule = createLintRule({
+  meta: {
+    name: 'no-utility-icons',
+    fixable: 'code',
+    hasSuggestions: true,
+    type: 'problem',
+    docs: {
+      description: 'Disallow use of deprecated utility icons, in favor of core icons with `size="small"`.',
+      recommended: true,
+      severity: 'warn'
+    },
+    messages: {
+      noUtilityIconsJSXElement: `Utility icons are deprecated. Please use core icons instead with the size prop set to small.`,
+      noUtilityIconsImport: `Utility icons are deprecated. Please do not import them, use core icons instead.`,
+      noUtilityIconsReference: `Utility icons are deprecated. To replace them, please use core icons with the size prop set to small instead.`
+    }
+  },
+  create(context) {
+    const {
+      checkImportDeclarations,
+      checkJSXElement,
+      checkIconReference,
+      throwErrors
+    } = createChecks(context);
+    return {
+      ImportDeclaration: checkImportDeclarations,
+      JSXElement: checkJSXElement,
+      Identifier: checkIconReference,
+      'Program:exit': throwErrors
+    };
+  }
+});
+export default rule;

package/dist/es2019/rules/utils/get-deprecated-config.js

@@ -1,6 +1,6 @@
 import fs from 'fs';
 import path from 'path';
-import { deprecatedCore as deprecatedIconLabCore } from '@atlaskit/icon-lab/deprecated-map';
+import { deprecatedCore as deprecatedIconLabCore, deprecatedUtility as deprecatedIconLabUtility } from '@atlaskit/icon-lab/deprecated-map';
 import { deprecatedCore as deprecatedIconCore, deprecatedUtility as deprecatedIconUtility } from '@atlaskit/icon/deprecated-map';
 export const getConfig = specifier => {
   const configPath = path.resolve(__dirname, '..', '..', '..', 'configs', 'deprecated.json');
@@ -12,7 +12,8 @@ export const getConfig = specifier => {
       ...parsedConfig.imports,
       ...deprecatedIconCore,
       ...deprecatedIconUtility,
-      ...deprecatedIconLabCore
+      ...deprecatedIconLabCore,
+      ...deprecatedIconLabUtility
     }
   };
   return combinedConfig[specifier];

package/dist/esm/presets/all-flat.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c6c896451f2be4d48f04068f5bbb85f1>>
+ * @codegen <<SignedSource::5ceb45b21744434ca96a850461a3c574>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -12,6 +12,7 @@ export default {
     '@atlaskit/design-system/ensure-design-token-usage': 'error',
     '@atlaskit/design-system/ensure-design-token-usage/preview': 'warn',
     '@atlaskit/design-system/ensure-icon-color': 'error',
+    '@atlaskit/design-system/ensure-proper-xcss-usage': 'error',
     '@atlaskit/design-system/icon-label': 'warn',
     '@atlaskit/design-system/no-banned-imports': 'error',
     '@atlaskit/design-system/no-boolean-autofocus-on-modal-dialog': 'warn',
@@ -47,6 +48,7 @@ export default {
     '@atlaskit/design-system/no-unsafe-design-token-usage': 'error',
     '@atlaskit/design-system/no-unsafe-style-overrides': 'warn',
     '@atlaskit/design-system/no-unsupported-drag-and-drop-libraries': 'error',
+    '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/prefer-primitives': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',

package/dist/esm/presets/all.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::d4de619ac262298b2af11f905a02b0dd>>
+ * @codegen <<SignedSource::b96d8bb5115de6e0a230feef152a1365>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -11,6 +11,7 @@ export default {
     '@atlaskit/design-system/ensure-design-token-usage': 'error',
     '@atlaskit/design-system/ensure-design-token-usage/preview': 'warn',
     '@atlaskit/design-system/ensure-icon-color': 'error',
+    '@atlaskit/design-system/ensure-proper-xcss-usage': 'error',
     '@atlaskit/design-system/icon-label': 'warn',
     '@atlaskit/design-system/no-banned-imports': 'error',
     '@atlaskit/design-system/no-boolean-autofocus-on-modal-dialog': 'warn',
@@ -46,6 +47,7 @@ export default {
     '@atlaskit/design-system/no-unsafe-design-token-usage': 'error',
     '@atlaskit/design-system/no-unsafe-style-overrides': 'warn',
     '@atlaskit/design-system/no-unsupported-drag-and-drop-libraries': 'error',
+    '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/prefer-primitives': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',

package/dist/esm/presets/recommended-flat.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::af96131434aa77c7882ceb200e4e2cf1>>
+ * @codegen <<SignedSource::10f372e16c048db9bfb1bc36cf48421c>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -36,6 +36,7 @@ export default {
     '@atlaskit/design-system/no-unsafe-design-token-usage': 'error',
     '@atlaskit/design-system/no-unsafe-style-overrides': 'warn',
     '@atlaskit/design-system/no-unsupported-drag-and-drop-libraries': 'error',
+    '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',
     '@atlaskit/design-system/use-datetime-picker-calendar-button': 'warn',

package/dist/esm/presets/recommended.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::4bb65ab8e5c1cad968c6e74d7179e58b>>
+ * @codegen <<SignedSource::608f46f9cc8653226152a8edc34849d6>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 
@@ -35,6 +35,7 @@ export default {
     '@atlaskit/design-system/no-unsafe-design-token-usage': 'error',
     '@atlaskit/design-system/no-unsafe-style-overrides': 'warn',
     '@atlaskit/design-system/no-unsupported-drag-and-drop-libraries': 'error',
+    '@atlaskit/design-system/no-utility-icons': 'warn',
     '@atlaskit/design-system/use-button-group-label': 'warn',
     '@atlaskit/design-system/use-cx-function-in-xcss': 'error',
     '@atlaskit/design-system/use-datetime-picker-calendar-button': 'warn',

package/dist/esm/rules/ensure-proper-xcss-usage/index.js

@@ -0,0 +1,151 @@
+import { isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
+import { errorBoundary } from '../utils/error-boundary';
+var rule = createLintRule({
+  meta: {
+    name: 'ensure-proper-xcss-usage',
+    docs: {
+      description: 'Enforces proper xcss usage: migrate from xcss() to cssMap() and use cssMap objects with specific keys.',
+      recommended: false,
+      severity: 'error'
+    },
+    messages: {
+      missingCssMapKey: 'xcss prop should use a specific key from cssMap (e.g., {{identifier}}.root) instead of the entire cssMap object.',
+      noXcssWithCompiled: 'Cannot use `xcss()` function with `@atlaskit/primitives/compiled`. Use `cssMap()` from `@atlaskit/css or `@compiled/react` instead.'
+    }
+  },
+  create: function create(context) {
+    var tracker = {
+      // Components tracking
+      compiledComponents: new Set(),
+      // Function tracking
+      cssMapFunction: new Set(),
+      xcssFunction: new Set(),
+      // Variables tracking
+      cssMapVariables: new Map(),
+      xcssVariables: new Set()
+    };
+    return errorBoundary({
+      // Track all imports in a single handler
+      ImportDeclaration: function ImportDeclaration(node) {
+        var source = node.source.value;
+        node.specifiers.forEach(function (specifier) {
+          if (specifier.type !== 'ImportSpecifier') {
+            return;
+          }
+
+          // Handle different import sources
+          switch (source) {
+            case '@atlaskit/primitives/compiled':
+              tracker.compiledComponents.add(specifier.imported.name);
+              break;
+            case '@atlaskit/primitives':
+              if (specifier.imported.name === 'xcss') {
+                tracker.xcssFunction.add(specifier.local.name);
+              }
+              break;
+            case '@atlaskit/css':
+            case '@compiled/react':
+              if (specifier.imported.name === 'cssMap') {
+                tracker.cssMapFunction.add(specifier.local.name);
+              }
+              break;
+          }
+        });
+      },
+      // Track variable declarations
+      VariableDeclarator: function VariableDeclarator(node) {
+        if (!node.init || node.init.type !== 'CallExpression' || node.init.callee.type !== 'Identifier' || node.id.type !== 'Identifier') {
+          return;
+        }
+        var calleeName = node.init.callee.name;
+        var variableName = node.id.name;
+
+        // Track cssMap variables and extract their keys
+        if (tracker.cssMapFunction.has(calleeName)) {
+          var keys = new Set();
+
+          // Extract keys from the cssMap object argument
+          if (node.init.arguments.length > 0 && node.init.arguments[0].type === 'ObjectExpression') {
+            node.init.arguments[0].properties.forEach(function (prop) {
+              if (prop.type === 'Property' && prop.key.type === 'Identifier') {
+                keys.add(prop.key.name);
+              }
+            });
+          }
+          tracker.cssMapVariables.set(variableName, keys);
+        }
+
+        // Track xcss variables
+        if (tracker.xcssFunction.has(calleeName)) {
+          tracker.xcssVariables.add(variableName);
+        }
+      },
+      // Check JSX elements for xcss prop usage
+      JSXElement: function JSXElement(node) {
+        var _xcssAttribute$value;
+        if (!isNodeOfType(node, 'JSXElement')) {
+          return;
+        }
+        var elementName = node.openingElement.name;
+        if (elementName.type !== 'JSXIdentifier') {
+          return;
+        }
+        var componentName = elementName.name;
+        if (!tracker.compiledComponents.has(componentName)) {
+          return;
+        }
+
+        // Find xcss attribute
+        var xcssAttribute = node.openingElement.attributes.find(function (attr) {
+          return attr.type === 'JSXAttribute' && attr.name.name === 'xcss';
+        });
+        if ((xcssAttribute === null || xcssAttribute === void 0 || (_xcssAttribute$value = xcssAttribute.value) === null || _xcssAttribute$value === void 0 ? void 0 : _xcssAttribute$value.type) !== 'JSXExpressionContainer') {
+          return;
+        }
+        var expression = xcssAttribute.value.expression;
+
+        // Check for direct xcss function calls
+        if (expression.type === 'CallExpression' && expression.callee.type === 'Identifier' && tracker.xcssFunction.has(expression.callee.name)) {
+          context.report({
+            node: expression,
+            messageId: 'noXcssWithCompiled'
+          });
+          return;
+        }
+
+        // Check for variables
+        if (expression.type === 'Identifier') {
+          var identifierName = expression.name;
+          if (tracker.xcssVariables.has(identifierName)) {
+            context.report({
+              node: expression,
+              messageId: 'noXcssWithCompiled'
+            });
+          } else if (tracker.cssMapVariables.has(identifierName)) {
+            context.report({
+              node: expression,
+              messageId: 'missingCssMapKey',
+              data: {
+                identifier: identifierName
+              }
+            });
+          }
+          return;
+        }
+
+        // Check member expressions (e.g., styles.root)
+        if (expression.type === 'MemberExpression' && expression.object.type === 'Identifier') {
+          var objectName = expression.object.name;
+          if (tracker.xcssVariables.has(objectName)) {
+            context.report({
+              node: expression,
+              messageId: 'noXcssWithCompiled'
+            });
+          }
+        }
+      }
+    });
+  }
+});
+export default rule;

package/dist/esm/rules/index.codegen.js

@@ -1,12 +1,13 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::d42e0ce93d45d02a5c30dcfdb7110c17>>
+ * @codegen <<SignedSource::3de5d5b44aa01faabdb840bc7fb43d04>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 import consistentCssPropUsage from './consistent-css-prop-usage';
 import ensureDesignTokenUsage from './ensure-design-token-usage';
 import ensureDesignTokenUsagePreview from './ensure-design-token-usage-preview';
 import ensureIconColor from './ensure-icon-color';
+import ensureProperXcssUsage from './ensure-proper-xcss-usage';
 import iconLabel from './icon-label';
 import noBannedImports from './no-banned-imports';
 import noBooleanAutofocusOnModalDialog from './no-boolean-autofocus-on-modal-dialog';
@@ -43,6 +44,7 @@ import noStyledTaggedTemplateExpression from './no-styled-tagged-template-expres
 import noUnsafeDesignTokenUsage from './no-unsafe-design-token-usage';
 import noUnsafeStyleOverrides from './no-unsafe-style-overrides';
 import noUnsupportedDragAndDropLibraries from './no-unsupported-drag-and-drop-libraries';
+import noUtilityIcons from './no-utility-icons';
 import preferPrimitives from './prefer-primitives';
 import useButtonGroupLabel from './use-button-group-label';
 import useCxFunctionInXcss from './use-cx-function-in-xcss';
@@ -69,6 +71,7 @@ export var rules = {
   'ensure-design-token-usage': ensureDesignTokenUsage,
   'ensure-design-token-usage/preview': ensureDesignTokenUsagePreview,
   'ensure-icon-color': ensureIconColor,
+  'ensure-proper-xcss-usage': ensureProperXcssUsage,
   'icon-label': iconLabel,
   'no-banned-imports': noBannedImports,
   'no-boolean-autofocus-on-modal-dialog': noBooleanAutofocusOnModalDialog,
@@ -105,6 +108,7 @@ export var rules = {
   'no-unsafe-design-token-usage': noUnsafeDesignTokenUsage,
   'no-unsafe-style-overrides': noUnsafeStyleOverrides,
   'no-unsupported-drag-and-drop-libraries': noUnsupportedDragAndDropLibraries,
+  'no-utility-icons': noUtilityIcons,
   'prefer-primitives': preferPrimitives,
   'use-button-group-label': useButtonGroupLabel,
   'use-cx-function-in-xcss': useCxFunctionInXcss,

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

@@ -14,6 +14,8 @@ export var createChecks = function createChecks(context) {
   var legacyButtonImports = new Set();
   var errorsManual = {};
   var errorsAuto = {};
+  var iconSizesInfo = {}; //Import source key, locations as value
+
   var guidance = {};
 
   // Extract parameters
@@ -385,6 +387,7 @@ export var createChecks = function createChecks(context) {
 
     // Legacy icons rendered as JSX elements
     if (Object.keys(legacyIconImports).includes(name)) {
+      var _sizeProp$value2;
       // Determine if inside a new button - if so:
       // - Assume spread props are safe - still error if props explicitly set to unmigratable values
       var insideNewButton = isInsideNewButton(node, newButtonImports);
@@ -483,7 +486,7 @@ export var createChecks = function createChecks(context) {
       var isNewIconMigratable = canAutoMigrateNewIconBasedOnSize(upcomingIcon ? upcomingIcon.sizeGuidance[size !== null && size !== void 0 ? size : 'medium'] : migrationMapObject === null || migrationMapObject === void 0 ? void 0 : migrationMapObject.sizeGuidance[size !== null && size !== void 0 ? size : 'medium']);
 
       // Add spacing if:
-      // 1. size is medium for core/utility icons or small for utility icons, or not set (default is medium for core and small for utility icons)
+      // 1. size is medium for core/utility icons or not set (default is medium for core and small for utility icons)
       // 2. not inside a new or legacy button (except for icon-only legacy buttons)
       var sizeProp = node.openingElement.attributes.find(function (attribute) {
         return attribute.type === 'JSXAttribute' && (attribute.name.name === 'size' || attribute.name.name === 'LEGACY_size');
@@ -494,13 +497,24 @@ export var createChecks = function createChecks(context) {
         if (sizeProp && sizeProp.type === 'JSXAttribute' && ((_sizeProp$value = sizeProp.value) === null || _sizeProp$value === void 0 ? void 0 : _sizeProp$value.type) === 'Literal') {
           if (sizeProp.value.value === 'medium') {
             spacing = 'spacious';
-          } else if (sizeProp.value.value === 'small' && (newIcon === null || newIcon === void 0 ? void 0 : newIcon.type) === 'utility') {
-            spacing = 'compact';
           }
         } else if (!sizeProp) {
           spacing = 'spacious';
         }
       }
+      if (!iconSizesInfo[legacyIconImports[name].packageName]) {
+        iconSizesInfo[legacyIconImports[name].packageName] = {
+          small: [],
+          usageCount: 0
+        };
+      }
+
+      // Do not automatically migration if size is small as we cannot determine if a core icon or a scaled down utility icon should be used
+      if (sizeProp && sizeProp.type === 'JSXAttribute' && ((_sizeProp$value2 = sizeProp.value) === null || _sizeProp$value2 === void 0 ? void 0 : _sizeProp$value2.type) === 'Literal' && sizeProp.value.value === 'small') {
+        iconSizesInfo[legacyIconImports[name].packageName].small.push(locToString(node));
+      }
+      iconSizesInfo[legacyIconImports[name].packageName].usageCount++;
+      var shouldForceSmallIcon = newIcon === null || newIcon === void 0 ? void 0 : newIcon.shouldForceSmallIcon;
       if (shouldUseSafeMigrationMode && !hasManualMigration && (newIcon !== null && newIcon !== void 0 && newIcon.isMigrationUnsafe || size !== 'medium' || hasSecondaryColorProp)) {
         createCantFindSuitableReplacementError(node, legacyIconImports[name].packageName, name, errorsManual, upcomingIcon ? true : migrationMapObject ? true : false);
       } else if (!hasManualMigration && (newIcon || upcomingIcon) && isNewIconMigratable) {
@@ -510,7 +524,8 @@ export var createChecks = function createChecks(context) {
           iconName: name,
           errors: errorsAuto,
           spacing: spacing,
-          insideNewButton: insideNewButton
+          insideNewButton: insideNewButton,
+          shouldForceSmallIcon: shouldForceSmallIcon
         });
       } else if ((!newIcon && !upcomingIcon || !isNewIconMigratable) && size) {
         createCantFindSuitableReplacementError(node, legacyIconImports[name].packageName, name, errorsManual, upcomingIcon ? true : migrationMapObject ? true : false);
@@ -520,7 +535,8 @@ export var createChecks = function createChecks(context) {
         iconPackage: legacyIconImports[name].packageName,
         insideNewButton: insideNewButton,
         size: size && isSize(size) ? size : undefined,
-        shouldUseMigrationPath: shouldUseMigrationPath
+        shouldUseMigrationPath: shouldUseMigrationPath,
+        shouldForceSmallIcon: shouldForceSmallIcon
       });
     }
   };
@@ -571,6 +587,7 @@ export var createChecks = function createChecks(context) {
       throwAutoErrors({
         errorsManual: errorsManual,
         errorsAuto: errorsAuto,
+        iconSizesInfo: iconSizesInfo,
         legacyIconImports: legacyIconImports,
         guidance: guidance,
         migrationIconImports: migrationIconImports,