https://github.com/ashwin-pc/open-chat-ui
https://github.com/ashwin-pc/open-chat-ui
Last synced: 10 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/ashwin-pc/open-chat-ui
- Owner: ashwin-pc
- Created: 2024-11-17T09:47:02.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-08-11T08:27:41.000Z (11 months ago)
- Last Synced: 2025-08-16T10:56:29.360Z (11 months ago)
- Language: TypeScript
- Size: 1.48 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Chat UI Component Library
A React-based chat interface component library with support for threaded conversations, file attachments, and AI model integration.

## Features
- Threaded conversations with branching support
- File attachments
- Real-time responses
- Immersive mode
- Keyboard shortcuts
- Multiple AI model support
- Dark/Light theme
- Responsive design
## Installation
```bash
npm install open-chat-ui
```
## Usage
```tsx
import { ChatApp, ChatProvider } from 'open-chat-ui';
import { apiClient } from './chat-api';
import 'open-chat-ui/style.css';
function App() {
return (
);
}
```
## Development
This repository contains both the component library and a Next.js development environment for testing.
### Local Development
1. Clone the repository:
```bash
git clone
```
2. Install dependencies:
```bash
npm install
```
3. Start the development server:
```bash
npm run dev
```
4. Build the library:
```bash
npm run build-lib
```
### Local Testing
You can use the included Next.js app to test the component library:
```bash
npm run dev
```
Visit [http://localhost:3000](http://localhost:3000) to see the chat interface in action.
## Component API
### ChatApp
Main component that renders the chat interface.
```tsx
interface ChatAppProps {
apiClient?: ChatApiInterface;
}
```
### ChatProvider
Context provider for chat functionality.
### ThemeProvider
Theme context provider for styling.
## Models
Supported AI models:
```typescript
enum BedrockModelNames {
CLAUDE_V3_5_SONNET_V2
CLAUDE_V3_5_SONNET
CLAUDE_V3_5_HAIKU
CLAUDE_V3_OPUS
CLAUDE_V3_SONNET
CLAUDE_V3_HAIKU
}
```
## Publishing
To publish a new version:
1. Update version in
package.json
2. Build the library:
```bash
npm run build-lib
```
3. Publish to npm: (also builds, but is useful to keep them seapare for now)
```bash
npm publish
```
## Tech Stack
- React 18+
- TypeScript
- Radix UI Components
- Tailwind CSS
- Lucide Icons
## License
This project is licensed under the MIT License.
## Contributing
Welcome all contributions!