Message

A Message component.

A component that displays a message that are designed like a chat bubble.

Component usage

import { Message } from "@caspeco/casper-ui-library";

export default function Demo() {
  return <Message>Hello world!</Message>;
}

Chat conversation

import { Message, Stack } from "@caspeco/casper-ui-library";

export default function Demo() {
  return (
    <Stack minW="200px">
      <Message author="me" time="07:30" from="Gulia" autoFloat>
        Hello Frank!
      </Message>
      <Message author="you" time="07:32" from="Frank" autoFloat>
        Hi!
      </Message>
    </Stack>
  );
}