Chat Components API

The tables below summarize the props and events exposed by each chat component. All components are standard Vue SFCs, so you can also inspect their source under src/components/ChatAgentComponents/ChatComponents/.

ChatViewWrapper

Prop	Type	Default	Description
None	–	–	Consumes useChatAgentStore internally; no external props are required.

Emits	Payload	Description
None	–	The wrapper coordinates child events internally; listen to the downstream components if you need granular hooks.

MainAIChatView

Prop	Type	Default	Description
chats	Array	[]	Array of conversation messages (conversationList entries from the store).

Emits	Payload	Description
askSelection	string	Fired when the user highlights part of a response and clicks the tooltip CTA; payload contains the selected text.

PrimaryInput

Prop	Type	Default	Description
textareaPlaceholder	String	'Enter something...'	Placeholder shown inside the textarea.
dropdownSuggestions	Array	[]	Suggestions displayed when the box is focused.
modelValue	String	''	The current input value (v-model).
hideSuggestionsDropdown	Boolean | String | Number	false	Forces the suggestion list closed.
inProgress	Boolean	false	When true, the CTA turns into a pause button and handleSubmitMessage emits pause-response.
short	Boolean | String | Number	false	Shrinks the textarea height (used after conversations have started).
referredText	String	''	Prefills the “Reference” pill shown inside the prompt box.

Emits	Payload	Description
update:modelValue	string	Standard v-model sync event.
textarea:focused	–	Fired when the textarea gains focus.
textarea:blur	–	Fired when the textarea loses focus.
files-selected	FileList | File[]	Triggered on drag/drop, paste, or manual picker uploads.
submit:message	string	Emitted when the user clicks send or presses Enter (unless streaming).
pause-response	–	Emitted when the CTA is pressed while inProgress is true.
removeReference	–	Emitted when the “reference” chip is cleared.

DraggableChatBox

Prop	Type	Default	Description
isVisible	Boolean	true	Controls whether the window is rendered (wrapper toggles this).

Emits	Payload	Description
close	–	Fired after the minimize animation completes so parents can hide the chat box.

DraggableChatBoxWrapper

This wrapper has no props or emits. It reads/writes isChatBoxVisible in the store and swaps between the launcher icon and the draggable window automatically.

UploadedFilesSection

Prop	Type	Default	Description
uploadedFiles	Array	[]	Array of file metadata objects (the same shape pushed inside ChatViewWrapper).
hideRemoveFileIcon	Boolean	false	Hides the inline “x” buttons when true.

Emits	Payload	Description
file:remove	number	Index of the removed item.
file:clicked	object	The file record that was clicked (used to open previews).

Markdown Components

Component	Purpose	Notes
CustomMarkdown	Assistant/AI message renderer	Uses markdown-it, highlight.js, click-to-copy, image zoom, color swatches.
SentMessageMarkdown	User/outbound renderer	Uses DOMPurify for sanitization, custom ordered/bullet list presentation.
FullScreenImageViewer	Modal for generated images	Emits fullScreenViewerClose and downloadImage.

RotationAnimation

Prop	Type	Default	Description
duration	Number	3	Controls both outer and inner rotation speed (seconds).
primaryColor	String	'#c8d5f7'	Gradient accent color.
secondaryColor	String	'#C6D3F7'	Animated fill color for inner blobs.
backgroundColor	String	'#F1F4FD'	Background of the outer ring.

ℹ️ OTooltip is documented separately (under general components) but is used extensively inside the chat shell for hover hints.