trama-ui 0.1.0

package/dist/lib/sketches/aurora.js

@@ -0,0 +1,42 @@
+import { clamp01, eachCell, hash2, hsv } from "../cells.js";
+/** Aurora boreal: cortinas de ruido sobre un cielo estrellado y montañas. */
+export function aurora(t) {
+    const ramp = t.createGlyphRamp(" .:;+*#%");
+    t.draw(() => {
+        const s = t.secs;
+        const rows = t.grid.rows;
+        const top = -Math.floor(rows / 2);
+        t.background(0);
+        eachCell(t, (x, y) => {
+            const yy = (y - top) / rows; // 0 arriba, 1 abajo
+            const ridge = 0.8 + 0.1 * t.noise(x * 0.03, 9) + 0.06 * t.noise(x * 0.11, 3);
+            if (yy > ridge) {
+                t.char(" ");
+                t.cellColor(3, 4, 8 + (yy - ridge) * 20);
+                return;
+            }
+            t.cellColor(2, 5, 14 + yy * 26);
+            // El pliegue de la cortina ondula en horizontal y se desplaza con el tiempo
+            const center = 0.2 + 0.3 * t.noise(x * 0.022, s * 0.06) + 0.07 * Math.sin(x * 0.035 + s * 0.45);
+            const fall = Math.exp(-(((yy - center) / 0.17) ** 2));
+            const rays = 0.45 + 0.75 * t.noise(x * 0.35, s * 0.3);
+            const body = 0.6 + 0.6 * t.noise(x * 0.05, yy * 2.2, s * 0.15);
+            const power = clamp01(fall * rays * body);
+            if (power > 0.05) {
+                const above = clamp01((center - yy) / 0.3);
+                const hue = 0.34 + 0.44 * above;
+                t.char(ramp.at(power));
+                t.charColor(...hsv(hue, 0.6, 0.35 + 0.65 * power));
+                t.cellColor(...hsv(hue, 0.9, 0.05 + 0.25 * power));
+            }
+            else if (hash2(x, y) > 0.988) {
+                const tw = Math.sin(s * 2.2 + hash2(y, x) * 60) * 0.5 + 0.5;
+                t.char(tw > 0.6 ? "*" : ".");
+                t.charColor(255, 255, 255, 90 + 165 * tw);
+            }
+            else {
+                t.char(" ");
+            }
+        });
+    });
+}

package/dist/lib/sketches/fire.d.ts

@@ -0,0 +1,3 @@
+import type { Textmodifier } from "textmode.js";
+/** Fuego estilo Doom. El puntero es una antorcha; pulsar la convierte en un soplete. */
+export declare function fire(t: Textmodifier): void;

package/dist/lib/sketches/fire.js

