← All proposals

Chat Message

ChatMessage, with sender: user or agent.

Net-new componentOpen in Storybook

proposals/ChatMessage/custom.md27 lines · View on GitHub

Custom and net-new: ChatMessage

Everything in this proposal that is not plain PDS v2. npm run check:tokens reads this file: each net-new class, custom CSS variable and raw value found in the code must appear here in backticks.

Net-new components

  • .pds-chat-message — ChatMessage, with sender: user or agent.
    • Parts and modifiers: .pds-chat-message--agent, .pds-chat-message--user, .pds-chat-message__content
  • .pds-chat-message-list — ChatMessage, with sender: user or agent.

Additions to existing PDS components

None.

Net-new props

All props of ChatMessageProps are new (net-new component).

Custom CSS variables

  • --chat-message-list-gap — set on .pds-chat-message-list
  • --chat-message-max-width — set on .pds-chat-message

Raw values kept on purpose

None.