Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProThe display half of mentions: it turns stored text such as @[Ada Lovelace](user:ada) into labelled mention chips or links, shows deleted people as Unknown user and gives you helpers to serialise and read plain text. Use this when comments with mentions are shown after they are saved.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it wherever a saved comment, message or note is read back, so that the stored form is stable (ids, not names) and the shown form follows the person's current name.
Do not use it when you are editing the text. Use a mention input; this component only renders.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
| ---------------- | --------------------------------- | ---------- | ----------------------------------------------- | --------------------------------------------------------------- |
| value | string | - | Stored text with @[Name](kind:id) tokens. |
| resolve | (kind, id) => { name, href? } \\ | undefined | - | Looks up the current name; return nothing for a deleted target. |
| onMentionClick | (kind, id) => void | - | Makes mentions buttons when no href is given. |
| className | string | - | Class for the text wrapper. |
<a>) when resolve returns an href, as buttons when onMentionClick is set, and as plain labelled text otherwise.Mention: <name>; the visible text is @name.@Unknown user and is not interactive.The pattern ships with a Testing Library test (mention-render-readonly.test.tsx) that covers parsing tokens, resolving current names, deleted targets, links versus buttons and the plain-text helper.