[BREAKING CHANGE] Remove deprecated icons

packages/eslint-plugin/README.md

@@ -29,6 +29,16 @@ We don't use `no-restricted-imports` because ESLint doesn't allow multiple error
 
 All deprecations still must follow our [deprecation process](../../wiki/eui-team-processes/deprecations.md).
 
+### `@elastic/eui/no-deprecated-icon-aliases`
+
+Disallows deprecated EUI icon aliases in static JSX props on components imported
+from `@elastic/eui`. The rule checks props ending in `IconType`, the `type` prop
+on `EuiIcon` and `EuiIconTip`, and component-specific icon props such as
+`timelineAvatar`, `icon`, `logo`, `iconLeft`, and `iconRight`. It automatically
+replaces deprecated aliases with their supported icon handles.
+
+See the full table of icon replacements here: https://github.com/elastic/eui/issues/9561
+
 ### `@elastic/eui/no-css-color`
 
 This rule warns engineers to not use literal css color in the codebase, particularly for CSS properties that apply color to either the html element or text nodes, but rather urge users to defer to using the color tokens provided by EUI.

packages/eslint-plugin/changelogs/upcoming/9815.md

@@ -0,0 +1 @@
+- Add `no-deprecated-icon-aliases` rule

packages/eslint-plugin/src/index.ts

@@ -27,6 +27,7 @@ import { EuiBadgeAccessibilityRules } from './rules/a11y/badge_accessibility_rul
 import { EuiIconAccessibilityRules } from './rules/a11y/icon_accessibility_rules';
 import { TooltipNoInteractiveContent } from './rules/a11y/tooltip_no_interactive_content';
 import { TooltipButtonIconWrap } from './rules/a11y/tooltip_button_icon_wrap';
