Banner · an alert or status role named by its message, so screen readers hear it

This commit is contained in:
ZacharyZhang-NY committed 2026-10-08 08:04:16 -04:00
1 parent 489ef31195
commit fac20ab967
1 file changed
+8 -1
+8 -1
View File
@@ -2,7 +2,7 @@ use std::rc::Rc;
use gpui::{ use gpui::{
Animation, AnimationExt, AnyElement, App, Div, ElementId, FontWeight, IntoElement, Animation, AnimationExt, AnyElement, App, Div, ElementId, FontWeight, IntoElement,
ParentElement, RenderOnce, SharedString, Styled, Window, div, prelude::*, ParentElement, RenderOnce, Role, SharedString, Styled, Window, div, prelude::*,
}; };
use smallvec::SmallVec; use smallvec::SmallVec;
@@ -159,8 +159,15 @@ impl RenderOnce for Banner {
let theme = cx.theme(); let theme = cx.theme();
let colors = &theme.colors; let colors = &theme.colors;
let (link, close) = ((self.id.clone(), "action"), (self.id.clone(), "dismiss")); let (link, close) = ((self.id.clone(), "action"), (self.id.clone(), "dismiss"));
// Assistive tech reads the message; danger interrupts.
let role = match self.severity {
Severity::Danger | Severity::Warning => Role::Alert,
Severity::Info | Severity::Success => Role::Status,
};
div() div()
.id(self.id) .id(self.id)
.role(role)
.aria_label(self.message.clone())
.relative() .relative()
.flex() .flex()
.items_center() .items_center()