@@ -0,0 +1,80 @@
+import { aspect, createPointer, gridOrigin, mix, plot } from "../cells.js";
+/** Paleta negro → rojo → naranja → amarillo → blanco */
+function fireColor(h) {
+    if (h < 0.35) {
+        const k = h / 0.35;
+        return [mix(10, 200, k), mix(0, 30, k), mix(0, 10, k)];
+    }
+    if (h < 0.7) {
+        const k = (h - 0.35) / 0.35;
+        return [mix(200, 255, k), mix(30, 170, k), mix(10, 20, k)];
+    }
+    const k = (h - 0.7) / 0.3;
+    return [255, mix(170, 255, k), mix(20, 210, k)];
+}
+/** Fuego estilo Doom. El puntero es una antorcha; pulsar la convierte en un soplete. */
+export function fire(t) {
+    const ramp = t.createGlyphRamp(" .:-=+*#%@");
+    const ptr = createPointer(t);
+    let W = 0;
+    let H = 0;
+    let heat = new Float32Array(0);
+    const rebuild = () => {
+        W = t.grid.cols;
+        H = t.grid.rows;
+        heat = new Float32Array(W * H);
+    };
+    t.draw(() => {
+        if (W !== t.grid.cols || H !== t.grid.rows)
+            rebuild();
+        ptr.update();
+        const { x0, y0 } = gridOrigin(t);
+        if (t.frameCount % 2 === 0) {
+            // Combustible con lenguas de distinta altura, moduladas por ruido
+            for (let x = 0; x < W; x++) {
+                const fuel = t.noise(x * 0.09, t.secs * 0.5);
+                heat[(H - 1) * W + x] = Math.min(1, 0.35 + fuel * 1.1 + Math.random() * 0.1);
+            }
+            const r = ptr.pressed ? 9 : 4;
+            const asp = aspect(t);
+            const rx = Math.ceil(r * asp);
+            const gx = Math.round(ptr.x - x0);
+            const gy = Math.round(ptr.y - y0);
+            if (ptr.hovering) {
+                for (let dy = -r; dy <= r; dy++) {
+                    for (let dx = -rx; dx <= rx; dx++) {
+                        const x = gx + dx;
+                        const y = gy + dy;
+                        if (x < 0 || y < 0 || x >= W || y >= H)
+                            continue;
+                        if (Math.hypot(dx / asp, dy) <= r)
+                            heat[y * W + x] = 1;
+                    }
+                }
+            }
+            const decay = 1.9 / H;
+            const wind = Math.sin(t.secs * 0.4) * 0.6;
+            for (let y = 0; y < H - 1; y++) {
+                for (let x = 0; x < W; x++) {
+                    // Cada celda toma calor de la de abajo, ladeada al azar y por el viento
+                    const sx = Math.min(W - 1, Math.max(0, x + Math.round(Math.random() * 2 - 1 + wind)));
+                    const src = (heat[(y + 1) * W + sx] * 2 + heat[(y + 1) * W + x]) / 3;
+                    heat[y * W + x] = Math.max(0, src - decay * (0.5 + Math.random()));
+                }
+            }
+        }
+        t.background(8, 4, 8);
+        for (let y = 0; y < H; y++) {
+            for (let x = 0; x < W; x++) {
+                const h = heat[y * W + x];
+                if (h < 0.03)
+                    continue;
+                const [r, g, b] = fireColor(h);
+                t.char(ramp.at(h));
+                t.charColor(Math.min(255, r * 1.25), Math.min(255, g * 1.2 + 20), b);
+                t.cellColor(r * 0.45, g * 0.4, b * 0.4);
+                plot(t, x0 + x, y0 + y);
+            }
+        }
+    });
+}

package/dist/lib/sketches/flow.d.ts

@@ -0,0 +1,3 @@
+import type { Textmodifier } from "textmode.js";
+/** Partículas sobre un campo de flujo de ruido. El puntero las atrae; pulsar las repele. */
+export declare function flow(t: Textmodifier): void;

package/dist/lib/sketches/flow.js

