Proper UI

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.

Messaging example

BoltStackBlitzv0
  1. Lana Steiner
    Lana Steiner
    Hey team, I’ve finished with the requirements doc!
  2. Lana Steiner
    Lana Steiner

    Tech requirements.pdf

    1.2 MB

  3. You
    Awesome! Thanks.
  4. Demi Wilkinson
    Demi Wilkinson
    Good timing—was just looking at this.
  5. Today
  6. Phoenix Baker
    Phoenix Baker
    Hey Olivia, can you please review the latest design when you can?
  7. You
    Sure thing, I’ll have a look today.

Installation

npx properui@latest add messaging

Message status

Message action examples

Message action advanced

BoltStackBlitzv0

Message examples

Message simple

BoltStackBlitzv0
  1. Phoenix Baker
    Phoenix Baker
    Hey Olivia, can you please review the latest design when you can?

Message reactions

BoltStackBlitzv0
  1. Phoenix Baker
    Phoenix Baker
    Hey Olivia, can you please review the latest design when you can?
    • ❤️
    • 👌2

Message reply

BoltStackBlitzv0
  1. Phoenix Baker
    Phoenix Baker
    Sure thing, I’ll have a look today.
    Awesome, thanks!

Message attachment

BoltStackBlitzv0
  1. Phoenix Baker
    Phoenix Baker

    Latest design screenshot.jpg

    1.2 MB

Message audio

BoltStackBlitzv0
  1. Phoenix Baker
    Phoenix Baker

    00:28

Message image

BoltStackBlitzv0
  1. Phoenix Baker
    Phoenix Baker
    Latest design screenshot
    Latest design screenshot.jpg128 KB

Message writing

BoltStackBlitzv0
  1. Phoenix Baker
    Phoenix Baker
    Phoenix Baker is typing