> For the complete documentation index, see [llms.txt](https://docs.limio.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.limio.com/components/component-library/ai-components/component-chat-panel.md).

# Component: Chat Panel

**Available from:** Release 117

**Purpose**: Embed Limio's conversational agent inline in a page, as a chat card rather than a floating popup.

In the Page Builder this component is called **Chat Panel**. It renders a card with a header, a scrolling message list, and a message input, and connects to the same agent as the [Chat Widget](/components/component-library/ai-components/component-chat-widget.md). Use it when you want a persistent assistant inside the page layout, such as a support page, an account page, or a dedicated help column.

The panel is built on the [agent client SDK](https://docs.limio.com/ai/limio-agents/getting-started) (`@limio/sdk/ai`), so it shares the widget's conversation behaviour.

## Behaviour

* The greeting shows when the panel loads. The conversation is created on the visitor's first message.
* Visitor messages appear immediately; a typing indicator shows while the agent replies.
* Agent replies render markdown; visitor messages render as plain text.
* Authentication is automatic for signed-in customers and guests on your shop domain.
* The panel is text-only: it does not render interactive agent components such as file upload. For those, use the [Chat Widget](/components/component-library/ai-components/component-chat-widget.md).

## Props

| Prop Label              | Type   | Default Value                                                     | Notes                                                                                            |
| ----------------------- | ------ | ----------------------------------------------------------------- | ------------------------------------------------------------------------------------------------ |
| Assistant name          | string | Assistant                                                         | Shown in the header and above each agent reply. Seeds the avatar initial when no avatar is set.  |
| Status label            | string | Online                                                            | Small label next to the status dot in the header.                                                |
| Greeting message        | text   | Hi 👋 I'm here to help. Ask me anything about your order or plan. | Opening assistant message. Falls back to the agent's configured greeting if cleared.             |
| Input placeholder       | string | Reply to the assistant…                                           | Placeholder text in the message input.                                                           |
| Avatar initial or emoji | string | (empty)                                                           | Initial or emoji shown in the avatar square. Defaults to the first letter of the assistant name. |

The panel's colours and bubble style come from the agent's theme, set on the agent's Presentation tab in the admin, not from component props. See **Theming an Agent** in the Limio Agents docs.

## Pairing with a layout

For a full-height, side-by-side layout, with the agent in one column and your content in the other, choose the **Two Column — Full Panel** cart layout when creating the page. Its panel column fills the full column width and viewport height, which suits the Chat Panel.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.limio.com/components/component-library/ai-components/component-chat-panel.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.