@promptctl/rich-js 0.20.0 → 0.22.0

package/dist/core/anchor.d.ts

@@ -43,3 +43,8 @@ export interface Anchor {
  * every level of the nesting — each level names the same cell.
  */
 export declare function shiftAnchor(anchor: Anchor, cells: number): Anchor;
+/**
+ * Whether `owner` drew the cell `anchor` names, itself or through an owner
+ * nested in its output.
+ */
+export declare function drawnBy(anchor: Anchor | undefined, owner: object): boolean;

package/dist/core/anchor.js

@@ -37,3 +37,13 @@ export function shiftAnchor(anchor, cells) {
         inner: anchor.inner && shiftAnchor(anchor.inner, cells),
     };
 }
+/**
+ * Whether `owner` drew the cell `anchor` names, itself or through an owner
+ * nested in its output.
+ */
+export function drawnBy(anchor, owner) {
+    for (let level = anchor; level; level = level.inner)
+        if (level.owner === owner)
+            return true;
+    return false;
+}

package/dist/core/color.d.ts

@@ -259,6 +259,15 @@ export declare class ColorSpec {
      * on a ground (`flattenAlpha`).
      */
     static matchOn(value: ColorRgba, depth: ColorDepth, theme: TerminalTheme, foreground: boolean): ColorSpec;
+    /**
+     * The spec a slot is written in once its colour moves from `was`, what its
+     * written spec draws on `theme`, to the opaque `now`: `matchOn`'s — or
+     * none, where the written spec is as near `now` as that match. A move the
+     * depth cannot show is no move, so below truecolor a colour moved a little
+     * off any colour the depth can write — a theme slot, the default colour,
+     * the cube — keeps the spec it was written in.
+     */
+    static matchMove(was: ColorRgba, now: ColorRgba, depth: ColorDepth, theme: TerminalTheme, foreground: boolean): ColorSpec | undefined;
     /**
      * Parse a color string. Memoized (`Memo`): a string parsed again while
      * remembered returns the same instance.

package/dist/core/color.js

@@ -581,7 +581,17 @@ export class ColorSpec {
             throw new ColorParseError(`A blend's fraction is in [0, 1]; got ${t}`);
         const a = from.fixedValue;
         const b = to.fixedValue;
-        return a !== undefined && b !== undefined ? ColorSpec.fromRgba(blendRgb(a, b, t)) : new ColorBlend(from, to, t);
+        if (a !== undefined && b !== undefined)
+            return ColorSpec.fromRgba(blendRgb(a, b, t));
+        // A blend that draws as one of its ends is that end — not a blend whose
+        // name no comparison will ever match back to it: at t 0 or 1, or between
+        // one slot of one palette spelled twice.
+        if (t === 0)
+            return from;
+        if (t === 1)
+            return to;
+        const oneSlot = from.type === to.type && (from.number !== undefined ? from.number === to.number : from.name === to.name);
+        return oneSlot ? from : new ColorBlend(from, to, t);
     }
     /**
      * The spec that draws `value` nearest to it at `depth` on a terminal known
@@ -614,6 +624,18 @@ export class ColorSpec {
         ];
         return candidates.reduce((best, next) => (rgbDistance(next[1], value) < rgbDistance(best[1], value) ? next : best))[0];
     }
+    /**
+     * The spec a slot is written in once its colour moves from `was`, what its
+     * written spec draws on `theme`, to the opaque `now`: `matchOn`'s — or
+     * none, where the written spec is as near `now` as that match. A move the
+     * depth cannot show is no move, so below truecolor a colour moved a little
+     * off any colour the depth can write — a theme slot, the default colour,
+     * the cube — keeps the spec it was written in.
+     */
+    static matchMove(was, now, depth, theme, foreground) {
+        const match = ColorSpec.matchOn(now, depth, theme, foreground);
+        return rgbDistance(was, now) <= rgbDistance(match.getTruecolor(theme, foreground), now) ? undefined : match;
+    }
     /**
      * Parse a color string. Memoized (`Memo`): a string parsed again while
      * remembered returns the same instance.

package/dist/core/strip.d.ts

@@ -25,6 +25,7 @@
  * single-style invariant on the cell type — the terminal supports per-column
  * styling, so the cell type does too.
  */
+import type { Anchor } from "./anchor.js";
 import { Segment } from "./segment.js";
 import { Style } from "./style.js";
 import { type Measurable, type Renderable, type RenderOptions } from "./protocol.js";
@@ -44,14 +45,58 @@ import { type Measurable, type Renderable, type RenderOptions } from "./protocol
 export interface StyledRenderable extends Renderable {
     edgeStyle(side: "left" | "right", options: RenderOptions): Style;
 }
+/**
+ * Where a join sits in its strip. `index` counts joins from the strip's start:
+ * the join before item `i` is `i`, and the end after the last of `n` items is
+ * `n`. It names the seam, not the line it lands on, so where a `FlexStrip`
+ * wraps, the end cap and the next line's lead both carry the index of the seam
+ * the wrap replaced — and every seam that survives a wrap keeps its own.
+ */
+export interface JoinContext {
+    readonly index: number;
+}
 export interface Joiner<T extends StyledRenderable = StyledRenderable> {
     /**
      * `left === null` marks the start endpoint; `right === null` marks the end
      * endpoint. The joiner decides what an endpoint looks like — typically
      * fg-only with no bg so the strip blends into the terminal background.
      */
-    join(left: T | null, right: T | null): Renderable;
+    join(left: T | null, right: T | null, context: JoinContext): Renderable;
 }
+/**
+ * The owner every cell a strip's joiner draws is stamped with
+ * (`Segment.anchorLines`), whatever the joiner: a seam is told by what drew
+ * it, never by its glyph, which an ASCII joiner draws otherwise and a lead may
+ * not draw at all. An effect reads it to leave a seam out of the words it
+ * keeps legible (`drawnOf`, `../renderables/effect.ts`).
+ *
+ * Inside it, every cell a `CellJoiner` draws names whose colour each of its
+ * two sides shows (`colorsOwnedBy`). One seam cell can show two neighbours —
+ * a powerline arrow is inked in the fill it points out of, over the fill it
+ * points into — so a cell has no single owner; each side has one.
+ */
+export declare const JOIN: object;
+/**
+ * Which of a cell's two colours on screen are `owner`'s: both, for a cell
+ * `owner` drew, itself or through an owner nested in its output; for a cell a
+ * `CellJoiner` drew, the sides shown in `owner`'s colour.
+ */
+export declare function colorsOwnedBy(anchor: Anchor | undefined, owner: object): {
+    readonly fg: boolean;
+    readonly bg: boolean;
+};
+/**
+ * [LAW:single-enforcer] What `joiner` draws at one join, every cell stamped
+ * as `JOIN`'s: the one way `Strip` and `FlexStrip` draw a join.
+ */
+export declare function drawJoin<T extends StyledRenderable>(joiner: Joiner<T>, left: T | null, right: T | null, context: JoinContext): Renderable;
+/**
+ * [LAW:single-enforcer] What `item` draws, every cell stamped as the item's,
+ * so whoever holds the composed row reads which item drew a cell however the
+ * row was laid out or wrapped: the one way `Strip` and `FlexStrip` draw an
+ * item.
+ */
+export declare function drawItem(item: StyledRenderable): Renderable;
 export declare class Strip<T extends StyledRenderable = StyledRenderable> implements Renderable, Measurable {
     readonly items: readonly T[];
     readonly joiner: Joiner<T>;
@@ -98,7 +143,10 @@ export type CellColor = Paint | "ground";
 /**
  * One styled run of a join. A `oneOf` glyph is a set any member of which may
  * stand in the cell; every member has the same width, because consumers
- * measure a join by rendering it.
+ * measure a join by rendering it. Which member stands is hashed from the
+ * join's part, its `index` and the cell's place in it, so it holds still from
+ * frame to frame while the items before it do, and differs from seam to seam
+ * even between the same two colours.
  */
 export interface JoinCell {
     readonly glyph: string | {
@@ -110,8 +158,9 @@ export interface JoinCell {
 /**
  * The cells a joiner draws at each kind of join:
  *   • `seam` — between two neighbours;
- *   • `divider` — in the seam's place where the two grounds are drawn as one
- *     colour (see `SEAM_MIN_DELTA_E`), so the seam would vanish into them;
+ *   • `divider` — in the seam's place where every seam cell's ink is drawn
+ *     indistinct from its own ground (see `SEAM_MIN_DELTA_E`), so the seam
+ *     would vanish;
  *     the same width as `seam`;
  *   • `lead` — where a run is entered from nothing: the strip's start, or a
  *     neighbour with no ground for the seam to paint. It cannot name `left`;
@@ -124,10 +173,9 @@ export interface JoinShape {
     readonly tail: readonly JoinCell[];
 }
 /**
- * The least ΔE_OK two neighbouring backgrounds must differ by for a seam drawn
- * between them to be seen. Below it the seam is drawn in a colour the eye
- * cannot tell from its own background, so the joiner draws the divider
- * instead. Twice the ~.02 threshold of a visible difference, because a seam is
+ * The least ΔE_OK a seam cell's ink must differ from its own ground by for the
+ * seam to be seen. Below it the eye cannot tell the ink from the ground,
+ * so the joiner draws the divider instead. Twice the ~.02 threshold of a visible difference, because a seam is
  * one cell wide.
  */
 export declare const SEAM_MIN_DELTA_E = 0.04;
@@ -138,8 +186,8 @@ export declare const SEAM_MIN_DELTA_E = 0.04;
  * Which part a join draws is read off its two neighbours. A neighbour is
  * missing at the strip's ends, and counts as missing — an endpoint — when the
  * shape paints with its ground anywhere and it has none to paint. With both present the
- * join is the seam, or the divider where the two grounds are drawn as one
- * colour at `options.colorSystem`; with only the right, the lead; with only
+ * join is the seam, or the divider where every seam cell's ink is drawn
+ * indistinct from its ground at `options.colorSystem`; with only the right, the lead; with only
  * the left, the tail; with neither, nothing.
  *
  * `ascii` is the shape an ASCII-only output draws instead, whole.
@@ -149,30 +197,34 @@ export declare class CellJoiner<T extends StyledRenderable = StyledRenderable> i
     readonly ascii: JoinShape;
     private readonly _forms;
     constructor(shape: JoinShape, ascii: JoinShape);
-    join(left: T | null, right: T | null): Renderable;
+    join(left: T | null, right: T | null, { index }: JoinContext): Renderable;
 }
 /**
- * The powerline joiner: U+E0B0 (right-arrow) in the left ground over the
- * right, divided by U+E0B1 (thin right-arrow) in the left item's text. The
- * lead is the arrow with the left ground replaced by the terminal's — drawn
- * in reverse video it leaves a notch whose base is the cell's left edge, inked
- * in the terminal's background colour. That ink is opaque, so under a
- * translucent terminal the notch does not let what is behind it through. The
- * tail is the arrow over the terminal's ground.
- * ASCII draws `>` everywhere and begins each run flat.
- */
-export declare const POWERLINE_JOINER: CellJoiner<StyledRenderable>;
-/**
- * Rounded pills: each run opened by U+E0B6 and closed by U+E0B4, both in its
- * ground over the terminal's, a space between pills. ASCII draws `(` and `)`.
+ * The bundled joiners, by name. What each draws is `docs/strip.md`'s
+ * "Built-in joiners"; a name from config is read with `joinerNamed`.
  */
-export declare const CAPSULE_JOINER: CellJoiner<StyledRenderable>;
+export declare const JOINERS: Readonly<{
+    powerline: CellJoiner<StyledRenderable>;
+    prism: CellJoiner<StyledRenderable>;
+    slant: CellJoiner<StyledRenderable>;
+    backslant: CellJoiner<StyledRenderable>;
+    flame: CellJoiner<StyledRenderable>;
+    pixel: CellJoiner<StyledRenderable>;
+    ice: CellJoiner<StyledRenderable>;
+    bubble: CellJoiner<StyledRenderable>;
+    capsule: CellJoiner<StyledRenderable>;
+    wrapper: CellJoiner<StyledRenderable>;
+    metro: CellJoiner<StyledRenderable>;
+    stitch: CellJoiner<StyledRenderable>;
+    torn: CellJoiner<StyledRenderable>;
+    plain: CellJoiner<StyledRenderable>;
+}>;
 /**
- * ` | ` between every pair of items, in the theme's `strip.separator` colour;
- * nothing at the ends. Its shape names no neighbour, so it joins items with no
- * ground too.
+ * The bundled joiner `name` names — a name read from config, parsed. Throws on
+ * any other string, naming the ones there are; an own-key test, so `toString`
+ * and the rest of `Object.prototype` are not joiners.
  */
-export declare const PLAIN_JOINER: CellJoiner<StyledRenderable>;
+export declare function joinerNamed(name: string): CellJoiner;
 /**
  * A ramp of `steps` cells from the left ground to the right. Each cell is the
  * half block U+258C, ink on its left half and ground on its right, so it

package/dist/core/strip.js

@@ -30,7 +30,65 @@ import { Style } from "./style.js";
 import { ColorDepth, ColorSpec, SURFACE_BLACK } from "./color.js";
 import { Oklch } from "./oklch.js";
 import { cellLen } from "./cells.js";
+import { fnv1a } from "./fnv1a.js";
 import { drawable, getStyle, isAscii } from "./protocol.js";
+/**
+ * The owner every cell a strip's joiner draws is stamped with
+ * (`Segment.anchorLines`), whatever the joiner: a seam is told by what drew
+ * it, never by its glyph, which an ASCII joiner draws otherwise and a lead may
+ * not draw at all. An effect reads it to leave a seam out of the words it
+ * keeps legible (`drawnOf`, `../renderables/effect.ts`).
+ *
+ * Inside it, every cell a `CellJoiner` draws names whose colour each of its
+ * two sides shows (`colorsOwnedBy`). One seam cell can show two neighbours —
+ * a powerline arrow is inked in the fill it points out of, over the fill it
+ * points into — so a cell has no single owner; each side has one.
+ */
+export const JOIN = Object.freeze({ name: "join" });
+/**
+ * Whose colour each side of a join cell shows on screen, its ink and its
+ * ground: the neighbour whose edge a `Paint` names, or `null` for a role, a
+ * mix or the terminal's ground, which are no neighbour's.
+ */
+class ColorOwners {
+    fg;
+    bg;
+    constructor(fg, bg) {
+        this.fg = fg;
+        this.bg = bg;
+    }
+}
+/**
+ * Which of a cell's two colours on screen are `owner`'s: both, for a cell
+ * `owner` drew, itself or through an owner nested in its output; for a cell a
+ * `CellJoiner` drew, the sides shown in `owner`'s colour.
+ */
+export function colorsOwnedBy(anchor, owner) {
+    for (let level = anchor; level; level = level.inner) {
+        if (level.owner === owner)
+            return { fg: true, bg: true };
+        if (level.owner instanceof ColorOwners)
+            return { fg: level.owner.fg === owner, bg: level.owner.bg === owner };
+    }
+    return { fg: false, bg: false };
+}
+/**
+ * [LAW:single-enforcer] What `joiner` draws at one join, every cell stamped
+ * as `JOIN`'s: the one way `Strip` and `FlexStrip` draw a join.
+ */
+export function drawJoin(joiner, left, right, context) {
+    const join = joiner.join(left, right, context);
+    return { render: (options) => Segment.anchorLines([[...join.render(options)]], JOIN)[0] };
+}
+/**
+ * [LAW:single-enforcer] What `item` draws, every cell stamped as the item's,
+ * so whoever holds the composed row reads which item drew a cell however the
+ * row was laid out or wrapped: the one way `Strip` and `FlexStrip` draw an
+ * item.
+ */
+export function drawItem(item) {
+    return { render: (options) => Segment.anchorLines([[...item.render(options)]], item)[0] };
+}
 // --- Strip ---
 export class Strip {
     items;
@@ -52,12 +110,12 @@ export class Strip {
         // `left` fills the canvas, and the first item would pad over the rest of
         // the row. Where the row sits in the width is its container's to say.
         const row = { ...options, justify: undefined };
-        yield* this.joiner.join(null, items[0]).render(row);
+        yield* drawJoin(this.joiner, null, items[0], { index: 0 }).render(row);
         for (let i = 0; i < items.length; i++) {
             const item = items[i];
-            yield* item.render(row);
+            yield* drawItem(item).render(row);
             const next = i + 1 < items.length ? items[i + 1] : null;
-            yield* this.joiner.join(item, next).render(row);
+            yield* drawJoin(this.joiner, item, next, { index: i + 1 }).render(row);
         }
         // [LAW:one-source-of-truth] `Strip`'s sibling `FlexStrip` ends every line
         // it emits, including the last, and the other block-level renderables
@@ -87,10 +145,9 @@ export class Strip {
 }
 const PARTS = ["seam", "divider", "lead", "tail"];
 /**
- * The least ΔE_OK two neighbouring backgrounds must differ by for a seam drawn
- * between them to be seen. Below it the seam is drawn in a colour the eye
- * cannot tell from its own background, so the joiner draws the divider
- * instead. Twice the ~.02 threshold of a visible difference, because a seam is
+ * The least ΔE_OK a seam cell's ink must differ from its own ground by for the
+ * seam to be seen. Below it the eye cannot tell the ink from the ground,
+ * so the joiner draws the divider instead. Twice the ~.02 threshold of a visible difference, because a seam is
  * one cell wide.
  */
 export const SEAM_MIN_DELTA_E = 0.04;
@@ -102,6 +159,14 @@ function* paintsIn(paint) {
     }
 }
 const glyphsOf = (cell) => (typeof cell.glyph === "string" ? [cell.glyph] : cell.glyph.oneOf);
+// An integer hash, so every engine picks the same member, scaled from its high
+// bits — FNV-1a's low bits barely mix — so the pick is in range by
+// construction. The part is in the key so a wrap's tail and lead, which share
+// an index, are picked independently.
+const pickGlyph = (cell, part, index, at) => {
+    const glyphs = glyphsOf(cell);
+    return glyphs[Math.floor((parseInt(fnv1a(`${part}:${index}:${at}`), 16) / 2 ** 32) * glyphs.length)];
+};
 const cellWidth = (cell) => cellLen(glyphsOf(cell)[0] ?? "");
 const partWidth = (cells) => cells.reduce((width, cell) => width + cellWidth(cell), 0);
 // `raw` as a `Paint`, or refused. `absent` is the neighbour this part may not
@@ -194,19 +259,22 @@ function paintableBg(bg) {
 function drawnGround(bg) {
     return bg.flattenAlpha(SURFACE_BLACK);
 }
-// A seam the eye cannot tell from the ground it is drawn on. What is measured
-// is what is drawn — `Style.drawnColors`, the colours the writer encodes: the
-// left ground flattened onto the right and the right onto the terminal's
-// black, both downgraded to the depth the render encodes at, so two grounds
-// 256 colours round to one cube entry are the one entry they render as. A
-// colour whose RGB is the terminal theme's own (ANSI 0–15, a blend reaching
-// one) has no value here, so two of them are the same only when they are one
-// expression: the same palette slot — its `number`, never the name or the
-// depth that spells it ("red", "color(1)", an EIGHT_BIT spec on 0–15 are one
-// slot) — or the same blend, whose name spells each end by its slot for the
-// same reason.
-function vanishes(leftBg, rightBg, colorSystem) {
-    const { color, bgcolor } = new Style({ color: drawnGround(leftBg), bgcolor: rightBg }).drawnColors(colorSystem ?? ColorDepth.TRUECOLOR);
+// A cell whose ink the eye cannot tell from its ground, read off the style it
+// is drawn in. What is measured is what is drawn — `Style.drawnColors`, the
+// colours the writer encodes: the ink flattened onto the cell's own ground and
+// the ground onto the terminal's black, both downgraded to the depth the
+// render encodes at, so two colours that depth rounds to one entry are the one
+// entry they render as. A colour whose RGB is the terminal theme's own (ANSI
+// 0–15, a blend reaching one) has no value here, so two of them are the same
+// only when they are one expression: the same palette slot — its `number`,
+// never the name or the depth that spells it ("red", "color(1)", an EIGHT_BIT
+// spec on 0–15 are one slot) — or the same blend, whose name spells each end
+// by its slot for the same reason. A cell on the terminal's ground, or in
+// reverse video over it, has a colour nobody knows on one side, and is seen.
+function vanishes(style, colorSystem) {
+    if (style.reverse)
+        return false;
+    const { color, bgcolor } = style.drawnColors(colorSystem ?? ColorDepth.TRUECOLOR);
     if (color === undefined || bgcolor === undefined)
         return false;
     const av = color.fixedValue;
@@ -248,8 +316,8 @@ const shapeGlyphs = (shape) => PARTS.flatMap((part) => shape[part].flatMap(glyph
  * Which part a join draws is read off its two neighbours. A neighbour is
  * missing at the strip's ends, and counts as missing — an endpoint — when the
  * shape paints with its ground anywhere and it has none to paint. With both present the
- * join is the seam, or the divider where the two grounds are drawn as one
- * colour at `options.colorSystem`; with only the right, the lead; with only
+ * join is the seam, or the divider where every seam cell's ink is drawn
+ * indistinct from its ground at `options.colorSystem`; with only the right, the lead; with only
  * the left, the tail; with neither, nothing.
  *
  * `ascii` is the shape an ASCII-only output draws instead, whole.
@@ -263,7 +331,7 @@ export class CellJoiner {
         this.ascii = parseShape(ascii, "ascii");
         this._forms = { glyph: formOf(this.shape), ascii: formOf(this.ascii) };
     }
-    join(left, right) {
+    join(left, right, { index }) {
         const forms = this._forms;
         return {
             *render(options) {
@@ -273,63 +341,119 @@ export class CellJoiner {
                 const rightBg = paintableBg(edges.right?.bgcolor);
                 const hasLeft = left !== null && (!reads.left || leftBg !== undefined);
                 const hasRight = right !== null && (!reads.right || rightBg !== undefined);
-                const divides = drawn.divider !== drawn.seam && leftBg !== undefined && rightBg !== undefined && vanishes(leftBg, rightBg, options.colorSystem);
-                const cells = hasLeft && hasRight ? (divides ? drawn.divider : drawn.seam) : hasRight ? drawn.lead : hasLeft ? drawn.tail : [];
-                // A oneOf draws its first member until a join knows its seam index
-                // (rich-joiners-9ntp.bex).
-                for (const cell of cells)
-                    yield new Segment(glyphsOf(cell)[0], cellStyle(cell, edges, options));
+                const neighbours = { left, right };
+                // On screen a cell's ink is its `fg` paint and its ground its `bg`,
+                // reverse video or not (`cellStyle`).
+                const ownerOf = (color) => (color !== "ground" && "edge" in color ? neighbours[color.edge] : null);
+                const styled = (part) => drawn[part].map((cell, at) => {
+                    const owners = new ColorOwners(ownerOf(cell.fg), ownerOf(cell.bg));
+                    return new Segment(pickGlyph(cell, part, index, at), cellStyle(cell, edges, options).withAnchor({ owner: owners, row: 0, col: 0, inner: undefined }));
+                });
+                if (!hasLeft || !hasRight) {
+                    if (hasLeft || hasRight)
+                        yield* styled(hasRight ? "lead" : "tail");
+                    return;
+                }
+                // A seam is lost only when every cell of it is: one cell rounded into
+                // its ground at a shallow depth still leaves the others to show the
+                // step, and measuring per cell, not across the two grounds, divides a
+                // seam stepping in thirds where each third would not be seen.
+                const seam = styled("seam");
+                const lost = drawn.divider !== drawn.seam && seam.every((segment) => segment.style !== undefined && vanishes(segment.style, options.colorSystem));
+                yield* lost ? styled("divider") : seam;
             },
         };
     }
 }
-// --- The four joiners as shapes ---
+// --- The bundled joiners ---
 const LEFT_BG = { edge: "left", part: "bg" };
 const RIGHT_BG = { edge: "right", part: "bg" };
 const LEFT_FG = { edge: "left", part: "fg" };
+const HALF = { mix: [LEFT_BG, RIGHT_BG, 1 / 2] };
 const GROUND = "ground";
-/**
- * The powerline joiner: U+E0B0 (right-arrow) in the left ground over the
- * right, divided by U+E0B1 (thin right-arrow) in the left item's text. The
- * lead is the arrow with the left ground replaced by the terminal's — drawn
- * in reverse video it leaves a notch whose base is the cell's left edge, inked
- * in the terminal's background colour. That ink is opaque, so under a
- * translucent terminal the notch does not let what is behind it through. The
- * tail is the arrow over the terminal's ground.
- * ASCII draws `>` everywhere and begins each run flat.
- */
-export const POWERLINE_JOINER = new CellJoiner({
-    seam: [{ glyph: "", fg: LEFT_BG, bg: RIGHT_BG }],
-    divider: [{ glyph: "", fg: LEFT_FG, bg: LEFT_BG }],
-    lead: [{ glyph: "", fg: GROUND, bg: RIGHT_BG }],
-    tail: [{ glyph: "", fg: LEFT_BG, bg: GROUND }],
-}, {
-    seam: [{ glyph: ">", fg: LEFT_BG, bg: RIGHT_BG }],
-    divider: [{ glyph: ">", fg: LEFT_FG, bg: LEFT_BG }],
-    lead: [],
-    tail: [{ glyph: ">", fg: LEFT_BG, bg: GROUND }],
-});
-function capsule(open, close) {
-    const seam = [
-        { glyph: close, fg: LEFT_BG, bg: GROUND },
-        { glyph: " ", fg: LEFT_FG, bg: GROUND },
-        { glyph: open, fg: RIGHT_BG, bg: GROUND },
-    ];
+// A one-cell edge in the powerline family: `glyph` in the left ground over the
+// right; divided by `thin` in the left item's text; led by the same glyph with
+// the left ground replaced by the terminal's — in reverse video, a notch whose
+// ink is the terminal's background — and tailed by it over the terminal's.
+function edge(glyph, thin) {
+    return {
+        seam: [{ glyph, fg: LEFT_BG, bg: RIGHT_BG }],
+        divider: [{ glyph: thin, fg: LEFT_FG, bg: LEFT_BG }],
+        lead: [{ glyph, fg: GROUND, bg: RIGHT_BG }],
+        tail: [{ glyph, fg: LEFT_BG, bg: GROUND }],
+    };
+}
+// Three powerline arrows stepping through the two thirds between the grounds.
+function prism(glyph, thin) {
+    const third = (t) => ({ mix: [LEFT_BG, RIGHT_BG, t] });
+    const pad = { glyph: " ", fg: LEFT_FG, bg: LEFT_BG };
+    return {
+        ...edge(glyph, thin),
+        seam: [
+            { glyph, fg: LEFT_BG, bg: third(1 / 3) },
+            { glyph, fg: third(1 / 3), bg: third(2 / 3) },
+            { glyph, fg: third(2 / 3), bg: RIGHT_BG },
+        ],
+        divider: [pad, { glyph: thin, fg: LEFT_FG, bg: LEFT_BG }, pad],
+    };
+}
+// A powerline-family joiner: `shape` over `glyph`, its ASCII form the same
+// shape over `ascii`, beginning each run flat — an ASCII arrow reversed out of
+// the terminal's ground is a block of nothing.
+const arrows = (shape, glyph, thin, ascii, asciiThin) => new CellJoiner(shape(glyph, thin), { ...shape(ascii, asciiThin), lead: [] });
+// Each run closed by `close` and opened by `open`, both in its ground over the
+// terminal's, with `between` — cells on the terminal's ground — between runs.
+function pill(open, close, between) {
+    const seam = [{ glyph: close, fg: LEFT_BG, bg: GROUND }, ...between, { glyph: open, fg: RIGHT_BG, bg: GROUND }];
     return { seam, divider: seam, lead: [{ glyph: open, fg: RIGHT_BG, bg: GROUND }], tail: [{ glyph: close, fg: LEFT_BG, bg: GROUND }] };
 }
-/**
- * Rounded pills: each run opened by U+E0B6 and closed by U+E0B4, both in its
- * ground over the terminal's, a space between pills. ASCII draws `(` and `)`.
- */
-export const CAPSULE_JOINER = new CellJoiner(capsule("", ""), capsule("(", ")"));
+const capsule = (open, close) => pill(open, close, [{ glyph: " ", fg: LEFT_FG, bg: GROUND }]);
+const metro = (open, close, rail) => pill(open, close, [{ glyph: rail, fg: { role: "strip.rail" }, bg: GROUND }]);
+// One cell drawn over the two grounds' midpoint, so it reads as neither item's;
+// nothing at the ends, where there is no second ground to meet.
+function midpoint(glyph, fg) {
+    const seam = [{ glyph, fg, bg: HALF }];
+    return { seam, divider: seam, lead: [], tail: [] };
+}
+// A ragged tear in the left ground over the midpoint; where that ink would
+// vanish into the midpoint — grounds a few steps apart, or one ground — the
+// same tear in the left item's text.
+function torn(glyphs) {
+    return { ...midpoint({ oneOf: glyphs }, LEFT_BG), divider: [{ glyph: { oneOf: glyphs }, fg: LEFT_FG, bg: HALF }] };
+}
 const PLAIN_SEAM = [{ glyph: " | ", fg: { role: "strip.separator" }, bg: GROUND }];
 const PLAIN = { seam: PLAIN_SEAM, divider: PLAIN_SEAM, lead: [], tail: [] };
 /**
- * ` | ` between every pair of items, in the theme's `strip.separator` colour;
- * nothing at the ends. Its shape names no neighbour, so it joins items with no
- * ground too.
+ * The bundled joiners, by name. What each draws is `docs/strip.md`'s
+ * "Built-in joiners"; a name from config is read with `joinerNamed`.
  */
-export const PLAIN_JOINER = new CellJoiner(PLAIN, PLAIN);
+export const JOINERS = Object.freeze({
+    powerline: arrows(edge, "\ue0b0", "\ue0b1", ">", ">"),
+    prism: arrows(prism, "\ue0b0", "\ue0b1", ">", ">"),
+    slant: arrows(edge, "\ue0bc", "\ue0bd", "/", "/"),
+    backslant: arrows(edge, "\ue0b8", "\ue0b9", "\\", "\\"),
+    flame: arrows(edge, "\ue0c0", "\ue0c1", "}", "}"),
+    pixel: arrows(edge, "\ue0c4", "\ue0b1", "#", ">"),
+    ice: arrows(edge, "\ue0c8", "\ue0b1", "]", ">"),
+    bubble: arrows(edge, "\ue0b4", "\ue0b5", ")", ")"),
+    capsule: new CellJoiner(capsule("\ue0b6", "\ue0b4"), capsule("(", ")")),
+    wrapper: new CellJoiner(pill("\ue0b2", "\ue0b0", []), pill("<", ">", [])),
+    metro: new CellJoiner(metro("\ue0b6", "\ue0b4", "\u2500\u2500"), metro("(", ")", "--")),
+    stitch: new CellJoiner(midpoint("\u250a", LEFT_FG), midpoint(":", LEFT_FG)),
+    torn: new CellJoiner(torn(["\u259a\u259e", "\u259e\u259a", "\u2598\u2597", "\u259d\u2596", "\u2596\u259d", "\u2597\u2598"]), torn(["/\\", "\\/"])),
+    plain: new CellJoiner(PLAIN, PLAIN),
+});
+/**
+ * The bundled joiner `name` names — a name read from config, parsed. Throws on
+ * any other string, naming the ones there are; an own-key test, so `toString`
+ * and the rest of `Object.prototype` are not joiners.
+ */
+export function joinerNamed(name) {
+    if (!isJoinerName(name))
+        throw new Error(`no joiner named ${JSON.stringify(name)}; the joiners are ${Object.keys(JOINERS).join(", ")}`);
+    return JOINERS[name];
+}
+const isJoinerName = (name) => Object.hasOwn(JOINERS, name);
 function gradient(steps, glyph) {
     // Midpoint sampling across `2 * steps` half-cell positions: cell i takes
     // samples 2i (its ink, the left half) and 2i+1 (its ground, the right half),

package/dist/core/style.js

@@ -646,6 +646,7 @@ export const DEFAULT_STYLES = {
     "rule.text": NULL_STYLE,
     // Strip
     "strip.separator": Style.parse("bright_black"),
+    "strip.rail": Style.parse("bright_black"),
     // JSON
     "json.brace": Style.parse("bold"),
     "json.bool_true": Style.parse("italic bright_green"),

package/dist/host/input.d.ts

@@ -16,8 +16,9 @@
  *
  * Lone-ESC handling: a bare `\x1b` is ambiguous (escape key vs. start of a
  * CSI sequence). When the buffer is drained but ends with a lone ESC, the
- * parser defers emission via setTimeout(0). The next chunk cancels the timer
- * if it extends the sequence. `flush()` drains it synchronously.
+ * parser defers emission via setTimeout(0). A next chunk opening with `[` or
+ * `O` extends the sequence; any other next chunk emits the ESC as Escape
+ * first. `flush()` drains it synchronously.
  */
 /** A key as the terminal reported it: plain data, with no say over who hears it. */
 export interface KeyPress {
@@ -73,6 +74,8 @@ export declare class InputParser {
     flush(): void;
     /** Drop what is buffered and any pending lone ESC: the parser as constructed. */
     reset(): void;
+    /** The parser's one hold: a lone ESC that may yet open a sequence. */
+    private holdingEscape;
     private cancelEscape;
     private drain;
     private consumeOne;