Interaction / component

Task Status Morph

Five original SVG poses, controlled task state and two actual cancellable local word-count examples.

Example

Preparing preview…

Take it with you.

SOURCE ACCESS

Enter the shared password to copy the complete source, download every file, and install components in your app.

Access lasts 24 hours. Your preview settings stay with you.

TaskStatusMorph accepts caller requestId and idle/running/success/error/cancelled. The same SVG node morphs and spins only while running; no timer infers success.
Complete Inline/Button count actual whitespace-separated words locally in abortable 128-character slices. Start and Retry are explicit; cancellation or a newer request cannot admit an old result.
runWordCount supports AbortSignal and validates a 50,000-code-unit maximum. No model/service call, persistence or artificial completion delay is included.
Pass onRetry from your own request owner. Replay restarts decoration while keeping the current task, draft and result. Pause/hidden/offscreen/reduced stop continuous frames.

React 19.2Modern browsers

Chungus UI · Original project implementation; no restricted reference recipe or asset.

Prop	Type	Default	Description
`requestId` (required)	string	`required`	Fresh caller identity; local samples guard each current request.
`state` (required)	idle \| running \| success \| error \| cancelled	`required`	Authoritative caller state; success maps to the check pose.
`label`	string	`state label`	Optional readable status override.
`onRetry`	() => void	`undefined`	Explicit native Retry for error/cancelled only; decoration never calls it.
`headline`	string	`Small actions, clear outcomes.`	Complete context heading.
`initialText`	string	`Every useful agent starts with a clear task.`	Complete initial editable text.
`paused`	boolean	`false`	Suspend decoration without changing caller state, retained text, local input or results.
`replayToken`	number	`0`	Restart decoration while retaining caller state and local work in the new contexts. Legacy Thought/Lattice Demo explicitly restarts its synthetic interaction.