Activity feed

Tab

Moves through filters, the pill, and each expandable event.

EnterorSpace

Expands or collapses an event and marks it read.

Escape

Closes the people filter and returns focus to its button.

• Each day is a labeled section with a heading; events are an ordered list.
• Expandable events are buttons with aria-expanded and aria-controls.
• Unread state is spoken as part of the event and shown with a dot and a wash, not color alone.
• Type filters are toggle buttons with aria-pressed; the people filter uses real checkboxes.
• A polite status region announces new updates shown and how many were marked read.

• New events queue behind a pill so the list never jumps while someone reads; showing them slides the list down and scrolls to the top.
• Mark all read sends a hairline down the list; each row lets go of its dot and wash exactly as the line passes it.
• Filtering fades rows out and closes the gaps on a spring.
• Details open with a height spring and a rotating chevron.
• Reduced motion removes the sweep delay, travel, and blur and keeps instant state changes.

• Type filters scroll sideways on narrow screens.
• Below 440px the time moves into the meta line under each event.
• Day headings stick with a translucent material while their events scroll under them.

• Filtering is memoized over the item list.
• The sweep uses CSS transition delays and one Web Animations API line, so it costs no React renders per row.
• Photos load through next/image at 96px.

• Map your events to action and target so each row reads as one sentence.
• Push websocket events into incoming; the pill counts them and merges them on click.
• Keep details short: a comment, a small diff, a deploy summary, or up to four photos.
• Persist read state through onRead.

The full library index for assistants is at /llms.txt.