Messaging components
Powerful and customizable React messaging components built for modern applications and websites. These messaging components are built using React Aria and styled with Tailwind CSS.
- Lana SteinerThursday 11:40amHey team, I've finished with the requirements doc!
- Lana SteinerThursday 11:40am
Tech requirements.pdf
1.2 MB
- YouThursday 11:41amAwesome! Thanks.
- Demi WilkinsonThursday 11:44amGood timing—was just looking at this.
- Phoenix BakerFriday 2:20pmHey Olivia, can you please review the latest design when you can?
- YouFriday 2:20pmSure thing, I'll have a look today.
Installation
Messaging component depends on other components to function properly. Before using them, make sure to add the required components via CLI.
Use the following command to install them:
npx untitledui add messaging
Message status
In order to display the message status separately, you can use the MessageStatus component. It accepts the status prop which can be one of the following:
sentreadfailed
Optionally, you can also pass the readAt prop to display the date and time when the message was read.
Message action examples
Below are examples and variations of this message action component:
Message examples
Below are examples and variations of this message component:
- Phonenix BakerFriday 2:20pmHey Olivia, can you please review the latest design when you can?
- Phonenix BakerFriday 2:20pmHey Olivia, can you please review the latest design when you can?
- ❤️
- 👌2
- Phonenix BakerFriday 2:20pmSure thing, I'll have a look today.Awesome, thanks!
- Phonenix BakerFriday 2:20pm
Latest design screenshot.jpg
1.2 MB
- Phonenix BakerFriday 2:20pm
00:28
- Phonenix BakerFriday 2:20pm
Latest design screenshot.jpg
128 KB
- Phonenix BakerFriday 2:20pm
- Phonenix BakerFriday 2:20pmhttps://www.untitledui.com
Untitled UI — Figma UI Kit and Design System
Untitled UI is the largest UI kit and design system for Figma in the world. Kickstart any project, save thousands of hours, and level up as a designer.
- Phonenix Baker