… ESLint rule (elastic#227623)

> [!CAUTION]
> ⚠️ Changes were made by GenAI. Please review carefully.

> [!NOTE]
> Only `EuiConfirmModal` part

## Summary
This PR applies the auto-fix for the newly introduced
`@elastic/eui/require-aria-label-for-modals` Ensures that EUI modal
components `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.

## Changes

- For **function components**:
1. Verify whether `useGeneratedHtmlId` is imported from the
`@elastic/eui` package. If not, add the following import.
2. Inside the render method, define a new constant: `const
confirmModalTitleId = useGeneratedHtmlId();`
- For **class components**:
1. Verify whether `htmlIdGenerator` is imported from the `@elastic/eui`
package. If not, add the following import.
2. Inside the render method, define a new constant: `const
confirmModalTitleId = htmlIdGenerator()('confirmModalTitle');`

In both cases, add the following props to the `EuiConfirmModal`
component:
- `aria-labelledby={confirmModalTitleId}`
- `titleProps={{ id: confirmModalTitleId }}`

## Related
- elastic/eui#8843

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
(cherry picked from commit f0dbc67)

`@elastic/eslint-plugin-eui`: `2.0.0` ⏩ `2.1.0`

[Questions? Please see our Kibana upgrade
FAQ.](https://github.com/elastic/eui/blob/main/wiki/eui-team-processes/upgrading-kibana.md#faq-for-kibana-teams)

## Changes

This PR updates the `@elastic/eslint-plugin-eui` version to latest:
[`v2.1.0`](https://www.npmjs.com/package/@elastic/eslint-plugin-eui/v/2.1.0)

### `@elastic/eui/require-aria-label-for-modals` (fixed with GenAI:
elastic#227623)

Ensures that EUI modal components (`EuiModal`, `EuiFlyout`,
`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.

### `@elastic/eui/consistent-is-invalid-props` (auto-fix available)

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` (auto-fix available)

Ensures `disableScreenReaderOutput` is set when `EuiToolTip` content
matches `EuiButtonIcon`'s `aria-label`.

> [!NOTE]
> `@elastic/eui/sr_output_disabled_tooltip` will be renamed to
`@elastic/eui/sr-output-disabled-tooltip` for consistent rule naming.

## Package updates

### `@elastic/eslint-plugin-eui`

- Added new `sr_output_disabled_tooltip` rule.
([elastic#8848](elastic/eui#8848))
- Added new `consistent-is-invalid-props` rule.
([elastic#8843](elastic/eui#8843))
- Added new `require-aria-label-for-modals` rule.
([elastic#8811](elastic/eui#8811))

… ESLint rule (elastic#227623)

> [!CAUTION]
> ⚠️ Changes were made by GenAI. Please review carefully.

> [!NOTE]
> Only `EuiConfirmModal` part

## Summary
This PR applies the auto-fix for the newly introduced
`@elastic/eui/require-aria-label-for-modals` Ensures that EUI modal
components `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.

## Changes

- For **function components**:
1. Verify whether `useGeneratedHtmlId` is imported from the
`@elastic/eui` package. If not, add the following import.
2. Inside the render method, define a new constant: `const
confirmModalTitleId = useGeneratedHtmlId();`
- For **class components**:
1. Verify whether `htmlIdGenerator` is imported from the `@elastic/eui`
package. If not, add the following import.
2. Inside the render method, define a new constant: `const
confirmModalTitleId = htmlIdGenerator()('confirmModalTitle');`

In both cases, add the following props to the `EuiConfirmModal`
component:
- `aria-labelledby={confirmModalTitleId}`
- `titleProps={{ id: confirmModalTitleId }}`

## Related
- elastic/eui#8843

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>

… ESLint rule (elastic#227623)

> [!CAUTION]
> ⚠️ Changes were made by GenAI. Please review carefully.

> [!NOTE]
> Only `EuiConfirmModal` part

## Summary
This PR applies the auto-fix for the newly introduced
`@elastic/eui/require-aria-label-for-modals` Ensures that EUI modal
components `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.

## Changes

- For **function components**:
1. Verify whether `useGeneratedHtmlId` is imported from the
`@elastic/eui` package. If not, add the following import.
2. Inside the render method, define a new constant: `const
confirmModalTitleId = useGeneratedHtmlId();`
- For **class components**:
1. Verify whether `htmlIdGenerator` is imported from the `@elastic/eui`
package. If not, add the following import.
2. Inside the render method, define a new constant: `const
confirmModalTitleId = htmlIdGenerator()('confirmModalTitle');`

In both cases, add the following props to the `EuiConfirmModal`
component:
- `aria-labelledby={confirmModalTitleId}`
- `titleProps={{ id: confirmModalTitleId }}`

## Related
- elastic/eui#8843

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>

…modals ESLint rule (#227623) (#229259)

# Backport

This will backport the following commits from `main` to `9.1`:
- [Auto-fix violations of the @elastic/eui/require-aria-label-for-modals
ESLint rule (#227623)](#227623)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Alexey
Antonov","email":"alexwizp@gmail.com"},"sourceCommit":{"committedDate":"2025-07-24T08:36:00Z","message":"Auto-fix
violations of the @elastic/eui/require-aria-label-for-modals ESLint rule
(#227623)\n\n> [!CAUTION]\n> ⚠️ Changes were made by GenAI. Please
review carefully.\n\n> [!NOTE]\n> Only `EuiConfirmModal` part\n\n##
Summary\nThis PR applies the auto-fix for the newly
introduced\n`@elastic/eui/require-aria-label-for-modals` Ensures that
EUI modal\ncomponents `EuiConfirmModal` have either an `aria-label`
or\n`aria-labelledby` prop for accessibility. This helps screen reader
users\nunderstand the purpose and content of modal dialogs.\n\n##
Changes\n\n- For **function components**:\n1. Verify whether
`useGeneratedHtmlId` is imported from the\n`@elastic/eui` package. If
not, add the following import.\n2. Inside the render method, define a
new constant: `const\nconfirmModalTitleId = useGeneratedHtmlId();`\n-
For **class components**:\n1. Verify whether `htmlIdGenerator` is
imported from the `@elastic/eui`\npackage. If not, add the following
import.\n2. Inside the render method, define a new constant:
`const\nconfirmModalTitleId =
htmlIdGenerator()('confirmModalTitle');`\n\nIn both cases, add the
following props to the `EuiConfirmModal`\ncomponent:\n-
`aria-labelledby={confirmModalTitleId}`\n- `titleProps={{ id:
confirmModalTitleId }}`\n\n## Related\n-
elastic/eui#8843\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"f0dbc67c4c1d2ad236a0fb9f65815df2b5aeaae5","branchLabelMapping":{"^v9.2.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Project:Accessibility","release_note:skip","Team:Fleet","backport:prev-minor","ci:project-deploy-observability","Team:obs-ux-infra_services","Team:obs-ux-management","v9.2.0"],"title":"Auto-fix
violations of the @elastic/eui/require-aria-label-for-modals ESLint
rule","number":227623,"url":"https://github.com/elastic/kibana/pull/227623","mergeCommit":{"message":"Auto-fix
violations of the @elastic/eui/require-aria-label-for-modals ESLint rule
(#227623)\n\n> [!CAUTION]\n> ⚠️ Changes were made by GenAI. Please
review carefully.\n\n> [!NOTE]\n> Only `EuiConfirmModal` part\n\n##
Summary\nThis PR applies the auto-fix for the newly
introduced\n`@elastic/eui/require-aria-label-for-modals` Ensures that
EUI modal\ncomponents `EuiConfirmModal` have either an `aria-label`
or\n`aria-labelledby` prop for accessibility. This helps screen reader
users\nunderstand the purpose and content of modal dialogs.\n\n##
Changes\n\n- For **function components**:\n1. Verify whether
`useGeneratedHtmlId` is imported from the\n`@elastic/eui` package. If
not, add the following import.\n2. Inside the render method, define a
new constant: `const\nconfirmModalTitleId = useGeneratedHtmlId();`\n-
For **class components**:\n1. Verify whether `htmlIdGenerator` is
imported from the `@elastic/eui`\npackage. If not, add the following
import.\n2. Inside the render method, define a new constant:
`const\nconfirmModalTitleId =
htmlIdGenerator()('confirmModalTitle');`\n\nIn both cases, add the
following props to the `EuiConfirmModal`\ncomponent:\n-
`aria-labelledby={confirmModalTitleId}`\n- `titleProps={{ id:
confirmModalTitleId }}`\n\n## Related\n-
elastic/eui#8843\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"f0dbc67c4c1d2ad236a0fb9f65815df2b5aeaae5"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.2.0","branchLabelMappingKey":"^v9.2.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/227623","number":227623,"mergeCommit":{"message":"Auto-fix
violations of the @elastic/eui/require-aria-label-for-modals ESLint rule
(#227623)\n\n> [!CAUTION]\n> ⚠️ Changes were made by GenAI. Please
review carefully.\n\n> [!NOTE]\n> Only `EuiConfirmModal` part\n\n##
Summary\nThis PR applies the auto-fix for the newly
introduced\n`@elastic/eui/require-aria-label-for-modals` Ensures that
EUI modal\ncomponents `EuiConfirmModal` have either an `aria-label`
or\n`aria-labelledby` prop for accessibility. This helps screen reader
users\nunderstand the purpose and content of modal dialogs.\n\n##
Changes\n\n- For **function components**:\n1. Verify whether
`useGeneratedHtmlId` is imported from the\n`@elastic/eui` package. If
not, add the following import.\n2. Inside the render method, define a
new constant: `const\nconfirmModalTitleId = useGeneratedHtmlId();`\n-
For **class components**:\n1. Verify whether `htmlIdGenerator` is
imported from the `@elastic/eui`\npackage. If not, add the following
import.\n2. Inside the render method, define a new constant:
`const\nconfirmModalTitleId =
htmlIdGenerator()('confirmModalTitle');`\n\nIn both cases, add the
following props to the `EuiConfirmModal`\ncomponent:\n-
`aria-labelledby={confirmModalTitleId}`\n- `titleProps={{ id:
confirmModalTitleId }}`\n\n## Related\n-
elastic/eui#8843\n\n---------\n\nCo-authored-by: kibanamachine
<42973632+kibanamachine@users.noreply.github.com>","sha":"f0dbc67c4c1d2ad236a0fb9f65815df2b5aeaae5"}}]}]
BACKPORT-->

---------

Co-authored-by: Alexey Antonov <alexwizp@gmail.com>

… ESLint rule (elastic#227623)

> [!CAUTION]
> ⚠️ Changes were made by GenAI. Please review carefully.

> [!NOTE]
> Only `EuiConfirmModal` part

## Summary
This PR applies the auto-fix for the newly introduced
`@elastic/eui/require-aria-label-for-modals` Ensures that EUI modal
components `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.

## Changes

- For **function components**:
1. Verify whether `useGeneratedHtmlId` is imported from the
`@elastic/eui` package. If not, add the following import.
2. Inside the render method, define a new constant: `const
confirmModalTitleId = useGeneratedHtmlId();`
- For **class components**:
1. Verify whether `htmlIdGenerator` is imported from the `@elastic/eui`
package. If not, add the following import.
2. Inside the render method, define a new constant: `const
confirmModalTitleId = htmlIdGenerator()('confirmModalTitle');`

In both cases, add the following props to the `EuiConfirmModal`
component:
- `aria-labelledby={confirmModalTitleId}`
- `titleProps={{ id: confirmModalTitleId }}`

## Related
- elastic/eui#8843

---------

Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>