https://github.com/morph-data/agents-kit
shadcn CLI compatible React components for LLM Apps. Works perfectly with Vercel AI SDK.
https://github.com/morph-data/agents-kit
ai nextjs react shadcn-ui tailwindcss vercel-ai-sdk
Last synced: 9 months ago
JSON representation
shadcn CLI compatible React components for LLM Apps. Works perfectly with Vercel AI SDK.
- Host: GitHub
- URL: https://github.com/morph-data/agents-kit
- Owner: morph-data
- License: apache-2.0
- Created: 2025-02-13T05:18:00.000Z (12 months ago)
- Default Branch: main
- Last Pushed: 2025-03-13T13:32:41.000Z (11 months ago)
- Last Synced: 2025-03-13T14:33:03.370Z (11 months ago)
- Topics: ai, nextjs, react, shadcn-ui, tailwindcss, vercel-ai-sdk
- Language: TypeScript
- Homepage: https://agents-kit.dev
- Size: 3.5 MB
- Stars: 5
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: License.md
Awesome Lists containing this project
README
Born at [Builders Weekend Hackathon](https://www.buildersweekend.co/)
## What is Agents Kit?
Agents Kit is a collection of components and utilities that help you build chat interfaces. It is designed to be flexible and easy to use, so you can focus on building your AI / chat experience.
Agents Kit is not a component library to be installed via npm, but rather a set of components that you can copy and paste into your project.
## Example
```tsx
'use client';
import { useChat } from '@ai-sdk/react';
import { ChatForm } from '@/components/agents-kit/chat-form';
import { ChatMessages } from '@/components/agents-kit/chat-messages';
import { ScrollArea } from '@/components/ui/scroll-area';
export default function Home() {
const { messages, input, handleInputChange, handleSubmit } = useChat();
return (
);
}
```
## Installation
Everything you need to set up to use Agents Kit.
### Dependencies
Agents Kit depents on shadcn/ui. So you need to setup shadcn/ui first. https://ui.shadcn.com/docs/installation
If you are already using shadcn/ui, you can start using Agents Kit right away.
### Where to start?
First, take a look at the components and blocks. If you find one you like, feel free to copy and paste it into your project and give it a try.
If you want to see a Next.js + Vercel AI SDK example, visit: https://agents-kit.dev/docs/example/nextjs
## Lisence
Morph is [Apache 2.0](https://www.apache.org/licenses/LICENSE-2.0) licensed.