@@ -0,0 +1,70 @@
+import { aspect, createPointer, gridOrigin, hsv, plot } from "../cells.js";
+const TRAIL = 9;
+/** Partículas sobre un campo de flujo de ruido. El puntero las atrae; pulsar las repele. */
+export function flow(t) {
+    const ptr = createPointer(t);
+    const ramp = t.createGlyphRamp(" .:-=+*#");
+    const particles = [];
+    const respawn = (p) => {
+        const { cols, rows, x0, y0 } = gridOrigin(t);
+        p.x = x0 + Math.random() * cols;
+        p.y = y0 + Math.random() * rows;
+        p.age = 0;
+        p.life = 120 + Math.random() * 260;
+        p.trail = [];
+    };
+    // La rejilla no existe hasta el primer fotograma, así que las partículas se crean allí
+    const init = () => {
+        for (let i = 0; i < 800; i++) {
+            const p = { x: 0, y: 0, age: 0, life: 0, trail: [] };
+            respawn(p);
+            p.age = Math.random() * p.life;
+            particles.push(p);
+        }
+    };
+    t.draw(() => {
+        if (particles.length === 0)
+            init();
+        ptr.update();
+        const s = t.secs;
+        const asp = aspect(t);
+        const { cols, rows, x0, y0 } = gridOrigin(t);
+        const sign = ptr.pressed ? -1 : 1;
+        t.background(5, 6, 14);
+        for (const p of particles) {
+            const n = t.noise(p.x * 0.025, p.y * 0.025 * asp, s * 0.07);
+            const ang = n * Math.PI * 4;
+            let vx = Math.cos(ang) * 0.5;
+            let vy = (Math.sin(ang) * 0.5) / asp;
+            const dx = ptr.x - p.x;
+            const dy = (ptr.y - p.y) * asp;
+            const d = Math.hypot(dx, dy) + 0.001;
+            if (d < 34) {
+                const pull = ((34 - d) / 34) * 0.9 * sign;
+                vx += (dx / d) * pull;
+                vy += ((dy / d) * pull) / asp;
+            }
+            p.x += vx;
+            p.y += vy;
+            p.age++;
+            if (p.age % 2 === 0) {
+                p.trail.push(p.x, p.y);
+                if (p.trail.length > TRAIL * 2)
+                    p.trail.splice(0, 2);
+            }
+            if (p.age > p.life || p.x < x0 - 2 || p.x > x0 + cols + 2 || p.y < y0 - 2 || p.y > y0 + rows + 2) {
+                respawn(p);
+                continue;
+            }
+            const hue = 0.52 + (ang / (Math.PI * 4)) * 0.4;
+            const len = p.trail.length / 2;
+            for (let k = 0; k < len; k++) {
+                const f = (k + 1) / len;
+                t.char(ramp.at(f));
+                t.charColor(...hsv(hue, 0.65, 0.25 + 0.75 * f));
+                t.cellColor(...hsv(hue, 0.8, 0.06 * f));
+                plot(t, Math.round(p.trail[k * 2]), Math.round(p.trail[k * 2 + 1]));
+            }
+        }
+    });
+}

package/dist/lib/sketches/life.d.ts

@@ -0,0 +1,3 @@
+import type { Textmodifier } from "textmode.js";
+/** Juego de la vida toroidal. Mover el puntero siembra células; pulsar siembra en grande. */
+export declare function life(t: Textmodifier): void;

package/dist/lib/sketches/life.js

