Components
Loading preview...
A modern chat input component with a web search toggle and file upload functionality. This component features an animated search toggle, file attachment support, and smooth transitions. Features: • Animated search toggle button • File upload support • Auto-resizing textarea • Dark mode compatibility • Keyboard shortcuts • Framer Motion animations for enhanced user experience • Mobile responsiveness
@kokonutd
npx shadcn@latest add https://21st.dev/r/kokonutd/ai-input-with-searchimport { AIInputWithSearch } from "@/components/ui/ai-input-with-search";
export function AIInputWithSearchDemo() {
return (
<div className="space-y-8 min-w-[350px]">
<div>
<AIInputWithSearch
onSubmit={(value, withSearch) => {
console.log('Message:', value);
console.log('Search enabled:', withSearch);
}}
onFileSelect={(file) => {
console.log('Selected file:', file);
}}
/>
</div>
</div>
);
}