AI screens
Eleven screens covering a whole assistant: an empty prompt, a streaming answer, cited sources, an image result, and the states a model forces you to handle. Every control is an instance of a component you already have, so one token change moves all eleven.
Preview
Eleven screens covering a whole assistant: an empty prompt, a streaming answer, cited sources, an image result, and the states a model forces you to handle. Each screen exists twice in the file, once with Color Tokens on Light and once on Dark, so the theme button swaps an export rather than restyling anything.






















The Light row and the Dark row are the same eleven frames with one variable mode changed, not two separate builds.
What it is built from
This is the whole point of the set. The eleven screens place 128 instances, 83 of them Appetite components across 9 distinct components and 45 of them Lucide icons. Two components, Message and Prompt Composer, carry the assistant itself.
Everything else is layout and text. This set draws more locally than the other two: the model switcher under the header, the icon tile on New chat and Projects, the project and file rows, the source cards and the figure table inside a reply. The switcher and the rows duplicate Dropdown and List, and are the two worth folding back in.
Overlays and scrims
Four of the eleven screens are another screen with something laid over it. Each overlay is an instance sitting on a local scrim, and each brings its own status bar, which is why those screens count two.
Manage chat is the deepest screen in the set: a thread, a drawer over it and a menu over that, 16 instances placed and 43 nested. It is the one to look at when you want to know whether the layering holds.
Tokens
No screen carries a raw colour, a raw radius or a raw type size. Every frame sits in a variable mode and reads down through the same six collections as every component.
Every AI frame is pinned to Color Tokens Light or Dark and Platform ios-md. The dark row is the light row with one mode changed, which is why the two exports agree line for line. Rebrand at Colors and all eleven screens follow.