fix: [Search:SearchApplications:Connect page]Button behind modal dialog is announced #199668
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…og is announced Closes: elastic#199634
alexwizp
added
Project:Accessibility
release_note:skip
|
Pinging @elastic/kibana-accessibility (Project:Accessibility) |
💚 Build Succeeded
Metrics [docs]Async chunks
History
|
TattdCodeMonkey
approved these changes
Nov 12, 2024
|
Starting backport for target branches: 8.x |
kibanamachine
pushed a commit
to kibanamachine/kibana
that referenced
this pull request
Nov 12, 2024
…og is announced (elastic#199668) Closes: elastic#199634 ## Summary This PR apply similar with elastic#197212 changes to [generate_search_application_api_key_modal.tsx](https://github.com/elastic/kibana/pull/199668/files#diff-2d651cfb54cad235005b4a9361f2dc25784a4d2842dfaa02fa301e8889d7825b) dialog. ## What was changed: 1. Dialog was slightly updated to be more accessibility (a11y) friendly: - To differentiate the two UI states, we now use two colors for the panel: `primary` for the initial state and `success` when the API key is generated. - An `EuiCallOut` with `role="alert"` was added to announce status updates for screen reader users. - After creating an API key, the focus now moves to the `Download API key` button. ## Screen: https://github.com/user-attachments/assets/41285198-9ee9-4201-a1fd-35b7192b439f (cherry picked from commit fbe926c)
💚 All backports created successfully
Note: Successful backport PRs will be merged automatically after passing CI. Questions ?Please refer to the Backport tool documentation |
kibanamachine
added a commit
that referenced
this pull request
Nov 12, 2024
…l dialog is announced (#199668) (#199869) # Backport This will backport the following commits from `main` to `8.x`: - [fix: [Search:SearchApplications:Connect page]Button behind modal dialog is announced (#199668)](#199668) <!--- Backport version: 9.4.3 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sqren/backport) <!--BACKPORT [{"author":{"name":"Alexey Antonov","email":"[email protected]"},"sourceCommit":{"committedDate":"2024-11-12T19:28:20Z","message":"fix: [Search:SearchApplications:Connect page]Button behind modal dialog is announced (#199668)\n\nCloses: #199634\r\n\r\n## Summary\r\n\r\nThis PR apply similar with #197212 changes to\r\n[generate_search_application_api_key_modal.tsx](https://github.com/elastic/kibana/pull/199668/files#diff-2d651cfb54cad235005b4a9361f2dc25784a4d2842dfaa02fa301e8889d7825b)\r\ndialog.\r\n\r\n## What was changed:\r\n\r\n1. Dialog was slightly updated to be more accessibility (a11y) friendly:\r\n- To differentiate the two UI states, we now use two colors for the\r\npanel: `primary` for the initial state and `success` when the API key is\r\ngenerated.\r\n- An `EuiCallOut` with `role=\"alert\"` was added to announce status\r\nupdates for screen reader users.\r\n- After creating an API key, the focus now moves to the `Download API\r\nkey` button.\r\n\r\n## Screen: \r\n\r\n\r\nhttps://github.com/user-attachments/assets/41285198-9ee9-4201-a1fd-35b7192b439f","sha":"fbe926cfd395d09fd0e312805306eb9c019f465b","branchLabelMapping":{"^v9.0.0$":"main","^v8.17.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Project:Accessibility","release_note:skip","v9.0.0","Team:Search","backport:prev-minor"],"title":"fix: [Search:SearchApplications:Connect page]Button behind modal dialog is announced","number":199668,"url":"https://github.com/elastic/kibana/pull/199668","mergeCommit":{"message":"fix: [Search:SearchApplications:Connect page]Button behind modal dialog is announced (#199668)\n\nCloses: #199634\r\n\r\n## Summary\r\n\r\nThis PR apply similar with #197212 changes to\r\n[generate_search_application_api_key_modal.tsx](https://github.com/elastic/kibana/pull/199668/files#diff-2d651cfb54cad235005b4a9361f2dc25784a4d2842dfaa02fa301e8889d7825b)\r\ndialog.\r\n\r\n## What was changed:\r\n\r\n1. Dialog was slightly updated to be more accessibility (a11y) friendly:\r\n- To differentiate the two UI states, we now use two colors for the\r\npanel: `primary` for the initial state and `success` when the API key is\r\ngenerated.\r\n- An `EuiCallOut` with `role=\"alert\"` was added to announce status\r\nupdates for screen reader users.\r\n- After creating an API key, the focus now moves to the `Download API\r\nkey` button.\r\n\r\n## Screen: \r\n\r\n\r\nhttps://github.com/user-attachments/assets/41285198-9ee9-4201-a1fd-35b7192b439f","sha":"fbe926cfd395d09fd0e312805306eb9c019f465b"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.0.0","branchLabelMappingKey":"^v9.0.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/199668","number":199668,"mergeCommit":{"message":"fix: [Search:SearchApplications:Connect page]Button behind modal dialog is announced (#199668)\n\nCloses: #199634\r\n\r\n## Summary\r\n\r\nThis PR apply similar with #197212 changes to\r\n[generate_search_application_api_key_modal.tsx](https://github.com/elastic/kibana/pull/199668/files#diff-2d651cfb54cad235005b4a9361f2dc25784a4d2842dfaa02fa301e8889d7825b)\r\ndialog.\r\n\r\n## What was changed:\r\n\r\n1. Dialog was slightly updated to be more accessibility (a11y) friendly:\r\n- To differentiate the two UI states, we now use two colors for the\r\npanel: `primary` for the initial state and `success` when the API key is\r\ngenerated.\r\n- An `EuiCallOut` with `role=\"alert\"` was added to announce status\r\nupdates for screen reader users.\r\n- After creating an API key, the focus now moves to the `Download API\r\nkey` button.\r\n\r\n## Screen: \r\n\r\n\r\nhttps://github.com/user-attachments/assets/41285198-9ee9-4201-a1fd-35b7192b439f","sha":"fbe926cfd395d09fd0e312805306eb9c019f465b"}}]}] BACKPORT--> Co-authored-by: Alexey Antonov <[email protected]>
CAWilson94
pushed a commit
to CAWilson94/kibana
that referenced
this pull request
Nov 18, 2024
…og is announced (elastic#199668) Closes: elastic#199634 ## Summary This PR apply similar with elastic#197212 changes to [generate_search_application_api_key_modal.tsx](https://github.com/elastic/kibana/pull/199668/files#diff-2d651cfb54cad235005b4a9361f2dc25784a4d2842dfaa02fa301e8889d7825b) dialog. ## What was changed: 1. Dialog was slightly updated to be more accessibility (a11y) friendly: - To differentiate the two UI states, we now use two colors for the panel: `primary` for the initial state and `success` when the API key is generated. - An `EuiCallOut` with `role="alert"` was added to announce status updates for screen reader users. - After creating an API key, the focus now moves to the `Download API key` button. ## Screen: https://github.com/user-attachments/assets/41285198-9ee9-4201-a1fd-35b7192b439f
CAWilson94
pushed a commit
to CAWilson94/kibana
that referenced
this pull request
Nov 18, 2024
…og is announced (elastic#199668) Closes: elastic#199634 ## Summary This PR apply similar with elastic#197212 changes to [generate_search_application_api_key_modal.tsx](https://github.com/elastic/kibana/pull/199668/files#diff-2d651cfb54cad235005b4a9361f2dc25784a4d2842dfaa02fa301e8889d7825b) dialog. ## What was changed: 1. Dialog was slightly updated to be more accessibility (a11y) friendly: - To differentiate the two UI states, we now use two colors for the panel: `primary` for the initial state and `success` when the API key is generated. - An `EuiCallOut` with `role="alert"` was added to announce status updates for screen reader users. - After creating an API key, the focus now moves to the `Download API key` button. ## Screen: https://github.com/user-attachments/assets/41285198-9ee9-4201-a1fd-35b7192b439f
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Closes: #199634
Summary
This PR apply similar with #197212 changes to generate_search_application_api_key_modal.tsx dialog.
What was changed:
primaryfor the initial state andsuccesswhen the API key is generated.EuiCallOutwithrole="alert"was added to announce status updates for screen reader users.Download API keybutton.Screen:
Screen.Recording.2024-11-11.at.18.09.38.mov