Stop Generation Cut
Halting a stream folds the caret away, closes the partial answer with a hairline, and states that it stopped.
The animated component in this preview is rendered from the canonical file shown here. The surrounding demo shell only provides context and is not part of the copied code.
import { useEffect, useState } from "react";
import { motion, useReducedMotion } from "motion/react";
/**
* Vibary · Stop Generation Cut
*
* The halt frame of a streaming answer: the caret stops blinking and
* collapses, a hairline rule closes the partial text, and a quietAbout this pattern
The other half of a streaming answer: what happens when the reader has seen enough and hits the halt control. Left alone, a cut stream looks like a crash — the words simply quit mid-sentence and the caret keeps blinking over nothing. Here the caret folds down from the baseline, a hairline sweeps shut under the last line, and a small note settles below to say the halt was deliberate. Everything after the click is fast and monotonic, because the reader made a decision and the interface should agree with it rather than mourn it.
Where it shows up
Screens we drew to show where this motion usually sits. Illustrations, not captures of any product.
- AI assistant
A halt control replaces send while a reply streams, and the cut reply keeps whatever had arrived.
Related patterns
- Reasoning Steps UnfoldA collapsed trace line opens into numbered reasoning steps, each arriving as the panel grows.
- Streaming Text RevealWords arrive one at a time behind a soft caret — the answer is being written, not loaded.
- Agent Step TimelineEach finished stage of an agent run ticks over and grows its connector toward the one after it.