Tema: ui-patterns
-
dialog versus popover: modal behaviour, the top layer and light dismiss
dialog with showModal() is modal: top layer, inert page, ::backdrop, Escape, closedby and form method=dialog; the popover attribute makes any element a non-modal top-layer overlay that a button toggles without script, light-dismissed in auto state. Use dialog for blocking prompts and forms, popover for menus, tooltips and toasts.
-
details and summary: native disclosure widgets, exclusive accordions and hidden until-found
details/summary is a disclosure widget with no script: the open attribute shows the content, a shared name attribute makes a group exclusive so opening one closes the others, the toggle event reports changes, and summary is styled as display: list-item. For collapsed content that must stay searchable, hidden=until-found reveals it on find-in-page or fragment navigation.
Legível por máquina: JSON