@aleph-alpha/chat-kit

Chat kit for building chat interfaces with Vue. Ships components, handlers (message tree via useMessageHandler, markdown, labels — from the package root or @aleph-alpha/chat-kit/handlers), a composables entry for useChat (under development), and a services layer for backends (under development).

Part of the frontend-hub monorepo.

Installation

pnpm add @aleph-alpha/chat-kit

Architecture

Chat Kit is organised into three layers:

1. Components — Pre-built Vue 3 components for chat UIs, split into base (presentational) and composed (opinionated patterns).
2. Handlers — Reactive utilities for chat state management: useMessageHandler (conversation tree), useMarkdownParser (markdown pipeline), useChatKitLabels (i18n).
3. Services (under development) — Abstract ChatService / IChatService for backend communication and streaming. Not ready for production use.

useChat (under development) lives in composables/ as a planned high-level orchestrator that composes handlers and services into a single API.

Usage

Import from specific entry points for tree-shaking:

// Services only
import { ChatService, type IChatService } from '@aleph-alpha/chat-kit/services';

// Handlers only
import { useMessageHandler } from '@aleph-alpha/chat-kit/handlers';

// Composables only
import { useChat } from '@aleph-alpha/chat-kit/composables';

// Components only
import { CkConversation } from '@aleph-alpha/chat-kit/components';

// Everything
import { ChatService, useChat, CkConversation } from '@aleph-alpha/chat-kit';

Development

This package lives in the frontend-hub monorepo. To work on it locally:

git clone [email protected]:Aleph-Alpha/frontend-hub.git
cd frontend-hub
pnpm install

# Run tests
pnpm nx run chat-kit:test

# Lint
pnpm nx run chat-kit:lint

# Storybook
pnpm nx run chat-kit:storybook

Documentation

• Overview — Architecture and features
• Quick Start — Install and minimal chat UI
• Handlers and Services — Message state, markdown, labels, services
• API Reference — Public exports (components, handlers, composables, services, types)
• CI/CD Flow — Release process and PR checks
• Storybook Deployment — Preview and production Storybook

License

MIT.