Knowledge Tile: @copilotkit/react-ui

This Knowledge Tile documents the @copilotkit/react-ui package (v1.10.6), providing comprehensive API documentation for building AI-powered chat interfaces with CopilotKit.

Contents

• tile.json: Package manifest with metadata
• docs/index.md: Entry-point documentation with overview and capability summaries
• docs/chat-components.md: CopilotChat, CopilotPopup, CopilotSidebar components
• docs/message-components.md: Message rendering components (AssistantMessage, UserMessage, etc.)
• docs/customization.md: Icons, labels, CSS properties, and component customization
• docs/hooks.md: React hooks (useCopilotChatSuggestions, useChatContext)
• docs/types.md: Complete TypeScript type definitions
• docs/dev-console.md: Development console and debugging utilities

Package Information

• Package: @copilotkit/react-ui
• Version: 1.10.6
• Type: npm
• Language: TypeScript
• Installation: npm install @copilotkit/react-ui

Documentation Structure

This is a multi-doc Knowledge Tile with:

• 1 entry-point doc (index.md)
• 6 sub-docs organized by capability
• 3,449 lines of documentation
• 46 API code blocks marked with { .api }
• Complete TypeScript type definitions
• Practical usage examples throughout

API Coverage

Components (11)

CopilotChat, CopilotPopup, CopilotSidebar, Markdown, AssistantMessage, UserMessage, ImageRenderer, RenderSuggestionsList, RenderSuggestion, CopilotDevConsole, ChatContextProvider

Hooks (2)

useCopilotChatSuggestions, useChatContext

Types & Interfaces (30+)

All exported types including props interfaces, customization types, message types, handler types, and context types

Utilities (1)

shouldShowDevConsole

Usage

Start with docs/index.md for an overview and basic usage, then explore sub-docs for detailed API documentation:

1. Getting Started: index.md
2. Chat Components: chat-components.md
3. Message Rendering: message-components.md
4. Customization: customization.md
5. Hooks: hooks.md
6. Type Definitions: types.md
7. Development Tools: dev-console.md

Compliance

This Knowledge Tile follows the official Knowledge Tile specification:

• Correct manifest format with purl
• Complete API coverage with { .api } markers
• Self-contained type definitions
• TypeScript examples
• Clear capability organization
• Practical usage examples

Verification

See VERIFICATION.md for a complete verification report documenting coverage, structure, and compliance.