@@ -0,0 +1,107 @@
+import { aspect, createPointer, gridOrigin, hsv, plot } from "../cells.js";
+/** Juego de la vida toroidal. Mover el puntero siembra células; pulsar siembra en grande. */
+export function life(t) {
+    const ptr = createPointer(t);
+    let W = 0;
+    let H = 0;
+    let alive = new Uint8Array(0);
+    let scratch = new Uint8Array(0);
+    let age = new Uint16Array(0);
+    let ghost = new Float32Array(0);
+    let steps = 0;
+    const seed = (density, keep = false) => {
+        for (let i = 0; i < W * H; i++) {
+            if (keep && alive[i])
+                continue;
+            if (Math.random() < density)
+                alive[i] = 1;
+        }
+    };
+    const rebuild = () => {
+        W = t.grid.cols;
+        H = t.grid.rows;
+        alive = new Uint8Array(W * H);
+        scratch = new Uint8Array(W * H);
+        age = new Uint16Array(W * H);
+        ghost = new Float32Array(W * H);
+        seed(0.2);
+    };
+    const step = () => {
+        let pop = 0;
+        for (let y = 0; y < H; y++) {
+            const ym = ((y + H - 1) % H) * W;
+            const yp = ((y + 1) % H) * W;
+            for (let x = 0; x < W; x++) {
+                const xm = (x + W - 1) % W;
+                const xp = (x + 1) % W;
+                const n = alive[ym + xm] + alive[ym + x] + alive[ym + xp] +
+                    alive[y * W + xm] + alive[y * W + xp] +
+                    alive[yp + xm] + alive[yp + x] + alive[yp + xp];
+                const i = y * W + x;
+                const live = alive[i] ? n === 2 || n === 3 : n === 3;
+                scratch[i] = live ? 1 : 0;
+                if (live) {
+                    age[i] = alive[i] ? Math.min(age[i] + 1, 60) : 0;
+                    pop++;
+                }
+                else if (alive[i]) {
+                    ghost[i] = 1;
+                }
+            }
+        }
+        [alive, scratch] = [scratch, alive];
+        steps++;
+        if (pop < W * H * 0.012)
+            seed(0.2);
+        else if (steps % 500 === 0)
+            seed(0.03, true);
+    };
+    t.draw(() => {
+        if (W !== t.grid.cols || H !== t.grid.rows)
+            rebuild();
+        ptr.update();
+        const { x0, y0 } = gridOrigin(t);
+        if (ptr.raw) {
+            const r = ptr.pressed ? 6 : 2;
+            const p = ptr.pressed ? 0.6 : 0.3;
+            const asp = aspect(t);
+            const rx = Math.ceil(r * asp);
+            const gx = Math.round(ptr.raw.x - x0);
+            const gy = Math.round(ptr.raw.y - y0);
+            for (let dy = -r; dy <= r; dy++) {
+                for (let dx = -rx; dx <= rx; dx++) {
+                    if (Math.hypot(dx / asp, dy) > r)
+                        continue;
+                    const x = gx + dx;
+                    const y = gy + dy;
+                    if (x < 0 || y < 0 || x >= W || y >= H)
+                        continue;
+                    if (Math.random() < p)
+                        alive[y * W + x] = 1;
+                }
+            }
+        }
+        if (t.frameCount % 4 === 0)
+            step();
+        t.background(4, 5, 12);
+        for (let y = 0; y < H; y++) {
+            for (let x = 0; x < W; x++) {
+                const i = y * W + x;
+                if (alive[i]) {
+                    const a = age[i];
+                    t.char(a < 2 ? "@" : a < 8 ? "O" : a < 24 ? "o" : "+");
+                    t.charColor(...hsv(0.5 + Math.min(a, 40) * 0.006, 0.55, a < 2 ? 1 : 0.85));
+                    t.cellColor(...hsv(0.55, 0.7, 0.14 + (a < 2 ? 0.14 : 0)));
+                    plot(t, x0 + x, y0 + y);
+                }
+                else if (ghost[i] > 0.05) {
+                    ghost[i] *= 0.9;
+                    t.char(".");
+                    t.charColor(...hsv(0.85, 0.6, ghost[i] * 0.9));
+                    t.cellColor(4, 5, 12);
+                    plot(t, x0 + x, y0 + y);
+                }
+            }
+        }
+    });
+}

package/dist/lib/sketches/matrix.d.ts

@@ -0,0 +1,3 @@
+import type { Textmodifier } from "textmode.js";
+/** Lluvia digital. Las columnas cercanas al puntero se vuelven cian, aceleran y se descomponen. */
+export declare function matrix(t: Textmodifier): void;

package/dist/lib/sketches/matrix.js

