# Chat

> Add a chat window with the same agent, for visitors who would rather type.

Source: https://voxio.in/docs/chat · voxioagent 2.0.0 · Index: https://voxio.in/docs/llms.txt

The chat window, `<voxio-chat>`, talks to the same flow as your voice widgets. It opens with the agent's greeting and keeps the conversation when the visitor reloads.

## Add the chat

Mount the chat with your flow key:

HTML:

```html
<script src="https://cdn.jsdelivr.net/npm/voxioagent@2.0.0/dist/voxio.js"
        data-flow-key="YOUR_FLOW_KEY" data-widget="chat" defer></script>
```

JavaScript:

```js
import { mountChat } from "voxioagent/widget";

const chat = mountChat({ flowKey: "YOUR_FLOW_KEY", config: { botName: "Asha" } });
```

React:

```jsx
import { VoxioChat } from "voxioagent/react";

<VoxioChat flowKey="YOUR_FLOW_KEY" config={{ botName: "Asha" }} />
```

Replace `YOUR_FLOW_KEY` with your flow key, from the flow's **Overview** in the dashboard.

A chat launcher appears in the corner. Opening it shows the agent's greeting.

## Options

- `flowKey` (string, required): Your flow key.
- `config` (Partial<ChatbotConfig>): The look and text of the window, such as `botName`, `welcomeMessage`, `placeholder`, `primaryColor` and `chatWidth`.
- `draggable` (boolean): Lets the visitor drag the launcher. It snaps to an edge and remembers the spot.
- `environment` ("standard" | "gpu"): The deployment. See [Servers and environments](https://voxio.in/docs/environments.md).
- `debug` (boolean): Prints diagnostics to the console.

## Read the messages

To follow the conversation from your own code, subscribe to it:

```js
const off = chat.onMessage((message) => console.log(message));

chat.getMessages();   // everything so far
chat.sessionId;       // the conversation's session id
chat.destroy();       // ends the session and removes the chat
```

Call `off()` to stop listening.

## Next steps

- [Customising widgets](https://voxio.in/docs/customising.md): match the chat to your brand.
- [Webhooks](https://voxio.in/docs/webhooks.md): receive each conversation on your server.
