Chat
The module allows to start a chat very easily. The history is persisted in a ref() and therefore automatically updates in the UI.
const { messages, send } = useGPT().createChat()
.createChat(options)
Creates a new chat instance.
type options = {
systemPrompt?: string
stream?: boolean
}
Parameters
| key | Type | Default | Description |
|---|---|---|---|
| systemPrompt | string | optional | Lets you start the chat with a priming-message of role system. |
| stream | boolean | optional | Adds the answer word-by-word with a delay of 50ms. |
systemPrompt can be used to define the style of the conversation like .createChat({ systemPrompt: 'You are a polite sales person' })
Return values
Returns a messages variable and a send(prompt, onSubmit) function
| key | Type | Default | Description |
|---|---|---|---|
| id | string | The internal uuid of the chat | |
| messages | ref<Message[]> | [] | Contains all messages from both the user and the assistant in historical order. |
| send | (prompt, onSubmit):Function | Is used to submit a new message to the chat. Accepts a callback function onSubmit e.g. for reseting an input field. | |
| status | string | idle | Gives the current state of the assistant as idle, thinking or streaming (if stream: true). |
type Message = {
id: string
role: 'system' | 'assistant' | 'user'
message: string
datetime_js: number
}
Example:
const { messages, send } = useGPT().createChat()
await send('Hi how are you?')
Minimal Demo
<script setup lang="ts">
const { messages, send, status } = useGPT().createChat({ stream: true })
const input = ref<string>('')
</script>
<template>
<pre>Status: {{ status }}</pre>
<pre>{{ messages }}</pre>
<input
type="text"
v-model="input"
@keyup.enter="send(input, () => (input = ''))" />
</template>