KQ-829 · RENDER/QUEUE

Render Queue

Yours is third. One row for a job waiting its turn: the badge's ordinal rolls its digit down on snap and cross-fades its suffix as the host lowers position, and the estimate's seconds roll on the same spring so waiting reads as counting. At position 0 the row expands into the progress view — the inner content is measured and the wrapper's height glides to it on glide — the badge cross-fades into a ring that fills to progress, a bar runs the row, and done closes the ring and draws a tick on flick. Leave is the only focusable part and goes with the wait.

KQ-829 · RENDER/QUEUE

Poster renderFernworks Model 3about s

Press queue

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/render-queue

Props

position: number; default —; Jobs ahead of this one plus one; 0 means it is rendering.
estimateSeconds: number; default —; Seconds until the job starts; its digits roll as the host updates it.
progress: number; default 0; 0..1 of the render while position is 0.
done: boolean; default false; The render finished: the ring closes, the tick draws, the word lands on Done.
title: string; default —; What is being rendered.
model: string; default —; The invented model's name under the title.
onCancel: () => void; default —; Fires from the Leave control while waiting.
label: string; default —; Names the row for assistive technology.
cancelLabel: string; default "Leave"; Copy on the waiting control.

Prop	Type	Default	Description
position	number	—	Jobs ahead of this one plus one; 0 means it is rendering.
estimateSeconds	number	—	Seconds until the job starts; its digits roll as the host updates it.
progress	number	0	0..1 of the render while position is 0.
done	boolean	false	The render finished: the ring closes, the tick draws, the word lands on Done.
title	string	—	What is being rendered.
model	string	—	The invented model's name under the title.
onCancel	() => void	—	Fires from the Leave control while waiting.
label	string	—	Names the row for assistive technology.
cancelLabel	string	"Leave"	Copy on the waiting control.