API Key flyout UX behavior - Keyboard navigation broken

[SiddharthMantri]

Kibana version: 8.x

Describe the bug:
Tabbing order: when the flyout appears, the name field is in focus, but tabbing only cycles between the name field and the close button. If another control is activated, e.g. the Include metadata toggle, the tab stops will include the remainder of the flyout controls, however tabbing will then escape the flyout and cycle through the Kibana header and top navigation elements before getting stuck back in the name/close tab loop of the flyout.

Additionally, we should add screen reader attributes for the Code editors to say more than just "Code Editor"

Expected behavior: Tabbing should cycle through relevant elements within the flyout and should not escape the flyout. The user should have to close the flyout in order to tab through elements on the main screen.

Screenshots (if relevant):

Screen.Recording.2023-09-27.at.19.00.19.mov

[elasticmachine]

Pinging @elastic/kibana-security (Team:Security)

[elasticmachine]

Pinging @elastic/kibana-accessibility (Project:Accessibility)

[cee-chen]

Shoot sorry, I accidentally used a magic keyword that I should not have in my EUI PR. This won't be resolved in Kibana until the next EUI upgrade

[legrego]

Resolved via #168396

[legrego]

Actually -- @SiddharthMantri, would you mind pulling down the latest main, and verify that #168396 fixes this behavior?

[legrego]

Sid verified - looks good!