Marker accessibility: presentational by default
Marker is presentational by default. The correct semantics depend on how you use it, so you should choose the role based on intent rather than relying on a single default role.
shadcn/ui · Components · all subjects
marker/accessibility
7 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.
Marker accessibility - interactive markers
When a marker links or triggers an action, render it as a real <button> or <a> with the render prop so it is focusable and exposes the correct role. The accessible name comes from the marker text.
Marker accessibility - status and progress
For streaming or progress markers such as "Thinking..." or a running tool, set role="status" so assistive tech announces the update as it appears.
Marker interactive semantics
When a marker links or triggers an action, render it as a real button or anchor element with the asChild prop so it is focusable and exposes the correct role. The accessible name comes from the marker text.
Marker status role for accessibility
Set role="status" on a Marker and include a Spinner component for streaming or in-progress markers so updates are announced by assistive technology.
Marker accessibility for labeled separators
A separator marker that carries text, such as a date or section label, needs no role. The divider lines are decorative CSS pseudo-elements, and the text is announced as ordinary content. Do not add role="separator" to a labeled divider because the separator role takes its accessible name from aria-label, not from its text, and its contents are treated as presentational.
Marker icon decorative and hidden from assistive tech
MarkerIcon is decorative and hidden from assistive technology with aria-hidden. The adjacent MarkerContent carries the meaning. For an icon-only marker, provide an aria-label or visible text so it is not announced as empty.