@sigrun/tui 0.4.1 → 0.5.0

package/dist/blocks/form/list.d.ts

@@ -0,0 +1,37 @@
+/**
+ * The list field (UI-blocks U2 Task 5, spec §5.6): a repeatable group —
+ * `item` describes the field of ONE entry; the value is an array of
+ * entry values. Add (`a` on the field), remove (`d`), and reorder (`u`
+ * up / `j` down) honour `min`/`max`. Entries edit inline through the
+ * item field's text editor (choice/other items stay text-shaped in v1 —
+ * noted in the module header of the form).
+ */
+import type { JsonValue, ListField } from "@sigrun/shared/blocks";
+/** The entries of a list value (never undefined). */
+export declare function listEntries(value: JsonValue): readonly JsonValue[];
+/** Can the list add an entry (`max`)? */
+export declare function listCanAdd(field: ListField, value: JsonValue): boolean;
+/** Can the list remove an entry (`min`)? */
+export declare function listCanRemove(field: ListField, value: JsonValue): boolean;
+/** Add an entry (the item field's empty value). */
+export declare function listAdd(value: JsonValue): JsonValue;
+/** Remove the entry at `index`. */
+export declare function listRemove(value: JsonValue, index: number): JsonValue;
+/** Move the entry at `index` by `delta` (reorder; clamped). */
+export declare function listMove(value: JsonValue, index: number, delta: number): JsonValue;
+/** Replace the entry at `index`. */
+export declare function listSet(value: JsonValue, index: number, entry: JsonValue): JsonValue;
+/** The per-field list state: the entry cursor. */
+export declare class ListFieldState {
+    cursor: number;
+}
+/** Render the entries (one editor line each) plus the hint row. */
+export declare function listLines(opts: {
+    field: ListField;
+    width: number;
+    value: JsonValue;
+    state: ListFieldState;
+    focused: boolean;
+    /** The rendered editor line of an entry (the form seeds caret state). */
+    entryLine(index: number, entry: JsonValue, focused: boolean): string;
+}): string[];

package/dist/blocks/form/list.js

@@ -0,0 +1,70 @@
+/**
+ * The list field (UI-blocks U2 Task 5, spec §5.6): a repeatable group —
+ * `item` describes the field of ONE entry; the value is an array of
+ * entry values. Add (`a` on the field), remove (`d`), and reorder (`u`
+ * up / `j` down) honour `min`/`max`. Entries edit inline through the
+ * item field's text editor (choice/other items stay text-shaped in v1 —
+ * noted in the module header of the form).
+ */
+import { truncate } from "../width.js";
+/** The entries of a list value (never undefined). */
+export function listEntries(value) {
+    return Array.isArray(value) ? value : [];
+}
+/** Can the list add an entry (`max`)? */
+export function listCanAdd(field, value) {
+    return field.max === undefined || listEntries(value).length < field.max;
+}
+/** Can the list remove an entry (`min`)? */
+export function listCanRemove(field, value) {
+    return listEntries(value).length > (field.min ?? 0);
+}
+/** Add an entry (the item field's empty value). */
+export function listAdd(value) {
+    return [...listEntries(value), ""];
+}
+/** Remove the entry at `index`. */
+export function listRemove(value, index) {
+    return listEntries(value).filter((_, at) => at !== index);
+}
+/** Move the entry at `index` by `delta` (reorder; clamped). */
+export function listMove(value, index, delta) {
+    const entries = [...listEntries(value)];
+    const target = index + delta;
+    if (target < 0 || target >= entries.length)
+        return entries;
+    const [entry] = entries.splice(index, 1);
+    entries.splice(target, 0, entry);
+    return entries;
+}
+/** Replace the entry at `index`. */
+export function listSet(value, index, entry) {
+    return listEntries(value).map((current, at) => (at === index ? entry : current));
+}
+/** The per-field list state: the entry cursor. */
+export class ListFieldState {
+    cursor = 0;
+}
+/** Render the entries (one editor line each) plus the hint row. */
+export function listLines(opts) {
+    const { field, width, value, state, focused } = opts;
+    const entries = listEntries(value);
+    const lines = [];
+    entries.forEach((entry, index) => {
+        const cursor = focused && index === state.cursor ? "> " : "  ";
+        lines.push(truncate(`${cursor}${opts.entryLine(index, entry, focused && index === state.cursor)}`, width));
+    });
+    if (focused) {
+        const hints = [];
+        if (listCanAdd(field, value))
+            hints.push("a add");
+        if (entries.length > 0 && listCanRemove(field, value))
+            hints.push("d remove");
+        if (field.reorder === true && entries.length > 1)
+            hints.push("u/j move");
+        if (hints.length > 0) {
+            lines.push(truncate(`  ${hints.join(" · ")}`, width));
+        }
+    }
+    return lines;
+}

