[Modals]: incorrect focus order via keyboard navigation

[NatalliaAlieva]

Description

Upon activation, the modal window does not receive immediate focus with keyboard navigation, as the focus moves sequentially through remaining page elements first.

Steps to Reproduce

1. Open Modal component.
2. Navigate to "Modal with Form" example with Tab key.
3. Activate "Modal with Form" example with Enter key.
4. Try using the keyboard to navigate inside the modal right after it opens.
5. Observe the behavior of the focus.

Actual result

The focus does not immediately enter the modal window. Instead, it progresses through other elements on the underlying page before finally moving into the modal.

Screen.Recording.2024-11-04.at.10.47.51.mov

Expected result

When the modal window is activated by pressing Enter, focus should move to the first interactive element inside the modal upon pressing the Tab key. This ensures intuitive and seamless keyboard navigation within the modal.

Environment

• UUI version: 5.10.2
• Browser name: any
• Operating System: any

[AlekseyManetov]

Related to theKashey/react-focus-lock#340