search

chatscope / chat-ui-kit-react

Build your own chat UI with React components in few minutes. Chat UI Kit from chatscope is an open source UI toolkit for developing web chat applications.
https://chatscope.io
MIT License
1.34k stars 116 forks source link

Unexpected overflow on ChatContainer #141

Closed AdrKacz closed 9 months ago

AdrKacz commented 10 months ago

While using the ChatContainer, this one extends the window to its maximum to display messages, which is very annoying. How can I reproduce the same behavior that in the demo https://chatscope.io/demo/chat-friends: the ChatContainer keeps a fixed height.

When the ChatContainer is empty, it is set to the height I want, the problem happens when it starts having too much message and needs to grow.

I am not using the MainContainer, I just need the ChatContainer (it looks like the demo is using the MainContainer)

Thank you,

PS: You are doing an amazing work, this package is awesome!

notzane commented 10 months ago

You can use MainContainer with no Sidebar elements to get just a ChatContainer.

<MainContainer>
  <ChatContainer>
    { content }
  </ChatContainer>
</MainContainer>
supersnager commented 9 months ago

@AdrKacz simply add height to the ChatContainer component.

<ChatContainer style={{height:"300px"}}>
  <MessageList>
  </MessageList>
</ChatContainer>