Messenger
Messaging
Source and install need .
pnpm dlx shadcn@latest add @assembli/channel-chatChannel Chat
A Slack-style team channel. Messages read flat with avatar, name and time; follow-ups compact under them. Hover for quick reactions, an emoji picker, Reply in thread and a menu. Reactions name who reacted, @mentions highlight (yours stronger), a New line marks where you left off and day labels stick. Threads open in a side panel. The composer formats text and suggests @mentions.
Props
Other props pass through to the root element.
channel*
{ name: string; topic?: React.ReactNode; private?: boolean }
members*
ChannelMember[]
me*
string
Your member id.
messages
ChannelMessage[]
defaultMessages
ChannelMessage[]
Default
[]onMessagesChange
(messages: ChannelMessage[]) => void
onSend
(message: ChannelMessage, threadOf?: string) => void
Called after you post.
threadOfis the parent's id for a thread reply.lastReadId
string
The last message you'd read when the channel opened. A "New" line marks everything after it.
typing
string[]
Default
[]Member ids currently typing. Shown under the composer.
quickReactions
string[]
Default
QUICKEmoji offered on hover, one tap to react.
now
string | Date
The current time, for stable server rendering and demos. Posts are stamped from a clock that runs on from it.
| Description | |||
|---|---|---|---|
| channel* | { name: string; topic?: React.ReactNode; private?: boolean } | – | |
| members* | ChannelMember[] | – | |
| me* | string | – | Your member id. |
| messages | ChannelMessage[] | – | |
| defaultMessages | ChannelMessage[] | [] | |
| onMessagesChange | (messages: ChannelMessage[]) => void | – | |
| onSend | (message: ChannelMessage, threadOf?: string) => void | – | Called after you post. |
| lastReadId | string | – | The last message you'd read when the channel opened. A "New" line marks everything after it. |
| typing | string[] | [] | Member ids currently typing. Shown under the composer. |
| quickReactions | string[] | QUICK | Emoji offered on hover, one tap to react. |
| now | string | Date | – | The current time, for stable server rendering and demos. Posts are stamped from a clock that runs on from it. |
