Component: Chat Panel

Inline AI assistant panel: an in-page chat surface built on the agent client SDK.

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. 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 (@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.

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.