Define focus restoration for controlled dialogs
Personne n'a encore pris cette issue.
Évaluation
- Difficulté
- 5/5
- Temps estimé
- Plus d'une semaine
- Accessibilité débutants
- 35/100
- Type d'issue
- Fonctionnalité
- Clarté
- Plutôt claire
- Activité
- Active
- Stack technique
- typescript
- Domaine
- accessibility, frontend
Piste de recherche
Commencez par examiner les 16 racines de Dialog contrôlées, notamment le sélecteur de packages de référence NPM, la boîte de dialogue de suppression de rôle d’administrateur et les exemples du système de design. Comparez la disposition de leurs opener avec le Dialog partagé basé sur Radix et définissez le contrat une fois la décision en attente résolue. C’est terminé lorsque le comportement choisi de restauration du focus est implémenté et qu’un test de régression au niveau du navigateur vérifie que le focus revient après Escape et la fermeture via le bouton de fermeture.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Description
Evidence
Merged PR #1205 moved shipping overlays onto the shared Radix-backed Dialog, but the controlled-dialog call sites do not register an opener with DialogTrigger.
Current source has 16 controlled Dialog roots and no shipping DialogTrigger usage. Radix stores the trigger in context.triggerRef, then its modal onCloseAutoFocus handler prevents the browser default and calls context.triggerRef.current?.focus(). Without a registered trigger, that ref is null, so keyboard focus is not restored to the control that opened the dialog.
This is straightforward for colocated single openers, such as the NPM baseline package picker. It is not one mechanical change for every caller:
- Some dialogs are controlled by an opener in a parent component.
- The admin role removal dialog has one dynamic opener per table row.
- Some design-system examples currently keep their opener outside the
Dialogroot.
Repeated title, body, keyword, and open-PR searches found no existing owner. Issue #775 tracks unrelated empty-name, label, landmark, and skip-navigation findings.
Expected impact
Closing a dialog should return keyboard and assistive-technology users to the control that opened it. Falling back to the document body loses their place and makes repeated actions harder.
Proposed direction
Adopt one explicit controlled-dialog focus contract:
- Require
DialogTrigger asChildfor dialogs with one colocated opener. - Add a typed shared API for external or dynamic openers, such as an explicit restore-focus ref or a narrowly exposed Radix close-auto-focus callback.
- Add a browser-level regression test that opens a dialog, closes it with Escape and the close button, and verifies focus returns to the actual opener.
Alternatives and tradeoffs
- Requiring
DialogTriggereverywhere keeps the shared API smallest, but dynamic table-row openers would need dialog state and content moved per row or another structural change. - Restoring the previously active element automatically inside
DialogContentreduces call-site work, but it changes every dialog and can restore focus to a stale or unrelated node when opening is indirect. - Exposing only
onCloseAutoFocusmatches Radix directly, but every caller must repeat the same focus logic and the shared primitive cannot enforce consistency.
Decision needed
@tannerlinsley, should the shared controlled-dialog contract support both DialogTrigger for colocated openers and an explicit restore-focus ref for external or dynamic openers, or should every dialog be restructured so one DialogTrigger always owns the opener?
Source: #1205
- Langage dominant
- TypeScript
- Étoiles
- 1.1k
- Forks
- 401
- Merge moyen
- 18 h 44 min
- PR mergées (30 j)
- 55
Guide de contribution
Aucun guide de contribution indexé pour ce dépôt
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Autres issues de TanStack/tanstack.com
-
source-audit
Difficulté 1/5 Moins d'une heure Accessibilité débutants 84/100
TanStack/tanstack.com#1195 ·
-
source-audit
Difficulté 2/5 1-3 heures Accessibilité débutants 68/100
TanStack/tanstack.com#1194 · 2 commentaires ·
-
source-audit
Difficulté 2/5 1-3 heures Accessibilité débutants 72/100
TanStack/tanstack.com#1177 · 1 commentaire ·
-
Difficulté 2/5 1-3 heures Accessibilité débutants 64/100
TanStack/tanstack.com#1059 ·
-
Difficulté 2/5 1-3 heures Accessibilité débutants 65/100
TanStack/tanstack.com#1047 ·
Toutes les issues de TanStack/tanstack.com
Issues similaires
-
VerificationGate: ATTRIBUTION quote guard never matches a normal quotation (\b around the quote) Ouverte
Difficulté 2/5 1-3 heures Accessibilité débutants 75/100
danielmiessler/LifeOS#2234 ·
-
T: Bug
Difficulté 2/5 1-3 heures Accessibilité débutants 75/100
-
Difficulté 2/5 1-3 heures Accessibilité débutants 65/100
-
Difficulté 1/5 Moins d'une heure Accessibilité débutants 85/100
-
Mend: dependency security vulnerability untriaged
Difficulté 2/5 1-3 heures Accessibilité débutants 70/100