ChatComposer
The box people write to the assistant in: what the question is about, what is attached, the words, and the toolbar that sends it.
Master
Type and press Enter to send. Add a file, take a chip off, or turn on field selection and dictation: each one goes red and says how to stop. Deep Thought stays lit while it is on.
Usage
Use ChatComposer at the foot of an assistant panel or a full-screen chat. It is one component: the ask field grows to six lines and then scrolls, Enter sends and Shift plus Enter starts a new line. scopeLabel adds the Scope to this page checkbox on top, naming the page the person is on; onScopeClose puts a close button at the end of that row so the whole row can be shut. attachments shows the files and fields going with the message, each a kit Badge you can take off, and the bar is gone when there are none. The toolbar holds add (a kit Dropdown when you pass addMenu), select fields, dictate, Deep Thought and send; send is off until something is typed. Select fields and dictate are switches: while one is on it turns red and says how to stop. See contracts/chatcomposer.json for the full contract.
Do's
- The foot of an assistant panel or a full-screen chat.
- A question that can be scoped to a page, or carry files and fields.
Don'ts
- Do not build the box from Textarea and Buttons, or add a MessageBox, PromptInput or SendButton. Use this.
- Do not use it for an ordinary form field. Use Textarea.
- Do not show the scope row on a screen with nothing to scope to, and do not name a page the person is not on.
- Do not leave the attachment bar showing when nothing is attached.
- Do not add a second strong brand Button beside send.
- Do not use raw hex.
<ChatComposer scopeLabel="Accounts page" defaultScoped mode="quick" />