Multimodal Chatbot

Install it

Source

1import { MultimodalChatbotScreen } from "@/components/multimodal-chatbot/multimodal-chatbot-screen";
2 
3export default function MultimodalChatbotPage() {
4  return <MultimodalChatbotScreen />;
5}

What it pulls in

npm packages

• @ai-sdk/react
• @base-ui/react
• @phosphor-icons/react
• ai
• class-variance-authority
• lucide-react

Other registry items

• utils
• badge
• breadcrumb
• button
• textarea
• https://elements.ai-sdk.dev/api/registry/attachments.json
• https://elements.ai-sdk.dev/api/registry/conversation.json
• https://elements.ai-sdk.dev/api/registry/message.json

Files it writes

• registry/multimodal-chatbot/app/demos/multimodal-chatbot/page.tsx
• registry/multimodal-chatbot/app/api/demos/multimodal-chatbot/route.ts
• registry/multimodal-chatbot/components/multimodal-chatbot/multimodal-chatbot-screen.tsx
• registry/multimodal-chatbot/components/multimodal-chatbot/multimodal-chatbot-workspace.tsx
• registry/multimodal-chatbot/components/multimodal-chatbot/use-multimodal-chatbot.ts
• registry/multimodal-chatbot/components/multimodal-chatbot/use-multimodal-chatbot-workspace.ts
• registry/multimodal-chatbot/components/multimodal-chatbot/convert-files-to-parts.ts
• registry/multimodal-chatbot/components/multimodal-chatbot/multimodal-chatbot-session.ts
• registry/multimodal-chatbot/components/ai-elements/prompt-input.tsx
• registry/multimodal-chatbot/lib/ai-gateway/contract.ts
• registry/multimodal-chatbot/lib/multimodal-chatbot/env-source.ts
• registry/multimodal-chatbot/lib/multimodal-chatbot/env.ts
• registry/multimodal-chatbot/lib/multimodal-chatbot/runtime.ts