shadcn.io is not affiliated with official shadcn/ui
Chat Fullscreen AI Block for Ark UI
A wide research window with a reading-width conversation and a pane of the chat's three files, two pinned notes and live counts, plus a Focus mode that hides the pane and Escape leaves it.
Installation
Overview
Give a long conversation room to breathe, with this fullscreen AI chat for React with Ark UI. A hairline frame with a plus mark on each corner holds a wide window of fixed height for Atlasroom, a research room. The conversation sits centred at reading width as plain assistant prose and quiet Bubble turns, and a pane at the end lists the chat's three files, each with an Ask button that puts a request about it in the composer, two pinned notes and a short list worked out from the chat: messages, estimated tokens and the model. Details in the top bar shows or hides the pane. Focus hides the pane and the secondary controls and widens the composer, and while it is on a Kbd hint says Esc leaves it. The composer's Shine Button is the only colored control; replies arrive in pieces after a Typing Indicator Text, with Stop in Send's place while one is written. The frame is ruled by Guides, and everything moves with CSS only.
FAQ
What stays in the page, and how do I make it real?
Everything. The conversation, the three file names, the notes and the replies are typed at the top of the file; replies come from a short keyed script plus two fallbacks. Nothing is read from the files, and no model runs, as the status line says. The counts are real: messages are the length of the list and the token estimate is the text's length divided by four. To wire it, pass the files to your model in post and render its pieces as they arrive.
What does Focus mode do, and how do I leave it?
It hides the pane and the Details button, swaps the sample requests for a one-line hint and widens the composer, so the conversation is the only thing left. The Focus button is pressed while it is on and Escape leaves it whenever focus is anywhere inside the window; leaving returns focus to the Focus button. The hint and the sample requests share one slot, so nothing moves when you switch.
What is in the pane?
Files with an Ask button each, Pinned notes, and "This chat" with messages, estimated tokens and the model, which update as you send. The pane scrolls on its own and the window never changes height.
How do Stop and the typing line work?
A request starts a short typing line, then the reply appears in pieces about every half second. Stop in Send's place ends it early and keeps what had arrived, marked Stopped. With reduced motion on, the reply lands whole after the typing line.
Is it usable with a keyboard and a screen reader?
The log is a focusable region announced as a log, every message starts with a hidden name and time, the pane is a labelled aside, and one polite status line says what changed. Details and Focus are pressed buttons; Ask buttons read "Ask about" and the file name.