@@ -0,0 +1,64 @@
+import { aspect, createPointer, gridOrigin, plot } from "../cells.js";
+const GLYPHS = "01ABCDEFGHIJKLMNOPQRSTUVWXYZ<>{}[]/\\|+=*:;#$%&@";
+/** Lluvia digital. Las columnas cercanas al puntero se vuelven cian, aceleran y se descomponen. */
+export function matrix(t) {
+    const ptr = createPointer(t);
+    let columns = [];
+    let W = 0;
+    let H = 0;
+    const glyph = () => GLYPHS[Math.floor(Math.random() * GLYPHS.length)];
+    const spawn = (initial) => {
+        const len = 8 + Math.random() * 22;
+        return {
+            head: initial ? Math.random() * H * 1.4 - H * 0.2 : -len - Math.random() * H * 0.5,
+            speed: 0.12 + Math.random() * 0.5,
+            len,
+            chars: Array.from({ length: H + 48 }, glyph),
+        };
+    };
+    const rebuild = () => {
+        W = t.grid.cols;
+        H = t.grid.rows;
+        columns = Array.from({ length: W }, () => spawn(true));
+    };
+    t.draw(() => {
+        if (W !== t.grid.cols || H !== t.grid.rows)
+            rebuild();
+        ptr.update();
+        const asp = aspect(t);
+        const { x0, y0 } = gridOrigin(t);
+        const R = 11 + (ptr.pressed ? 10 : 0);
+        t.background(0, 6, 2);
+        for (let i = 0; i < W; i++) {
+            const c = columns[i];
+            const x = x0 + i;
+            const headY = y0 + c.head;
+            const near = Math.hypot(x - ptr.x, (headY - ptr.y) * asp) < R;
+            c.head += c.speed * (near ? 2.4 : 1);
+            if (Math.random() < 0.06)
+                c.chars[Math.floor(Math.random() * c.chars.length)] = glyph();
+            if (c.head - c.len > H)
+                columns[i] = spawn(false);
+            for (let k = 0; k < c.len; k++) {
+                const row = Math.floor(c.head) - k;
+                if (row < 0 || row >= H)
+                    continue;
+                const fade = 1 - k / c.len;
+                const y = y0 + row;
+                const hot = Math.hypot(x - ptr.x, (y - ptr.y) * asp) < R;
+                t.char(hot && Math.random() < 0.4 ? glyph() : c.chars[row % c.chars.length]);
+                if (k === 0) {
+                    t.charColor(hot ? 210 : 200, 255, hot ? 255 : 220);
+                }
+                else if (hot) {
+                    t.charColor(40 * fade, 220 * fade + 30, 255 * fade + 20);
+                }
+                else {
+                    t.charColor(0, 60 + 195 * fade * fade, 40 * fade);
+                }
+                t.cellColor(0, 8 + 14 * fade, 4);
+                plot(t, x, y);
+            }
+        }
+    });
+}

package/dist/lib/sketches/ocean.d.ts

@@ -0,0 +1,3 @@
+import type { Textmodifier } from "textmode.js";
+/** Atardecer sobre el mar: cielo degradado, sol y reflejo que centellea entre las olas. */
+export declare function ocean(t: Textmodifier): void;

package/dist/lib/sketches/ocean.js

@@ -0,0 +1,56 @@
+import { aspect, clamp01, eachCell, hash2, mix, smoothstep } from "../cells.js";
+/** Atardecer sobre el mar: cielo degradado, sol y reflejo que centellea entre las olas. */
+export function ocean(t) {
+    t.draw(() => {
+        const s = t.secs;
+        const asp = aspect(t);
+        const rows = t.grid.rows;
+        const horizon = Math.round(rows * 0.08); // fila (coordenada Y) del horizonte
+        const top = -Math.floor(rows / 2);
+        const bottom = top + rows;
+        const sunR = Math.max(6, rows * 0.16);
+        t.background(0);
+        eachCell(t, (x, y) => {
+            if (y < horizon) {
+                // Cielo
+                const k = (y - top) / (horizon - top);
+                const dx = x;
+                const dy = (y - (horizon - sunR * 0.55)) * asp;
+                const d = Math.hypot(dx, dy);
+                const glow = Math.exp(-d / (sunR * 2.2)) * 0.9;
+                let r = mix(24, 255, k * k) + glow * 90;
+                let g = mix(14, 120, k * k * k) + glow * 70;
+                let b = mix(60, 110, k) + glow * 10;
+                t.cellColor(r, g, b);
+                if (d < sunR) {
+                    t.char(" ");
+                    t.cellColor(255, 220 - d * 4, 130 - d * 5);
+                    t.charColor(255, 240, 190);
+                }
+                else if (k < 0.5 && hash2(x, y) > 0.985) {
+                    t.char(Math.sin(s * 2 + hash2(y, x) * 40) > 0 ? "*" : ".");
+                    t.charColor(255, 255, 255, (1 - k * 2) * 255);
+                }
+                else {
+                    t.char(" ");
+                }
+                return;
+            }
+            // Agua
+            const depth = clamp01((y - horizon) / (bottom - horizon));
+            const k = 0.12 + 0.55 * (1 - depth);
+            const wave = Math.sin(x * k + s * (1 + depth * 2.5) + Math.sin(y * 0.7 + s * 0.6) * 0.8) * 0.5 + 0.5;
+            const sunSpread = 3 + depth * 26;
+            const glitter = Math.exp(-(x * x) / (sunSpread * sunSpread)) * smoothstep(0.35, 0.9, wave);
+            t.cellColor(mix(70, 6, depth) + glitter * 190, mix(30, 14, depth) + glitter * 130, mix(90, 40, depth) + glitter * 20);
+            if (glitter > 0.25) {
+                t.char("=");
+                t.charColor(255, 235, 180);
+            }
+            else {
+                t.char(wave > 0.8 ? "~" : wave > 0.5 ? "-" : " ");
+                t.charColor(mix(190, 90, depth), mix(90, 110, depth), mix(150, 190, depth));
+            }
+        });
+    });
+}

