Effects
What you paint into a component
Every framed component carries two slots — one under its content and one over it — and a motion channel to drive them from. gpui-ai ships none of these effects: they are the gallery’s, written the way an application would write them, to show what the slot is for.
Starts when it scrolls into view
NORD FROST · DARK · RADIUS 6/10 · BASE 16PX · SHADOW
Decorations
Thirteen, from a photograph laid straight under the words to a field of colour with light sweeping over the frame.
Two rules, and why they are rules
A layer that reaches the edge carries the frame’s radius itself. GPUI’s content mask is a rectangle, so nothing can clip a subtree to a corner on your behalf. decoration::frame_radius(cx) is the radius to round by. A layer that never reaches a corner — scattered dots, a ring in the middle — needs nothing. Note that ObjectFit::Cover hands a sprite bounds larger than the element, which puts those radii on corners that are off screen: a covered photograph has to be cropped to the frame rather than fitted into it.
A decoration never changes the size of what it decorates. The frame measures its content, and both layers are painted into the space that measurement produced. The over layer passes pointer input through, so a veil never costs the component a click.
Motion
decoration::animated drives a layer from a looping 0…1 and stops it when the frame scrolls out of view or the reader has asked for less motion — so an application’s own effect answers to the same preference every animation in this library does, without the application arranging it. decoration::toward eases towards a value the application already has, for an effect driven by a press or a pointer rather than a clock.