[Accessibility] Brand assets dialog missing focus lock and required ARIA attributes

[amberhinds]

• I've read and understood the contribution guidelines.
• I've searched for any related issues and avoided creating a duplicate issue.

Please give us a description of what happened

The brand assets dialog is missing a Tab focus lock and required ARIA attributes for screen reader users. Here is a screen reading showing keyboard navigation with the dialog open.

Screen.Recording.2025-11-14.at.9.27.36.AM.mov

To Reproduce

Step-by-step reproduction instructions

1. Turn on a screen reader such as VoiceOver or NVDA.
2. Trigger the dialog so it opens.
3. Listen as you use the Tab and Arrow keys to navigate the dialog.
4. Observe that you cna leave the dialog without closing it using but Tab and arrow navigation.
5. Additionally, not the dialog is unlabelled so all contents are read when it first opens.

Expected results

1. Dialogs will have accessible names: assign a label to the dialog by either hardcoding it using the aria-label attribute or linking it to the heading within the modal using the aria-labelledby attribute.
2. Add aria-modal="true" to the dialog element to ensure that users cannot leave the dialog when navigating with the arrow keys.
3. Add a JavaScript tab focus lock so users cannot leave the dialog when navigating with the Tab key.

Actual results

See above

Technical info

• If relevant, which editor is affected (or editors):

• Block Editor
• Gutenberg Editor
• Elementor Editor
• Classic Editor
• Other:

• Which browser is affected (or browsers):

• Chrome
• Firefox
• Safari
• Other:

Used versions

• Device you are using:
• Operating system:
• PHP version:
• WordPress version:
• WordPress Theme:
• Plugin version:
• Gutenberg plugin version:
• Elementor plugin version:
• Classic Editor plugin version:
• Relevant plugins in case of a bug: