The substrate for comments threads, @-mentions, and emoji reactions on any first-class object — docs, tasks, designs, code reviews. Composed entirely from existing primitives; the pattern is in the wiring, not in new components.
When users need to talk to each other about a specific object — a design, a task, a row, a paragraph. Comments anchor to the object; mentions notify a person; reactions condense agreement without a reply. The three nest: a comment thread carries mentions inside its text and reactions on each message.
A vertical stack of comments anchored to a parent object. Each row carries author avatar + name + timestamp + body + reactions strip + reply action. Threaded replies indent one level — deeper nesting collapses to "X replies" by default.
The input field below a thread. Multiline, with attach + mention + emoji affordances inline, and Send / Cancel actions. Submits on Cmd/Ctrl+Enter; Enter inserts a newline.
Popover that opens after the user types @. Shows team members + recently-mentioned at top, fuzzy-filtered by query. Each row carries avatar + name + handle + role tag. Arrow keys navigate; Enter inserts; Esc closes without inserting.
The strip of reaction tags under a comment or message. Each tag shows emoji + count; the user's own reaction is highlighted. A trailing "+" opens the picker. Click a count to toggle the user's own reaction; long-press shows who reacted.
The emoji-grid popover that opens from the "+" button. Recent + frequent emojis at top; full categorical grid below; search input above. Arrow + Enter for keyboard; click for pointer.
@name always pings that user; emoji reactions never do. The semantic gap matters: mentions are an action ("read this"), reactions are an acknowledgment ("seen / agreed").