package/dist/lib/sketches/plasma.d.ts

@@ -0,0 +1,3 @@
+import type { Textmodifier } from "textmode.js";
+/** Plasma con rampa de glifos. El puntero deforma el campo; al pulsar la onda crece. */
+export declare function plasma(t: Textmodifier): void;

package/dist/lib/sketches/plasma.js

@@ -0,0 +1,29 @@
+import { aspect, clamp01, createPointer, eachCell, hsv } from "../cells.js";
+/** Plasma con rampa de glifos. El puntero deforma el campo; al pulsar la onda crece. */
+export function plasma(t) {
+    const ramp = t.createGlyphRamp(" .:-=+*#%@");
+    const ptr = createPointer(t);
+    t.draw(() => {
+        ptr.update();
+        const s = t.secs;
+        const asp = aspect(t);
+        const radius = ptr.pressed ? 900 : 260;
+        t.background(0);
+        eachCell(t, (x, y) => {
+            const yy = y * asp;
+            let v = Math.sin(x * 0.09 + s) +
+                Math.sin(yy * 0.13 - s * 1.3) +
+                Math.sin((x + yy) * 0.06 + s * 0.7) +
+                Math.sin(Math.hypot(x * 0.8, yy) * 0.08 - s * 1.1);
+            const dx = x - ptr.x;
+            const dy = (y - ptr.y) * asp;
+            const d2 = dx * dx + dy * dy;
+            v += 3 * Math.exp(-d2 / radius) * Math.sin(s * 4 - Math.sqrt(d2) * 0.5);
+            const n = clamp01((v + 4) / 8);
+            const hue = n * 0.55 + s * 0.02 + 0.55;
+            t.char(ramp.at(n));
+            t.charColor(...hsv(hue, 0.75, 0.3 + 0.7 * n));
+            t.cellColor(...hsv(hue, 0.85, 0.05 + 0.13 * n));
+        });
+    });
+}

package/dist/lib/sketches/registry.d.ts

@@ -0,0 +1,6 @@
+import type { Textmodifier } from "textmode.js";
+export type Sketch = {
+    fontSize: number;
+    setup: (t: Textmodifier) => void;
+};
+export declare const sketches: Record<string, Sketch>;

package/dist/lib/sketches/registry.js