package/dist/blocks/form/values.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Form values plumbing (UI-blocks U2 Task 5, spec §5.6 — the port of
+ * U1's `form/values.ts`): the form reads its initial values from the
+ * bound object and tracks edits locally; these helpers flatten the
+ * field tree (sections nest fields), read a field's value out of the
+ * bound object, and validate a value against the shared field props
+ * (`required`, `min`/`max`, `minLength`/`maxLength`, `pattern`).
+ */
+import type { Field, FormBlock, JsonValue } from "@sigrun/shared/blocks";
+/** Whether a form child is a field (sections hold fields/blocks). */
+export declare function isFieldNode(node: unknown): node is Field;
+/** All fields of the form, depth-first through sections. */
+export declare function collectFields(block: FormBlock): readonly Field[];
+/** The initial value of a field from the bound object (missing →
+ *  a type-appropriate empty; a secret is write-only — the bound slot
+ *  carries the STATUS, never a value to echo back, §5.6/§15). */
+export declare function initialValue(field: Field, bound: Record<string, JsonValue>): JsonValue;
+/** Client validation (spec §5.6): the error message or null.
+ *  `label` names the field in the message. */
+export declare function validateField(field: Field, value: JsonValue, label: string): string | null;

package/dist/blocks/form/values.js

@@ -0,0 +1,106 @@
+/**
+ * Form values plumbing (UI-blocks U2 Task 5, spec §5.6 — the port of
+ * U1's `form/values.ts`): the form reads its initial values from the
+ * bound object and tracks edits locally; these helpers flatten the
+ * field tree (sections nest fields), read a field's value out of the
+ * bound object, and validate a value against the shared field props
+ * (`required`, `min`/`max`, `minLength`/`maxLength`, `pattern`).
+ */
+/** Whether a form child is a field (sections hold fields/blocks). */
+export function isFieldNode(node) {
+    return (typeof node === "object" &&
+        node !== null &&
+        typeof node.type === "string" &&
+        typeof node.name === "string");
+}
+/** All fields of the form, depth-first through sections. */
+export function collectFields(block) {
+    const out = [];
+    const walk = (children) => {
+        for (const child of children) {
+            if (isFieldNode(child))
+                out.push(child);
+            else if (typeof child === "object" &&
+                child !== null &&
+                child.type === "section") {
+                walk(child.children);
+            }
+        }
+    };
+    walk(block.children);
+    return out;
+}
+/** The initial value of a field from the bound object (missing →
+ *  a type-appropriate empty; a secret is write-only — the bound slot
+ *  carries the STATUS, never a value to echo back, §5.6/§15). */
+export function initialValue(field, bound) {
+    if (field.type === "secret")
+        return "";
+    const value = bound[field.name];
+    if (value !== undefined)
+        return value;
+    switch (field.type) {
+        case "toggle":
+            // §13.4 fix: a default-ON toggle initializes ON when the bound
+            // value is absent (absent = the default).
+            return field.default === true;
+        case "choice":
+            return field.multi === true ? [] : "";
+        case "list":
+            return [];
+        case "daterange":
+            return {};
+        default:
+            return "";
+    }
+}
+/** Client validation (spec §5.6): the error message or null.
+ *  `label` names the field in the message. */
+export function validateField(field, value, label) {
+    const empty = value === undefined ||
+        value === null ||
+        value === "" ||
+        (Array.isArray(value) && value.length === 0) ||
+        (typeof value === "object" && !Array.isArray(value) && Object.keys(value).length === 0);
+    if (field.required === true && empty)
+        return `${label} is required`;
+    if (empty)
+        return null;
+    if (typeof value === "number") {
+        if (field.min !== undefined && value < field.min) {
+            return `${label} must be at least ${field.min}`;
+        }
+        if (field.max !== undefined && value > field.max) {
+            return `${label} must be at most ${field.max}`;
+        }
+    }
+    if (typeof value === "string") {
+        if (field.minLength !== undefined && value.length < field.minLength) {
+            return `${label} must be at least ${field.minLength} characters`;
+        }
+        if (field.maxLength !== undefined && value.length > field.maxLength) {
+            return `${label} must be at most ${field.maxLength} characters`;
+        }
+        if (field.pattern !== undefined && value !== "") {
+            let regex = null;
+            try {
+                regex = new RegExp(`^(?:${field.pattern})$`);
+            }
+            catch {
+                regex = null;
+            }
+            if (regex !== null && !regex.test(value)) {
+                return `${label} does not match ${field.pattern}`;
+            }
+        }
+    }
+    if (Array.isArray(value)) {
+        if (field.min !== undefined && value.length < field.min) {
+            return `${label} needs at least ${field.min} entries`;
+        }
+        if (field.max !== undefined && value.length > field.max) {
+            return `${label} allows at most ${field.max} entries`;
+        }
+    }
+    return null;
+}

package/dist/blocks/icons.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Named icons in the terminal (UI-blocks spec §10.2): each of the 49
+ * closed-set names maps to a Unicode glyph with an ASCII fallback. The
+ * ASCII form is used when the terminal can't be assumed to render the
+ * glyph (the plain/no-Unicode path, and tests that assert structure).
+ *
+ * Glyphs are chosen for terminal legibility over pictorial fidelity
+ * (a 1-cell glyph beats a 2-cell emoji that shifts the grid): mostly
+ * Miscellaneous Symbols and Dingbats, all narrow in standard terminals.
+ */
+import type { IconName } from "@sigrun/shared/blocks";
+/** The icon glyph for `name` (the ASCII fallback when the terminal
+ * lacks Unicode support — callers pass `!ctx.unicode`). */
+export declare function iconGlyph(name: IconName, ascii: boolean): string;

package/dist/blocks/icons.js

@@ -0,0 +1,74 @@
+/**
+ * Named icons in the terminal (UI-blocks spec §10.2): each of the 49
+ * closed-set names maps to a Unicode glyph with an ASCII fallback. The
+ * ASCII form is used when the terminal can't be assumed to render the
+ * glyph (the plain/no-Unicode path, and tests that assert structure).
+ *
+ * Glyphs are chosen for terminal legibility over pictorial fidelity
+ * (a 1-cell glyph beats a 2-cell emoji that shifts the grid): mostly
+ * Miscellaneous Symbols and Dingbats, all narrow in standard terminals.
+ */
+/** The Unicode glyph and its ASCII fallback, per icon name. */
+const GLYPHS = {
+    // navigation and actions
+    add: ["+", "+"],
+    edit: ["✎", "e"],
+    delete: ["✖", "x"],
+    refresh: ["↻", "r"],
+    search: ["⌕", "/"],
+    filter: ["▽", "f"],
+    share: ["⇱", "s"],
+    copy: ["⧉", "c"],
+    link: ["⚓", "l"],
+    external: ["↗", "^"],
+    more: ["⋯", "."],
+    check: ["✓", "v"],
+    close: ["✕", "x"],
+    drag: ["⠿", "#"],
+    // objects
+    file: ["▤", "f"],
+    folder: ["▸", ">"],
+    calendar: ["▦", "#"],
+    clock: ["◷", "o"],
+    user: ["◔", "u"],
+    users: ["◍", "U"],
+    tag: ["◇", "t"],
+    list: ["☰", "="],
+    board: ["▥", "|"],
+    chart: ["▄", "c"],
+    image: ["▣", "i"],
+    book: ["❑", "b"],
+    cart: ["▤", "C"],
+    home: ["⌂", "h"],
+    bell: ["⚑", "B"],
+    lock: ["▪", "L"],
+    key: ["◂", "K"],
+    // status
+    info: ["ℹ", "i"],
+    warn: ["▲", "!"],
+    error: ["✖", "!!"],
+    success: ["✓", "v"],
+    pending: ["◌", "-"],
+    running: ["▶", "R"],
+    // weather
+    sun: ["☀", "*"],
+    moon: ["☾", ")"],
+    cloud: ["☁", "o"],
+    "cloud-sun": ["⛅", "o*"],
+    "cloud-rain": ["☔", "or"],
+    "cloud-snow": ["❄", "os"],
+    "cloud-lightning": ["⚡", "ol"],
+    fog: ["≋", "~"],
+    wind: ["≈", "w"],
+    droplets: ["❍", "d"],
+    thermometer: ["▴", "T"],
+    umbrella: ["☂", "u"],
+};
+/** The icon glyph for `name` (the ASCII fallback when the terminal
+ * lacks Unicode support — callers pass `!ctx.unicode`). */
+export function iconGlyph(name, ascii) {
+    const pair = GLYPHS[name];
+    if (pair === undefined)
+        return ascii ? "?" : name;
+    return ascii ? pair[1] : pair[0];
+}

package/dist/blocks/image.d.ts

@@ -0,0 +1,39 @@
+/**
+ * The `image` block (UI-blocks spec §11.3): pi-tui's `Image` when
+ * `getCapabilities().images` is kitty/iterm2 and the bytes arrived;
+ * `[image: <alt>]` otherwise (no protocol, a failed or refused fetch,
+ * a missing alt). Every non-PNG source is requested with `as=png`
+ * (the server-side conversion, ruling 17); TMUX handling is pi-tui's
+ * own (`terminal-image.js` turns images off under TMUX unless
+ * `PI_IMAGE_PROTOCOL` overrides) — this block adds no detection.
+ *
+ * The byte-fetch is an injectable seam ({@link FetchImageBytes}): the
+ * surface transport that resolves `asset:`/URL sources lands in
+ * Task 4; tests fake it. Images size to the block's width in cells,
+ * capped at 20 rows.
+ */
+import type { Component } from "@earendil-works/pi-tui";
+import type { ImageBlock } from "@sigrun/shared/blocks";
+import { type BlockCtx } from "./context.js";
+/**
+ * Fetch the bytes for one image source. `asPng` asks the transport
+ * for the server-side PNG conversion (ruling 17); rejection or a
+ * throw renders the alt fallback.
+ */
+export type FetchImageBytes = (src: string, opts: {
+    asPng: boolean;
+}) => Promise<Uint8Array>;
+/** The extra options {@link renderImageBlock} takes (the seams). */
+export interface ImageOptions {
+    /** The byte transport; absent renders the alt (nothing to fetch with). */
+    fetchImage?: FetchImageBytes;
+}
+/** The fallback line for `alt` (`[image]` when the alt is missing). */
+export declare function imageFallbackLine(alt: string): string;
+/** `image`: fetch-then-render, with the alt as the standing fallback. */
+export declare class ImageComponent implements Component {
+    #private;
+    constructor(block: ImageBlock, ctx: BlockCtx, options?: ImageOptions);
+    render(width: number): string[];
+    invalidate(): void;
+}

package/dist/blocks/image.js

@@ -0,0 +1,82 @@
+/**
+ * The `image` block (UI-blocks spec §11.3): pi-tui's `Image` when
+ * `getCapabilities().images` is kitty/iterm2 and the bytes arrived;
+ * `[image: <alt>]` otherwise (no protocol, a failed or refused fetch,
+ * a missing alt). Every non-PNG source is requested with `as=png`
+ * (the server-side conversion, ruling 17); TMUX handling is pi-tui's
+ * own (`terminal-image.js` turns images off under TMUX unless
+ * `PI_IMAGE_PROTOCOL` overrides) — this block adds no detection.
+ *
+ * The byte-fetch is an injectable seam ({@link FetchImageBytes}): the
+ * surface transport that resolves `asset:`/URL sources lands in
+ * Task 4; tests fake it. Images size to the block's width in cells,
+ * capped at 20 rows.
+ */
+import { getCapabilities, Image } from "@earendil-works/pi-tui";
+import { bindText } from "./context.js";
+import { truncate } from "./width.js";
+/** The row cap (spec §11.3). */
+const MAX_IMAGE_ROWS = 20;
+/** Does the source name a PNG already (extension or data URL)? */
+function isPng(src) {
+    if (src.startsWith("data:"))
+        return src.startsWith("data:image/png");
+    return /\.png($|[?#])/i.test(src);
+}
+/** The fallback line for `alt` (`[image]` when the alt is missing). */
+export function imageFallbackLine(alt) {
+    return alt === "" ? "[image]" : `[image: ${alt}]`;
+}
+/** `image`: fetch-then-render, with the alt as the standing fallback. */
+export class ImageComponent {
+    #block;
+    #ctx;
+    #options;
+    /** The fetched component once the bytes are in (one fetch ever). */
+    #image;
+    /** "idle" not started; "pending" renders [] while the fetch runs. */
+    #state = "idle";
+    constructor(block, ctx, options = {}) {
+        this.#block = block;
+        this.#ctx = ctx;
+        this.#options = options;
+    }
+    render(width) {
+        const alt = bindText(this.#block.alt, this.#ctx);
+        const protocol = getCapabilities().images;
+        const src = bindText(this.#block.src, this.#ctx);
+        const fetch = this.#options.fetchImage;
+        if (protocol !== "kitty" && protocol !== "iterm2") {
+            return [truncate(imageFallbackLine(alt), width)];
+        }
+        if (fetch === undefined || src === "") {
+            return [truncate(imageFallbackLine(alt), width)];
+        }
+        if (this.#state === "idle") {
+            this.#state = "pending";
+            void fetch(src, { asPng: !isPng(src) })
+                .then((bytes) => {
+                let binary = "";
+                for (const byte of bytes)
+                    binary += String.fromCharCode(byte);
+                this.#image = new Image(btoa(binary), "image/png", { fallbackColor: this.#ctx.theme.dim }, { maxWidthCells: width, maxHeightCells: MAX_IMAGE_ROWS });
+            })
+                .catch(() => {
+                this.#state = "failed";
+            });
+        }
+        if (this.#state === "failed") {
+            return [truncate(imageFallbackLine(alt), width)];
+        }
+        if (this.#image === undefined) {
+            // Bytes pending: render nothing until the fetch resolves
+            // (the host re-renders; a transient empty beats a flash of
+            // the fallback line).
+            return [];
+        }
+        return this.#image.render(width);
+    }
+    invalidate() {
+        this.#image?.invalidate();
+    }
+}

package/dist/blocks/interaction-transport.d.ts

@@ -0,0 +1,42 @@
+/**
+ * The TUI's interaction SurfaceTransport (UI-blocks U6 Task 3), the port
+ * of the webui's `interactionTransport.ts`: an interaction record IS the
+ * surface — `load` returns the record's block tree (placement
+ * `interaction`: a root `form` whose submit is the answer) with the
+ * form's bind-path document as the initial data, and `act` on the submit
+ * POSTs the payload as the answer `{values}` to the ONE generic answer
+ * route (ruling 20).
+ *
+ * No polling: the record never changes while rendered here (a settle
+ * lands via the prompter's list refetch, which drops the record from the
+ * pending set), so `onChanged` is inert and `fetchData` echoes the load
+ * data. `upload`/`image` reject: the interaction block set carries no
+ * data-backed or upload blocks (§5.7's field set).
+ */
+import type { JsonObject, SurfaceTransport, Tree } from "@sigrun/shared/blocks";
+import type { SigrunClient } from "../api.js";
+export interface InteractionTransportOptions {
+    readonly client: SigrunClient;
+    readonly conversationId: number;
+    readonly callId: string;
+    /** The record's block-tree body (placement `interaction`). */
+    readonly tree: Tree;
+    /** The form's bind document (`/values` → `{values}`); a settled
+     *  record passes its stored answer so the read-only form renders the
+     *  values it was answered with. */
+    readonly data: JsonObject;
+    /** Settled records render read-only (spec §6.5). */
+    readonly access: "read" | "write";
+    /** The root form's submit action name (`onSubmit ?? "submit"`) — the
+     *  ONLY action that answers the record; every other action (a
+     *  callout button, a live-mode edit dispatch) is ignored. */
+    readonly submitAction: string;
+    /** An accepted answer's follow-through (the prompter's refetch). */
+    readonly onAnswered?: () => void;
+    /** A 404 (not_pending — the record settled under the user's fingers)
+     *  or a transport failure's follow-through; the original error rides
+     *  along so the host's error describer keeps its status formatting. */
+    readonly onSettledElsewhere?: (message: string, cause: unknown) => void;
+}
+/** The record-as-surface transport. */
+export declare function createInteractionTransport(options: InteractionTransportOptions): SurfaceTransport;

package/dist/blocks/interaction-transport.js

@@ -0,0 +1,79 @@
+/**
+ * The TUI's interaction SurfaceTransport (UI-blocks U6 Task 3), the port
+ * of the webui's `interactionTransport.ts`: an interaction record IS the
+ * surface — `load` returns the record's block tree (placement
+ * `interaction`: a root `form` whose submit is the answer) with the
+ * form's bind-path document as the initial data, and `act` on the submit
+ * POSTs the payload as the answer `{values}` to the ONE generic answer
+ * route (ruling 20).
+ *
+ * No polling: the record never changes while rendered here (a settle
+ * lands via the prompter's list refetch, which drops the record from the
+ * pending set), so `onChanged` is inert and `fetchData` echoes the load
+ * data. `upload`/`image` reject: the interaction block set carries no
+ * data-backed or upload blocks (§5.7's field set).
+ */
+/** The record-as-surface transport. */
+export function createInteractionTransport(options) {
+    let answered = false;
+    return {
+        load() {
+            return Promise.resolve({
+                tree: options.tree,
+                data: options.data,
+                rev: 0,
+                treeRev: 0,
+                access: options.access,
+            });
+        },
+        fetchData() {
+            return Promise.resolve({ rev: 0, treeRev: 0, data: options.data });
+        },
+        async act(body) {
+            // Only the root form's submit is the answer (Review fix): a
+            // callout button or a live-mode edit dispatch must never POST
+            // `{values}` — ignore it (an ok result keeps the form happy).
+            // The gate checks the action KIND too (fix round 2): a callout
+            // itemAction or a live-mode edit NAMED "submit" still isn't
+            // one.
+            if (body.type !== "submit" || body.action !== options.submitAction) {
+                return { ok: true, rev: 0 };
+            }
+            // The form's submit payload is `{values}` (spec §5.6) — the
+            // answer shape verbatim. A double-submit is a channel bug; the
+            // route would 404 — guard anyway.
+            if (answered) {
+                return { ok: false, error: { message: "already answered" } };
+            }
+            const payload = body.payload;
+            const values = typeof payload === "object" &&
+                payload !== null &&
+                !Array.isArray(payload) &&
+                typeof payload.values === "object" &&
+                payload.values !== null &&
+                !Array.isArray(payload.values)
+                ? payload.values
+                : {};
+            try {
+                await options.client.answerInteraction(options.conversationId, options.callId, { values });
+            }
+            catch (cause) {
+                const message = cause instanceof Error ? cause.message : String(cause);
+                options.onSettledElsewhere?.(message, cause);
+                return { ok: false, error: { message } };
+            }
+            answered = true;
+            options.onAnswered?.();
+            return { ok: true, rev: 1 };
+        },
+        upload(_body) {
+            return Promise.reject(new Error("interaction surfaces do not accept uploads"));
+        },
+        image() {
+            return Promise.reject(new Error("interaction surfaces have no image route"));
+        },
+        onChanged(_listener) {
+            return () => { };
+        },
+    };
+}

package/dist/blocks/layout.d.ts

@@ -0,0 +1,31 @@
+/**
+ * The layout blocks (UI-blocks spec §5.2): `stack`, `columns`, `grid`,
+ * `section` as pi-tui components.
+ *
+ * Columns/grid honour the compact fallbacks (spec §12.3): `columns`
+ * stack when the minimums don't fit; `grid` runs
+ * `max(1, floor(width / minItemWidth))` columns so a compact pane gets
+ * one. Every line every block emits is clamped to the pane
+ * ({@link truncate} — Review Focus 2).
+ */
+import type { Component } from "@earendil-works/pi-tui";
+import type { ColumnsBlock, GridBlock, SectionBlock, StackBlock } from "@sigrun/shared/blocks";
+import { type BlockCtx } from "./context.js";
+/**
+ * A component from a width-aware line builder. Each produced line is
+ * clamped to the render width (the invariant every block must keep).
+ */
+export declare class Lines implements Component {
+    #private;
+    constructor(build: (width: number) => string[]);
+    render(width: number): string[];
+    invalidate(): void;
+}
+/** Render `children` vertically with `gap` blank lines between. */
+export declare function renderStack(block: StackBlock, ctx: BlockCtx): Component;
+/** Render children side by side, stacking when the minimums don't fit. */
+export declare function renderColumns(block: ColumnsBlock, ctx: BlockCtx): Component;
+/** Render children in as many columns as `minItemWidth` allows. */
+export declare function renderGrid(block: GridBlock, ctx: BlockCtx): Component;
+/** Render a titled, optionally toned group of children. */
+export declare function renderSection(block: SectionBlock, ctx: BlockCtx): Component;