@flyingrobots/bijou-tui 2.1.0 → 3.0.0

package/dist/motion/types.d.ts

@@ -0,0 +1,52 @@
+import type { LayoutRect } from '@flyingrobots/bijou';
+import type { SpringConfig, SpringPreset } from '../spring.js';
+/**
+ * Options for the motion() declarative wrapper.
+ */
+export interface MotionOptions {
+    /**
+     * A unique key to track this component across frames.
+     * Essential for stable transitions during list re-ordering.
+     */
+    key: string;
+    /**
+     * Transition configuration.
+     * Defaults to a 'gentle' spring.
+     */
+    transition?: {
+        type?: 'spring' | 'tween';
+        spring?: SpringPreset | SpringConfig;
+        duration?: number;
+    };
+    /**
+     * Initial layout offsets or size overrides when the component first appears.
+     * e.g. { x: -10, y: 2, width: 0 }
+     */
+    initial?: Partial<LayoutRect>;
+}
+/**
+ * Internal state for a tracked motion component.
+ */
+export interface TrackedMotion {
+    key: string;
+    /** The target rect we are moving towards. */
+    targetRect: LayoutRect;
+    /** The current interpolated rect being rendered. */
+    currentRect: LayoutRect;
+    /** Velocity for spring physics. */
+    velocity: {
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+    };
+    /** Resolved motion mode for the current transition. */
+    mode: 'spring' | 'tween';
+    /** Elapsed time for tween transitions. */
+    tweenElapsedMs: number;
+    /** Starting rect for the active tween. */
+    tweenFromRect: LayoutRect;
+    /** Whether the motion has settled. */
+    done: boolean;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/motion/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/motion/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAE/D;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B;;;OAGG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,UAAU,CAAC,EAAE;QACX,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;QAC1B,MAAM,CAAC,EAAE,YAAY,GAAG,YAAY,CAAC;QACrC,QAAQ,CAAC,EAAE,MAAM,CAAC;KACnB,CAAC;IACF;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;CAC/B;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,6CAA6C;IAC7C,UAAU,EAAE,UAAU,CAAC;IACvB,oDAAoD;IACpD,WAAW,EAAE,UAAU,CAAC;IACxB,mCAAmC;IACnC,QAAQ,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACzD,uDAAuD;IACvD,IAAI,EAAE,QAAQ,GAAG,OAAO,CAAC;IACzB,0CAA0C;IAC1C,cAAc,EAAE,MAAM,CAAC;IACvB,0CAA0C;IAC1C,aAAa,EAAE,UAAU,CAAC;IAC1B,sCAAsC;IACtC,IAAI,EAAE,OAAO,CAAC;CACf"}

package/dist/motion/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/motion/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/motion/types.ts"],"names":[],"mappings":""}

package/dist/pipeline/middleware/css.d.ts

@@ -0,0 +1,20 @@
+import type { RenderMiddleware } from '../pipeline.js';
+/**
+ * Creates a BCSS styling middleware for the rendering pipeline.
+ *
+ * This middleware resolves CSS rules against component identities
+ * and applies them to the render state.
+ *
+ * @param css - The BCSS stylesheet string.
+ * @returns A RenderMiddleware.
+ */
+export declare function bcssMiddleware(css: string): RenderMiddleware;
+/**
+ * Helper for components to resolve their own BCSS styles.
+ */
+export declare function useBCSS(state: any, identity: {
+    type: string;
+    id?: string;
+    classes?: string[];
+}): import("../../css/resolver.js").ResolvedStyles;
+//# sourceMappingURL=css.d.ts.map

package/dist/pipeline/middleware/css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.d.ts","sourceRoot":"","sources":["../../../src/pipeline/middleware/css.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAKvD;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,GAAG,EAAE,MAAM,GAAG,gBAAgB,CAoB5D;AAED;;GAEG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;CAAE,kDAU9F"}

package/dist/pipeline/middleware/css.js

@@ -0,0 +1,41 @@
+import { parseBCSS } from '../../css/parser.js';
+import { resolveStyles } from '../../css/resolver.js';
+/**
+ * Creates a BCSS styling middleware for the rendering pipeline.
+ *
+ * This middleware resolves CSS rules against component identities
+ * and applies them to the render state.
+ *
+ * @param css - The BCSS stylesheet string.
+ * @returns A RenderMiddleware.
+ */
+export function bcssMiddleware(css) {
+    let cachedSheet = null;
+    return (state, next) => {
+        if (!cachedSheet) {
+            cachedSheet = parseBCSS(css);
+        }
+        // Pass the sheet through the data bag so stages can use it
+        state.data['bcss_sheet'] = cachedSheet;
+        // The actual application of styles happens within the components 
+        // by calling a helper that uses this sheet, OR we can do a global 
+        // post-layout pass here.
+        // For now, we'll just ensure the sheet is available.
+        // Future: implement global layout override pass here.
+        next();
+    };
+}
+/**
+ * Helper for components to resolve their own BCSS styles.
+ */
+export function useBCSS(state, identity) {
+    const sheet = state.data['bcss_sheet'];
+    if (!sheet)
+        return {};
+    const terminal = {
+        width: state.ctx.runtime.columns,
+        height: state.ctx.runtime.rows
+    };
+    return resolveStyles(identity, sheet, terminal);
+}
+//# sourceMappingURL=css.js.map

package/dist/pipeline/middleware/css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.js","sourceRoot":"","sources":["../../../src/pipeline/middleware/css.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAEhD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAEtD;;;;;;;;GAQG;AACH,MAAM,UAAU,cAAc,CAAC,GAAW;IACxC,IAAI,WAAW,GAAqB,IAAI,CAAC;IAEzC,OAAO,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE;QACrB,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,WAAW,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC;QAC/B,CAAC;QAED,2DAA2D;QAC3D,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,WAAW,CAAC;QAEvC,kEAAkE;QAClE,mEAAmE;QACnE,yBAAyB;QAEzB,qDAAqD;QACrD,sDAAsD;QAEtD,IAAI,EAAE,CAAC;IACT,CAAC,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,OAAO,CAAC,KAAU,EAAE,QAA2D;IAC7F,MAAM,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,YAAY,CAA0B,CAAC;IAChE,IAAI,CAAC,KAAK;QAAE,OAAO,EAAE,CAAC;IAEtB,MAAM,QAAQ,GAAG;QACf,KAAK,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO;QAChC,MAAM,EAAE,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI;KAC/B,CAAC;IAEF,OAAO,aAAa,CAAC,QAAQ,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC;AAClD,CAAC"}

package/dist/pipeline/middleware/grayscale.d.ts

@@ -0,0 +1,9 @@
+import type { RenderMiddleware } from '../pipeline.js';
+/**
+ * Creates a post-processing middleware that converts all colors in the
+ * target surface to grayscale luminance values.
+ *
+ * @returns A RenderMiddleware for the 'PostProcess' stage.
+ */
+export declare function grayscaleFilter(): RenderMiddleware;
+//# sourceMappingURL=grayscale.d.ts.map

package/dist/pipeline/middleware/grayscale.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"grayscale.d.ts","sourceRoot":"","sources":["../../../src/pipeline/middleware/grayscale.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD;;;;;GAKG;AACH,wBAAgB,eAAe,IAAI,gBAAgB,CAiBlD"}

package/dist/pipeline/middleware/grayscale.js

@@ -0,0 +1,39 @@
+/**
+ * Creates a post-processing middleware that converts all colors in the
+ * target surface to grayscale luminance values.
+ *
+ * @returns A RenderMiddleware for the 'PostProcess' stage.
+ */
+export function grayscaleFilter() {
+    return (state, next) => {
+        const { targetSurface } = state;
+        for (let i = 0; i < targetSurface.cells.length; i++) {
+            const cell = targetSurface.cells[i];
+            if (cell.fg) {
+                cell.fg = hexToGrayscale(cell.fg);
+            }
+            if (cell.bg) {
+                cell.bg = hexToGrayscale(cell.bg);
+            }
+        }
+        next();
+    };
+}
+/** Convert a #RRGGBB hex string to a grayscale hex string based on luminance. */
+function hexToGrayscale(hex) {
+    if (hex.length !== 7 || hex[0] !== '#')
+        return hex;
+    const digits = hex.slice(1);
+    if (!/^[0-9A-Fa-f]{6}$/.test(digits))
+        return hex;
+    const r = parseInt(digits.slice(0, 2), 16);
+    const g = parseInt(digits.slice(2, 4), 16);
+    const b = parseInt(digits.slice(4, 6), 16);
+    if (isNaN(r) || isNaN(g) || isNaN(b))
+        return hex;
+    // Standard luminance formula
+    const lum = Math.round(0.299 * r + 0.587 * g + 0.114 * b);
+    const hexLum = lum.toString(16).padStart(2, '0');
+    return `#${hexLum}${hexLum}${hexLum}`;
+}
+//# sourceMappingURL=grayscale.js.map

package/dist/pipeline/middleware/grayscale.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grayscale.js","sourceRoot":"","sources":["../../../src/pipeline/middleware/grayscale.ts"],"names":[],"mappings":"AAEA;;;;;GAKG;AACH,MAAM,UAAU,eAAe;IAC7B,OAAO,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE;QACrB,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC;QAEhC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,aAAa,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YACpD,MAAM,IAAI,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC,CAAE,CAAC;YAErC,IAAI,IAAI,CAAC,EAAE,EAAE,CAAC;gBACZ,IAAI,CAAC,EAAE,GAAG,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YACpC,CAAC;YACD,IAAI,IAAI,CAAC,EAAE,EAAE,CAAC;gBACZ,IAAI,CAAC,EAAE,GAAG,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YACpC,CAAC;QACH,CAAC;QAED,IAAI,EAAE,CAAC;IACT,CAAC,CAAC;AACJ,CAAC;AAED,iFAAiF;AACjF,SAAS,cAAc,CAAC,GAAW;IACjC,IAAI,GAAG,CAAC,MAAM,KAAK,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,KAAK,GAAG;QAAE,OAAO,GAAG,CAAC;IAEnD,MAAM,MAAM,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IAC5B,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,CAAC;QAAE,OAAO,GAAG,CAAC;IAEjD,MAAM,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAC3C,MAAM,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAC3C,MAAM,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAE3C,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC;QAAE,OAAO,GAAG,CAAC;IAEjD,6BAA6B;IAC7B,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,CAAC,CAAC;IAE1D,MAAM,MAAM,GAAG,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC;IACjD,OAAO,IAAI,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,CAAC;AACxC,CAAC"}

package/dist/pipeline/middleware/motion.d.ts

@@ -0,0 +1,6 @@
+import type { RenderMiddleware } from '../pipeline.js';
+/**
+ * Pipeline middleware that performs layout interpolation for motion components.
+ */
+export declare function motionMiddleware(): RenderMiddleware;
+//# sourceMappingURL=motion.d.ts.map

package/dist/pipeline/middleware/motion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.d.ts","sourceRoot":"","sources":["../../../src/pipeline/middleware/motion.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAMvD;;GAEG;AACH,wBAAgB,gBAAgB,IAAI,gBAAgB,CAenD"}

package/dist/pipeline/middleware/motion.js

@@ -0,0 +1,19 @@
+import { MotionReconciler } from '../../motion/reconciler.js';
+const reconciler = new MotionReconciler();
+/**
+ * Pipeline middleware that performs layout interpolation for motion components.
+ */
+export function motionMiddleware() {
+    return (state, next) => {
+        const { dt } = state;
+        // We assume the Layout pass has already populated targetSurface 
+        // with a LayoutNode tree if it's not a raw Surface.
+        // In our simplified V3, App.view might return a LayoutNode.
+        const root = state.layoutRoot;
+        if (root) {
+            reconciler.reconcile(root, dt);
+        }
+        next();
+    };
+}
+//# sourceMappingURL=motion.js.map

package/dist/pipeline/middleware/motion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.js","sourceRoot":"","sources":["../../../src/pipeline/middleware/motion.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAG9D,MAAM,UAAU,GAAG,IAAI,gBAAgB,EAAE,CAAC;AAE1C;;GAEG;AACH,MAAM,UAAU,gBAAgB;IAC9B,OAAO,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE;QACrB,MAAM,EAAE,EAAE,EAAE,GAAG,KAAK,CAAC;QAErB,iEAAiE;QACjE,oDAAoD;QACpD,4DAA4D;QAE5D,MAAM,IAAI,GAAI,KAAa,CAAC,UAAoC,CAAC;QACjE,IAAI,IAAI,EAAE,CAAC;YACT,UAAU,CAAC,SAAS,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACjC,CAAC;QAED,IAAI,EAAE,CAAC;IACT,CAAC,CAAC;AACJ,CAAC"}

package/dist/pipeline/middleware/paint.d.ts

@@ -0,0 +1,6 @@
+import type { RenderMiddleware } from '../pipeline.js';
+/**
+ * Pipeline middleware that paints a LayoutNode tree onto the target surface.
+ */
+export declare function paintMiddleware(): RenderMiddleware;
+//# sourceMappingURL=paint.d.ts.map

package/dist/pipeline/middleware/paint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"paint.d.ts","sourceRoot":"","sources":["../../../src/pipeline/middleware/paint.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGvD;;GAEG;AACH,wBAAgB,eAAe,IAAI,gBAAgB,CAQlD"}

package/dist/pipeline/middleware/paint.js

@@ -0,0 +1,21 @@
+/**
+ * Pipeline middleware that paints a LayoutNode tree onto the target surface.
+ */
+export function paintMiddleware() {
+    return (state, next) => {
+        const root = state.layoutRoot;
+        if (root) {
+            paintNode(state.targetSurface, root);
+        }
+        next();
+    };
+}
+function paintNode(target, node) {
+    if (node.surface) {
+        target.blit(node.surface, node.rect.x, node.rect.y);
+    }
+    for (const child of node.children) {
+        paintNode(target, child);
+    }
+}
+//# sourceMappingURL=paint.js.map

package/dist/pipeline/middleware/paint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"paint.js","sourceRoot":"","sources":["../../../src/pipeline/middleware/paint.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,MAAM,UAAU,eAAe;IAC7B,OAAO,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE;QACrB,MAAM,IAAI,GAAI,KAAa,CAAC,UAAoC,CAAC;QACjE,IAAI,IAAI,EAAE,CAAC;YACT,SAAS,CAAC,KAAK,CAAC,aAAa,EAAE,IAAI,CAAC,CAAC;QACvC,CAAC;QACD,IAAI,EAAE,CAAC;IACT,CAAC,CAAC;AACJ,CAAC;AAED,SAAS,SAAS,CAAC,MAAe,EAAE,IAAgB;IAClD,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;QACjB,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACtD,CAAC;IAED,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;QAClC,SAAS,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IAC3B,CAAC;AACH,CAAC"}

package/dist/pipeline/pipeline.d.ts

@@ -0,0 +1,56 @@
+import type { Surface, BijouContext } from '@flyingrobots/bijou';
+/**
+ * The state passed through the rendering pipeline.
+ */
+export interface RenderState {
+    /** The model being rendered. */
+    model: any;
+    /** The Bijou context (ports, theme, mode). */
+    ctx: BijouContext;
+    /** Time delta in seconds since the last frame. */
+    dt: number;
+    /**
+     * The surface currently visible on the terminal.
+     * This should NOT be modified by pipeline stages.
+     */
+    readonly currentSurface: Surface;
+    /**
+     * The target surface being painted.
+     * Middleware in the `Paint` and `PostProcess` stages modify this surface.
+     */
+    targetSurface: Surface;
+    /**
+     * Layout geometry calculated during the `Layout` stage.
+     * Keyed by component ID.
+     */
+    layoutMap: Map<string, any>;
+    /**
+     * Custom data bag for middleware to pass state between stages.
+     */
+    data: Record<string, any>;
+}
+/**
+ * A middleware function in the rendering pipeline.
+ *
+ * @param state - The current render state.
+ * @param next - Function to yield control to the next middleware.
+ */
+export type RenderMiddleware = (state: RenderState, next: () => void) => void | Promise<void>;
+/**
+ * A stage in the rendering pipeline.
+ */
+export type RenderStage = 'Layout' | 'Paint' | 'PostProcess' | 'Diff' | 'Output';
+/**
+ * The rendering pipeline registry.
+ */
+export interface RenderPipeline {
+    /** Register middleware for a specific stage. */
+    use(stage: RenderStage, middleware: RenderMiddleware): void;
+    /** Execute the entire pipeline for a given state. */
+    execute(state: RenderState): void;
+}
+/**
+ * Create a new programmable rendering pipeline.
+ */
+export declare function createPipeline(): RenderPipeline;
+//# sourceMappingURL=pipeline.d.ts.map

package/dist/pipeline/pipeline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pipeline.d.ts","sourceRoot":"","sources":["../../src/pipeline/pipeline.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAEjE;;GAEG;AACH,MAAM,WAAW,WAAW;IAC1B,gCAAgC;IAChC,KAAK,EAAE,GAAG,CAAC;IACX,8CAA8C;IAC9C,GAAG,EAAE,YAAY,CAAC;IAClB,kDAAkD;IAClD,EAAE,EAAE,MAAM,CAAC;IACX;;;OAGG;IACH,QAAQ,CAAC,cAAc,EAAE,OAAO,CAAC;IACjC;;;OAGG;IACH,aAAa,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,SAAS,EAAE,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC5B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAC3B;AAED;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,CAAC,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,IAAI,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;AAE9F;;GAEG;AACH,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,OAAO,GAAG,aAAa,GAAG,MAAM,GAAG,QAAQ,CAAC;AAEjF;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,gDAAgD;IAChD,GAAG,CAAC,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAC5D,qDAAqD;IACrD,OAAO,CAAC,KAAK,EAAE,WAAW,GAAG,IAAI,CAAC;CACnC;AAED;;GAEG;AACH,wBAAgB,cAAc,IAAI,cAAc,CA8C/C"}

package/dist/pipeline/pipeline.js

@@ -0,0 +1,45 @@
+/**
+ * Create a new programmable rendering pipeline.
+ */
+export function createPipeline() {
+    const stages = {
+        Layout: [],
+        Paint: [],
+        PostProcess: [],
+        Diff: [],
+        Output: [],
+    };
+    const STAGE_ORDER = ['Layout', 'Paint', 'PostProcess', 'Diff', 'Output'];
+    function use(stage, middleware) {
+        stages[stage].push(middleware);
+    }
+    function execute(state) {
+        // Flatten all middleware into a single execution chain based on stage order
+        const chain = [];
+        for (const stage of STAGE_ORDER) {
+            chain.push(...stages[stage]);
+        }
+        let index = 0;
+        const next = () => {
+            if (index < chain.length) {
+                const mw = chain[index++];
+                try {
+                    // Note: The pipeline is currently synchronous. If a middleware returns a Promise,
+                    // it won't block the TEA update loop, but it might resolve out-of-order.
+                    // For now, we expect render middleware to be entirely synchronous.
+                    void mw(state, next);
+                }
+                catch (err) {
+                    // Log and continue if a specific middleware fails, preventing full crash
+                    if (state.ctx.io.writeError) {
+                        state.ctx.io.writeError(`[Pipeline Error] ${err instanceof Error ? err.stack : err}\n`);
+                    }
+                    next();
+                }
+            }
+        };
+        next();
+    }
+    return { use, execute };
+}
+//# sourceMappingURL=pipeline.js.map

package/dist/pipeline/pipeline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pipeline.js","sourceRoot":"","sources":["../../src/pipeline/pipeline.ts"],"names":[],"mappings":"AAwDA;;GAEG;AACH,MAAM,UAAU,cAAc;IAC5B,MAAM,MAAM,GAA4C;QACtD,MAAM,EAAE,EAAE;QACV,KAAK,EAAE,EAAE;QACT,WAAW,EAAE,EAAE;QACf,IAAI,EAAE,EAAE;QACR,MAAM,EAAE,EAAE;KACX,CAAC;IAEF,MAAM,WAAW,GAAkB,CAAC,QAAQ,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;IAExF,SAAS,GAAG,CAAC,KAAkB,EAAE,UAA4B;QAC3D,MAAM,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACjC,CAAC;IAED,SAAS,OAAO,CAAC,KAAkB;QACjC,4EAA4E;QAC5E,MAAM,KAAK,GAAuB,EAAE,CAAC;QACrC,KAAK,MAAM,KAAK,IAAI,WAAW,EAAE,CAAC;YAChC,KAAK,CAAC,IAAI,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;QAC/B,CAAC;QAED,IAAI,KAAK,GAAG,CAAC,CAAC;QAEd,MAAM,IAAI,GAAG,GAAG,EAAE;YAChB,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC;gBACzB,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC;gBAC1B,IAAI,CAAC;oBACH,kFAAkF;oBAClF,yEAAyE;oBACzE,mEAAmE;oBACnE,KAAK,EAAG,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;gBACxB,CAAC;gBAAC,OAAO,GAAG,EAAE,CAAC;oBACb,yEAAyE;oBACzE,IAAI,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,UAAU,EAAE,CAAC;wBAC5B,KAAK,CAAC,GAAG,CAAC,EAAE,CAAC,UAAU,CAAC,oBAAoB,GAAG,YAAY,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC;oBAC1F,CAAC;oBACD,IAAI,EAAE,CAAC;gBACT,CAAC;YACH,CAAC;QACH,CAAC,CAAC;QAEF,IAAI,EAAE,CAAC;IACT,CAAC;IAED,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC;AAC1B,CAAC"}

package/dist/runtime.d.ts

@@ -15,5 +15,5 @@ import type { App, RunOptions } from './types.js';
  * @param options - Optional runtime configuration (context, alt screen, cursor, mouse).
  * @returns A promise that resolves when the application exits.
  */
-export declare function run<Model, M>(app: App<Model, M>, options?: RunOptions): Promise<void>;
+export declare function run<Model, M>(app: App<Model, M>, options?: RunOptions<M>): Promise<void>;
 //# sourceMappingURL=runtime.d.ts.map

package/dist/runtime.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"runtime.d.ts","sourceRoot":"","sources":["../src/runtime.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,GAAG,EAAO,UAAU,EAAa,MAAM,YAAY,CAAC;AAkBlE;;;;;;;;;;;;;;;GAeG;AACH,wBAAsB,GAAG,CAAC,KAAK,EAAE,CAAC,EAChC,GAAG,EAAE,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,EAClB,OAAO,CAAC,EAAE,UAAU,GACnB,OAAO,CAAC,IAAI,CAAC,CAoHf"}
+{"version":3,"file":"runtime.d.ts","sourceRoot":"","sources":["../src/runtime.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,GAAG,EAAO,UAAU,EAAa,MAAM,YAAY,CAAC;AAwBlE;;;;;;;;;;;;;;;GAeG;AACH,wBAAsB,GAAG,CAAC,KAAK,EAAE,CAAC,EAChC,GAAG,EAAE,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,EAClB,OAAO,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC,GACtB,OAAO,CAAC,IAAI,CAAC,CAgQf"}

package/dist/runtime.js

@@ -1,12 +1,18 @@
-import { getDefaultContext } from '@flyingrobots/bijou';
-import { isKeyMsg } from './types.js';
-import { enterScreen, exitScreen, renderFrame } from './screen.js';
+import { getDefaultContext, createSurface, surfaceToString } from '@flyingrobots/bijou';
+import { isKeyMsg, isPulseMsg, isResizeMsg } from './types.js';
+import { clearAndHome, enterScreen, exitScreen, renderSurfaceFrame } from './screen.js';
 import { createEventBus } from './eventbus.js';
+import { createPipeline } from './pipeline/pipeline.js';
+import { bcssMiddleware } from './pipeline/middleware/css.js';
+import { motionMiddleware } from './pipeline/middleware/motion.js';
+import { paintMiddleware } from './pipeline/middleware/paint.js';
+import { installBCSSResolver } from './css/install.js';
+import { normalizeViewOutput, wrapViewOutputAsLayoutRoot } from './view-output.js';
 /**
  * Disable mouse reporting sequences that terminals may send.
  * Some terminals auto-enable mouse tracking in alt screen mode.
  */
-const DISABLE_MOUSE = '\x1b[?1000l\x1b[?1002l\x1b[?1003l\x1b[?1006l';
+const DISABLE_MOUSE = '\x1b[?1000l\x1b[?1002l\x1b[?1006l';
 /**
  * Enable SGR mouse reporting.
  * 1000 = basic press/release, 1002 = button-event tracking (drag),
@@ -31,13 +37,27 @@ const ENABLE_MOUSE = '\x1b[?1000h\x1b[?1002h\x1b[?1006h';
  */
 export async function run(app, options) {
     const ctx = options?.ctx ?? getDefaultContext();
+    installRuntimeOverlay(ctx);
     const useAltScreen = options?.altScreen ?? true;
     const useHideCursor = options?.hideCursor ?? true;
     const useMouse = options?.mouse ?? false;
+    installBCSSResolver(ctx, options?.css);
     const [initModel, initCmds] = app.init();
     // Non-interactive: render once and return
     if (ctx.mode !== 'interactive') {
-        ctx.io.write(app.view(initModel));
+        const viewOutput = app.view(initModel);
+        let output;
+        if (typeof viewOutput === 'string') {
+            output = viewOutput;
+        }
+        else {
+            const normalized = normalizeViewOutput(viewOutput, {
+                width: sanitizeDimension(ctx.runtime.columns),
+                height: sanitizeDimension(ctx.runtime.rows),
+            });
+            output = surfaceToString(normalized.surface, ctx.style);
+        }
+        ctx.io.write(output);
         return;
     }
     // Interactive mode
@@ -45,6 +65,10 @@ export async function run(app, options) {
     let running = true;
     let lastCtrlC = 0;
     let resolveQuit = null;
+    let currentDt = 0.016; // Default to 60fps for first frame
+    let fatalError = null;
+    // Double Buffering: track what is currently on screen
+    let currentSurface = createSurface(sanitizeDimension(ctx.runtime.columns), sanitizeDimension(ctx.runtime.rows));
     const bus = createEventBus({
         onCommandRejected(error) {
             const message = error instanceof Error
@@ -53,8 +77,46 @@ export async function run(app, options) {
             writeErrorLine(ctx.io, `[EventBus] Command rejected: ${message}\n`);
         },
     });
+    // Setup Programmable Rendering Pipeline
+    const pipeline = createPipeline();
+    // 1. Layout Logic Stage
+    pipeline.use('Layout', (state, next) => {
+        const viewOutput = app.view(state.model);
+        state.layoutRoot = wrapViewOutputAsLayoutRoot(viewOutput, {
+            width: sanitizeDimension(ctx.runtime.columns),
+            height: sanitizeDimension(ctx.runtime.rows),
+        });
+        next();
+    });
+    // 2. Motion Interpolation Stage
+    pipeline.use('Layout', motionMiddleware());
+    if (options?.css) {
+        pipeline.use('Layout', bcssMiddleware(options.css));
+    }
+    // 3. Paint Stage
+    pipeline.use('Paint', paintMiddleware());
+    // Add default Diff stage (double-buffering)
+    pipeline.use('Diff', (state, next) => {
+        renderSurfaceFrame(state.ctx.io, state.currentSurface, state.targetSurface, state.ctx.style);
+        next();
+    });
+    // Add default Output stage (sync current surface)
+    pipeline.use('Output', (state, next) => {
+        currentSurface = state.targetSurface.clone();
+        next();
+    });
+    options?.configurePipeline?.(pipeline);
+    // Register user middleware
+    if (options?.middlewares) {
+        for (const mw of options.middlewares) {
+            bus.use(mw);
+        }
+    }
     /** Tear down the run loop and signal the quit promise. */
-    function shutdown() {
+    function shutdown(error) {
+        if (error !== undefined && fatalError === null) {
+            fatalError = error;
+        }
         if (!running)
             return;
         running = false;
@@ -72,11 +134,34 @@ export async function run(app, options) {
         ctx.io.write(DISABLE_MOUSE);
     }
     // Render helper
+    let renderRequested = false;
     /** Render the current model's view to the terminal. */
     function render() {
-        if (!running)
+        if (!running || renderRequested)
             return;
-        renderFrame(ctx.io, app.view(model));
+        renderRequested = true;
+        setTimeout(() => {
+            try {
+                const targetSurface = createSurface(sanitizeDimension(ctx.runtime.columns), sanitizeDimension(ctx.runtime.rows));
+                const renderState = {
+                    model,
+                    ctx,
+                    dt: currentDt,
+                    currentSurface,
+                    targetSurface,
+                    layoutMap: new Map(),
+                    data: {},
+                };
+                pipeline.execute(renderState);
+            }
+            catch (error) {
+                writeErrorLine(ctx.io, `[Runtime Error] ${error instanceof Error ? (error.stack ?? error.message) : String(error)}\n`);
+                shutdown(error);
+            }
+            finally {
+                renderRequested = false;
+            }
+        }, 0);
     }
     // Execute commands through the bus
     /** Submit TEA commands to the event bus for async execution. */
@@ -89,10 +174,22 @@ export async function run(app, options) {
     bus.connectIO(ctx.io, { mouse: useMouse });
     // Handle quit signals from commands
     bus.onQuit(shutdown);
+    // Start heartbeat for animations
+    bus.startPulse(ctx.runtime.refreshRate);
     // Single subscription drives the entire update cycle
     bus.on((msg) => {
         if (!running)
             return;
+        // Track time delta from pulse
+        if (isPulseMsg(msg)) {
+            currentDt = msg.dt;
+        }
+        if (isResizeMsg(msg)) {
+            ctx.runtime.columns = sanitizeDimension(msg.columns);
+            ctx.runtime.rows = sanitizeDimension(msg.rows);
+            currentSurface = createSurface(ctx.runtime.columns, ctx.runtime.rows);
+            clearAndHome(ctx.io);
+        }
         // Double Ctrl+C force-quit
         if (isKeyMsg(msg) && msg.key === 'c' && msg.ctrl) {
             const now = Date.now();
@@ -116,6 +213,9 @@ export async function run(app, options) {
     };
     const [resizedModel, resizeCmds] = app.update(initialResize, model);
     model = resizedModel;
+    // After a potential resize in update, ensure currentSurface matches size
+    // to avoid diffing mismatched grids.
+    currentSurface = createSurface(sanitizeDimension(ctx.runtime.columns), sanitizeDimension(ctx.runtime.rows));
     // Initial render + startup commands
     render();
     executeCommands(initCmds);
@@ -126,7 +226,14 @@ export async function run(app, options) {
         if (!running)
             resolve();
     });
+    // Ensure any pending render is flushed before exiting
+    if (renderRequested) {
+        await new Promise((resolve) => {
+            setTimeout(resolve, 0);
+        });
+    }
     // Cleanup — bus disposes all I/O connections
+    bus.stopPulse();
     bus.dispose();
     if (useMouse) {
         ctx.io.write(DISABLE_MOUSE);
@@ -134,6 +241,9 @@ export async function run(app, options) {
     if (useAltScreen || useHideCursor) {
         exitScreen(ctx.io);
     }
+    if (fatalError != null) {
+        throw fatalError instanceof Error ? fatalError : new Error(String(fatalError));
+    }
 }
 /** Clamp a terminal dimension to a non-negative integer. */
 function sanitizeDimension(value) {
@@ -141,6 +251,41 @@ function sanitizeDimension(value) {
         return 0;
     return Math.max(0, Math.floor(value));
 }
+function installRuntimeOverlay(ctx) {
+    const baseRuntime = ctx.runtime;
+    const state = {
+        columns: sanitizeDimension(baseRuntime.columns),
+        rows: sanitizeDimension(baseRuntime.rows),
+    };
+    const runtime = {
+        env(key) {
+            return baseRuntime.env(key);
+        },
+        get stdoutIsTTY() {
+            return baseRuntime.stdoutIsTTY;
+        },
+        get stdinIsTTY() {
+            return baseRuntime.stdinIsTTY;
+        },
+        get columns() {
+            return state.columns;
+        },
+        set columns(value) {
+            state.columns = sanitizeDimension(value);
+        },
+        get rows() {
+            return state.rows;
+        },
+        set rows(value) {
+            state.rows = sanitizeDimension(value);
+        },
+        get refreshRate() {
+            return baseRuntime.refreshRate;
+        },
+    };
+    ctx.runtime = runtime;
+    return runtime;
+}
 /** Write an error message to stderr if available, otherwise stdout. */
 function writeErrorLine(io, data) {
     if (io.writeError != null) {