Compare commits

...
Sign in to create a new pull request.

1 commit

Author SHA1 Message Date
danielhanchen
04de91fc97 studio: mark closed chat configuration aside as inert
The desktop right-rail ChatSettingsPanel collapses to width:0 with
overflow:hidden when closed, but its inner controls (Close button,
sliders, system-prompt textarea, etc.) stay mounted in the DOM. Without
inert they remain in the keyboard focus order and the accessibility
tree: pressing Tab a few times from /chat lands focus on the off-screen
"Close configuration" button, and screen readers announce panel controls
as available even though nothing is visible.

Setting inert={!open} on the aside removes the closed subtree from focus
and AT semantics. The open path is unchanged.
2026-05-20 03:14:12 +00:00

View file

@ -1500,6 +1500,13 @@ export function ChatSettingsPanel({
return (
<aside
// When `open` is false the aside collapses to width 0 with
// overflow:hidden, but its inner controls remain in the DOM
// (Configuration heading, Close button, sliders, etc). Without
// `inert`, keyboard users Tab into off-screen focusable controls
// and screen readers announce them as available. `inert` also
// sets aria-hidden semantics so AT skips the subtree entirely.
inert={!open}
className={`relative z-50 shrink-0 h-full overflow-hidden bg-panel-surface text-panel-surface-fg font-heading ${open ? "w-[17rem] border-l border-sidebar-border" : "w-0"}`}
>
<div className="h-full w-full">{settingsContent}</div>