ansimax 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.es.md +629 -0
- package/README.md +629 -0
- package/dist/index.d.mts +708 -0
- package/dist/index.d.ts +708 -0
- package/dist/index.js +1707 -0
- package/dist/index.mjs +1632 -0
- package/package.json +110 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 Brashkie
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.es.md
ADDED
|
@@ -0,0 +1,629 @@
|
|
|
1
|
+
<div align="center">
|
|
2
|
+
|
|
3
|
+
<img src="media/ansimax.png" alt="Ansimax" width="180"/>
|
|
4
|
+
|
|
5
|
+
# Ansimax
|
|
6
|
+
|
|
7
|
+
### La librería definitiva para crear interfaces de consola en Node.js
|
|
8
|
+
|
|
9
|
+
Colores • Gradientes • Animaciones • ASCII Art • Pixel Art • Componentes • Temas
|
|
10
|
+
|
|
11
|
+
[](#)
|
|
12
|
+
[](LICENSE)
|
|
13
|
+
[](tsconfig.json)
|
|
14
|
+
[](#)
|
|
15
|
+
[](#)
|
|
16
|
+
[](#)
|
|
17
|
+
|
|
18
|
+
[English](README.md) · **Español**
|
|
19
|
+
|
|
20
|
+
</div>
|
|
21
|
+
|
|
22
|
+
---
|
|
23
|
+
|
|
24
|
+
## 🎬 Vista previa en vivo
|
|
25
|
+
|
|
26
|
+
Mira Ansimax en acción — todas las animaciones y loaders corriendo en vivo:
|
|
27
|
+
|
|
28
|
+
### Animaciones
|
|
29
|
+
|
|
30
|
+
https://github.com/Brashkie/ansimax/raw/main/media/animations.mp4
|
|
31
|
+
|
|
32
|
+
### Loaders
|
|
33
|
+
|
|
34
|
+
https://github.com/Brashkie/ansimax/raw/main/media/loaders.mp4
|
|
35
|
+
|
|
36
|
+
> 💡 GitHub renderiza estos MP4 como reproductores de video integrados al subir el repo. O ejecútalos localmente con `npx tsx examples/animations.ts` y `npx tsx examples/loaders.ts`.
|
|
37
|
+
|
|
38
|
+
---
|
|
39
|
+
|
|
40
|
+
## 🌟 ¿Qué es Ansimax?
|
|
41
|
+
|
|
42
|
+
**Ansimax** es una librería moderna de Node.js, sin dependencias, que convierte tu terminal en un lienzo vibrante y dinámico. Combina colores ANSI avanzados, animaciones fluidas, ASCII art, pixel art, componentes interactivos y un sistema de temas — todo en un único paquete escrito en TypeScript estricto y con tipos completos.
|
|
43
|
+
|
|
44
|
+
Diseñada para desarrolladores que quieren publicar CLIs que **se sientan** profesionales.
|
|
45
|
+
|
|
46
|
+
---
|
|
47
|
+
|
|
48
|
+
## 💡 ¿Por qué Ansimax?
|
|
49
|
+
|
|
50
|
+
- ⚡ **Cero dependencias** — sin bloat, sin vulnerabilidades transitivas, sin conflictos de versiones
|
|
51
|
+
- 🎯 **Una librería en lugar de 10** — reemplaza `chalk` + `ora` + `cli-table3` + `figlet` + `gradient-string` y más
|
|
52
|
+
- 🎨 **Truecolor de 24 bits + gradientes** out of the box — fallback automático a 256/16 cuando hace falta
|
|
53
|
+
- 🧠 **Pensada para CLIs reales** — soporte de `AbortSignal`, cumple `NO_COLOR`, consciente de TTY
|
|
54
|
+
- 🛡️ **100% de cobertura de tests** — más de 750 tests en cada módulo
|
|
55
|
+
- 📘 **TypeScript primero** — modo estricto, tipos completos, cero `any`
|
|
56
|
+
|
|
57
|
+
---
|
|
58
|
+
|
|
59
|
+
## 🆚 Comparación
|
|
60
|
+
|
|
61
|
+
| Característica | **Ansimax** | chalk | ora | cli-table3 | figlet | gradient-string |
|
|
62
|
+
|------------------------|-------------|-------|------|------------|--------|-----------------|
|
|
63
|
+
| 16 colores | ✅ | ✅ | ➖ | ➖ | ➖ | ➖ |
|
|
64
|
+
| 256 colores | ✅ | ✅ | ➖ | ➖ | ➖ | ➖ |
|
|
65
|
+
| Truecolor (24 bits) | ✅ | ✅ | ➖ | ➖ | ➖ | ✅ |
|
|
66
|
+
| Gradientes | ✅ | ❌ | ❌ | ❌ | ❌ | ✅ |
|
|
67
|
+
| Animaciones | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ |
|
|
68
|
+
| Spinners | ✅ | ❌ | ✅ | ❌ | ❌ | ❌ |
|
|
69
|
+
| Barras de progreso | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ |
|
|
70
|
+
| Tablas | ✅ | ❌ | ❌ | ✅ | ❌ | ❌ |
|
|
71
|
+
| ASCII art / banners | ✅ | ❌ | ❌ | ❌ | ✅ | ❌ |
|
|
72
|
+
| Pixel art / canvas | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ |
|
|
73
|
+
| Temas | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ |
|
|
74
|
+
| Soporte de AbortSignal | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ |
|
|
75
|
+
| Cero dependencias | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ |
|
|
76
|
+
|
|
77
|
+
> Ansimax reemplaza más de 5 paquetes separados con una sola librería sin dependencias.
|
|
78
|
+
|
|
79
|
+
---
|
|
80
|
+
|
|
81
|
+
## 📦 Instalación
|
|
82
|
+
|
|
83
|
+
```bash
|
|
84
|
+
npm install ansimax
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
```bash
|
|
88
|
+
yarn add ansimax # Yarn
|
|
89
|
+
pnpm add ansimax # PNPM
|
|
90
|
+
bun add ansimax # Bun
|
|
91
|
+
```
|
|
92
|
+
|
|
93
|
+
**Requiere Node.js >= 18**
|
|
94
|
+
|
|
95
|
+
---
|
|
96
|
+
|
|
97
|
+
## ⚡ Ejemplo de 30 segundos
|
|
98
|
+
|
|
99
|
+
```ts
|
|
100
|
+
import { color } from 'ansimax';
|
|
101
|
+
|
|
102
|
+
console.log(color.green('Hola mundo'));
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
Eso es todo. Sin config, sin setup. ¿Quieres más? Sigue leyendo.
|
|
106
|
+
|
|
107
|
+
---
|
|
108
|
+
|
|
109
|
+
## 🚀 Inicio rápido
|
|
110
|
+
|
|
111
|
+
```ts
|
|
112
|
+
import { color, animate, loader, ascii, components, gradient } from 'ansimax';
|
|
113
|
+
|
|
114
|
+
// Colores con estilos apilados (un solo reset ANSI, sin anidamiento)
|
|
115
|
+
console.log(color.bold(color.cyan('¡Hola, terminal!')));
|
|
116
|
+
|
|
117
|
+
// Texto con gradiente
|
|
118
|
+
console.log(gradient('Flujo de color suave', ['#ff6b6b', '#feca57', '#48dbfb']));
|
|
119
|
+
|
|
120
|
+
// Typewriter animado
|
|
121
|
+
await animate.typewriter('Bienvenido a Ansimax...', { speed: 50 });
|
|
122
|
+
|
|
123
|
+
// Spinner con estado de éxito
|
|
124
|
+
const stop = loader.spin('Construyendo proyecto...', { color: '#00ff88' });
|
|
125
|
+
await hacerTrabajo();
|
|
126
|
+
stop('Construido con éxito', true);
|
|
127
|
+
|
|
128
|
+
// Banner ASCII
|
|
129
|
+
console.log(ascii.banner('ANSIMAX', { font: 'big', align: 'center' }));
|
|
130
|
+
|
|
131
|
+
// Tabla como componente
|
|
132
|
+
console.log(components.table([
|
|
133
|
+
['Nombre', 'Estado'],
|
|
134
|
+
['Build', '✓ listo'],
|
|
135
|
+
], { header: true, borderStyle: 'rounded' }));
|
|
136
|
+
```
|
|
137
|
+
|
|
138
|
+
---
|
|
139
|
+
|
|
140
|
+
## ✨ Características
|
|
141
|
+
|
|
142
|
+
| Módulo | Capacidades |
|
|
143
|
+
|---|---|
|
|
144
|
+
| 🎨 **Colores** | 16 colores · 256 colores · truecolor de 24 bits · hex · RGB · `compose()` para apilar estilos · soporta `NO_COLOR` |
|
|
145
|
+
| 🌈 **Gradientes** | Lineales · multi-stop · arcoíris · rectángulos de gradiente (horizontal, vertical, diagonal, radial) |
|
|
146
|
+
| ⚡ **Animaciones** | typewriter · fadeIn · fadeOut · slide · pulse · wave · glitch · reveal — todas con `AbortSignal` |
|
|
147
|
+
| 🔄 **Loaders** | 11 estilos de spinner · barras de progreso animadas · ejecución de tareas (secuencial y paralela) · countdowns |
|
|
148
|
+
| 🖼️ **ASCII Art** | Dos fuentes · `box()` con 6 estilos de borde · separadores ANSI-aware · banners con gradiente |
|
|
149
|
+
| 🎬 **Frames** | Motor de frames · render en vivo · barras de carga · pelota rebotando · **morph** (texto→texto) |
|
|
150
|
+
| 🧩 **Componentes** | Tablas · mensajes de estado · badges · barras de progreso · timelines · menús interactivos (single/multi-select) |
|
|
151
|
+
| 🌃 **Temas** | 8 temas integrados (Dracula, Nord, Monokai, Cyberpunk, Pastel, Matrix, Ocean, Sunset) · temas personalizados |
|
|
152
|
+
| 🖌️ **Pixel Art** | Renderizado half-block · librería de sprites · API de canvas · transformaciones (flip, rotate) |
|
|
153
|
+
| 🛠️ **Utilidades** | `truncateAnsi` · `wordWrap` (con soft-break) · `repeatVisible` · `stripAnsi` · matemática de colores |
|
|
154
|
+
|
|
155
|
+
---
|
|
156
|
+
|
|
157
|
+
## 📸 Galería
|
|
158
|
+
|
|
159
|
+
### Colores y gradientes
|
|
160
|
+
<div align="center">
|
|
161
|
+
<img src="media/colors.png" alt="Colores y gradientes" width="700"/>
|
|
162
|
+
</div>
|
|
163
|
+
|
|
164
|
+
```ts
|
|
165
|
+
import { color, gradient, rainbow, compose } from 'ansimax';
|
|
166
|
+
|
|
167
|
+
// 16, 256 y 24 bits
|
|
168
|
+
color.red('básico'); // 16 colores
|
|
169
|
+
color.color256(196)('paleta'); // 256 colores
|
|
170
|
+
color.hex('#48dbfb')('truecolor'); // 24 bits
|
|
171
|
+
color.rgb(255, 100, 50)('personalizado'); // RGB
|
|
172
|
+
|
|
173
|
+
// Apila estilos con compose() — un solo reset, sin anidamiento
|
|
174
|
+
const errorStyle = compose(color.bold, color.red, color.underline);
|
|
175
|
+
console.log(errorStyle('ERROR CRÍTICO'));
|
|
176
|
+
|
|
177
|
+
// Gradientes con varios stops
|
|
178
|
+
gradient('Flujo suave', ['#ff6b6b', '#feca57', '#48dbfb']);
|
|
179
|
+
rainbow('¡Texto arcoíris!');
|
|
180
|
+
```
|
|
181
|
+
|
|
182
|
+
---
|
|
183
|
+
|
|
184
|
+
### ASCII Art
|
|
185
|
+
<div align="center">
|
|
186
|
+
<img src="media/ascii_art.png" alt="ASCII art" width="700"/>
|
|
187
|
+
</div>
|
|
188
|
+
|
|
189
|
+
```ts
|
|
190
|
+
import { ascii, rainbow } from 'ansimax';
|
|
191
|
+
|
|
192
|
+
ascii.big('HELLO'); // fuente grande de 5 líneas
|
|
193
|
+
ascii.small('hello'); // fuente compacta de 3 líneas
|
|
194
|
+
ascii.banner('ANSIMAX', {
|
|
195
|
+
font: 'big',
|
|
196
|
+
colorFn: rainbow,
|
|
197
|
+
align: 'center',
|
|
198
|
+
});
|
|
199
|
+
|
|
200
|
+
// Cajas con 6 estilos de borde
|
|
201
|
+
ascii.box(rainbow('¡Caja arcoíris!'), {
|
|
202
|
+
borderStyle: 'double',
|
|
203
|
+
padding: 2,
|
|
204
|
+
});
|
|
205
|
+
|
|
206
|
+
// Separadores con conciencia ANSI
|
|
207
|
+
ascii.divider({
|
|
208
|
+
label: color.cyan(' SECCIÓN '),
|
|
209
|
+
width: 60,
|
|
210
|
+
});
|
|
211
|
+
```
|
|
212
|
+
|
|
213
|
+
---
|
|
214
|
+
|
|
215
|
+
### Componentes
|
|
216
|
+
<div align="center">
|
|
217
|
+
<img src="media/components.png" alt="Componentes UI" width="700"/>
|
|
218
|
+
</div>
|
|
219
|
+
|
|
220
|
+
```ts
|
|
221
|
+
import { components } from 'ansimax';
|
|
222
|
+
|
|
223
|
+
// Tablas con auto-ajuste de columnas
|
|
224
|
+
components.table([
|
|
225
|
+
['Nombre', 'Estado', 'Puntaje'],
|
|
226
|
+
['Ana', '✓ activa', '95'],
|
|
227
|
+
['Luis', '⚠ pendiente', '78'],
|
|
228
|
+
], { header: true, borderStyle: 'rounded' });
|
|
229
|
+
|
|
230
|
+
// Mensajes de estado
|
|
231
|
+
components.status('success', 'Todos los tests pasaron');
|
|
232
|
+
components.status('error', 'Build falló');
|
|
233
|
+
components.status('warn', 'Aviso de deprecación');
|
|
234
|
+
|
|
235
|
+
// Badges
|
|
236
|
+
components.badge('VERSION', 'v1.0.0');
|
|
237
|
+
components.badge('BUILD', 'passing');
|
|
238
|
+
|
|
239
|
+
// Menús interactivos (con soporte de AbortSignal)
|
|
240
|
+
const choice = await components.menu([
|
|
241
|
+
'Instalar dependencias',
|
|
242
|
+
'Ejecutar tests',
|
|
243
|
+
'Desplegar',
|
|
244
|
+
'Cancelar',
|
|
245
|
+
], { multiSelect: false });
|
|
246
|
+
```
|
|
247
|
+
|
|
248
|
+
---
|
|
249
|
+
|
|
250
|
+
### Timeline
|
|
251
|
+
<div align="center">
|
|
252
|
+
<img src="media/timeline.png" alt="Componente timeline" width="700"/>
|
|
253
|
+
</div>
|
|
254
|
+
|
|
255
|
+
```ts
|
|
256
|
+
components.timeline([
|
|
257
|
+
{ label: 'Inicio del proyecto', done: true, time: '10:00' },
|
|
258
|
+
{ label: 'Pipeline de build', done: true, time: '10:15' },
|
|
259
|
+
{ label: 'Ejecutar tests', done: true, time: '10:32' },
|
|
260
|
+
{ label: 'Desplegar a npm', done: false, time: 'pendiente' },
|
|
261
|
+
]);
|
|
262
|
+
```
|
|
263
|
+
|
|
264
|
+
---
|
|
265
|
+
|
|
266
|
+
### Loaders y progreso
|
|
267
|
+
<div align="center">
|
|
268
|
+
<img src="media/loaders.png" alt="Loaders y barras de progreso" width="700"/>
|
|
269
|
+
</div>
|
|
270
|
+
|
|
271
|
+
```ts
|
|
272
|
+
import { loader } from 'ansimax';
|
|
273
|
+
|
|
274
|
+
// Spinner — 11 estilos integrados
|
|
275
|
+
const stop = loader.spin('Procesando...', {
|
|
276
|
+
type: 'dots', // dots, line, arrow, bounce, star, moon, clock...
|
|
277
|
+
color: '#00ff88',
|
|
278
|
+
signal: ctrl.signal, // Compatible con AbortSignal
|
|
279
|
+
});
|
|
280
|
+
stop('Completado', true);
|
|
281
|
+
|
|
282
|
+
// Barra de progreso animada
|
|
283
|
+
await loader.progressAnimate(50, 'Instalando', {
|
|
284
|
+
delay: 30,
|
|
285
|
+
color: '#48dbfb',
|
|
286
|
+
});
|
|
287
|
+
|
|
288
|
+
// Ejecutor de tareas — secuencial o paralelo
|
|
289
|
+
await loader.tasks([
|
|
290
|
+
{ text: 'Obtener deps', fn: async () => fetch() },
|
|
291
|
+
{ text: 'Compilar src', fn: async () => compile() },
|
|
292
|
+
{ text: 'Run tests', fn: async () => test() },
|
|
293
|
+
], { parallel: false });
|
|
294
|
+
|
|
295
|
+
// Countdown
|
|
296
|
+
await loader.countdown(5, {
|
|
297
|
+
label: 'Lanzamiento en',
|
|
298
|
+
color: '#ffd700',
|
|
299
|
+
});
|
|
300
|
+
```
|
|
301
|
+
|
|
302
|
+
---
|
|
303
|
+
|
|
304
|
+
### Pixel Art y Canvas
|
|
305
|
+
<div align="center">
|
|
306
|
+
<img src="media/pixel_art.png" alt="Pixel art y canvas" width="700"/>
|
|
307
|
+
</div>
|
|
308
|
+
|
|
309
|
+
```ts
|
|
310
|
+
import { images, createCanvas } from 'ansimax';
|
|
311
|
+
|
|
312
|
+
// Sprites integrados: heart, star, smiley, pacman
|
|
313
|
+
console.log(images.sprite('heart', { scale: 2 }));
|
|
314
|
+
|
|
315
|
+
// Transformaciones de sprites
|
|
316
|
+
const flipped = images.flipHorizontal(images.sprites.heart.pixels);
|
|
317
|
+
const rotated = images.rotate90(images.sprites.star.pixels);
|
|
318
|
+
|
|
319
|
+
// Dibujo en canvas personalizado
|
|
320
|
+
const canvas = createCanvas(30, 10);
|
|
321
|
+
canvas.drawRect(0, 0, 30, 10, { r: 30, g: 30, b: 50 }, true);
|
|
322
|
+
canvas.drawCircle(15, 5, 4, { r: 255, g: 200, b: 0 }, true);
|
|
323
|
+
canvas.print();
|
|
324
|
+
|
|
325
|
+
// Rectángulos con gradiente — horizontal, vertical, diagonal, radial
|
|
326
|
+
images.gradientRect({
|
|
327
|
+
width: 50, height: 8,
|
|
328
|
+
colors: ['#ff0080', '#7928ca', '#0070f3'],
|
|
329
|
+
style: 'radial',
|
|
330
|
+
});
|
|
331
|
+
```
|
|
332
|
+
|
|
333
|
+
---
|
|
334
|
+
|
|
335
|
+
### Temas
|
|
336
|
+
<div align="center">
|
|
337
|
+
<img src="media/themes.png" alt="Temas integrados" width="700"/>
|
|
338
|
+
</div>
|
|
339
|
+
|
|
340
|
+
```ts
|
|
341
|
+
import { themes, color } from 'ansimax';
|
|
342
|
+
|
|
343
|
+
// 8 temas integrados
|
|
344
|
+
themes.use('dracula'); // 'dracula', 'nord', 'monokai', 'cyberpunk',
|
|
345
|
+
// 'pastel', 'matrix', 'ocean', 'sunset', 'custom'
|
|
346
|
+
|
|
347
|
+
const t = themes.current();
|
|
348
|
+
console.log(color.hex(t.primary)('Texto primario'));
|
|
349
|
+
console.log(color.hex(t.error)('Mensaje de error'));
|
|
350
|
+
console.log(color.hex(t.success)('¡Éxito!'));
|
|
351
|
+
|
|
352
|
+
// Define tu propio tema
|
|
353
|
+
themes.define('mitema', {
|
|
354
|
+
primary: '#00ff88',
|
|
355
|
+
secondary: '#0070f3',
|
|
356
|
+
accent: '#ffd700',
|
|
357
|
+
error: '#ff4757',
|
|
358
|
+
warning: '#ffa502',
|
|
359
|
+
success: '#2ed573',
|
|
360
|
+
});
|
|
361
|
+
```
|
|
362
|
+
|
|
363
|
+
---
|
|
364
|
+
|
|
365
|
+
### Empezar
|
|
366
|
+
<div align="center">
|
|
367
|
+
<img src="media/get_started.png" alt="Empezar" width="700"/>
|
|
368
|
+
</div>
|
|
369
|
+
|
|
370
|
+
---
|
|
371
|
+
|
|
372
|
+
## 📚 Ejemplos completos
|
|
373
|
+
|
|
374
|
+
La carpeta `examples/` contiene demos ejecutables:
|
|
375
|
+
|
|
376
|
+
```bash
|
|
377
|
+
# Demo en TypeScript (todos los módulos)
|
|
378
|
+
npx tsx examples/demo.ts
|
|
379
|
+
|
|
380
|
+
# Demo en JavaScript (CommonJS)
|
|
381
|
+
npm run build
|
|
382
|
+
node examples/demo.js
|
|
383
|
+
|
|
384
|
+
# Showcase visual (ideal para capturas de pantalla)
|
|
385
|
+
npx tsx examples/showcase.ts
|
|
386
|
+
|
|
387
|
+
# Demo de animaciones para grabar
|
|
388
|
+
npx tsx examples/animations.ts
|
|
389
|
+
|
|
390
|
+
# Demo de loaders para grabar
|
|
391
|
+
npx tsx examples/loaders.ts
|
|
392
|
+
```
|
|
393
|
+
|
|
394
|
+
---
|
|
395
|
+
|
|
396
|
+
## 🎯 Casos de uso
|
|
397
|
+
|
|
398
|
+
- **CLIs profesionales** — herramientas que se sienten pulidas, no básicas
|
|
399
|
+
- **Salidas de build** — reemplaza los logs aburridos de `npm run build` por timelines de estado
|
|
400
|
+
- **Instaladores interactivos** — menús multi-select con soporte de temas
|
|
401
|
+
- **Dashboards en vivo** — motor de frames con auto-refresh y diff rendering
|
|
402
|
+
- **Juegos en terminal** — canvas de pixel art + motor de animación
|
|
403
|
+
- **Herramientas de desarrollo** — reportes de cobertura, trackers de despliegue, paneles de estado
|
|
404
|
+
- **Herramientas educativas** — explicaciones animadas directamente en la terminal
|
|
405
|
+
|
|
406
|
+
---
|
|
407
|
+
|
|
408
|
+
## ⚙️ Configuración
|
|
409
|
+
|
|
410
|
+
```ts
|
|
411
|
+
import { configure } from 'ansimax';
|
|
412
|
+
|
|
413
|
+
configure({
|
|
414
|
+
colorMode: 'truecolor', // 'basic' | '256' | 'truecolor'
|
|
415
|
+
animationSpeed: 'normal', // 'slow' | 'normal' | 'fast'
|
|
416
|
+
});
|
|
417
|
+
|
|
418
|
+
// O sobreescribe en runtime
|
|
419
|
+
import { setNoColor } from 'ansimax';
|
|
420
|
+
setNoColor(true); // desactiva todos los colores (entornos CI)
|
|
421
|
+
```
|
|
422
|
+
|
|
423
|
+
Ansimax también respeta la variable de entorno estándar `NO_COLOR` y detecta automáticamente cuando stdout no es un TTY (pipes, logs de CI).
|
|
424
|
+
|
|
425
|
+
---
|
|
426
|
+
|
|
427
|
+
## 🛣️ Roadmap
|
|
428
|
+
|
|
429
|
+
Ansimax avanza hacia ser una **plataforma completa de renderizado de terminal**. Esto es lo que ya está hecho y lo que viene:
|
|
430
|
+
|
|
431
|
+
### ✅ Fase 1 — Fundación del core (actual)
|
|
432
|
+
|
|
433
|
+
- [x] **Motor de estilos** — ANSI 16 / 256 / truecolor con auto-fallback
|
|
434
|
+
- [x] **Helpers de Hex y RGB** con clamping y validación
|
|
435
|
+
- [x] **Soporte para `NO_COLOR`** + detección automática de no-TTY
|
|
436
|
+
- [x] **Integración con `AbortSignal`** en animaciones y loaders
|
|
437
|
+
- [x] **Apilado de estilos con `compose()`** y un solo reset
|
|
438
|
+
|
|
439
|
+
### ✅ Fase 2 — Motor de gradientes
|
|
440
|
+
|
|
441
|
+
- [x] Gradientes lineales (multi-stop)
|
|
442
|
+
- [x] Presets de arcoíris
|
|
443
|
+
- [x] Gradientes radiales (en `gradientRect`)
|
|
444
|
+
- [x] Gradientes diagonales
|
|
445
|
+
- [ ] **Gradientes animados** (flujo de color a lo largo del tiempo)
|
|
446
|
+
|
|
447
|
+
### 🟡 Fase 3 — Motor ASCII
|
|
448
|
+
|
|
449
|
+
- [x] Fuentes en bloque (`big`, `small`)
|
|
450
|
+
- [x] Banner con gradiente y alineación
|
|
451
|
+
- [x] Dibujo de cajas (6 estilos de borde)
|
|
452
|
+
- [ ] **Convertidor imagen → ASCII** (con detección de bordes)
|
|
453
|
+
- [ ] **Renderizado ASCII a color** (preserva los colores de la imagen)
|
|
454
|
+
- [ ] **Dithering de imágenes** para mejor rango tonal
|
|
455
|
+
- [ ] **ASCII optimizado para caras** (modo de alto detalle para retratos)
|
|
456
|
+
|
|
457
|
+
### ✅ Fase 4 — Primitivos UI de terminal
|
|
458
|
+
|
|
459
|
+
- [x] Tablas (filas irregulares, datos jagged)
|
|
460
|
+
- [x] Cajas con múltiples estilos
|
|
461
|
+
- [x] Mensajes de estado + badges
|
|
462
|
+
- [x] Timelines con estados done/pending
|
|
463
|
+
- [x] Menús interactivos (single + multi-select)
|
|
464
|
+
- [ ] **Árboles** (colapsables, lazy-loadable)
|
|
465
|
+
- [ ] **Paneles** (layouts divididos)
|
|
466
|
+
- [ ] **Layouts** (posicionamiento estilo flexbox)
|
|
467
|
+
|
|
468
|
+
### ✅ Fase 5 — Control de cursor y pantalla
|
|
469
|
+
|
|
470
|
+
- [x] Visibilidad del cursor, save/restore, posicionamiento
|
|
471
|
+
- [x] Limpieza de pantalla (línea, área, completa)
|
|
472
|
+
- [x] Garantías de cleanup con try/finally
|
|
473
|
+
|
|
474
|
+
### ✅ Fase 6 — Motor de animaciones
|
|
475
|
+
|
|
476
|
+
- [x] Typewriter, fadeIn, fadeOut, slide, pulse, wave, glitch, reveal
|
|
477
|
+
- [x] Todas compatibles con `AbortSignal`
|
|
478
|
+
- [x] Modo `reducedMotion` para accesibilidad
|
|
479
|
+
- [x] **Morph de frames** (interpolación texto → texto)
|
|
480
|
+
|
|
481
|
+
### 🟡 Fase 7 — Ecosistema de progreso
|
|
482
|
+
|
|
483
|
+
- [x] Spinners (11 estilos) con color y AbortSignal
|
|
484
|
+
- [x] Barras de progreso animadas
|
|
485
|
+
- [x] Ejecutor de tareas (secuencial + paralelo)
|
|
486
|
+
- [x] Countdowns
|
|
487
|
+
- [ ] **Progreso anidado** (padre + hijos con rollup)
|
|
488
|
+
- [ ] **Estimación de ETA** (promedio móvil + proyección)
|
|
489
|
+
- [ ] **Refresco en vivo** sin parpadeo (diff renderer)
|
|
490
|
+
|
|
491
|
+
### 🟡 Fase 8 — Detección de capacidades
|
|
492
|
+
|
|
493
|
+
- [x] Detección de TTY (auto-desactivar en pipes/CI)
|
|
494
|
+
- [x] Soporte de `NO_COLOR`
|
|
495
|
+
- [ ] **Detección de profundidad de color** (16 / 256 / truecolor)
|
|
496
|
+
- [ ] **Detección de ancho Unicode** (CJK, emojis)
|
|
497
|
+
- [ ] **Base de datos de capacidades** (xterm, iTerm, Windows Terminal...)
|
|
498
|
+
|
|
499
|
+
### 🔴 Fase 9 — Renderizado avanzado
|
|
500
|
+
|
|
501
|
+
- [ ] **Diff renderer** (solo redibuja regiones modificadas)
|
|
502
|
+
- [ ] **Buffer virtual** (componer UI sin escribir a stdout)
|
|
503
|
+
- [ ] **Z-index / capas**
|
|
504
|
+
- [ ] **Soporte de eventos del mouse**
|
|
505
|
+
|
|
506
|
+
### 🔴 Fase 10 — Charts en terminal
|
|
507
|
+
|
|
508
|
+
- [ ] Gráficos de barras (horizontal y vertical)
|
|
509
|
+
- [ ] Gráficos de líneas (con braille para resolución sub-carácter)
|
|
510
|
+
- [ ] Sparklines
|
|
511
|
+
- [ ] Heatmaps
|
|
512
|
+
- [ ] Charts en streaming en tiempo real
|
|
513
|
+
|
|
514
|
+
### 🔴 Fase 11 — Sistema de plugins
|
|
515
|
+
|
|
516
|
+
- [ ] API de plugins para componentes personalizados
|
|
517
|
+
- [ ] Marketplace de temas
|
|
518
|
+
- [ ] Registro de fuentes personalizadas
|
|
519
|
+
- [ ] Registro comunitario de animaciones
|
|
520
|
+
|
|
521
|
+
**Leyenda:** ✅ Completo · 🟡 Parcial · 🔴 Planeado
|
|
522
|
+
|
|
523
|
+
---
|
|
524
|
+
|
|
525
|
+
## 🧪 Tests
|
|
526
|
+
|
|
527
|
+
Ansimax incluye **750+ tests** y **100% de cobertura de líneas**:
|
|
528
|
+
|
|
529
|
+
```bash
|
|
530
|
+
npm test # Ejecuta todos los tests
|
|
531
|
+
npm run test:coverage # Reporte de cobertura
|
|
532
|
+
npm run typecheck # Check estricto de TypeScript
|
|
533
|
+
```
|
|
534
|
+
|
|
535
|
+
---
|
|
536
|
+
|
|
537
|
+
## 🛠️ Requisitos
|
|
538
|
+
|
|
539
|
+
- Node.js **>= 18.0.0**
|
|
540
|
+
- Una terminal con soporte de escapes ANSI (cualquier terminal moderno)
|
|
541
|
+
|
|
542
|
+
---
|
|
543
|
+
|
|
544
|
+
## 🏗️ Estructura del proyecto
|
|
545
|
+
|
|
546
|
+
```
|
|
547
|
+
ansimax/
|
|
548
|
+
├── src/
|
|
549
|
+
│ ├── colors/ # Sistema de colores, gradientes, compose, NO_COLOR
|
|
550
|
+
│ ├── animations/ # 7 efectos de animación con AbortSignal
|
|
551
|
+
│ ├── ascii/ # Fuentes ASCII, cajas, dividers, banners
|
|
552
|
+
│ ├── components/ # Tablas, menús, timelines, badges
|
|
553
|
+
│ ├── loaders/ # Spinners, progress, tasks, countdowns
|
|
554
|
+
│ ├── frames/ # Motor de frames + morph + presets
|
|
555
|
+
│ ├── images/ # Pixel art, sprites, API de canvas
|
|
556
|
+
│ ├── themes/ # 8 temas integrados + custom
|
|
557
|
+
│ ├── utils/ # Helpers ANSI, math de colores, utils de strings
|
|
558
|
+
│ └── index.ts # Barrel del API público
|
|
559
|
+
├── examples/ # Demos ejecutables (TS + JS)
|
|
560
|
+
├── media/ # Capturas y videos para el README
|
|
561
|
+
└── dist/ # Build (CJS + ESM + tipos)
|
|
562
|
+
```
|
|
563
|
+
|
|
564
|
+
---
|
|
565
|
+
|
|
566
|
+
## 🤝 Contribuir
|
|
567
|
+
|
|
568
|
+
¡Las contribuciones son bienvenidas! Para empezar:
|
|
569
|
+
|
|
570
|
+
1. Haz **fork** del repo
|
|
571
|
+
2. Crea una rama: `git checkout -b feature/mi-feature`
|
|
572
|
+
3. Añade tests para tus cambios (la barra es 100% de cobertura)
|
|
573
|
+
4. Commit: `git commit -m 'Add: mi feature'`
|
|
574
|
+
5. Push: `git push origin feature/mi-feature`
|
|
575
|
+
6. Abre un Pull Request
|
|
576
|
+
|
|
577
|
+
Asegúrate de que:
|
|
578
|
+
- Todos los tests pasan: `npm test`
|
|
579
|
+
- TypeScript está contento: `npm run typecheck`
|
|
580
|
+
- El código sigue el estilo existente
|
|
581
|
+
|
|
582
|
+
---
|
|
583
|
+
|
|
584
|
+
## 🐛 Reportar problemas
|
|
585
|
+
|
|
586
|
+
¿Encontraste un bug o tienes una idea? Abre un [issue](https://github.com/Brashkie/ansimax/issues) — por favor incluye una reproducción mínima.
|
|
587
|
+
|
|
588
|
+
---
|
|
589
|
+
|
|
590
|
+
## ⭐ Apoyar el proyecto
|
|
591
|
+
|
|
592
|
+
Si te gusta Ansimax:
|
|
593
|
+
|
|
594
|
+
- ⭐ **Dale una estrella al repo** — ayuda a que otros descubran el proyecto
|
|
595
|
+
- 🐛 **Reporta bugs** — abre un [issue](https://github.com/Brashkie/ansimax/issues)
|
|
596
|
+
- 🚀 **Úsalo en tus proyectos CLI** — es el mejor apoyo posible
|
|
597
|
+
- 📢 **Compártelo** — tweet, blog, menciónalo a un colega que construya CLIs
|
|
598
|
+
- 💬 **Difúndelo** — etiqueta tu CLI con `#ansimax` para que otros encuentren inspiración
|
|
599
|
+
|
|
600
|
+
Esto ayuda al proyecto a crecer y le da impulso para añadir las funcionalidades planeadas más rápido.
|
|
601
|
+
|
|
602
|
+
---
|
|
603
|
+
|
|
604
|
+
## 📝 Changelog
|
|
605
|
+
|
|
606
|
+
Consulta [CHANGELOG.md](CHANGELOG.md) para el historial de versiones.
|
|
607
|
+
|
|
608
|
+
---
|
|
609
|
+
|
|
610
|
+
## 👨💻 Autor
|
|
611
|
+
|
|
612
|
+
**Brashkie** · [@Brashkie](https://github.com/Brashkie)
|
|
613
|
+
|
|
614
|
+
---
|
|
615
|
+
|
|
616
|
+
## 📜 Licencia
|
|
617
|
+
|
|
618
|
+
[MIT](LICENSE) © 2026 Brashkie
|
|
619
|
+
|
|
620
|
+
---
|
|
621
|
+
|
|
622
|
+
**Keywords:** cli, terminal, ansi, colors, gradients, animation, spinner, ascii, ascii-art, pixel-art, progress-bar, loader, components, table, banner, theme, typescript, nodejs, zero-dependencies
|
|
623
|
+
|
|
624
|
+
---
|
|
625
|
+
|
|
626
|
+
<div align="center">
|
|
627
|
+
<p>Hecho con ❤️ y TypeScript</p>
|
|
628
|
+
<p>Si Ansimax te ayuda a crear mejores CLIs, ¡dale una ⭐ en GitHub!</p>
|
|
629
|
+
</div>
|