Attributes

Layout & Positioning

Attributes that control the widget's position, size, and spacing.

`bot`

UUID identifier of the bot. Required for component initialization. When set, the component connects to the Tolki backend to retrieve the bot configuration.

Property	Value
Type	`string` (UUID)
Required	Yes
Default	—

<tolki-chat bot="YOUR-BOT-UUID"></tolki-chat>

`position`

Widget positioning on the page.

Property	Value
Type	`'inline'` \| `'left'` \| `'center'` \| `'right'`
Default	`'right'`

right — Bottom-right corner (classic chat widget position)
left — Bottom-left corner
center — Bottom-center
inline — Embedded directly in the page flow (no toggle button)

<tolki-chat bot="..." position="right"></tolki-chat>
<tolki-chat bot="..." position="left"></tolki-chat>
<tolki-chat bot="..." position="center"></tolki-chat>
<tolki-chat bot="..." position="inline"></tolki-chat>

`window-size`

Size of the chat window when open.

Property	Value
Type	`'sm'` \| `'md'` \| `'lg'` \| `'xl'`
Default	`'sm'`

<tolki-chat bot="..." window-size="sm"></tolki-chat>
<tolki-chat bot="..." window-size="md"></tolki-chat>
<tolki-chat bot="..." window-size="lg"></tolki-chat>
<tolki-chat bot="..." window-size="xl"></tolki-chat>

`toggle-size`

Size of the circular button that opens/closes the chat.

Property	Value
Type	`'sm'` \| `'md'` \| `'lg'`
Default	`'md'`

<tolki-chat bot="..." toggle-size="sm"></tolki-chat>
<tolki-chat bot="..." toggle-size="md"></tolki-chat>
<tolki-chat bot="..." toggle-size="lg"></tolki-chat>

`margin`

Widget margin from the page edges, in pixels. Supports a single value or two values for X and Y axes.

Property	Value
Type	`number` \| `[number, number]`
Default	`20`

Supported formats:

Single number: "20" — equal margin on all sides
Comma-separated: "20,30" — X=20px, Y=30px
JSON array: "[20,30]" — X=20px, Y=30px

<tolki-chat bot="..." margin="20"></tolki-chat>
<tolki-chat bot="..." margin="10,30"></tolki-chat>
<tolki-chat bot="..." margin="[15,25]"></tolki-chat>
<tolki-chat bot="..." margin="0"></tolki-chat>

Overview

Complete reference of all HTML attributes available for the tolki-chat component.

Behavior

Attributes that control the widget's interactive behavior.