Ely-GPUI-Components/frontend/src/docs/motion.md

Motion

Ely's motion lives in ely_gpui_component::motion: four durations, a few easings, and components that move. Every one honors the theme's reduced motion.

Durations and easings

Item	Value
FAST, BASE, SLOW	120, 200 and 320 ms.
THEME	280 ms, the theme's cross-fade.
NUDGE	4px, the travel of a small entrance.
duration(base, cx)	base, or 1 ms under reduced motion. Pass every duration through it.
ease_out_cubic, ease_in_out_cubic, lerp	Plain functions of t from 0 to 1.
spring	A damped spring. It overshoots past 1 before it settles.

GPUI hands an easing's value to the animator unclamped. Use spring inside the animator, on what may overshoot, such as a thumb's travel; its colors keep a plain easing.

Reduced motion

The theme's reduced_motion field starts off. Ely does not read the system's setting; the app sets it:

Theme::update(cx, |theme| theme.reduced_motion = true);

Under it, duration returns 1 ms, so a change lands at once. A motion that repeats, such as a spinner or a breathing dot, holds still instead: at 1 ms a turn it would flicker. Ely's spinner checks the flag itself; an app's own repeating animation checks it too, as the example's dot does.

Components that move

Component	Moves
Transition::new(id, shown)	Its children in and out as shown turns: Entrance::Fade, Rise or Slide.
Stagger	Rows in one after another.
Flash::new(id, key)	A tint each time key changes, fading out.
Shake::new(id, key)	A shake each time key changes; still under reduced motion.
Spinner, ProgressBar, ProgressRing	Progress, held still under reduced motion where they repeat.
Skeleton, Shimmer	Placeholders while content loads.
Flip, AnimatePresence, Reorder	Keyed rows that glide to new places, enter, leave, or drag.

Flash and Shake read the time since key changed; they do not restart an animation, so what they hold keeps its focus and state.

A window that moves

The example shows a panel that rises in, a count that flashes, a spinner, and a breathing dot, with a button that turns reduced motion on and off.