@effect-tui/react 0.1.1 → 0.1.4

package/dist/src/hosts/flex-container.d.ts

@@ -0,0 +1,45 @@
+import type { CellBuffer, Palette, Color } from "@effect-tui/core";
+import type { HostContext, Rect, Size, CommonProps } from "../reconciler/types.js";
+import { BaseHost } from "./base.js";
+import { type FlexAxis } from "../utils/index.js";
+export type CrossAlignment<A extends FlexAxis> = A extends "vertical" ? "leading" | "center" | "trailing" : "top" | "center" | "bottom";
+export interface FlexContainerProps<A extends FlexAxis> extends CommonProps {
+    spacing?: number;
+    alignment?: CrossAlignment<A>;
+    /** Background color to fill the entire container rect */
+    bg?: Color;
+}
+/**
+ * FlexContainerHost is a generic linear layout container.
+ * VStackHost and HStackHost extend this with their axis-specific defaults.
+ */
+export declare class FlexContainerHost<A extends FlexAxis> extends BaseHost {
+    protected readonly axis: A;
+    spacing: number;
+    alignment: CrossAlignment<A>;
+    bg?: Color;
+    private cachedSizes;
+    private layoutChildren;
+    constructor(axis: A, elementType: string, props: FlexContainerProps<A>, ctx: HostContext, defaultAlignment: CrossAlignment<A>);
+    /** Get children excluding __static nodes (which are rendered separately) */
+    private getNonStaticChildren;
+    /**
+     * Measure this container's size given parent's proposed constraints.
+     *
+     * Frame constraints are applied in two places:
+     * 1. constrainProposal() - limits what we tell children is available
+     * 2. constrainResult() - limits what we report back to parent
+     *
+     * This enables patterns like:
+     * ```tsx
+     * <vstack height={10}>      // Reports 10, proposes 10 to children
+     *   <scroll>...</scroll>    // Greedy, but only gets 10
+     * </vstack>
+     * ```
+     */
+    measure(maxW: number, maxH: number): Size;
+    layout(rect: Rect): void;
+    render(buffer: CellBuffer, palette: Palette): void;
+    updateProps(props: Record<string, unknown>): void;
+}
+//# sourceMappingURL=flex-container.d.ts.map

package/dist/src/hosts/flex-container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flex-container.d.ts","sourceRoot":"","sources":["../../../src/hosts/flex-container.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AAElE,OAAO,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAClF,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AACpC,OAAO,EAA2B,KAAK,QAAQ,EAAsC,MAAM,mBAAmB,CAAA;AAE9G,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,QAAQ,IAAI,CAAC,SAAS,UAAU,GAClE,SAAS,GAAG,QAAQ,GAAG,UAAU,GACjC,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;AAE9B,MAAM,WAAW,kBAAkB,CAAC,CAAC,SAAS,QAAQ,CAAE,SAAQ,WAAW;IAC1E,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAA;IAC7B,yDAAyD;IACzD,EAAE,CAAC,EAAE,KAAK,CAAA;CACV;AAYD;;;GAGG;AACH,qBAAa,iBAAiB,CAAC,CAAC,SAAS,QAAQ,CAAE,SAAQ,QAAQ;IAQjE,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;IAP3B,OAAO,SAAI;IACX,SAAS,EAAG,cAAc,CAAC,CAAC,CAAC,CAAA;IAC7B,EAAE,CAAC,EAAE,KAAK,CAAA;IACV,OAAO,CAAC,WAAW,CAAa;IAChC,OAAO,CAAC,cAAc,CAA2B;gBAG7B,IAAI,EAAE,CAAC,EAC1B,WAAW,EAAE,MAAM,EACnB,KAAK,EAAE,kBAAkB,CAAC,CAAC,CAAC,EAC5B,GAAG,EAAE,WAAW,EAChB,gBAAgB,EAAE,cAAc,CAAC,CAAC,CAAC;IAOpC,4EAA4E;IAC5E,OAAO,CAAC,oBAAoB;IAI5B;;;;;;;;;;;;;OAaG;IACH,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IAchC,MAAM,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;IAcjC,MAAM,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;IAgBzC,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;CAS1D"}

package/dist/src/hosts/flex-container.js

