@elastic/eslint-plugin-eui 2.1.0 → 2.2.0

package/README.md

@@ -135,10 +135,14 @@ Ensures that EUI modal components (`EuiModal`, `EuiFlyout`, `EuiConfirmModal`) h
 
 Ensures that form control components within `EuiFormRow` components have matching `isInvalid` prop values. This maintains consistent validation state between parent form rows and their child form controls, leading to a more predictable and accessible user experience.
 
-### `@elastic/eui/sr_output_disabled_tooltip`
+### `@elastic/eui/sr-output-disabled-tooltip`
 
 Ensures `disableScreenReaderOutput` is set when `EuiToolTip` content matches `EuiButtonIcon` "aria-label".
 
+### `@elastic/eui/prefer-eui-icon-tip`
+
+Ensure `EuiIconTip` is used rather than `<EuiToolTip><EuiIcon/></EuiToolTip>`, as it provides better accessibility and improved support for assistive technologies.
+
 ## Testing
 
 ### Running unit tests

package/lib/cjs/index.js

@@ -6,6 +6,7 @@ var _no_css_color = require("./rules/no_css_color");
 var _require_aria_label_for_modals = require("./rules/a11y/require_aria_label_for_modals");
 var _consistent_is_invalid_props = require("./rules/a11y/consistent_is_invalid_props");
 var _sr_output_disabled_tooltip = require("./rules/a11y/sr_output_disabled_tooltip");
+var _prefer_eui_icon_tip = require("./rules/a11y/prefer_eui_icon_tip");
 /*
  * Licensed to Elasticsearch B.V. under one or more contributor
  * license agreements. See the NOTICE file distributed with
@@ -32,7 +33,8 @@ const config = {
     'no-css-color': _no_css_color.NoCssColor,
     'require-aria-label-for-modals': _require_aria_label_for_modals.RequireAriaLabelForModals,
     'consistent-is-invalid-props': _consistent_is_invalid_props.ConsistentIsInvalidProps,
-    'sr_output_disabled_tooltip': _sr_output_disabled_tooltip.ScreenReaderOutputDisabledTooltip
+    'sr-output-disabled-tooltip': _sr_output_disabled_tooltip.ScreenReaderOutputDisabledTooltip,
+    'prefer-eui-icon-tip': _prefer_eui_icon_tip.PreferEuiIconTip
   },
   configs: {
     recommended: {
@@ -43,7 +45,9 @@ const config = {
         '@elastic/eui/no-css-color': 'warn',
         '@elastic/eui/require-aria-label-for-modals': 'warn',
         '@elastic/eui/consistent-is-invalid-props': 'warn',
-        '@elastic/eui/sr_output_disabled_tooltip': 'warn'
+        '@elastic/eui/sr-output-disabled-tooltip': 'warn',
+        '@elastic/eui/no-css_color': 'warn',
+        '@elastic/eui/prefer-eui-icon-tip': 'warn'
       }
     }
   }

package/lib/cjs/rules/a11y/prefer_eui_icon_tip.d.ts

@@ -0,0 +1,3 @@
+import { ESLintUtils } from '@typescript-eslint/utils';
+export declare const PreferEuiIconTip: ESLintUtils.RuleModule<"preferEuiIconTip", [], unknown, ESLintUtils.RuleListener>;
+//# sourceMappingURL=prefer_eui_icon_tip.d.ts.map

package/lib/cjs/rules/a11y/prefer_eui_icon_tip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"prefer_eui_icon_tip.d.ts","sourceRoot":"","sources":["../../../../src/rules/a11y/prefer_eui_icon_tip.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAMtE,eAAO,MAAM,gBAAgB,mFA0C3B,CAAC"}

package/lib/cjs/rules/a11y/prefer_eui_icon_tip.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PreferEuiIconTip = void 0;
+var _utils = require("@typescript-eslint/utils");
+const TOOLTIP_COMPONENT = 'EuiToolTip';
+const ICON_COMPONENT = 'EuiIcon';
+const ICON_TIP_COMPONENT = 'EuiIconTip';
+const PreferEuiIconTip = exports.PreferEuiIconTip = _utils.ESLintUtils.RuleCreator.withoutDocs({
+  create(context) {
+    return {
+      JSXElement(node) {
+        const openingElement = node.openingElement;
+        if (openingElement.name.type !== 'JSXIdentifier' || openingElement.name.name !== TOOLTIP_COMPONENT) {
+          return;
+        }
+
+        // Find first JSX child
+        const firstChild = node.children.find(child => child.type === 'JSXElement');
+        if (firstChild && firstChild.openingElement.name.type === 'JSXIdentifier' && firstChild.openingElement.name.name === ICON_COMPONENT) {
+          context.report({
+            node: firstChild,
+            messageId: 'preferEuiIconTip'
+          });
+        }
+      }
+    };
+  },
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description: `Prefer using ${ICON_TIP_COMPONENT} over <${TOOLTIP_COMPONENT}><${ICON_COMPONENT}/></${TOOLTIP_COMPONENT}>, as it delivers better accessibility and improved support for assistive technologies.`
+    },
+    schema: [],
+    messages: {
+      preferEuiIconTip: `Ensure ${ICON_TIP_COMPONENT} is used rather than <${TOOLTIP_COMPONENT}><${ICON_COMPONENT}/></${TOOLTIP_COMPONENT}>, as it delivers better accessibility and improved support for assistive technologies.`
+    }
+  },
+  defaultOptions: []
+});

package/lib/esm/index.js

@@ -24,6 +24,7 @@ const no_css_color_1 = require("./rules/no_css_color");
 const require_aria_label_for_modals_1 = require("./rules/a11y/require_aria_label_for_modals");
 const consistent_is_invalid_props_1 = require("./rules/a11y/consistent_is_invalid_props");
 const sr_output_disabled_tooltip_1 = require("./rules/a11y/sr_output_disabled_tooltip");
+const prefer_eui_icon_tip_1 = require("./rules/a11y/prefer_eui_icon_tip");
 const config = {
     rules: {
         'href-or-on-click': href_or_on_click_1.HrefOnClick,
@@ -31,7 +32,8 @@ const config = {
         'no-css-color': no_css_color_1.NoCssColor,
         'require-aria-label-for-modals': require_aria_label_for_modals_1.RequireAriaLabelForModals,
         'consistent-is-invalid-props': consistent_is_invalid_props_1.ConsistentIsInvalidProps,
-        'sr_output_disabled_tooltip': sr_output_disabled_tooltip_1.ScreenReaderOutputDisabledTooltip,
+        'sr-output-disabled-tooltip': sr_output_disabled_tooltip_1.ScreenReaderOutputDisabledTooltip,
+        'prefer-eui-icon-tip': prefer_eui_icon_tip_1.PreferEuiIconTip,
     },
     configs: {
         recommended: {
@@ -42,7 +44,9 @@ const config = {
                 '@elastic/eui/no-css-color': 'warn',
                 '@elastic/eui/require-aria-label-for-modals': 'warn',
                 '@elastic/eui/consistent-is-invalid-props': 'warn',
-                '@elastic/eui/sr_output_disabled_tooltip': 'warn',
+                '@elastic/eui/sr-output-disabled-tooltip': 'warn',
+                '@elastic/eui/no-css_color': 'warn',
+                '@elastic/eui/prefer-eui-icon-tip': 'warn',
             },
         },
     },

package/lib/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;GAiBG;;AAEH,+DAAuD;AACvD,iFAA2E;AAC3E,uDAAkD;AAElD,8FAAuF;AACvF,0FAAoF;AACpF,wFAA4F;AAE5F,MAAM,MAAM,GAAG;IACb,KAAK,EAAE;QACL,kBAAkB,EAAE,8BAAW;QAC/B,2BAA2B,EAAE,kDAAsB;QACnD,cAAc,EAAE,yBAAU;QAC1B,+BAA+B,EAAE,yDAAyB;QAC1D,6BAA6B,EAAE,sDAAwB;QACvD,4BAA4B,EAAE,8DAAiC;KAChE;IACD,OAAO,EAAE;QACP,WAAW,EAAE;YACX,OAAO,EAAE,CAAC,4BAA4B,CAAC;YACvC,KAAK,EAAE;gBACL,+BAA+B,EAAE,MAAM;gBACvC,wCAAwC,EAAE,MAAM;gBAChD,2BAA2B,EAAE,MAAM;gBACnC,4CAA4C,EAAE,MAAM;gBACpD,0CAA0C,EAAE,MAAM;gBAClD,yCAAyC,EAAE,MAAM;aAClD;SACF;KACF;CACF,CAAC;AAEF,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;GAiBG;;AAEH,+DAAuD;AACvD,iFAA2E;AAC3E,uDAAkD;AAElD,8FAAuF;AACvF,0FAAoF;AACpF,wFAA4F;AAC5F,0EAAoE;AAEpE,MAAM,MAAM,GAAG;IACb,KAAK,EAAE;QACL,kBAAkB,EAAE,8BAAW;QAC/B,2BAA2B,EAAE,kDAAsB;QACnD,cAAc,EAAE,yBAAU;QAC1B,+BAA+B,EAAE,yDAAyB;QAC1D,6BAA6B,EAAE,sDAAwB;QACvD,4BAA4B,EAAE,8DAAiC;QAC/D,qBAAqB,EAAE,sCAAgB;KACxC;IACD,OAAO,EAAE;QACP,WAAW,EAAE;YACX,OAAO,EAAE,CAAC,4BAA4B,CAAC;YACvC,KAAK,EAAE;gBACL,+BAA+B,EAAE,MAAM;gBACvC,wCAAwC,EAAE,MAAM;gBAChD,2BAA2B,EAAE,MAAM;gBACnC,4CAA4C,EAAE,MAAM;gBACpD,0CAA0C,EAAE,MAAM;gBAClD,yCAAyC,EAAE,MAAM;gBACjD,2BAA2B,EAAE,MAAM;gBACnC,kCAAkC,EAAE,MAAM;aAC3C;SACF;KACF;CACF,CAAC;AAEF,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC"}

package/lib/esm/rules/a11y/prefer_eui_icon_tip.d.ts

@@ -0,0 +1,2 @@
+import { ESLintUtils } from '@typescript-eslint/utils';
+export declare const PreferEuiIconTip: ESLintUtils.RuleModule<"preferEuiIconTip", [], unknown, ESLintUtils.RuleListener>;

package/lib/esm/rules/a11y/prefer_eui_icon_tip.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PreferEuiIconTip = void 0;
+const utils_1 = require("@typescript-eslint/utils");
+const TOOLTIP_COMPONENT = 'EuiToolTip';
+const ICON_COMPONENT = 'EuiIcon';
+const ICON_TIP_COMPONENT = 'EuiIconTip';
+exports.PreferEuiIconTip = utils_1.ESLintUtils.RuleCreator.withoutDocs({
+    create(context) {
+        return {
+            JSXElement(node) {
+                const openingElement = node.openingElement;
+                if (openingElement.name.type !== 'JSXIdentifier' ||
+                    openingElement.name.name !== TOOLTIP_COMPONENT) {
+                    return;
+                }
+                // Find first JSX child
+                const firstChild = node.children.find((child) => child.type === 'JSXElement');
+                if (firstChild &&
+                    firstChild.openingElement.name.type === 'JSXIdentifier' &&
+                    firstChild.openingElement.name.name === ICON_COMPONENT) {
+                    context.report({
+                        node: firstChild,
+                        messageId: 'preferEuiIconTip'
+                    });
+                }
+            },
+        };
+    },
+    meta: {
+        type: 'suggestion',
+        docs: {
+            description: `Prefer using ${ICON_TIP_COMPONENT} over <${TOOLTIP_COMPONENT}><${ICON_COMPONENT}/></${TOOLTIP_COMPONENT}>, as it delivers better accessibility and improved support for assistive technologies.`
+        },
+        schema: [],
+        messages: {
+            preferEuiIconTip: `Ensure ${ICON_TIP_COMPONENT} is used rather than <${TOOLTIP_COMPONENT}><${ICON_COMPONENT}/></${TOOLTIP_COMPONENT}>, as it delivers better accessibility and improved support for assistive technologies.`,
+        },
+    },
+    defaultOptions: [],
+});
+//# sourceMappingURL=prefer_eui_icon_tip.js.map

package/lib/esm/rules/a11y/prefer_eui_icon_tip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prefer_eui_icon_tip.js","sourceRoot":"","sources":["../../../../src/rules/a11y/prefer_eui_icon_tip.ts"],"names":[],"mappings":";;;AAAA,oDAAsE;AAEtE,MAAM,iBAAiB,GAAG,YAAY,CAAC;AACvC,MAAM,cAAc,GAAG,SAAS,CAAC;AACjC,MAAM,kBAAkB,GAAG,YAAY,CAAC;AAE3B,QAAA,gBAAgB,GAAG,mBAAW,CAAC,WAAW,CAAC,WAAW,CAAC;IAClE,MAAM,CAAC,OAAO;QACZ,OAAO;YACL,UAAU,CAAC,IAAI;gBACb,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,CAAC;gBAC3C,IACE,cAAc,CAAC,IAAI,CAAC,IAAI,KAAK,eAAe;oBAC5C,cAAc,CAAC,IAAI,CAAC,IAAI,KAAK,iBAAiB,EAC9C,CAAC;oBACD,OAAO;gBACT,CAAC;gBAED,uBAAuB;gBACvB,MAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CACnC,CAAC,KAAK,EAAgC,EAAE,CACtC,KAAK,CAAC,IAAI,KAAK,YAAY,CAC9B,CAAC;gBAEF,IACE,UAAU;oBACV,UAAU,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,KAAK,eAAe;oBACvD,UAAU,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,KAAK,cAAc,EACtD,CAAC;oBACD,OAAO,CAAC,MAAM,CAAC;wBACb,IAAI,EAAE,UAAU;wBAChB,SAAS,EAAE,kBAAkB;qBAC9B,CAAC,CAAC;gBACL,CAAC;YACH,CAAC;SACF,CAAC;IACJ,CAAC;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,YAAY;QAClB,IAAI,EAAE;YACJ,WAAW,EAAE,gBAAgB,kBAAkB,UAAU,iBAAiB,KAAK,cAAc,OAAO,iBAAiB,yFAAyF;SAC/M;QACD,MAAM,EAAE,EAAE;QACV,QAAQ,EAAE;YACR,gBAAgB,EAAE,UAAU,kBAAkB,yBAAyB,iBAAiB,KAAK,cAAc,OAAO,iBAAiB,yFAAyF;SAC7N;KACF;IACD,cAAc,EAAE,EAAE;CACnB,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elastic/eslint-plugin-eui",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",