vijayksingh

AI Composer

AI chats

About

A chat thread block with a growing composer, file attachments, and a model picker whose assistant replies stream in word by word with stop, copy and retry controls.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds AI Composer to your project and fits it to your theme.

Code

How AI Composer is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import AiComposer from "@/components/ui/block-ai-composer";

export default function AiComposerDemo() {
  return (
    <div className="w-full max-w-2xl mx-auto">
      <AiComposer />
    </div>
  );
}

Dependencies

More by vijayksingh

View all
  • Weather Widget

    Weather Widget

    91
  • Meter

    Meter

    10
  • Skeleton Loader

    Skeleton Loader

    9
  • Textarea

    Textarea

    2
  • Well

    Well

    1
  • Soft Hardware Spinner

    Soft Hardware Spinner

    1
  • Settings List

    Settings List

  • Perfect Preview

    Perfect Preview

More in AI chats

View all
  • AI Actions

    AI Actions

    326
  • Agent Chat

    Agent Chat

    18
  • Memory Scope

    Memory Scope

    3
  • Attachments

    Attachments

    23
  • Message Thread

    Message Thread

    49
  • Color Picker

    Color Picker

    118
  • Chat Bubble

    Chat Bubble

    190
  • Environment Variables

    Environment Variables

    16