@@ -0,0 +1,90 @@
+import { splitConstraints } from "@effect-tui/core";
+import { BaseHost } from "./base.js";
+import { measureFlex, layoutFlex, resolveBgStyle } from "../utils/index.js";
+// Map alignment names to generic flex alignment
+function toFlexAlignment(axis, alignment) {
+    if (alignment === "center")
+        return "center";
+    if (axis === "vertical") {
+        return alignment === "leading" ? "start" : "end";
+    }
+    else {
+        return alignment === "top" ? "start" : "end";
+    }
+}
+/**
+ * FlexContainerHost is a generic linear layout container.
+ * VStackHost and HStackHost extend this with their axis-specific defaults.
+ */
+export class FlexContainerHost extends BaseHost {
+    axis;
+    spacing = 0;
+    alignment; // Set in constructor before updateProps
+    bg;
+    cachedSizes = [];
+    layoutChildren = [];
+    constructor(axis, elementType, props, ctx, defaultAlignment) {
+        super(elementType, props, ctx);
+        this.axis = axis;
+        this.alignment = defaultAlignment;
+        this.updateProps(props);
+    }
+    /** Get children excluding __static nodes (which are rendered separately) */
+    getNonStaticChildren() {
+        return this.children.filter((c) => !c.__static);
+    }
+    /**
+     * Measure this container's size given parent's proposed constraints.
+     *
+     * Frame constraints are applied in two places:
+     * 1. constrainProposal() - limits what we tell children is available
+     * 2. constrainResult() - limits what we report back to parent
+     *
+     * This enables patterns like:
+     * ```tsx
+     * <vstack height={10}>      // Reports 10, proposes 10 to children
+     *   <scroll>...</scroll>    // Greedy, but only gets 10
+     * </vstack>
+     * ```
+     */
+    measure(maxW, maxH) {
+        // Apply frame constraints to what we propose to children
+        const constrained = this.constrainProposal(maxW, maxH);
+        // Exclude __static children from normal layout - they're rendered to scrollback separately
+        this.layoutChildren = this.getNonStaticChildren();
+        const [maxMain, maxCross] = splitConstraints(this.axis, constrained.w, constrained.h);
+        const result = measureFlex(this.axis, this.layoutChildren, this.spacing, maxMain, maxCross);
+        this.cachedSizes = result.sizes;
+        // Apply frame constraints to what we report to parent
+        return this.constrainResult(result.totalSize);
+    }
+    layout(rect) {
+        super.layout(rect);
+        const stretchCross = this.axis === "vertical" ? this.alignment === "leading" : this.alignment === "top";
+        layoutFlex(this.axis, this.layoutChildren, this.cachedSizes, rect, this.spacing, toFlexAlignment(this.axis, this.alignment), stretchCross);
+    }
+    render(buffer, palette) {
+        // Fill background color if set
+        if (this.bg && this.rect) {
+            const { styleId } = resolveBgStyle(palette, this.bg);
+            buffer.fillRect(this.rect.x, this.rect.y, this.rect.w, this.rect.h, 32, styleId);
+        }
+        // Only render non-static children to buffer (static content goes to scrollback)
+        // Check __static at render time (not just measure time) to avoid race with React commit
+        for (const child of this.layoutChildren) {
+            if (!child.__static) {
+                child.render(buffer, palette);
+            }
+        }
+    }
+    updateProps(props) {
+        super.updateProps(props);
+        this.spacing = props.spacing ?? 0;
+        // Reset to axis-specific default when undefined
+        this.alignment =
+            props.alignment ??
+                (this.axis === "vertical" ? "leading" : "top");
+        this.bg = props.bg;
+    }
+}
+//# sourceMappingURL=flex-container.js.map

package/dist/src/hosts/flex-container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flex-container.js","sourceRoot":"","sources":["../../../src/hosts/flex-container.ts"],"names":[],"mappings":"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"}

package/dist/src/hosts/hstack.d.ts

@@ -1,18 +1,13 @@
-import type { CellBuffer, Palette } from "@effect-tui/core";
-import type { HostContext, Rect, Size, CommonProps } from "../reconciler/types.js";
-import { BaseHost } from "./base.js";
+import type { HostContext, CommonProps } from "../reconciler/types.js";
+import { FlexContainerHost } from "./flex-container.js";
 export interface HStackProps extends CommonProps {
     spacing?: number;
     alignment?: "top" | "center" | "bottom";
 }
