KANTO DS v1.12.0
Customise

Theme

Accent

Font

Corners

Density

Text size

Reset to Kanto
Templates

Chat

GitHub Copy link

An assistant: conversations on the side, answers that stream, and a prompt.

Demo

Live demo
Chat

The frame is the template itself, running. Everything in it works.

What to try

  • Start a new chat from a suggestion, and watch the answer stream.
  • Ask, then switch to another conversation before the answer ends: it lands in the conversation it belongs to.
  • Narrow the window: the conversations move into the shell's drawer.

Start a project

npm create kanto@latest my-app -- --template chat --stack react

Or fork it as it is, without the tool:

npx degit MrArnaudMichel/kanto/templates/chat-react my-app

What is inside

Atlas, an assistant that answers about Northwind's numbers: conversations down the side, the transcript, and a prompt — each answer streamed a word at a time.

The model is one function, reply() in src/model.ts: it streams a canned answer until you point it at your model's streaming API, and nothing else changes.

Route What it shows
To change first What it holds
src/model.ts The model. Call yours here.
src/content.ts What it says, suggests and knows.
src/conversations.ts The conversations, as plain data.
src/brand.ts The brand, in one call.

Components