@@ -0,0 +1,60 @@
+import { aurora } from "./aurora.js";
+import { fire } from "./fire.js";
+import { flow } from "./flow.js";
+import { life } from "./life.js";
+import { matrix } from "./matrix.js";
+import { ocean } from "./ocean.js";
+import { plasma } from "./plasma.js";
+import { ripples } from "./ripples.js";
+import { starfield } from "./starfield.js";
+import { tunnel } from "./tunnel.js";
+import { scAssemble } from "./scroll-assemble.js";
+import { scParallax } from "./scroll-parallax.js";
+import { scRain } from "./scroll-rain.js";
+import { scStats } from "./scroll-stats.js";
+import { scTerminal } from "./scroll-terminal.js";
+import { scZoom } from "./scroll-zoom.js";
+import { tx3d } from "./text-3d.js";
+import { txScramble } from "./text-scramble.js";
+import { thOrbit } from "./theme-orbit.js";
+import { thPulse } from "./theme-pulse.js";
+import { txComboFiglet } from "./text-combo-figlet.js";
+import { txGlitch } from "./text-glitch.js";
+import { txMarquee } from "./text-marquee.js";
+import { txParticles } from "./text-particles.js";
+import { txRain } from "./text-rain.js";
+import { txWave } from "./text-wave.js";
+export const sketches = {
+    plasma: { fontSize: 16, setup: plasma },
+    matrix: { fontSize: 16, setup: matrix },
+    starfield: { fontSize: 14, setup: starfield },
+    ripples: { fontSize: 14, setup: ripples },
+    life: { fontSize: 14, setup: life },
+    flow: { fontSize: 14, setup: flow },
+    fire: { fontSize: 14, setup: fire },
+    ocean: { fontSize: 16, setup: ocean },
+    tunnel: { fontSize: 16, setup: tunnel },
+    aurora: { fontSize: 16, setup: aurora },
+    // Demos de texto (leen lo que se escribe en el cajón de la interfaz)
+    "tx-wave": { fontSize: 12, setup: txWave },
+    "tx-particles": { fontSize: 12, setup: txParticles },
+    "tx-glitch": { fontSize: 12, setup: txGlitch },
+    "tx-rain": { fontSize: 14, setup: txRain },
+    "tx-marquee": { fontSize: 16, setup: txMarquee },
+    "tx-combo-figlet": { fontSize: 14, setup: txComboFiglet },
+    "tx-scramble": { fontSize: 12, setup: txScramble },
+    "tx-3d": { fontSize: 12, setup: tx3d },
+    // Demos con scroll (300vh): leen scrollState
+    "sc-zoom": { fontSize: 12, setup: scZoom },
+    "sc-assemble": { fontSize: 12, setup: (t) => scAssemble(t) },
+    "sc-rain": { fontSize: 14, setup: scRain },
+    "sc-parallax": { fontSize: 14, setup: scParallax },
+    "sc-terminal": { fontSize: 20, setup: scTerminal },
+    "sc-stats": { fontSize: 10, setup: scStats },
+    "sc-combo": { fontSize: 12, setup: (t) => scAssemble(t, { transparent: true }) },
+    // Fondos de las landings temáticas
+    "th-orbit": { fontSize: 14, setup: thOrbit },
+    "th-pulse": { fontSize: 14, setup: thPulse },
+    // Capa superior del combo: partículas de texto sin fondo, fusionadas con la capa de asciify
+    "tx-combo-layers": { fontSize: 12, setup: (t) => txParticles(t, { transparent: true }) },
+};

package/dist/lib/sketches/ripples.d.ts

@@ -0,0 +1,3 @@
+import type { Textmodifier } from "textmode.js";
+/** Agua. Cada movimiento del puntero lanza ondas; pulsar deja caer una gota grande. */
+export declare function ripples(t: Textmodifier): void;

package/dist/lib/sketches/ripples.js