-export declare class HStackHost extends BaseHost {
-    spacing: number;
-    alignment: "top" | "center" | "bottom";
-    private cachedSizes;
+/**
+ * HStackHost lays out children horizontally with optional spacing and cross-axis alignment.
+ */
+export declare class HStackHost extends FlexContainerHost<"horizontal"> {
     constructor(props: HStackProps, ctx: HostContext);
-    measure(maxW: number, maxH: number): Size;
-    layout(rect: Rect): void;
-    render(buffer: CellBuffer, palette: Palette): void;
-    updateProps(props: Record<string, unknown>): void;
 }
 //# sourceMappingURL=hstack.d.ts.map

package/dist/src/hosts/hstack.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hstack.d.ts","sourceRoot":"","sources":["../../../src/hosts/hstack.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAA;AAC3D,OAAO,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAClF,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AAGpC,MAAM,WAAW,WAAY,SAAQ,WAAW;IAC9C,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;CACxC;AAcD,qBAAa,UAAW,SAAQ,QAAQ;IACtC,OAAO,SAAI;IACX,SAAS,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAQ;IAC9C,OAAO,CAAC,WAAW,CAAa;gBAEpB,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,WAAW;IAKhD,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IAMhC,MAAM,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;IAcjC,MAAM,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;IAMzC,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;CAK3D"}
+{"version":3,"file":"hstack.d.ts","sourceRoot":"","sources":["../../../src/hosts/hstack.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AACtE,OAAO,EAAE,iBAAiB,EAA2B,MAAM,qBAAqB,CAAA;AAEhF,MAAM,WAAW,WAAY,SAAQ,WAAW;IAC/C,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;CACvC;AAED;;GAEG;AACH,qBAAa,UAAW,SAAQ,iBAAiB,CAAC,YAAY,CAAC;gBAClD,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,WAAW;CAGhD"}

package/dist/src/hosts/hstack.js

@@ -1,45 +1,10 @@
-import { BaseHost } from "./base.js";
-import { measureFlex, layoutFlex } from "../utils/index.js";
-// Map HStack alignment names to generic flex alignment
-function toFlexAlignment(alignment) {
-    switch (alignment) {
-        case "top":
-            return "start";
-        case "center":
-            return "center";
-        case "bottom":
-            return "end";
-    }
-}
-export class HStackHost extends BaseHost {
-    spacing = 0;
-    alignment = "top";
-    cachedSizes = [];
+import { FlexContainerHost } from "./flex-container.js";
+/**
+ * HStackHost lays out children horizontally with optional spacing and cross-axis alignment.
+ */
+export class HStackHost extends FlexContainerHost {
     constructor(props, ctx) {
-        super("hstack", props, ctx);
-        this.updateProps(props);
-    }
-    measure(maxW, maxH) {
-        const result = measureFlex("horizontal", this.children, this.spacing, maxW, maxH);
-        this.cachedSizes = result.sizes;
-        return result.totalSize;
-    }
-    layout(rect) {
-        super.layout(rect);
-        const stretchCross = this.alignment === "top";
-        layoutFlex("horizontal", this.children, this.cachedSizes, rect, this.spacing, toFlexAlignment(this.alignment), stretchCross);
-    }
-    render(buffer, palette) {
-        for (const child of this.children) {
-            child.render(buffer, palette);
-        }
-    }
-    updateProps(props) {
-        super.updateProps(props);
-        if (props.spacing !== undefined)
-            this.spacing = props.spacing;
-        if (props.alignment !== undefined)
-            this.alignment = props.alignment;
+        super("horizontal", "hstack", props, ctx, "top");
     }
 }
 //# sourceMappingURL=hstack.js.map

package/dist/src/hosts/hstack.js.map

@@ -1 +1 @@
-{"version":3,"file":"hstack.js","sourceRoot":"","sources":["../../../src/hosts/hstack.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AACpC,OAAO,EAAE,WAAW,EAAE,UAAU,EAAsB,MAAM,mBAAmB,CAAA;AAO/E,uDAAuD;AACvD,SAAS,eAAe,CAAC,SAAsC;IAC7D,QAAQ,SAAS,EAAE,CAAC;QAClB,KAAK,KAAK;YACR,OAAO,OAAO,CAAA;QAChB,KAAK,QAAQ;YACX,OAAO,QAAQ,CAAA;QACjB,KAAK,QAAQ;YACX,OAAO,KAAK,CAAA;IAChB,CAAC;AACH,CAAC;AAED,MAAM,OAAO,UAAW,SAAQ,QAAQ;IACtC,OAAO,GAAG,CAAC,CAAA;IACX,SAAS,GAAgC,KAAK,CAAA;IACtC,WAAW,GAAW,EAAE,CAAA;IAEhC,YAAY,KAAkB,EAAE,GAAgB;QAC9C,KAAK,CAAC,QAAQ,EAAE,KAAK,EAAE,GAAG,CAAC,CAAA;QAC3B,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;IACzB,CAAC;IAED,OAAO,CAAC,IAAY,EAAE,IAAY;QAChC,MAAM,MAAM,GAAG,WAAW,CAAC,YAAY,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,CAAC,CAAA;QACjF,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC,KAAK,CAAA;QAC/B,OAAO,MAAM,CAAC,SAAS,CAAA;IACzB,CAAC;IAEQ,MAAM,CAAC,IAAU;QACxB,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;QAClB,MAAM,YAAY,GAAG,IAAI,CAAC,SAAS,KAAK,KAAK,CAAA;QAC7C,UAAU,CACR,YAAY,EACZ,IAAI,CAAC,QAAQ,EACb,IAAI,CAAC,WAAW,EAChB,IAAI,EACJ,IAAI,CAAC,OAAO,EACZ,eAAe,CAAC,IAAI,CAAC,SAAS,CAAC,EAC/B,YAAY,CACb,CAAA;IACH,CAAC;IAED,MAAM,CAAC,MAAkB,EAAE,OAAgB;QACzC,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClC,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;QAC/B,CAAC;IACH,CAAC;IAEQ,WAAW,CAAC,KAA8B;QACjD,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;QACxB,IAAI,KAAK,CAAC,OAAO,KAAK,SAAS;YAAE,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,OAAiB,CAAA;QACvE,IAAI,KAAK,CAAC,SAAS,KAAK,SAAS;YAAE,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,SAAwC,CAAA;IACpG,CAAC;CACF"}
+{"version":3,"file":"hstack.js","sourceRoot":"","sources":["../../../src/hosts/hstack.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAA2B,MAAM,qBAAqB,CAAA;AAOhF;;GAEG;AACH,MAAM,OAAO,UAAW,SAAQ,iBAA+B;IAC9D,YAAY,KAAkB,EAAE,GAAgB;QAC/C,KAAK,CAAC,YAAY,EAAE,QAAQ,EAAE,KAAyC,EAAE,GAAG,EAAE,KAAK,CAAC,CAAA;IACrF,CAAC;CACD"}

package/dist/src/hosts/index.d.ts

@@ -1,6 +1,7 @@
 import type { HostContext, CommonProps } from "../reconciler/types.js";
 import type { BaseHost } from "./base.js";
 import { RawTextHost } from "./text.js";
+export { SingleChildHost } from "./single-child.js";
 export { BaseHost } from "./base.js";
 export { TextHost, RawTextHost, type TextProps } from "./text.js";
 export { SpacerHost, type SpacerProps } from "./spacer.js";
@@ -10,6 +11,9 @@ export { ZStackHost, type ZStackProps } from "./zstack.js";
 export { BoxHost, type BoxProps } from "./box.js";
 export { CanvasHost, type CanvasProps, type DrawContext } from "./canvas.js";
 export { CodeBlockHost, type CodeBlockProps } from "./codeblock.js";
+export { ScrollHost, type ScrollProps } from "./scroll.js";
+export { OverlayHost, type OverlayProps } from "./overlay.js";
+export { OverlayItemHost, type OverlayItemProps } from "./overlay-item.js";
 export declare const hostRegistry: Record<string, new (props: any, ctx: HostContext) => BaseHost>;
 export declare function createHostInstance(type: string, props: CommonProps, ctx: HostContext): BaseHost;
 export declare function createTextInstance(text: string, ctx: HostContext): RawTextHost;

package/dist/src/hosts/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hosts/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AACtE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AACzC,OAAO,EAAY,WAAW,EAAE,MAAM,WAAW,CAAA;AASjD,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AACpC,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAA;AACjE,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,UAAU,CAAA;AACjD,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC5E,OAAO,EAAE,aAAa,EAAE,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAInE,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,WAAW,KAAK,QAAQ,CASvF,CAAA;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,WAAW,GAAG,QAAQ,CAM/F;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,WAAW,GAAG,WAAW,CAE9E"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hosts/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AACtE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AACzC,OAAO,EAAY,WAAW,EAAE,MAAM,WAAW,CAAA;AAWjD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAEnD,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AACpC,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAK,SAAS,EAAE,MAAM,WAAW,CAAA;AACjE,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,UAAU,CAAA;AACjD,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC5E,OAAO,EAAE,aAAa,EAAE,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAA;AACnE,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,WAAW,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAA;AAC7D,OAAO,EAAE,eAAe,EAAE,KAAK,gBAAgB,EAAE,MAAM,mBAAmB,CAAA;AAI1E,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,WAAW,KAAK,QAAQ,CAYvF,CAAA;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,WAAW,GAAG,QAAQ,CAM/F;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,WAAW,GAAG,WAAW,CAE9E"}

package/dist/src/hosts/index.js

@@ -6,6 +6,10 @@ import { ZStackHost } from "./zstack.js";
 import { BoxHost } from "./box.js";
 import { CanvasHost } from "./canvas.js";
 import { CodeBlockHost } from "./codeblock.js";
+import { ScrollHost } from "./scroll.js";
+import { OverlayHost } from "./overlay.js";
+import { OverlayItemHost } from "./overlay-item.js";
+export { SingleChildHost } from "./single-child.js";
 export { BaseHost } from "./base.js";
 export { TextHost, RawTextHost } from "./text.js";
 export { SpacerHost } from "./spacer.js";
@@ -15,6 +19,9 @@ export { ZStackHost } from "./zstack.js";
 export { BoxHost } from "./box.js";
 export { CanvasHost } from "./canvas.js";
 export { CodeBlockHost } from "./codeblock.js";
+export { ScrollHost } from "./scroll.js";
+export { OverlayHost } from "./overlay.js";
+export { OverlayItemHost } from "./overlay-item.js";
 // Use any to allow specialized props on each host type
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const hostRegistry = {
@@ -26,6 +33,9 @@ export const hostRegistry = {
     box: BoxHost,
     canvas: CanvasHost,
     codeblock: CodeBlockHost,
+    scroll: ScrollHost,
+    overlay: OverlayHost,
+    overlayItem: OverlayItemHost,
 };
 export function createHostInstance(type, props, ctx) {
     const Host = hostRegistry[type];

package/dist/src/hosts/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/hosts/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAE9C,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AACpC,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAkB,MAAM,WAAW,CAAA;AACjE,OAAO,EAAE,UAAU,EAAoB,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAoB,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAoB,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAoB,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,OAAO,EAAiB,MAAM,UAAU,CAAA;AACjD,OAAO,EAAE,UAAU,EAAsC,MAAM,aAAa,CAAA;AAC5E,OAAO,EAAE,aAAa,EAAuB,MAAM,gBAAgB,CAAA;AAEnE,uDAAuD;AACvD,8DAA8D;AAC9D,MAAM,CAAC,MAAM,YAAY,GAAmE;IAC1F,IAAI,EAAE,QAAQ;IACd,MAAM,EAAE,UAAU;IAClB,MAAM,EAAE,UAAU;IAClB,MAAM,EAAE,UAAU;IAClB,MAAM,EAAE,UAAU;IAClB,GAAG,EAAE,OAAO;IACZ,MAAM,EAAE,UAAU;IAClB,SAAS,EAAE,aAAa;CACzB,CAAA;AAED,MAAM,UAAU,kBAAkB,CAAC,IAAY,EAAE,KAAkB,EAAE,GAAgB;IACnF,MAAM,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC,CAAA;IAC/B,IAAI,CAAC,IAAI,EAAE,CAAC;QACV,MAAM,IAAI,KAAK,CAAC,gCAAgC,IAAI,EAAE,CAAC,CAAA;IACzD,CAAC;IACD,OAAO,IAAI,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAA;AAC7B,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,IAAY,EAAE,GAAgB;IAC/D,OAAO,IAAI,WAAW,CAAC,IAAI,EAAE,GAAG,CAAC,CAAA;AACnC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/hosts/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACjD,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAA;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAEnD,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AACpC,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAkB,MAAM,WAAW,CAAA;AACjE,OAAO,EAAE,UAAU,EAAoB,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAoB,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAoB,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,UAAU,EAAoB,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,OAAO,EAAiB,MAAM,UAAU,CAAA;AACjD,OAAO,EAAE,UAAU,EAAsC,MAAM,aAAa,CAAA;AAC5E,OAAO,EAAE,aAAa,EAAuB,MAAM,gBAAgB,CAAA;AACnE,OAAO,EAAE,UAAU,EAAoB,MAAM,aAAa,CAAA;AAC1D,OAAO,EAAE,WAAW,EAAqB,MAAM,cAAc,CAAA;AAC7D,OAAO,EAAE,eAAe,EAAyB,MAAM,mBAAmB,CAAA;AAE1E,uDAAuD;AACvD,8DAA8D;AAC9D,MAAM,CAAC,MAAM,YAAY,GAAmE;IAC3F,IAAI,EAAE,QAAQ;IACd,MAAM,EAAE,UAAU;IAClB,MAAM,EAAE,UAAU;IAClB,MAAM,EAAE,UAAU;IAClB,MAAM,EAAE,UAAU;IAClB,GAAG,EAAE,OAAO;IACZ,MAAM,EAAE,UAAU;IAClB,SAAS,EAAE,aAAa;IACxB,MAAM,EAAE,UAAU;IAClB,OAAO,EAAE,WAAW;IACpB,WAAW,EAAE,eAAe;CAC5B,CAAA;AAED,MAAM,UAAU,kBAAkB,CAAC,IAAY,EAAE,KAAkB,EAAE,GAAgB;IACpF,MAAM,IAAI,GAAG,YAAY,CAAC,IAAI,CAAC,CAAA;IAC/B,IAAI,CAAC,IAAI,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CAAC,gCAAgC,IAAI,EAAE,CAAC,CAAA;IACxD,CAAC;IACD,OAAO,IAAI,IAAI,CAAC,KAAK,EAAE,GAAG,CAAC,CAAA;AAC5B,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,IAAY,EAAE,GAAgB;IAChE,OAAO,IAAI,WAAW,CAAC,IAAI,EAAE,GAAG,CAAC,CAAA;AAClC,CAAC"}

package/dist/src/hosts/overlay-item.d.ts

@@ -0,0 +1,32 @@
+/**
+ * OverlayItem host - wrapper for overlay children with alignment
+ *
+ * This is a pass-through container that holds alignment props.
+ * Used by Overlay to position non-base children.
+ */
+import type { CellBuffer, Palette, Rect, Size } from "@effect-tui/core";
+import type { HostContext, CommonProps } from "../reconciler/types.js";
+import { BaseHost } from "./base.js";
+type HAlign = "left" | "center" | "right";
+type VAlign = "top" | "center" | "bottom";
+export interface OverlayItemProps extends CommonProps {
+    /** Alignment within the overlay container */
+    alignment?: {
+        h?: HAlign;
+        v?: VAlign;
+    };
+}
+export declare class OverlayItemHost extends BaseHost {
+    /** Stored alignment for parent Overlay to read */
+    alignment: {
+        h?: HAlign;
+        v?: VAlign;
+    };
+    constructor(props: OverlayItemProps, ctx: HostContext);
+    measure(maxW: number, maxH: number): Size;
+    layout(rect: Rect): void;
+    render(buffer: CellBuffer, palette: Palette): void;
+    updateProps(props: Record<string, unknown>): void;
+}
+export {};
+//# sourceMappingURL=overlay-item.d.ts.map

package/dist/src/hosts/overlay-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay-item.d.ts","sourceRoot":"","sources":["../../../src/hosts/overlay-item.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAA;AACvE,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AACtE,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AAEpC,KAAK,MAAM,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;AACzC,KAAK,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAA;AAEzC,MAAM,WAAW,gBAAiB,SAAQ,WAAW;IACpD,6CAA6C;IAC7C,SAAS,CAAC,EAAE;QAAE,CAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAA;CACtC;AAED,qBAAa,eAAgB,SAAQ,QAAQ;IAC5C,kDAAkD;IAClD,SAAS,EAAE;QAAE,CAAC,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,CAAC,EAAE,MAAM,CAAA;KAAE,CAAK;gBAE9B,KAAK,EAAE,gBAAgB,EAAE,GAAG,EAAE,WAAW;IAK5C,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IAazC,MAAM,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;IAUxB,MAAM,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;IAclD,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;CAM1D"}

package/dist/src/hosts/overlay-item.js

@@ -0,0 +1,54 @@
+/**
+ * OverlayItem host - wrapper for overlay children with alignment
+ *
+ * This is a pass-through container that holds alignment props.
+ * Used by Overlay to position non-base children.
+ */
+import { BaseHost } from "./base.js";
+export class OverlayItemHost extends BaseHost {
+    /** Stored alignment for parent Overlay to read */
+    alignment = {};
+    constructor(props, ctx) {
+        super("overlayItem", props, ctx);
+        this.updateProps(props);
+    }
+    measure(maxW, maxH) {
+        const constrained = this.constrainProposal(maxW, maxH);
+        // Size is determined by single child
+        const child = this.children[0];
+        if (!child) {
+            return this.constrainResult({ w: 0, h: 0 });
+        }
+        const childSize = child.measure(constrained.w, constrained.h);
+        return this.constrainResult(childSize);
+    }
+    layout(rect) {
+        this.rect = rect;
+        // Pass rect to child
+        const child = this.children[0];
+        if (child) {
+            child.layout(rect);
+        }
+    }
+    render(buffer, palette) {
+        // Render child
+        const child = this.children[0];
+        if (child) {
+            if (child.rect) {
+                buffer.withClip(child.rect.x, child.rect.y, child.rect.w, child.rect.h, () => {
+                    child.render(buffer, palette);
+                });
+            }
+            else {
+                child.render(buffer, palette);
+            }
+        }
+    }
+    updateProps(props) {
+        super.updateProps(props);
+        if (props.alignment !== undefined) {
+            this.alignment = props.alignment;
+        }
+    }
+}
+//# sourceMappingURL=overlay-item.js.map

package/dist/src/hosts/overlay-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay-item.js","sourceRoot":"","sources":["../../../src/hosts/overlay-item.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AAUpC,MAAM,OAAO,eAAgB,SAAQ,QAAQ;IAC5C,kDAAkD;IAClD,SAAS,GAA+B,EAAE,CAAA;IAE1C,YAAY,KAAuB,EAAE,GAAgB;QACpD,KAAK,CAAC,aAAa,EAAE,KAAK,EAAE,GAAG,CAAC,CAAA;QAChC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;IACxB,CAAC;IAEQ,OAAO,CAAC,IAAY,EAAE,IAAY;QAC1C,MAAM,WAAW,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,EAAE,IAAI,CAAC,CAAA;QAEtD,qCAAqC;QACrC,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;QAC9B,IAAI,CAAC,KAAK,EAAE,CAAC;YACZ,OAAO,IAAI,CAAC,eAAe,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAA;QAC5C,CAAC;QAED,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,CAAA;QAC7D,OAAO,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,CAAA;IACvC,CAAC;IAEQ,MAAM,CAAC,IAAU;QACzB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;QAEhB,qBAAqB;QACrB,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;QAC9B,IAAI,KAAK,EAAE,CAAC;YACX,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;QACnB,CAAC;IACF,CAAC;IAEQ,MAAM,CAAC,MAAkB,EAAE,OAAgB;QACnD,eAAe;QACf,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;QAC9B,IAAI,KAAK,EAAE,CAAC;YACX,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC;gBAChB,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,EAAE,GAAG,EAAE;oBAC5E,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;gBAC9B,CAAC,CAAC,CAAA;YACH,CAAC;iBAAM,CAAC;gBACP,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;YAC9B,CAAC;QACF,CAAC;IACF,CAAC;IAEQ,WAAW,CAAC,KAA8B;QAClD,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAA;QACxB,IAAI,KAAK,CAAC,SAAS,KAAK,SAAS,EAAE,CAAC;YACnC,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,SAAuC,CAAA;QAC/D,CAAC;IACF,CAAC;CACD"}

package/dist/src/hosts/overlay.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Overlay host - SwiftUI-style overlay layout
+ *
+ * Unlike zstack (which sizes to MAX of all children), overlay:
+ * 1. First child is the "base" - determines the container size
+ * 2. Subsequent children (overlayItem) are overlaid without affecting measurement
+ * 3. Each overlayItem specifies its own alignment
+ *
+ * Usage with compound component:
+ * ```tsx
+ * <Overlay>
+ *   <MainContent />
+ *   <Overlay.Item alignment={{ v: "top" }}><Toast /></Overlay.Item>
+ *   <Overlay.Item alignment={{ v: "bottom" }}><Console /></Overlay.Item>
+ * </Overlay>
+ * ```
+ */
+import type { CellBuffer, Palette, Rect, Size } from "@effect-tui/core";
+import type { HostContext, CommonProps } from "../reconciler/types.js";
+import { BaseHost } from "./base.js";
+export interface OverlayProps extends CommonProps {
+}
+export declare class OverlayHost extends BaseHost {
+    private cachedSizes;
+    constructor(props: OverlayProps, ctx: HostContext);
+    measure(maxW: number, maxH: number): Size;
+    layout(rect: Rect): void;
+    render(buffer: CellBuffer, palette: Palette): void;
+}
+//# sourceMappingURL=overlay.d.ts.map

package/dist/src/hosts/overlay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../../../src/hosts/overlay.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAA;AACvE,OAAO,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AACtE,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAA;AAGpC,MAAM,WAAW,YAAa,SAAQ,WAAW;CAAG;AAEpD,qBAAa,WAAY,SAAQ,QAAQ;IACxC,OAAO,CAAC,WAAW,CAAa;gBAEpB,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,WAAW;IAIxC,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IAwBzC,MAAM,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;IAwDxB,MAAM,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;CAY3D"}

package/dist/src/hosts/overlay.js

@@ -0,0 +1,105 @@
+/**
+ * Overlay host - SwiftUI-style overlay layout
+ *
+ * Unlike zstack (which sizes to MAX of all children), overlay:
+ * 1. First child is the "base" - determines the container size
+ * 2. Subsequent children (overlayItem) are overlaid without affecting measurement
+ * 3. Each overlayItem specifies its own alignment
+ *
+ * Usage with compound component:
+ * ```tsx
+ * <Overlay>
+ *   <MainContent />
+ *   <Overlay.Item alignment={{ v: "top" }}><Toast /></Overlay.Item>
+ *   <Overlay.Item alignment={{ v: "bottom" }}><Console /></Overlay.Item>
+ * </Overlay>
+ * ```
+ */
+import { BaseHost } from "./base.js";
+export class OverlayHost extends BaseHost {
+    cachedSizes = [];
+    constructor(props, ctx) {
+        super("overlay", props, ctx);
+    }
+    measure(maxW, maxH) {
+        // Apply frame constraints to what we propose to children
+        const constrained = this.constrainProposal(maxW, maxH);
+        // Only first child determines our size
+        const baseChild = this.children[0];
+        if (!baseChild) {
+            return this.constrainResult({ w: 0, h: 0 });
+        }
+        const baseSize = baseChild.measure(constrained.w, constrained.h);
+        this.cachedSizes = [baseSize];
+        // Measure overlay children with the base size
+        // They don't affect our size, but need to know their constraints
+        for (let i = 1; i < this.children.length; i++) {
+            const size = this.children[i].measure(baseSize.w, baseSize.h);
+            this.cachedSizes.push(size);
+        }
+        // Return base size (overlay children don't affect our size)
+        return this.constrainResult(baseSize);
+    }
+    layout(rect) {
+        this.rect = rect;
+        // Layout base child to fill our rect
+        const baseChild = this.children[0];
+        if (baseChild) {
+            baseChild.layout(rect);
+        }
+        // Layout overlay children with their alignment
+        for (let i = 1; i < this.children.length; i++) {
+            const child = this.children[i];
+            const size = this.cachedSizes[i] ?? child.measure(rect.w, rect.h);
+            // Read alignment from OverlayItemHost (use type check, not instanceof, for bundler compatibility)
+            const alignment = child.type === "overlayItem" ? child.alignment : {};
+            const hAlign = alignment.h ?? "center";
+            const vAlign = alignment.v ?? "center";
+            // Calculate position based on alignment
+            let x = rect.x;
+            let y = rect.y;
+            switch (hAlign) {
+                case "left":
+                    x = rect.x;
+                    break;
+                case "center":
+                    x = rect.x + Math.floor((rect.w - size.w) / 2);
+                    break;
+                case "right":
+                    x = rect.x + rect.w - size.w;
+                    break;
+            }
+            switch (vAlign) {
+                case "top":
+                    y = rect.y;
+                    break;
+                case "center":
+                    y = rect.y + Math.floor((rect.h - size.h) / 2);
+                    break;
+                case "bottom":
+                    y = rect.y + rect.h - size.h;
+                    break;
+            }
+            child.layout({
+                x,
+                y,
+                w: Math.min(rect.w, size.w),
+                h: Math.min(rect.h, size.h),
+            });
+        }
+    }
+    render(buffer, palette) {
+        // Render all children in order (base first, then overlays)
+        for (const child of this.children) {
+            if (child.rect) {
+                buffer.withClip(child.rect.x, child.rect.y, child.rect.w, child.rect.h, () => {
+                    child.render(buffer, palette);
+                });
+            }
+            else {
+                child.render(buffer, palette);
+            }
+        }
+    }
+}
+//# sourceMappingURL=overlay.js.map

package/dist/src/hosts/overlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay.js","sourceRoot":"","sources":["../../../src/hosts/overlay.ts"],"names":[],"mappings":"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"}

package/dist/src/hosts/scroll.d.ts

@@ -0,0 +1,56 @@
+import type { CellBuffer, Palette, Color } from "@effect-tui/core";
+import type { HostContext, Rect, Size, CommonProps } from "../reconciler/types.js";
+import { SingleChildHost } from "./single-child.js";
+export interface ScrollProps extends CommonProps {
+    /** Scroll axis: "vertical" (default), "horizontal", or "both" */
+    axis?: "vertical" | "horizontal" | "both";
+    /** Current scroll offset in pixels (0 = start) */
+    offset?: number;
+    /** Horizontal offset when axis="both" */
+    offsetX?: number;
+    /** Alignment when content is smaller than viewport */
+    align?: "start" | "end";
+    /** Background color for the scroll viewport */
+    bg?: Color;
+    /** Whether to show scrollbar indicators */
+    showScrollbar?: boolean;
+    /**
+     * Sticky scroll - automatically stay at end when content grows.
+     * This is handled in the host itself for instant updates (no React roundtrip).
+     */
+    sticky?: boolean;
+    /** Called when content size is measured (for useScroll) */
+    onContentSize?: (width: number, height: number) => void;
+    /** Called when viewport size changes (for useScroll) */
+    onViewportSize?: (width: number, height: number) => void;
+    /** Called when effective offset changes (for syncing with useScroll when sticky adjusts) */
+    onEffectiveOffset?: (offset: number) => void;
+}
+export declare class ScrollHost extends SingleChildHost {
+    axis: "vertical" | "horizontal" | "both";
+    offset: number;
+    offsetX: number;
+    align: "start" | "end";
+    bg?: Color;
+    showScrollbar: boolean;
+    sticky: boolean;
+    onContentSize?: (width: number, height: number) => void;
+    onViewportSize?: (width: number, height: number) => void;
+    onEffectiveOffset?: (offset: number) => void;
+    private contentWidth;
+    private contentHeight;
+    private lastViewportW;
+    private lastViewportH;
+    private lastReportedContentW;
+    private lastReportedContentH;
+    private wasAtEnd;
+    private effectiveOffset;
+    private effectiveOffsetX;
+    constructor(props: ScrollProps, ctx: HostContext);
+    measure(maxW: number, maxH: number): Size;
+    layout(rect: Rect): void;
+    render(buffer: CellBuffer, palette: Palette): void;
+    private renderScrollbars;
+    updateProps(props: Record<string, unknown>): void;
+}
+//# sourceMappingURL=scroll.d.ts.map

package/dist/src/hosts/scroll.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll.d.ts","sourceRoot":"","sources":["../../../src/hosts/scroll.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AAClE,OAAO,KAAK,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA;AAElF,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAGnD,MAAM,WAAW,WAAY,SAAQ,WAAW;IAC/C,iEAAiE;IACjE,IAAI,CAAC,EAAE,UAAU,GAAG,YAAY,GAAG,MAAM,CAAA;IACzC,kDAAkD;IAClD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,yCAAyC;IACzC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,sDAAsD;IACtD,KAAK,CAAC,EAAE,OAAO,GAAG,KAAK,CAAA;IACvB,+CAA+C;IAC/C,EAAE,CAAC,EAAE,KAAK,CAAA;IACV,2CAA2C;IAC3C,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,2DAA2D;IAC3D,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACvD,wDAAwD;IACxD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACxD,4FAA4F;IAC5F,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;CAC5C;AAED,qBAAa,UAAW,SAAQ,eAAe;IAC9C,IAAI,EAAE,UAAU,GAAG,YAAY,GAAG,MAAM,CAAa;IACrD,MAAM,SAAI;IACV,OAAO,SAAI;IACX,KAAK,EAAE,OAAO,GAAG,KAAK,CAAU;IAChC,EAAE,CAAC,EAAE,KAAK,CAAA;IACV,aAAa,UAAO;IACpB,MAAM,UAAQ;IACd,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACvD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACxD,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IAG5C,OAAO,CAAC,YAAY,CAAI;IACxB,OAAO,CAAC,aAAa,CAAI;IAEzB,OAAO,CAAC,aAAa,CAAI;IACzB,OAAO,CAAC,aAAa,CAAI;IACzB,OAAO,CAAC,oBAAoB,CAAI;IAChC,OAAO,CAAC,oBAAoB,CAAI;IAEhC,OAAO,CAAC,QAAQ,CAAO;IAEvB,OAAO,CAAC,eAAe,CAAI;IAC3B,OAAO,CAAC,gBAAgB,CAAI;gBAEhB,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,WAAW;IAKhD,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,IAAI;IA4BhC,MAAM,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI;IAiFjC,MAAM,CAAC,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;IAyBlD,OAAO,CAAC,gBAAgB;IA2Cf,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;CAa1D"}