@atlaskit/eslint-plugin-design-system 10.22.0 → 10.22.1

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/eslint-plugin-design-system
 
+## 10.22.1
+
+### Patch Changes
+
+- [#153007](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/153007)
+  [`89e8b9b297149`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/89e8b9b297149) -
+  Update `ensure-design-token-usage` rule to avoid false positive with Icon Tile component
+
 ## 10.22.0
 
 ### Minor Changes

package/dist/cjs/rules/ensure-design-token-usage/color.js

@@ -148,7 +148,7 @@ var lintJSXLiteralForColor = exports.lintJSXLiteralForColor = function lintJSXLi
   if ((0, _isNode.isDecendantOfPrimitive)(node.parent, context)) {
     return;
   }
-  if (['alt', 'src', 'label', 'key'].includes(node.parent.name.name)) {
+  if (['alt', 'src', 'label', 'key', 'appearance'].includes(node.parent.name.name)) {
     return;
   }
   var isException = (0, _getIsException.getIsException)(config.exceptions);

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

@@ -392,14 +392,14 @@ var createChecks = exports.createChecks = function createChecks(context) {
         importSource: migrationIconImports[name].packageName,
         iconName: name,
         errors: errorsAuto,
-        shouldAddSpaciousSpacing: shouldAddSpaciousSpacing,
+        spacing: shouldAddSpaciousSpacing ? 'spacious' : undefined,
         insideNewButton: insideNewButton
       });
     }
 
     // Legacy icons rendered as JSX elements
     if (Object.keys(legacyIconImports).includes(name)) {
-      var _size, _size2, _sizeProp$value2;
+      var _size, _size2;
       // Determine if inside a new button - if so:
       // - Assume spread props are safe - still error if props explicitly set to unmigratable values
       var _insideNewButton = (0, _helpers.isInsideNewButton)(node, newButtonImports);
@@ -488,20 +488,32 @@ var createChecks = exports.createChecks = function createChecks(context) {
       var newIcon = migrationMapObject === null || migrationMapObject === void 0 ? void 0 : migrationMapObject.newIcon;
       var isNewIconMigratable = (0, _helpers.canAutoMigrateNewIconBasedOnSize)(upcomingIcon ? upcomingIcon.sizeGuidance[(_size = size) !== null && _size !== void 0 ? _size : 'medium'] : migrationMapObject === null || migrationMapObject === void 0 ? void 0 : migrationMapObject.sizeGuidance[(_size2 = size) !== null && _size2 !== void 0 ? _size2 : 'medium']);
 
-      // Add spacious spacing if:
-      // 1. size is medium, or not set (default is 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)
       // 2. not inside a new or legacy button
       var _sizeProp = node.openingElement.attributes.find(function (attribute) {
         return attribute.type === 'JSXAttribute' && (attribute.name.name === 'size' || attribute.name.name === 'LEGACY_size');
       });
-      var _shouldAddSpaciousSpacing = (_sizeProp && _sizeProp.type === 'JSXAttribute' && ((_sizeProp$value2 = _sizeProp.value) === null || _sizeProp$value2 === void 0 ? void 0 : _sizeProp$value2.type) === 'Literal' && _sizeProp.value.value === 'medium' || !_sizeProp) && !_insideNewButton && !insideLegacyButton;
+      var spacing;
+      if (!_insideNewButton && !insideLegacyButton) {
+        var _sizeProp$value2;
+        if (_sizeProp && _sizeProp.type === 'JSXAttribute' && ((_sizeProp$value2 = _sizeProp.value) === null || _sizeProp$value2 === void 0 ? void 0 : _sizeProp$value2.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 (!hasManualMigration && (newIcon || upcomingIcon) && isNewIconMigratable) {
         (0, _helpers.createAutoMigrationError)({
           node: node,
           importSource: legacyIconImports[name].packageName,
           iconName: name,
           errors: errorsAuto,
-          shouldAddSpaciousSpacing: _shouldAddSpaciousSpacing,
+          spacing: spacing,
           insideNewButton: _insideNewButton
         });
       } else if ((!newIcon && !upcomingIcon || !isNewIconMigratable) && size) {

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

@@ -279,7 +279,7 @@ var createAutoMigrationError = exports.createAutoMigrationError = function creat
     importSource = _ref4.importSource,
     iconName = _ref4.iconName,
     errors = _ref4.errors,
-    shouldAddSpaciousSpacing = _ref4.shouldAddSpaciousSpacing,
+    spacing = _ref4.spacing,
     insideNewButton = _ref4.insideNewButton;
   var myError = {
     node: node,
@@ -287,7 +287,7 @@ var createAutoMigrationError = exports.createAutoMigrationError = function creat
     data: {
       importSource: importSource,
       iconName: iconName,
-      spacing: shouldAddSpaciousSpacing ? 'spacious' : '',
+      spacing: spacing !== null && spacing !== void 0 ? spacing : '',
       // value type need to be a string in Rule.ReportDescriptor
       insideNewButton: String(insideNewButton)
     }
@@ -480,14 +480,11 @@ var createPropFixes = function createPropFixes(_ref7) {
     migrationImportNode = _ref7.migrationImportNode,
     newIconName = _ref7.newIconName;
   var fixes = [];
-  var importSource = metadata.importSource,
-    spacing = metadata.spacing,
+  var spacing = metadata.spacing,
     insideNewButton = metadata.insideNewButton;
   if (shouldUseMigrationPath && !legacyImportNode) {
     return fixes;
   }
-  var importPath = migrationImportNode ? importSource.replace('/migration', '').split('--')[0] : getNewIconNameAndImportPath(importSource, shouldUseMigrationPath).importPath;
-  var iconType = importPath !== null && importPath !== void 0 && importPath.startsWith('@atlaskit/icon/core') ? 'core' : 'utility';
   if (node.type === 'JSXElement') {
     var openingElement = node.openingElement;
     if (newIconName) {
@@ -519,7 +516,7 @@ var createPropFixes = function createPropFixes(_ref7) {
     // 4. icon is not imported from migration entrypoint
     var sizeProp = findProp(attributes, 'size');
     var spacingProp = findProp(attributes, 'spacing');
-    if (spacing && !spacingProp && iconType === 'core' && !migrationImportNode) {
+    if (spacing && !spacingProp && !migrationImportNode) {
       fixes.push(fixer.insertTextAfter(sizeProp || openingElement.name, " spacing=\"".concat(spacing, "\"")));
     }
     if (sizeProp && sizeProp.type === 'JSXAttribute') {

package/dist/es2019/rules/ensure-design-token-usage/color.js

@@ -143,7 +143,7 @@ export const lintJSXLiteralForColor = (node, context, config) => {
   if (isDecendantOfPrimitive(node.parent, context)) {
     return;
   }
-  if (['alt', 'src', 'label', 'key'].includes(node.parent.name.name)) {
+  if (['alt', 'src', 'label', 'key', 'appearance'].includes(node.parent.name.name)) {
     return;
   }
   const isException = getIsException(config.exceptions);

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

@@ -315,14 +315,14 @@ export const createChecks = context => {
         importSource: migrationIconImports[name].packageName,
         iconName: name,
         errors: errorsAuto,
-        shouldAddSpaciousSpacing,
+        spacing: shouldAddSpaciousSpacing ? 'spacious' : undefined,
         insideNewButton
       });
     }
 
     // Legacy icons rendered as JSX elements
     if (Object.keys(legacyIconImports).includes(name)) {
-      var _size, _size2, _sizeProp$value2;
+      var _size, _size2;
       // Determine if inside a new button - if so:
       // - Assume spread props are safe - still error if props explicitly set to unmigratable values
       const insideNewButton = isInsideNewButton(node, newButtonImports);
@@ -398,18 +398,30 @@ export const createChecks = context => {
       const newIcon = migrationMapObject === null || migrationMapObject === void 0 ? void 0 : migrationMapObject.newIcon;
       const isNewIconMigratable = canAutoMigrateNewIconBasedOnSize(upcomingIcon ? upcomingIcon.sizeGuidance[(_size = size) !== null && _size !== void 0 ? _size : 'medium'] : migrationMapObject === null || migrationMapObject === void 0 ? void 0 : migrationMapObject.sizeGuidance[(_size2 = size) !== null && _size2 !== void 0 ? _size2 : 'medium']);
 
-      // Add spacious spacing if:
-      // 1. size is medium, or not set (default is 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)
       // 2. not inside a new or legacy button
       const sizeProp = node.openingElement.attributes.find(attribute => attribute.type === 'JSXAttribute' && (attribute.name.name === 'size' || attribute.name.name === 'LEGACY_size'));
-      const shouldAddSpaciousSpacing = (sizeProp && sizeProp.type === 'JSXAttribute' && ((_sizeProp$value2 = sizeProp.value) === null || _sizeProp$value2 === void 0 ? void 0 : _sizeProp$value2.type) === 'Literal' && sizeProp.value.value === 'medium' || !sizeProp) && !insideNewButton && !insideLegacyButton;
+      let spacing;
+      if (!insideNewButton && !insideLegacyButton) {
+        var _sizeProp$value2;
+        if (sizeProp && sizeProp.type === 'JSXAttribute' && ((_sizeProp$value2 = sizeProp.value) === null || _sizeProp$value2 === void 0 ? void 0 : _sizeProp$value2.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 (!hasManualMigration && (newIcon || upcomingIcon) && isNewIconMigratable) {
         createAutoMigrationError({
           node,
           importSource: legacyIconImports[name].packageName,
           iconName: name,
           errors: errorsAuto,
-          shouldAddSpaciousSpacing,
+          spacing,
           insideNewButton
         });
       } else if ((!newIcon && !upcomingIcon || !isNewIconMigratable) && size) {

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

@@ -257,7 +257,7 @@ export const createAutoMigrationError = ({
   importSource,
   iconName,
   errors,
-  shouldAddSpaciousSpacing,
+  spacing,
   insideNewButton
 }) => {
   const myError = {
@@ -266,7 +266,7 @@ export const createAutoMigrationError = ({
     data: {
       importSource,
       iconName,
-      spacing: shouldAddSpaciousSpacing ? 'spacious' : '',
+      spacing: spacing !== null && spacing !== void 0 ? spacing : '',
       // value type need to be a string in Rule.ReportDescriptor
       insideNewButton: String(insideNewButton)
     }
@@ -462,15 +462,12 @@ const createPropFixes = ({
 }) => {
   const fixes = [];
   const {
-    importSource,
     spacing,
     insideNewButton
   } = metadata;
   if (shouldUseMigrationPath && !legacyImportNode) {
     return fixes;
   }
-  const importPath = migrationImportNode ? importSource.replace('/migration', '').split('--')[0] : getNewIconNameAndImportPath(importSource, shouldUseMigrationPath).importPath;
-  const iconType = importPath !== null && importPath !== void 0 && importPath.startsWith('@atlaskit/icon/core') ? 'core' : 'utility';
   if (node.type === 'JSXElement') {
     const {
       openingElement
@@ -506,7 +503,7 @@ const createPropFixes = ({
     // 4. icon is not imported from migration entrypoint
     const sizeProp = findProp(attributes, 'size');
     const spacingProp = findProp(attributes, 'spacing');
-    if (spacing && !spacingProp && iconType === 'core' && !migrationImportNode) {
+    if (spacing && !spacingProp && !migrationImportNode) {
       fixes.push(fixer.insertTextAfter(sizeProp || openingElement.name, ` spacing="${spacing}"`));
     }
     if (sizeProp && sizeProp.type === 'JSXAttribute') {

package/dist/esm/rules/ensure-design-token-usage/color.js

@@ -142,7 +142,7 @@ export var lintJSXLiteralForColor = function lintJSXLiteralForColor(node, contex
   if (isDecendantOfPrimitive(node.parent, context)) {
     return;
   }
-  if (['alt', 'src', 'label', 'key'].includes(node.parent.name.name)) {
+  if (['alt', 'src', 'label', 'key', 'appearance'].includes(node.parent.name.name)) {
     return;
   }
   var isException = getIsException(config.exceptions);

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

@@ -386,14 +386,14 @@ export var createChecks = function createChecks(context) {
         importSource: migrationIconImports[name].packageName,
         iconName: name,
         errors: errorsAuto,
-        shouldAddSpaciousSpacing: shouldAddSpaciousSpacing,
+        spacing: shouldAddSpaciousSpacing ? 'spacious' : undefined,
         insideNewButton: insideNewButton
       });
     }
 
     // Legacy icons rendered as JSX elements
     if (Object.keys(legacyIconImports).includes(name)) {
-      var _size, _size2, _sizeProp$value2;
+      var _size, _size2;
       // 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);
@@ -482,20 +482,32 @@ export var createChecks = function createChecks(context) {
       var newIcon = migrationMapObject === null || migrationMapObject === void 0 ? void 0 : migrationMapObject.newIcon;
       var isNewIconMigratable = canAutoMigrateNewIconBasedOnSize(upcomingIcon ? upcomingIcon.sizeGuidance[(_size = size) !== null && _size !== void 0 ? _size : 'medium'] : migrationMapObject === null || migrationMapObject === void 0 ? void 0 : migrationMapObject.sizeGuidance[(_size2 = size) !== null && _size2 !== void 0 ? _size2 : 'medium']);
 
-      // Add spacious spacing if:
-      // 1. size is medium, or not set (default is 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)
       // 2. not inside a new or legacy button
       var _sizeProp = node.openingElement.attributes.find(function (attribute) {
         return attribute.type === 'JSXAttribute' && (attribute.name.name === 'size' || attribute.name.name === 'LEGACY_size');
       });
-      var _shouldAddSpaciousSpacing = (_sizeProp && _sizeProp.type === 'JSXAttribute' && ((_sizeProp$value2 = _sizeProp.value) === null || _sizeProp$value2 === void 0 ? void 0 : _sizeProp$value2.type) === 'Literal' && _sizeProp.value.value === 'medium' || !_sizeProp) && !_insideNewButton && !insideLegacyButton;
+      var spacing;
+      if (!_insideNewButton && !insideLegacyButton) {
+        var _sizeProp$value2;
+        if (_sizeProp && _sizeProp.type === 'JSXAttribute' && ((_sizeProp$value2 = _sizeProp.value) === null || _sizeProp$value2 === void 0 ? void 0 : _sizeProp$value2.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 (!hasManualMigration && (newIcon || upcomingIcon) && isNewIconMigratable) {
         createAutoMigrationError({
           node: node,
           importSource: legacyIconImports[name].packageName,
           iconName: name,
           errors: errorsAuto,
-          shouldAddSpaciousSpacing: _shouldAddSpaciousSpacing,
+          spacing: spacing,
           insideNewButton: _insideNewButton
         });
       } else if ((!newIcon && !upcomingIcon || !isNewIconMigratable) && size) {

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

@@ -269,7 +269,7 @@ export var createAutoMigrationError = function createAutoMigrationError(_ref4) {
     importSource = _ref4.importSource,
     iconName = _ref4.iconName,
     errors = _ref4.errors,
-    shouldAddSpaciousSpacing = _ref4.shouldAddSpaciousSpacing,
+    spacing = _ref4.spacing,
     insideNewButton = _ref4.insideNewButton;
   var myError = {
     node: node,
@@ -277,7 +277,7 @@ export var createAutoMigrationError = function createAutoMigrationError(_ref4) {
     data: {
       importSource: importSource,
       iconName: iconName,
-      spacing: shouldAddSpaciousSpacing ? 'spacious' : '',
+      spacing: spacing !== null && spacing !== void 0 ? spacing : '',
       // value type need to be a string in Rule.ReportDescriptor
       insideNewButton: String(insideNewButton)
     }
@@ -470,14 +470,11 @@ var createPropFixes = function createPropFixes(_ref7) {
     migrationImportNode = _ref7.migrationImportNode,
     newIconName = _ref7.newIconName;
   var fixes = [];
-  var importSource = metadata.importSource,
-    spacing = metadata.spacing,
+  var spacing = metadata.spacing,
     insideNewButton = metadata.insideNewButton;
   if (shouldUseMigrationPath && !legacyImportNode) {
     return fixes;
   }
-  var importPath = migrationImportNode ? importSource.replace('/migration', '').split('--')[0] : getNewIconNameAndImportPath(importSource, shouldUseMigrationPath).importPath;
-  var iconType = importPath !== null && importPath !== void 0 && importPath.startsWith('@atlaskit/icon/core') ? 'core' : 'utility';
   if (node.type === 'JSXElement') {
     var openingElement = node.openingElement;
     if (newIconName) {
@@ -509,7 +506,7 @@ var createPropFixes = function createPropFixes(_ref7) {
     // 4. icon is not imported from migration entrypoint
     var sizeProp = findProp(attributes, 'size');
     var spacingProp = findProp(attributes, 'spacing');
-    if (spacing && !spacingProp && iconType === 'core' && !migrationImportNode) {
+    if (spacing && !spacingProp && !migrationImportNode) {
       fixes.push(fixer.insertTextAfter(sizeProp || openingElement.name, " spacing=\"".concat(spacing, "\"")));
     }
     if (sizeProp && sizeProp.type === 'JSXAttribute') {

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

@@ -87,12 +87,12 @@ export declare const createCantMigrateFunctionUnknownError: (node: Node, importS
 export declare const createCantMigrateColorError: (node: Node, colorValue: string, errors: ErrorListManual, importSource: string, iconName: string) => void;
 export declare const createCantMigrateSpreadPropsError: (node: Node, missingProps: string[], errors: ErrorListManual, importSource: string, iconName: string) => void;
 export declare const createCantMigrateSizeUnknown: (node: Node, errors: ErrorListManual, importSource: string, iconName: string) => void;
-export declare const createAutoMigrationError: ({ node, importSource, iconName, errors, shouldAddSpaciousSpacing, insideNewButton, }: {
+export declare const createAutoMigrationError: ({ node, importSource, iconName, errors, spacing, insideNewButton, }: {
     node: Node;
     importSource: string;
     iconName: string;
     errors: ErrorListAuto;
-    shouldAddSpaciousSpacing?: boolean | undefined;
+    spacing?: string | undefined;
     insideNewButton?: boolean | undefined;
 }) => void;
 export declare const createHelpers: (context: Rule.RuleContext) => {

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

@@ -92,12 +92,12 @@ export declare const createCantMigrateFunctionUnknownError: (node: Node, importS
 export declare const createCantMigrateColorError: (node: Node, colorValue: string, errors: ErrorListManual, importSource: string, iconName: string) => void;
 export declare const createCantMigrateSpreadPropsError: (node: Node, missingProps: string[], errors: ErrorListManual, importSource: string, iconName: string) => void;
 export declare const createCantMigrateSizeUnknown: (node: Node, errors: ErrorListManual, importSource: string, iconName: string) => void;
-export declare const createAutoMigrationError: ({ node, importSource, iconName, errors, shouldAddSpaciousSpacing, insideNewButton, }: {
+export declare const createAutoMigrationError: ({ node, importSource, iconName, errors, spacing, insideNewButton, }: {
     node: Node;
     importSource: string;
     iconName: string;
     errors: ErrorListAuto;
-    shouldAddSpaciousSpacing?: boolean | undefined;
+    spacing?: string | undefined;
     insideNewButton?: boolean | undefined;
 }) => void;
 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.22.0",
+	"version": "10.22.1",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
 	"publishConfig": {
@@ -41,7 +41,7 @@
 	},
 	"dependencies": {
 		"@atlaskit/eslint-utils": "^1.7.0",
-		"@atlaskit/icon": "^22.20.0",
+		"@atlaskit/icon": "^22.22.0",
 		"@atlaskit/tokens": "*",
 		"@babel/runtime": "^7.0.0",
 		"@typescript-eslint/utils": "^5.48.1",
@@ -54,8 +54,8 @@
 	},
 	"devDependencies": {
 		"@af/formatting": "*",
-		"@atlaskit/ds-lib": "^2.6.0",
-		"@atlaskit/theme": "^13.0.0",
+		"@atlaskit/ds-lib": "^3.1.0",
+		"@atlaskit/theme": "^13.1.0",
 		"@atlassian/codegen": "*",
 		"@atlassian/eslint-utils": "^0.5.0",
 		"@atlassian/ts-loader": "*",