@@ -0,0 +1,84 @@
+import { aspect, clamp01, createPointer, gridOrigin, plot } from "../cells.js";
+/** Agua. Cada movimiento del puntero lanza ondas; pulsar deja caer una gota grande. */
+export function ripples(t) {
+    const ramp = t.createGlyphRamp(" .,:;+*#@");
+    const ptr = createPointer(t);
+    let W = 0;
+    let H = 0;
+    let cur = new Float32Array(0);
+    let prev = new Float32Array(0);
+    let next = new Float32Array(0);
+    const rebuild = () => {
+        W = t.grid.cols;
+        H = t.grid.rows;
+        cur = new Float32Array(W * H);
+        prev = new Float32Array(W * H);
+        next = new Float32Array(W * H);
+    };
+    const drop = (cx, cy, r, amp) => {
+        const asp = aspect(t);
+        const ry = Math.ceil(r);
+        const rx = Math.ceil(r * asp);
+        for (let dy = -ry; dy <= ry; dy++) {
+            for (let dx = -rx; dx <= rx; dx++) {
+                const x = cx + dx;
+                const y = cy + dy;
+                if (x < 1 || y < 1 || x >= W - 1 || y >= H - 1)
+                    continue;
+                const f = Math.max(0, 1 - Math.hypot(dx, dy * asp) / (r * asp + 0.5));
+                cur[y * W + x] += amp * f;
+            }
+        }
+    };
+    let wasPressed = false;
+    t.draw(() => {
+        if (W !== t.grid.cols || H !== t.grid.rows)
+            rebuild();
+        ptr.update();
+        const { x0, y0 } = gridOrigin(t);
+        // Entradas: puntero y lluvia ocasional
+        if (ptr.raw) {
+            const gx = ptr.raw.x - x0;
+            const gy = ptr.raw.y - y0;
+            if (ptr.pressed && !wasPressed)
+                drop(gx, gy, 4, 6);
+            else if (Math.abs(ptr.vx) + Math.abs(ptr.vy) > 0.15)
+                drop(gx, gy, 1, 1.4);
+        }
+        wasPressed = ptr.pressed;
+        if (t.frameCount % 45 === 0) {
+            drop(2 + Math.floor(Math.random() * (W - 4)), 2 + Math.floor(Math.random() * (H - 4)), 2, 3);
+        }
+        // Ecuación de ondas anisótropa: las celdas son ~2 veces más altas que anchas
+        const asp = aspect(t);
+        const kx = 1;
+        const ky = 1 / (asp * asp);
+        const a = 0.92 / (kx + ky); // condición de estabilidad: a·(kx+ky) < 1
+        for (let y = 1; y < H - 1; y++) {
+            for (let x = 1; x < W - 1; x++) {
+                const i = y * W + x;
+                const u = cur[i];
+                const lap = kx * (cur[i - 1] + cur[i + 1] - 2 * u) + ky * (cur[i - W] + cur[i + W] - 2 * u);
+                next[i] = (2 * u - prev[i] + a * lap) * 0.99;
+            }
+        }
+        [prev, cur, next] = [cur, next, prev];
+        t.background(3, 10, 24);
+        for (let y = 0; y < H; y++) {
+            for (let x = 0; x < W; x++) {
+                const v = cur[y * W + x];
+                const m = Math.abs(v);
+                if (m < 0.04)
+                    continue;
+                const n = clamp01(m * 0.9);
+                t.char(ramp.at(n));
+                if (v > 0)
+                    t.charColor(120 + 135 * n, 210 + 45 * n, 255);
+                else
+                    t.charColor(20 + 40 * n, 90 + 90 * n, 200 + 50 * n);
+                t.cellColor(4 + 20 * n, 16 + 60 * n, 40 + 90 * n);
+                plot(t, x0 + x, y0 + y);
+            }
+        }
+    });
+}

package/dist/lib/sketches/scroll-assemble.d.ts

@@ -0,0 +1,8 @@
+import type { Textmodifier } from "textmode.js";
+/**
+ * Ensamblaje: las partículas empiezan dispersas, se agrupan formando tu texto a medida
+ * que bajas y estallan hacia fuera al final del recorrido.
+ */
+export declare function scAssemble(t: Textmodifier, opts?: {
+    transparent?: boolean;
+}): void;