2.0.1 • Published 2 months ago

@lg-chat/chat-window v2.0.1

Weekly downloads
-
License
Apache-2.0
Repository
-
Last release
2 months ago

Chat Window

Installation

Yarn

yarn add @lg-chat/chat-window

NPM

npm install @lg-chat/chat-window

Example

const Example = (props) => {
  const userName = "Sean Park";
  const [messages, setMessages] = useState<Array<any>>(baseMessages);

  const handleMessageSend = (messageBody: string) => {
    const newMessage = {
      messageBody,
      userName,
    };
    setMessages((messages) => [...messages, newMessage]);
  };

  return (
    <LeafyGreenChatProvider>
      <ChatWindow {...props}>
        <TitleBar title="LG Chat Demo" badgeText="Beta" />
        <MessageFeed>
          {messages.map((messageFields) => (
            <MyMessage key={messageFields.id} {...messageFields} />
          ))}
        </MessageFeed>
        <InputBar onMessageSend={handleMessageSend} />
      </ChatWindow>
    </LeafyGreenChatProvider>
  );
};

Properties

PropTypeDescriptionDefault
darkModebooleanDetermines if the component should render in dark modefalse
...HTMLElementProps<'div'>Props spread on root element