ProgressBar

Barra de progreso segmentada estilo BIOS con lectura ASCII [████████░░░░] en vivo.

// VISTA PREVIA

> PROGRESSBAR GPU SCALEX

Núcleo Térmico Scorch CRITICAL

[███████████████░] 92%

Memoria RAM Asignada 1.36 GB / 2 GB

[███████████░░░░░] 68%

Sincronización de Paquetes NOMINAL [ ! ] LEVEL UP!

[████████████████] 100%

Prop	Tipo TypeScript	Default	Descripción	Variantes
value	`number`	`0`	Porcentaje actual de la barra (rango 0 a 100).	—
label	`string`	`undefined`	Etiqueta de texto descriptiva en la parte superior.	—
status	`string`	`''`	Texto de estado secundario alineado a la derecha.	—
variant	`'crimson' \| 'cyan' \| 'emerald'`	`'crimson'`	Variante de color de la barra de llenado acelerada por GPU.	crimson cyan emerald
showAscii	`boolean`	`true`	Muestra u oculta la representación en bloques ASCII [████░░░░].	—

Terminal // Bash BASH

ryukami-ui add progress-bar

src/pages/progress-bar-demo.astro ASTRO

01 ---

02 import ProgressBar from '@/components/ProgressBar.astro';

03 ---

05 <ProgressBar label="Nucleo Termico Velgrynd" value={92} variant="crimson" status="CRITICAL" />

06 <ProgressBar label="Memoria RAM Asignada" value={68} variant="cyan" status="1.36 GB / 2 GB" />

07 <ProgressBar label="Sincronizacion de Paquetes" value={100} variant="emerald" status="NOMINAL" />