@govsim/chat

React SDK for Brazilian government services chat assistant. Features CPF validation, SSE streaming chat, and a complete UI component library.

Features

• 🔐 Brazilian CPF validation and user identification
• 💬 Real-time streaming chat with Server-Sent Events (SSE)
• 🎨 Complete UI component library (shadcn/ui + Radix UI)
• 🌓 Dark mode support
• 📱 Responsive design
• 🔧 Highly customizable and composable
• 📦 Bundled CSS and dependencies (Tailwind CSS v4, TanStack Query, markdown rendering)
• 🦾 Full TypeScript support

Installation

```bash pnpm add @govsim/chat

or

npm install @govsim/chat

or

yarn add @govsim/chat ```

Peer Dependencies

```json { "react": "^19.0.0", "react-dom": "^19.0.0" } ```

Quick Start

Basic Usage

```tsx import { GovSimChatProvider, GovSimChat } from '@govsim/chat' import '@govsim/chat/styles.css'

function App() { return ( ) }

export default App ```

Controlled Dark Mode

```tsx import { useState } from 'react' import { GovSimChatProvider, GovSimChat } from '@govsim/chat' import '@govsim/chat/styles.css'

function App() { const [darkMode, setDarkMode] = useState(false)

const handleDarkModeChange = (dark: boolean) => { setDarkMode(dark) document.documentElement.classList.toggle('dark', dark) }

return ( ) } ```

API Reference

See full documentation for all exported components, hooks, and utilities.

Core Components

• GovSimChatProvider - Configuration provider
• GovSimChat - Complete chat interface
• OnboardingScreen - CPF validation screen
• ChatView - Chat interface
• ChatHeader - Header with controls

Hooks

• useOnboarding() - User identification flow
• useChatMessages() - Message fetching
• useChatStream() - SSE streaming
• useChatConfig() - Access configuration

License

MIT