+import { NoDeprecatedIconAliases } from './rules/no_deprecated_icon_aliases';
 
 const config = {
   rules: {
@@ -36,6 +37,7 @@ const config = {
     'consistent-is-invalid-props': ConsistentIsInvalidProps,
     'href-or-on-click': HrefOnClick,
     'no-css-color': NoCssColor,
+    'no-deprecated-icon-aliases': NoDeprecatedIconAliases,
     'no-restricted-eui-imports': NoRestrictedEuiImports,
     'no-static-z-index': NoStaticZIndex,
     'no-unnamed-interactive-element': NoUnnamedInteractiveElement,
@@ -63,6 +65,7 @@ const config = {
         '@elastic/eui/consistent-is-invalid-props': 'warn',
         '@elastic/eui/href-or-on-click': 'warn',
         '@elastic/eui/no-css-color': 'warn',
+        '@elastic/eui/no-deprecated-icon-aliases': 'warn',
         '@elastic/eui/no-restricted-eui-imports': 'warn',
         '@elastic/eui/no-static-z-index': 'warn',
         '@elastic/eui/no-unnamed-interactive-element': 'warn',

packages/eslint-plugin/src/rules/no_deprecated_icon_aliases.test.ts

@@ -0,0 +1,153 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { RuleTester } from '@typescript-eslint/rule-tester';
+import {
+  DEPRECATED_ICON_ALIASES,
+  DEPRECATED_ICONS_WITHOUT_REPLACEMENT,
+  NoDeprecatedIconAliases,
+} from './no_deprecated_icon_aliases';
+
+const languageOptions = {
+  sourceType: 'module' as const,
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+  },
+};
+
+const ruleTester = new RuleTester();
+
+ruleTester.run('no-deprecated-icon-aliases', NoDeprecatedIconAliases, {
+  valid: [
+    {
+      code: 'import { EuiIcon } from "@elastic/eui";\n<EuiIcon type="warning" />',
+      languageOptions,
+    },
+    {
+      code: 'import { EuiButtonIcon } from "@elastic/eui";\n<EuiButtonIcon iconType={iconType} />',
+      languageOptions,
+    },
+    {
+      code: '<Component type="alert" />',
+      languageOptions,
+    },
+    {
+      code: '<Component status="alert" />',
+      languageOptions,
+    },
+    {
+      code: '<CustomComponent leadingIcon="mapMarker" />',
+      languageOptions,
+    },
+    {
+      code: 'import { EuiEmptyPrompt } from "@elastic/eui";\n<EuiEmptyPrompt icon="alert" />',
+      languageOptions,
+    },
+    {
+      code: '<EuiIcon type="alert" />',
+      languageOptions,
+    },
+  ],
+  invalid: [
+    ...Object.entries(DEPRECATED_ICON_ALIASES).map(([alias, replacement]) => ({
+      code: `import { EuiIcon } from "@elastic/eui";\n<EuiIcon type="${alias}" />`,
+      output: `import { EuiIcon } from "@elastic/eui";\n<EuiIcon type="${replacement}" />`,
+      languageOptions,
+      errors: [
+        {
+          messageId: 'deprecatedIconAlias' as const,
+          data: { alias, replacement },
+        },
+      ],
+    })),
+    ...Array.from(DEPRECATED_ICONS_WITHOUT_REPLACEMENT).map((iconType) => ({
+      code: `import { EuiIcon } from "@elastic/eui";\n<EuiIcon type="${iconType}" />`,
+      languageOptions,
+      errors: [
+        {
+          messageId: 'deprecatedIcon' as const,
+          data: { iconType },
+        },
+      ],
+    })),
+    {
+      code: "import { EuiButtonIcon } from '@elastic/eui';\n<EuiButtonIcon iconType={'editorComment'} />",
+      output:
+        "import { EuiButtonIcon } from '@elastic/eui';\n<EuiButtonIcon iconType={'comment'} />",
+      languageOptions,
+      errors: [
+        {
+          messageId: 'deprecatedIconAlias',
+          data: { alias: 'editorComment', replacement: 'comment' },
+        },
+      ],
+    },
+    {
+      code: 'import { EuiCommentTimeline } from "@elastic/eui";\n<EuiCommentTimeline timelineAvatar="compute" />',
+      output:
+        'import { EuiCommentTimeline } from "@elastic/eui";\n<EuiCommentTimeline timelineAvatar="processor" />',
+      languageOptions,
+      errors: [
+        {
+          messageId: 'deprecatedIconAlias',
+          data: { alias: 'compute', replacement: 'processor' },
+        },
+      ],
+    },
+    {
+      code: 'import { EuiTimelineItem } from "@elastic/eui";\n<EuiTimelineItem icon="temperature" />',
+      output:
+        'import { EuiTimelineItem } from "@elastic/eui";\n<EuiTimelineItem icon="thermometer" />',
+      languageOptions,
+      errors: [
+        {
+          messageId: 'deprecatedIconAlias',
+          data: { alias: 'temperature', replacement: 'thermometer' },
+        },
+      ],
+    },
+    {
+      code: 'import { EuiLoadingLogo } from "@elastic/eui";\n<EuiLoadingLogo logo="visArea" />',
+      output:
+        'import { EuiLoadingLogo } from "@elastic/eui";\n<EuiLoadingLogo logo="chartArea" />',
+      languageOptions,
+      errors: [
+        {
+          messageId: 'deprecatedIconAlias',
+          data: { alias: 'visArea', replacement: 'chartArea' },
+        },
+      ],
+    },
+    {
+      code: 'import { EuiFormPrepend } from "@elastic/eui";\n<EuiFormPrepend iconLeft="search" />',
+      output:
+        'import { EuiFormPrepend } from "@elastic/eui";\n<EuiFormPrepend iconLeft="magnify" />',
+      languageOptions,
+      errors: [
+        {
+          messageId: 'deprecatedIconAlias',
+          data: { alias: 'search', replacement: 'magnify' },
+        },
+      ],
+    },
+    {
+      code: 'import { EuiIcon as Icon } from "@elastic/eui";\n<Icon type="mapMarker" />',
+      output:
+        'import { EuiIcon as Icon } from "@elastic/eui";\n<Icon type="waypoint" />',
+      languageOptions,
+      errors: [
+        {
+          messageId: 'deprecatedIconAlias',
+          data: { alias: 'mapMarker', replacement: 'waypoint' },
+        },
+      ],
+    },
+  ],
+});