@elastic/eslint-plugin-eui 2.9.0 → 2.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/README.md +1 -1
  2. package/lib/cjs/rules/a11y/require_aria_label_for_modals.d.ts +1 -1
  3. package/lib/cjs/rules/a11y/require_aria_label_for_modals.d.ts.map +1 -1
  4. package/lib/cjs/rules/a11y/require_aria_label_for_modals.js +8 -2
  5. package/lib/esm/rules/a11y/require_aria_label_for_modals.d.ts +1 -1
  6. package/lib/esm/rules/a11y/require_aria_label_for_modals.js +28 -1
  7. package/lib/esm/rules/a11y/require_aria_label_for_modals.js.map +1 -1
  8. package/package.json +1 -1
package/README.md CHANGED
@@ -129,7 +129,7 @@ It's worth pointing out that although the examples provided are specific to EUI
129
129
 
130
130
  ### `@elastic/eui/require-aria-label-for-modals`
131
131
 
132
- Ensure that EUI modal components (`EuiModal`, `EuiFlyout`, `EuiFlyoutResizable` ,`EuiConfirmModal`) have either an `aria-label` or `aria-labelledby` prop for accessibility. This helps screen reader users understand the purpose and content of modal dialogs.
132
+ Ensure that EUI modal components (`EuiModal`, `EuiFlyout`, `EuiFlyoutResizable` ,`EuiConfirmModal`, `EuiPopover`, `EuiWrappingPopover`) have either an `aria-label` or `aria-labelledby` prop for accessibility. This helps screen reader users understand the purpose and content of modal dialogs.
133
133
 
134
134
  ### `@elastic/eui/consistent-is-invalid-props`
135
135
 
package/lib/cjs/rules/a11y/require_aria_label_for_modals.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import { ESLintUtils } from '@typescript-eslint/utils';
2
- export declare const RequireAriaLabelForModals: ESLintUtils.RuleModule<"modalAriaMissing" | "confirmModalAriaMissing", [], unknown, ESLintUtils.RuleListener>;
2
+ export declare const RequireAriaLabelForModals: ESLintUtils.RuleModule<"modalAriaMissing" | "confirmModalAriaMissing" | "popoverAriaMissing", [], unknown, ESLintUtils.RuleListener>;
3
3
  //# sourceMappingURL=require_aria_label_for_modals.d.ts.map
package/lib/cjs/rules/a11y/require_aria_label_for_modals.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"require_aria_label_for_modals.d.ts","sourceRoot":"","sources":["../../../../src/rules/a11y/require_aria_label_for_modals.ts"],"names":[],"mappings":"AAQA,OAAO,EAAY,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAKjE,eAAO,MAAM,yBAAyB,+GA0FpC,CAAC"}
1
+ {"version":3,"file":"require_aria_label_for_modals.d.ts","sourceRoot":"","sources":["../../../../src/rules/a11y/require_aria_label_for_modals.ts"],"names":[],"mappings":"AAQA,OAAO,EAAY,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAOjE,eAAO,MAAM,yBAAyB,sIAsHpC,CAAC"}
package/lib/cjs/rules/a11y/require_aria_label_for_modals.js CHANGED
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.RequireAriaLabelForModals = void 0;
7
7
  var _utils = require("@typescript-eslint/utils");
