AI Composer

The block is a composition, so it follows your theme preset. Copy the source from the Code tab and wire onSend to your model; uploads, the Drive, GitHub and screenshot actions, dictation and the replies here are simulated.

What it's made of

Every state

• Empty. A greeting, the composer and three suggestions. A suggestion fills the composer so it can be edited before sending.
• Typing. Send is muted until there is something to send. / at the start of a word opens the commands, @ opens files and docs; the choice is inserted as text, so undo and paste keep working.
• Attaching. Upload file opens the file picker; Drive, GitHub and a screenshot add a file that uploads in place. While a file uploads, Send says so and does not send. A paste of more than 1,200 characters becomes a Pasted text attachment instead of filling the field.
• Over the limit. The counter appears near 4,000 characters and Send refuses a message over it.
• Dictating. The mic swaps the field for a level meter with Cancel and Insert; the toolbar stays, so the model can still be changed.
• Choosing a model. The model menu lists the models, then Effort, which opens a submenu that says what more effort costs and marks the recommended level and the most expensive one, then a Fast mode switch. With fast mode on, replies arrive in bigger chunks after a shorter think.
• Sending. The first message moves the composer from the middle of the stage to its foot, and the reply appears below the message.
• Thinking and searching. With Extended thinking or Web search on, the reply opens with its steps, which settle into "Thought for 1s" and "Searched 6 sites". With both off, typing dots hold the place of the first words.
• Streaming. Send becomes Stop. Stop ends the reply where it is and marks it stopped.
• Done or stopped. Copy and Retry sit under the reply. Retry runs it again in place; New chat starts over.

Motion

Every movement explains a change, and none plays when the block first appears.

• The composer travels from the middle to the foot of the stage when the first message is sent, and back on New chat.
• Upload progress fills each file's bar, and the menus open on the house popup motion.
• The reply grows in chunks of whole words; the steps open and close on the panel curve.

With reduced motion the composer changes place at once, and every state and announcement stays.

Keyboard and screen readers

• Enter sends, Shift+Enter adds a line. With the command or file list open, arrows move through it, Enter or Tab inserts the choice and Escape closes it.
• Web search, Extended thinking and the mic keep one name and report their state as pressed; the state also shows in their fill and tooltip, never colour alone.
• Send names what it will do: Send message, Send after uploads finish, or Stop generating.
• One polite status region reports what happened — a file added, a long paste turned into an attachment, the model and effort chosen, the reply finished or stopped — and the conversation list announces each reply starting and ending.

In a narrow block

The block answers to its own width, not the window's. Below 42rem the tool toggles fold to their icons, with the label kept for screen readers and shown in the tooltip. Below 24rem the suggestions stack to full width. The toolbar stays one row at 320px.