deposit-ui (and others): modals should auto-focus their inputs

[slint]

When opening modals in the deposit form, their first (or "best" actionable) input should be auto-focused. Some examples:

• Creators/Contributors "+ Add creator" modal: The focus should be on the search input (i.e. to quickly be able to search for an author, navigate with arrows and click enter to select)
  • Extra: when Tabing through the form, once you reach the "Role" field, it wrongly automatically selects the first option. The only way to clear it afterwards is to click the X at the right of the dropdown
• Licenses "+ Add custom" modal: Should focus on "Title" input field
• Awards "+ Add custom" modal: Should focus on "Funder" search dropdown

Some good examples of modals that auto-focus correctly:

• "Select a community" modal at top of the deposit form (focuses on the search input)
• Licenses "+ Add standard" modal (focuses on the search input)
• Awards "+ Add award" modal (focuses on the search input)
• On the record landing page, all the community management modals on the right sidebar (they focus on their search inputs)
• Member invitation modal (focuses on the "People" tab inside the modal)
  • 👉 This could be possibly improved by focusing on the member search input directly (but still much better, since you can reach it with a single Tab)

[jennur]

Just a comment to the focusing in modals!

Member invitation modal (focuses on the "People" tab inside the modal). This could be possibly improved by focusing on the member search input directly (but still much better, since you can reach it with a single Tab)

The people tab is intentionally focused on opening because it's the first focusable element in the modal. It should be this way because of accessibility concerns (see https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/examples/dialog/) – e.g. screen reader users (who can't see the UI) rely on the tab flow, where each focusable element is announced by the screen reader as they navigate.

I.e. from an accessibility perspective:

When opening modals in the deposit form, their first (or "best" actionable) input focusable element should be auto-focused.

[slint]

Thanks, that makes sense :)

I think we'll have to see how much the "Organization" option is used and if it's not we could redesign to make the most common path (i.e. "Person") quicker, and move the "Organization" option to something more secondary.