8
+ var _has_spread = require("../../utils/has_spread");
8
9
  /*
9
10
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
10
11
  * or more contributor license agreements. Licensed under the Elastic License
@@ -15,6 +16,7 @@ var _utils = require("@typescript-eslint/utils");
15
16
 
16
17
  const modalComponents = ['EuiModal', 'EuiFlyout', 'EuiFlyoutResizable'];
17
18
  const confirmModalComponents = ['EuiConfirmModal'];
19
+ const popoverComponents = ['EuiPopover', 'EuiWrappingPopover'];
18
20
  const RequireAriaLabelForModals = exports.RequireAriaLabelForModals = _utils.ESLintUtils.RuleCreator.withoutDocs({
19
21
  create(context) {
20
22
  function checkAttributes(node, componentName, messageId) {
@@ -31,13 +33,16 @@ const RequireAriaLabelForModals = exports.RequireAriaLabelForModals = _utils.ESL
31
33
  }
32
34
  return {
33
35
  JSXOpeningElement(node) {
34
- if (node.name.type === 'JSXIdentifier') {
36
+ if (node.name.type === 'JSXIdentifier' && !(0, _has_spread.hasSpread)(node.attributes)) {
35
37
  if (modalComponents.includes(node.name.name)) {
36
38
  checkAttributes(node, node.name.name, 'modalAriaMissing');
37
39
  }
38
40
  if (confirmModalComponents.includes(node.name.name)) {
39
41
  checkAttributes(node, node.name.name, 'confirmModalAriaMissing');
40
42
  }
43
+ if (popoverComponents.includes(node.name.name)) {
44
+ checkAttributes(node, node.name.name, 'popoverAriaMissing');
45
+ }
41
46
  }
42
47
  return;
43
48
  }
@@ -51,7 +56,8 @@ const RequireAriaLabelForModals = exports.RequireAriaLabelForModals = _utils.ESL
51
56
  schema: [],
52
57
  messages: {
53
58
  modalAriaMissing: ['{{ component }} must have either \'aria-label\' or \'aria-labelledby\' prop for accessibility.', '\n', 'Option 1: Using \'aria-labelledby\' (preferred):', '1. Import \'useGeneratedHtmlId\':', ' import { useGeneratedHtmlId } from \'@elastic/eui\';', '2. Update your component:', ' const modalTitleId = useGeneratedHtmlId();', ' ...', ' <{{ component }}', ' aria-labelledby={modalTitleId}', ' {...props} ', ' />', ' <{{ component }}Header>', ' <EuiTitle id={modalTitleId}>', ' {\'Descriptive title for the {{ component }}\'}', ' </EuiTitle>', ' </{ component }}Header>', ' ...', ' </{{ component }}>', '\n', 'Option 2: Using \'aria-label\':', ' <{{ component }} aria-label="Descriptive title for the {{ component }}" {...props} />'].join('\n'),
54
- confirmModalAriaMissing: ['{{ component }} must have either \'aria-label\' or \'aria-labelledby\' prop for accessibility.', '\n', 'Option 1: Using \'aria-labelledby\' (preferred):', '1. Import \'useGeneratedHtmlId\':', ' import { useGeneratedHtmlId } from \'@elastic/eui\';', '2. Update your component:', ' const modalTitleId = useGeneratedHtmlId();', ' ...', ' <{{ component }}', ' title="Descriptive title for the {{ component }}"', ' aria-labelledby={modalTitleId}', ' titleProps={({id: modalTitleId })}', ' {...props} ', ' />', '\n', 'Option 2: Using \'aria-label\':', ' <{{ component }} aria-label="Descriptive title for the {{ component }}" {...props} />'].join('\n')
59
+ confirmModalAriaMissing: ['{{ component }} must have either \'aria-label\' or \'aria-labelledby\' prop for accessibility.', '\n', 'Option 1: Using \'aria-labelledby\' (preferred):', '1. Import \'useGeneratedHtmlId\':', ' import { useGeneratedHtmlId } from \'@elastic/eui\';', '2. Update your component:', ' const modalTitleId = useGeneratedHtmlId();', ' ...', ' <{{ component }}', ' title="Descriptive title for the {{ component }}"', ' aria-labelledby={modalTitleId}', ' titleProps={({id: modalTitleId })}', ' {...props} ', ' />', '\n', 'Option 2: Using \'aria-label\':', ' <{{ component }} aria-label="Descriptive title for the {{ component }}" {...props} />'].join('\n'),
60
+ popoverAriaMissing: ['{{ component }} must have either \'aria-label\' or \'aria-labelledby\' prop for accessibility.', '\n', 'Option 1: Using \'aria-labelledby\' (preferred):', '1. Import \'useGeneratedHtmlId\':', ' import { useGeneratedHtmlId } from \'@elastic/eui\';', '2. Update your component:', ' const popoverTitleId = useGeneratedHtmlId();', ' ...', ' <{{ component }}', ' aria-labelledby={popoverTitleId}', ' {...props} ', ' />', ' <EuiPopoverTitle id={popoverTitleId}>' + ' {\'Descriptive title for the {{ component }}\'}', ' </EuiPopoverTitle>', ' ...', ' </{{ component }}>', '\n', 'Option 2: Using \'aria-label\':', ' <{{ component }} aria-label="Descriptive title for the {{ component }}" {...props} />'].join('\n')
55
61
  }
56
62
  },
57
63
  defaultOptions: []
package/lib/esm/rules/a11y/require_aria_label_for_modals.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import { ESLintUtils } from '@typescript-eslint/utils';
2
- export declare const RequireAriaLabelForModals: ESLintUtils.RuleModule<"modalAriaMissing" | "confirmModalAriaMissing", [], unknown, ESLintUtils.RuleListener>;
2
+ export declare const RequireAriaLabelForModals: ESLintUtils.RuleModule<"modalAriaMissing" | "confirmModalAriaMissing" | "popoverAriaMissing", [], unknown, ESLintUtils.RuleListener>;
package/lib/esm/rules/a11y/require_aria_label_for_modals.js CHANGED
@@ -9,8 +9,10 @@
9
9
  Object.defineProperty(exports, "__esModule", { value: true });
10
10
  exports.RequireAriaLabelForModals = void 0;
11
11
  const utils_1 = require("@typescript-eslint/utils");
12
+ const has_spread_1 = require("../../utils/has_spread");
12
13
  const modalComponents = ['EuiModal', 'EuiFlyout', 'EuiFlyoutResizable'];
13
14
  const confirmModalComponents = ['EuiConfirmModal'];
15
+ const popoverComponents = ['EuiPopover', 'EuiWrappingPopover'];
14
16
  exports.RequireAriaLabelForModals = utils_1.ESLintUtils.RuleCreator.withoutDocs({
15
17
  create(context) {
16
18
  function checkAttributes(node, componentName, messageId) {
@@ -27,13 +29,16 @@ exports.RequireAriaLabelForModals = utils_1.ESLintUtils.RuleCreator.withoutDocs(
27
29
  }
28
30
  return {
29
31
  JSXOpeningElement(node) {
30
- if (node.name.type === 'JSXIdentifier') {
32
+ if (node.name.type === 'JSXIdentifier' && !(0, has_spread_1.hasSpread)(node.attributes)) {
31
33
  if (modalComponents.includes(node.name.name)) {
32
34
  checkAttributes(node, node.name.name, 'modalAriaMissing');
33
35
  }
34
36
  if (confirmModalComponents.includes(node.name.name)) {
35
37
  checkAttributes(node, node.name.name, 'confirmModalAriaMissing');
36
38
  }
39
+ if (popoverComponents.includes(node.name.name)) {
40
+ checkAttributes(node, node.name.name, 'popoverAriaMissing');
41
+ }
37
42
  }
38
43
  return;
39
44
  },
@@ -88,6 +93,28 @@ exports.RequireAriaLabelForModals = utils_1.ESLintUtils.RuleCreator.withoutDocs(
88
93
  '\n',
89
94
  'Option 2: Using \'aria-label\':',
90
95
  ' <{{ component }} aria-label="Descriptive title for the {{ component }}" {...props} />',
96
+ ].join('\n'),
97
+ popoverAriaMissing: [
98
+ '{{ component }} must have either \'aria-label\' or \'aria-labelledby\' prop for accessibility.',
99
+ '\n',
100
+ 'Option 1: Using \'aria-labelledby\' (preferred):',
101
+ '1. Import \'useGeneratedHtmlId\':',
102
+ ' import { useGeneratedHtmlId } from \'@elastic/eui\';',
103
+ '2. Update your component:',
104
+ ' const popoverTitleId = useGeneratedHtmlId();',
105
+ ' ...',
106
+ ' <{{ component }}',
107
+ ' aria-labelledby={popoverTitleId}',
108
+ ' {...props} ',
109
+ ' />',
110
+ ' <EuiPopoverTitle id={popoverTitleId}>' +
111
+ ' {\'Descriptive title for the {{ component }}\'}',
112
+ ' </EuiPopoverTitle>',
113
+ ' ...',
114
+ ' </{{ component }}>',
115
+ '\n',
116
+ 'Option 2: Using \'aria-label\':',
117
+ ' <{{ component }} aria-label="Descriptive title for the {{ component }}" {...props} />',
91
118
  ].join('\n')
92
119
  },
93
120
  },
package/lib/esm/rules/a11y/require_aria_label_for_modals.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"require_aria_label_for_modals.js","sourceRoot":"","sources":["../../../../src/rules/a11y/require_aria_label_for_modals.ts"],"names":[],"mappings":";AAAA;;;;;;GAMG;;;AAEH,oDAAiE;AAEjE,MAAM,eAAe,GAAG,CAAC,UAAU,EAAE,WAAW,EAAE,oBAAoB,CAAC,CAAC;AACxE,MAAM,sBAAsB,GAAG,CAAC,iBAAiB,CAAC,CAAC;AAEtC,QAAA,yBAAyB,GAAG,mBAAW,CAAC,WAAW,CAAC,WAAW,CAAC;IAC3E,MAAM,CAAC,OAAO;QACZ,SAAS,eAAe,CAAC,IAAgC,EAAE,aAAqB,EAAE,SAAyD;YACzI,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,CAAC,IAAI,CACvC,CAAC,IAAI,EAAE,EAAE,CACP,IAAI,CAAC,IAAI,KAAK,cAAc;gBAC5B,OAAO,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,QAAQ;gBAClC,CAAC,YAAY,EAAE,iBAAiB,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,CAC7D,CAAC;YAEF,IAAI,CAAC,YAAY,EAAE,CAAC;gBAClB,OAAO,CAAC,MAAM,CAAC;oBACb,IAAI;oBACJ,SAAS,EAAE,SAAS;oBACpB,IAAI,EAAE,EAAE,SAAS,EAAE,aAAa,EAAE;iBACnC,CAAC,CAAC;YACL,CAAC;QACH,CAAC;QAED,OAAO;YACL,iBAAiB,CAAC,IAAI;gBACpB,IACE,IAAI,CAAC,IAAI,CAAC,IAAI,KAAK,eAAe,EAClC,CAAC;oBACD,IAAI,eAAe,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;wBAC7C,eAAe,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,kBAAkB,CAAC,CAAA;oBAC3D,CAAC;oBAED,IAAI,sBAAsB,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;wBACpD,eAAe,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,yBAAyB,CAAC,CAAA;oBAClE,CAAC;gBACH,CAAC;gBACD,OAAM;YACR,CAAC;SACF,CAAC;IACJ,CAAC;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,SAAS;QACf,IAAI,EAAE;YACJ,WAAW,EAAE,0DAA0D;SACxE;QACD,MAAM,EAAE,EAAE;QACV,QAAQ,EAAE;YACR,gBAAgB,EAAE;gBAChB,gGAAgG;gBAChG,IAAI;gBACJ,kDAAkD;gBAClD,mCAAmC;gBACnC,yDAAyD;gBACzD,2BAA2B;gBAC3B,+CAA+C;gBAC/C,QAAQ;gBACR,qBAAqB;gBACrB,oCAAoC;gBACpC,iBAAiB;gBACjB,OAAO;gBACP,8BAA8B;gBAC9B,qCAAqC;gBACrC,0DAA0D;gBAC1D,oBAAoB;gBACpB,8BAA8B;gBAC9B,UAAU;gBACV,uBAAuB;gBACvB,IAAI;gBACJ,iCAAiC;gBACjC,0FAA0F;aAC3F,CAAC,IAAI,CAAC,IAAI,CAAC;YAEZ,uBAAuB,EAAE;gBACvB,gGAAgG;gBAChG,IAAI;gBACJ,kDAAkD;gBAClD,mCAAmC;gBACnC,yDAAyD;gBACzD,2BAA2B;gBAC3B,+CAA+C;gBAC/C,QAAQ;gBACR,qBAAqB;gBACrB,wDAAwD;gBACxD,qCAAqC;gBACrC,yCAAyC;gBACzC,kBAAkB;gBAClB,OAAO;gBACP,IAAI;gBACJ,iCAAiC;gBACjC,0FAA0F;aAC7F,CAAC,IAAI,CAAC,IAAI,CAAC;SACX;KACF;IACD,cAAc,EAAE,EAAE;CACnB,CAAC,CAAC"}
1
+ {"version":3,"file":"require_aria_label_for_modals.js","sourceRoot":"","sources":["../../../../src/rules/a11y/require_aria_label_for_modals.ts"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elastic/eslint-plugin-eui",
3
- "version": "2.9.0",
3
+ "version": "2.10.0",
4
4
  "license": "Apache-2.0",
5
5
  "repository": {
6
6
  "type": "git",