Custom container along with <MessageList> for custom user forms

[sclea]

Hey!

I'm making website chat widget and trying to place a fixed div with input field for user name in the between and , like this:

<ConversationHeader>
	...
</ConversationHeader>

<div className='my-custom-form-container'>
	<input type='text' placeholder="Your name..." />
</div>

<MessageList>
	...
<MessageList>

The idea is that input will be visible until user submit his name. Would you suggest how this can achieved?

Probably it would be nice to have a possibility to add custom container inside along with and whatever. Now React complains on "... is not a valid child...".

[supersnager]

@sclea Can you place the input inside the <MessageList />?
Here is an example: https://chatscope.io/storybook/react/?path=/docs/components-messagelist--custom-content

[sclea]

Thank you, I meant slightly different: fixed custom content AND messageList simultaneously, like this:

(It's just a mock made with DevTools.)