RefineFrame

Marco que muestra el progreso de una imagen generada sin saltos.

Cómo instalarlo

npx shadcn@latest add https://reactbits.dev/r/RefineFrame-TS-TW

Para acciones frecuentes: confirmar, marcar, valorar. El feedback convierte un clic en una sensación.

Prop	Tipo	Por defecto
status	'queued' \| 'generating' \| 'refining' \| 'complete' \| 'error'	'generating'
children	ReactNode	-
aspectRatio	string	"4 / 3"
width	number	320
radius	number	16
background	string	"#27272a"
color	string	"#f5f5f5"
stageDuration	number	400
sweep	boolean	true
showStatus	boolean	true
hideAfter	number	1200
labels	Partial<Record<status, string>>	DEFAULT_LABELS
retryLabel	string	"Retry"
onRetry	() => void	-
className	string	""

Shredder — Lista con trituradora: arrastra una fila para destruirla.
SquishSwitch — Interruptor que se estira según la velocidad y se aplasta al llegar.
ThoughtLine — Cabecera de razonamiento de IA con pasos y temporizador.
AnimatedCircularProgressBar — Indicador circular de progreso animado.
CometDial — Dial que se lanza con un gesto y deja una estela de cometa.
GlideSelect — Selector cuyo menú sale de su esquina con un resaltado que se desliza.