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

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

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::310e184a1b8eca0da1246cfe8d128e2c>>
+ * @codegen <<SignedSource::47f018ad98455be31dc522bcf5360adf>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -29,6 +29,7 @@ export default {
     '@atlaskit/design-system/no-margin': 'warn',
     '@atlaskit/design-system/no-nested-styles': 'error',
     '@atlaskit/design-system/no-physical-properties': 'error',
+    '@atlaskit/design-system/no-separator-with-list-elements': 'warn',
     '@atlaskit/design-system/no-styled-tagged-template-expression': 'error',
     '@atlaskit/design-system/no-unsafe-design-token-usage': 'error',
     '@atlaskit/design-system/no-unsafe-style-overrides': 'warn',

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

@@ -0,0 +1,39 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::9c6dda34a88386c4fa5b931ab4baf929>>
+ * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
+ */
+export default {
+  // NOTE: The reference to this plugin is inserted dynamically while creating the plugin in `index.codegen.tsx`
+  plugins: {},
+  rules: {
+    '@atlaskit/design-system/consistent-css-prop-usage': 'error',
+    '@atlaskit/design-system/ensure-design-token-usage': 'error',
+    '@atlaskit/design-system/icon-label': 'warn',
+    '@atlaskit/design-system/no-banned-imports': 'error',
+    '@atlaskit/design-system/no-deprecated-apis': 'error',
+    '@atlaskit/design-system/no-deprecated-design-token-usage': 'warn',
+    '@atlaskit/design-system/no-deprecated-imports': 'error',
+    '@atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop': 'error',
+    '@atlaskit/design-system/no-html-anchor': 'warn',
+    '@atlaskit/design-system/no-html-button': 'warn',
+    '@atlaskit/design-system/no-invalid-css-map': ['error', {
+      allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
+    }],
+    '@atlaskit/design-system/no-nested-styles': 'error',
+    '@atlaskit/design-system/no-separator-with-list-elements': 'warn',
+    '@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/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
+    '@atlaskit/design-system/use-href-in-link-item': 'warn',
+    '@atlaskit/design-system/use-latest-xcss-syntax': 'error',
+    '@atlaskit/design-system/use-latest-xcss-syntax-typography': 'warn',
+    '@atlaskit/design-system/use-menu-section-title': 'warn',
+    '@atlaskit/design-system/use-popup-label': 'warn',
+    '@atlaskit/design-system/use-tag-group-label': 'warn',
+    '@atlaskit/design-system/use-visually-hidden': 'error'
+  }
+};

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

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::9be7e90918082d78473f5d2a2271b15c>>
+ * @codegen <<SignedSource::f1b4aa9e656294739485e62ba4a33f9d>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -20,6 +20,7 @@ export default {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],
     '@atlaskit/design-system/no-nested-styles': 'error',
+    '@atlaskit/design-system/no-separator-with-list-elements': 'warn',
     '@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',

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/index.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::2c61c8c9aa86b4fb1d11e0bcba9d83a1>>
+ * @codegen <<SignedSource::2ab06b34c4e08cd70b0f67f5915f12c9>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 import consistentCssPropUsage from './consistent-css-prop-usage';
@@ -27,6 +27,7 @@ import noLegacyIcons from './no-legacy-icons';
 import noMargin from './no-margin';
 import noNestedStyles from './no-nested-styles';
 import noPhysicalProperties from './no-physical-properties';
+import noSeparatorWithListElements from './no-separator-with-list-elements';
 import noStyledTaggedTemplateExpression from './no-styled-tagged-template-expression';
 import noUnsafeDesignTokenUsage from './no-unsafe-design-token-usage';
 import noUnsafeStyleOverrides from './no-unsafe-style-overrides';
@@ -47,7 +48,7 @@ import useTagGroupLabel from './use-tag-group-label';
 import useTokensSpace from './use-tokens-space';
 import useTokensTypography from './use-tokens-typography';
 import useVisuallyHidden from './use-visually-hidden';
-export default {
+export const rules = {
   'consistent-css-prop-usage': consistentCssPropUsage,
   'ensure-design-token-usage': ensureDesignTokenUsage,
   'ensure-design-token-usage/preview': ensureDesignTokenUsagePreview,
@@ -72,6 +73,7 @@ export default {
   'no-margin': noMargin,
   'no-nested-styles': noNestedStyles,
   'no-physical-properties': noPhysicalProperties,
+  'no-separator-with-list-elements': noSeparatorWithListElements,
   'no-styled-tagged-template-expression': noStyledTaggedTemplateExpression,
   'no-unsafe-design-token-usage': noUnsafeDesignTokenUsage,
   'no-unsafe-style-overrides': noUnsafeStyleOverrides,

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/es2019/rules/no-separator-with-list-elements/index.js

@@ -0,0 +1,50 @@
+import { isNodeOfType } from 'eslint-codemod-utils';
+import { createLintRule } from '../utils/create-rule';
+const separatorAsCombinationNotAllowed = 'The combination of `separator` with `as="li"`, `as="ol"`, or `as="dl"` is not allowed.';
+const rule = createLintRule({
+  meta: {
+    name: 'no-separator-with-list-elements',
+    type: 'suggestion',
+    docs: {
+      description: 'Warn when the `separator` prop is used with `as="li"`, `as="ol"`, or `as="dl"` in the Inline component.',
+      recommended: true,
+      severity: 'warn'
+    },
+    messages: {
+      separatorAsCombinationNotAllowed
+    }
+  },
+  create(context) {
+    const inlineComponentNames = [];
+    return {
+      ImportDeclaration(node) {
+        if (node.type === 'ImportDeclaration' && (node.source.value === '../src' || node.source.value === '@atlaskit/primitives')) {
+          node.specifiers.forEach(specifier => {
+            if (specifier.type === 'ImportSpecifier' && specifier.imported.name === 'Inline') {
+              inlineComponentNames.push(specifier.local.name);
+            }
+          });
+        }
+      },
+      JSXElement(node) {
+        if (!isNodeOfType(node, 'JSXElement') || !isNodeOfType(node.openingElement.name, 'JSXIdentifier')) {
+          return;
+        }
+        const componentName = node.openingElement.name.name;
+        if (!inlineComponentNames.includes(componentName)) {
+          return;
+        }
+        const inlineProps = node.openingElement.attributes.filter(attr => isNodeOfType(attr, 'JSXAttribute') && isNodeOfType(attr.name, 'JSXIdentifier'));
+        const separatorProp = inlineProps.find(attr => attr.name.name === 'separator');
+        const asProp = inlineProps.find(attr => attr.name.name === 'as');
+        if (separatorProp && asProp && asProp.value && isNodeOfType(asProp.value, 'Literal') && ['li', 'ol', 'dl'].includes(asProp.value.value)) {
+          context.report({
+            node: node,
+            messageId: 'separatorAsCombinationNotAllowed'
+          });
+        }
+      }
+    };
+  }
+});
+export default rule;

package/dist/esm/index.codegen.js

@@ -1,12 +1,50 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::abdb6f8b0dfdc4e2489691c04488f46e>>
+ * @codegen <<SignedSource::7656123b732a9145dedb7f9eee588883>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
+import allFlat from './presets/all-flat.codegen';
 import all from './presets/all.codegen';
+import recommendedFlat from './presets/recommended-flat.codegen';
 import recommended from './presets/recommended.codegen';
-export { default as rules } from './rules/index.codegen';
-export var configs = {
-  all: all,
-  recommended: recommended
-};
+import { rules } from './rules/index.codegen';
+
+// this uses require because not all node versions this package supports use the same import assertions/attributes
+var pkgJson = require('../package.json');
+var version = pkgJson.version,
+  name = pkgJson.name;
+export { version, name };
+export var plugin = {
+  meta: {
+    name: name,
+    version: version
+  },
+  rules: rules,
+  // flat configs need to be done like this so they can get a reference to the plugin.
+  // see here: https://eslint.org/docs/latest/extend/plugins#configs-in-plugins
+  // they cannot use `Object.assign` because it will not work with the getter
+  configs: {
+    all: all,
+    'all/flat': _objectSpread(_objectSpread({}, allFlat), {}, {
+      plugins: _objectSpread(_objectSpread({}, allFlat.plugins), {}, {
+        get '@atlaskit/design-system'() {
+          return plugin;
+        }
+      })
+    }),
+    recommended: recommended,
+    'recommended/flat': _objectSpread(_objectSpread({}, recommendedFlat), {}, {
+      plugins: _objectSpread(_objectSpread({}, recommendedFlat.plugins), {}, {
+        get '@atlaskit/design-system'() {
+          return plugin;
+        }
+      })
+    })
+  }
+};
+export { rules } from './rules/index.codegen';
+export var configs = plugin.configs;
+export default plugin;

package/dist/esm/index.js

@@ -1,2 +1,2 @@
-export { configs, rules } from './index.codegen';
+export { version, name, rules, plugin, configs, default } from './index.codegen';
 export { filterActionableDeprecations } from './rules/no-deprecated-apis/helpers/filter-actionable-deprecations';

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

@@ -0,0 +1,55 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::56a9d309ec6f548dce4a4f6e99059a15>>
+ * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
+ */
+export default {
+  // NOTE: The reference to this plugin is inserted dynamically while creating the plugin in `index.codegen.tsx`
+  plugins: {},
+  rules: {
+    '@atlaskit/design-system/consistent-css-prop-usage': 'error',
+    '@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/icon-label': 'warn',
+    '@atlaskit/design-system/no-banned-imports': 'error',
+    '@atlaskit/design-system/no-css-tagged-template-expression': 'error',
+    '@atlaskit/design-system/no-custom-icons': 'warn',
+    '@atlaskit/design-system/no-dark-theme-vr-tests': 'error',
+    '@atlaskit/design-system/no-deprecated-apis': 'error',
+    '@atlaskit/design-system/no-deprecated-design-token-usage': 'warn',
+    '@atlaskit/design-system/no-deprecated-imports': 'error',
+    '@atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop': 'error',
+    '@atlaskit/design-system/no-html-anchor': 'warn',
+    '@atlaskit/design-system/no-html-button': 'warn',
+    '@atlaskit/design-system/no-invalid-css-map': ['error', {
+      allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
+    }],
+    '@atlaskit/design-system/no-keyframes-tagged-template-expression': 'error',
+    '@atlaskit/design-system/no-legacy-icons': 'warn',
+    '@atlaskit/design-system/no-margin': 'warn',
+    '@atlaskit/design-system/no-nested-styles': 'error',
+    '@atlaskit/design-system/no-physical-properties': 'error',
+    '@atlaskit/design-system/no-separator-with-list-elements': 'warn',
+    '@atlaskit/design-system/no-styled-tagged-template-expression': 'error',
+    '@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/prefer-primitives': 'warn',
+    '@atlaskit/design-system/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-heading': 'warn',
+    '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
+    '@atlaskit/design-system/use-href-in-link-item': 'warn',
+    '@atlaskit/design-system/use-latest-xcss-syntax': 'error',
+    '@atlaskit/design-system/use-latest-xcss-syntax-typography': 'warn',
+    '@atlaskit/design-system/use-menu-section-title': 'warn',
+    '@atlaskit/design-system/use-popup-label': 'warn',
+    '@atlaskit/design-system/use-primitives': 'warn',
+    '@atlaskit/design-system/use-primitives-text': 'warn',
+    '@atlaskit/design-system/use-tag-group-label': 'warn',
+    '@atlaskit/design-system/use-tokens-space': 'error',
+    '@atlaskit/design-system/use-tokens-typography': 'warn',
+    '@atlaskit/design-system/use-visually-hidden': '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::310e184a1b8eca0da1246cfe8d128e2c>>
+ * @codegen <<SignedSource::47f018ad98455be31dc522bcf5360adf>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -29,6 +29,7 @@ export default {
     '@atlaskit/design-system/no-margin': 'warn',
     '@atlaskit/design-system/no-nested-styles': 'error',
     '@atlaskit/design-system/no-physical-properties': 'error',
+    '@atlaskit/design-system/no-separator-with-list-elements': 'warn',
     '@atlaskit/design-system/no-styled-tagged-template-expression': 'error',
     '@atlaskit/design-system/no-unsafe-design-token-usage': 'error',
     '@atlaskit/design-system/no-unsafe-style-overrides': 'warn',

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

@@ -0,0 +1,39 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::9c6dda34a88386c4fa5b931ab4baf929>>
+ * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
+ */
+export default {
+  // NOTE: The reference to this plugin is inserted dynamically while creating the plugin in `index.codegen.tsx`
+  plugins: {},
+  rules: {
+    '@atlaskit/design-system/consistent-css-prop-usage': 'error',
+    '@atlaskit/design-system/ensure-design-token-usage': 'error',
+    '@atlaskit/design-system/icon-label': 'warn',
+    '@atlaskit/design-system/no-banned-imports': 'error',
+    '@atlaskit/design-system/no-deprecated-apis': 'error',
+    '@atlaskit/design-system/no-deprecated-design-token-usage': 'warn',
+    '@atlaskit/design-system/no-deprecated-imports': 'error',
+    '@atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop': 'error',
+    '@atlaskit/design-system/no-html-anchor': 'warn',
+    '@atlaskit/design-system/no-html-button': 'warn',
+    '@atlaskit/design-system/no-invalid-css-map': ['error', {
+      allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
+    }],
+    '@atlaskit/design-system/no-nested-styles': 'error',
+    '@atlaskit/design-system/no-separator-with-list-elements': 'warn',
+    '@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/use-button-group-label': 'warn',
+    '@atlaskit/design-system/use-drawer-label': 'warn',
+    '@atlaskit/design-system/use-heading-level-in-spotlight-card': 'warn',
+    '@atlaskit/design-system/use-href-in-link-item': 'warn',
+    '@atlaskit/design-system/use-latest-xcss-syntax': 'error',
+    '@atlaskit/design-system/use-latest-xcss-syntax-typography': 'warn',
+    '@atlaskit/design-system/use-menu-section-title': 'warn',
+    '@atlaskit/design-system/use-popup-label': 'warn',
+    '@atlaskit/design-system/use-tag-group-label': 'warn',
+    '@atlaskit/design-system/use-visually-hidden': 'error'
+  }
+};

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::9be7e90918082d78473f5d2a2271b15c>>
+ * @codegen <<SignedSource::f1b4aa9e656294739485e62ba4a33f9d>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 export default {
@@ -20,6 +20,7 @@ export default {
       allowedFunctionCalls: [['@atlaskit/tokens', 'token']]
     }],
     '@atlaskit/design-system/no-nested-styles': 'error',
+    '@atlaskit/design-system/no-separator-with-list-elements': 'warn',
     '@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',

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/index.codegen.js

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::2c61c8c9aa86b4fb1d11e0bcba9d83a1>>
+ * @codegen <<SignedSource::2ab06b34c4e08cd70b0f67f5915f12c9>>
  * @codegenCommand yarn workspace @atlaskit/eslint-plugin-design-system codegen
  */
 import consistentCssPropUsage from './consistent-css-prop-usage';
@@ -27,6 +27,7 @@ import noLegacyIcons from './no-legacy-icons';
 import noMargin from './no-margin';
 import noNestedStyles from './no-nested-styles';
 import noPhysicalProperties from './no-physical-properties';
+import noSeparatorWithListElements from './no-separator-with-list-elements';
 import noStyledTaggedTemplateExpression from './no-styled-tagged-template-expression';
 import noUnsafeDesignTokenUsage from './no-unsafe-design-token-usage';
 import noUnsafeStyleOverrides from './no-unsafe-style-overrides';
@@ -47,7 +48,7 @@ import useTagGroupLabel from './use-tag-group-label';
 import useTokensSpace from './use-tokens-space';
 import useTokensTypography from './use-tokens-typography';
 import useVisuallyHidden from './use-visually-hidden';
-export default {
+export var rules = {
   'consistent-css-prop-usage': consistentCssPropUsage,
   'ensure-design-token-usage': ensureDesignTokenUsage,
   'ensure-design-token-usage/preview': ensureDesignTokenUsagePreview,
@@ -72,6 +73,7 @@ export default {
   'no-margin': noMargin,
   'no-nested-styles': noNestedStyles,
   'no-physical-properties': noPhysicalProperties,
+  'no-separator-with-list-elements': noSeparatorWithListElements,
   'no-styled-tagged-template-expression': noStyledTaggedTemplateExpression,
   'no-unsafe-design-token-usage': noUnsafeDesignTokenUsage,
   'no-unsafe-style-overrides': noUnsafeStyleOverrides,

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') {