fix(ui): add aria-label to STT button and aria-expanded to pinned toggle (#70593)

- Voice input button had title= but no aria-label, so screen readers
  announced it without context. Add aria-label mirroring the title,
  toggling between "Voice input" and "Stop recording".
- Pinned messages toggle lacked aria-expanded, so screen readers could
  not announce the collapsed/expanded state of the section.

Co-authored-by: akinshaywai <akinshaywai@users.noreply.github.com>
This commit is contained in:
Olabode Felix Akinyemi
2026-04-23 22:10:59 +01:00
committed by GitHub
parent 5a97c0d5fd
commit b686f56b23

View File

@@ -572,6 +572,7 @@ function renderPinnedSection(
<div class="agent-chat__pinned">
<button
class="agent-chat__pinned-toggle"
aria-expanded=${vs.pinnedExpanded}
@click=${() => {
vs.pinnedExpanded = !vs.pinnedExpanded;
requestUpdate();
@@ -1251,6 +1252,7 @@ export function renderChat(props: ChatProps) {
}
}}
title=${vs.sttRecording ? "Stop recording" : "Voice input"}
aria-label=${vs.sttRecording ? "Stop recording" : "Voice input"}
?disabled=${!props.connected}
>
${vs.sttRecording ? icons.micOff : icons.mic}