@flowtty/core 1.0.0-alpha.12 → 1.0.0-alpha.13

package/dist/{backend-CT8SGLO5.d.ts → backend-DPFtzaxG.d.ts}

@@ -45,6 +45,17 @@ interface Key {
 //#endregion
 //#region src/backend.d.ts
 interface Backend {
+  /**
+   * The render area, in cells.
+   *
+   * `height` may be `Infinity`: an unbounded surface — a report printed once
+   * rather than a screen to fit into. The renderer then lays the tree out with
+   * no height constraint (percent heights have nothing to resolve against and
+   * fall back to auto) and draws a buffer exactly as tall as the content, so a
+   * frame can be any number of rows. `useTerminalSize()` reports `Infinity`
+   * for the height too, which is what a component should branch on when it
+   * would otherwise size itself to the screen.
+   */
   size(): {
     width: number;
     height: number;

package/dist/host/index.d.ts

@@ -1,6 +1,6 @@
-import { D as getYoga, E as YogaNode, T as Yoga, _ as computeLayout, c as applyProps, d as insertBefore, f as measureText, g as Rect, h as removeChild, i as Instance, l as createInstance, m as refreshMeasure, n as Container, o as TextInstance, p as ownText, r as HostType, s as appendChild, u as createTextInstance, v as layoutOf, y as BORDER_CHARS } from "../host-C98WW3Ai.js";
+import { D as Yoga, O as YogaNode, _ as Rect, b as layoutOf, c as appendChild, d as createTextInstance, f as insertBefore, g as removeChild, h as refreshMeasure, i as Instance, k as getYoga, l as applyProps, m as ownText, n as Container, o as TextInstance, p as measureText, r as HostType, u as createInstance, v as computeLayout, x as BORDER_CHARS, y as contentHeight } from "../host-DnKJiaQh.js";
 import { t as Buffer } from "../cells-C-GthybI.js";
 //#region src/host/paint.d.ts
 export declare function paint(container: Container, width: number, height: number): Buffer;
 //#endregion
-export { BORDER_CHARS, type Container, type HostType, type Instance, type Rect, type TextInstance, type Yoga, type YogaNode, appendChild, applyProps, computeLayout, createInstance, createTextInstance, getYoga, insertBefore, layoutOf, measureText, ownText, refreshMeasure, removeChild };
+export { BORDER_CHARS, type Container, type HostType, type Instance, type Rect, type TextInstance, type Yoga, type YogaNode, appendChild, applyProps, computeLayout, contentHeight, createInstance, createTextInstance, getYoga, insertBefore, layoutOf, measureText, ownText, refreshMeasure, removeChild };

package/dist/host/index.js

@@ -1,4 +1,4 @@
-import { a as Buffer, n as BORDER_CHARS, t as wrapText } from "../wrap-D5f0P1iA.js";
+import { a as noteWarning, n as BORDER_CHARS, s as Buffer, t as wrapText } from "../wrap-DvO7jrLD.js";
 import { Align, Display, Edge, FlexDirection, Gutter, Justify, MeasureMode, PositionType, Wrap, loadYoga } from "yoga-layout/load";
 //#region src/host/yoga.ts
 let yogaPromise = null;
@@ -25,6 +25,7 @@ function createTextInstance(text, _Yoga) {
 	};
 }
 function applyProps(inst, props, _Yoga) {
+	const hadRuns = inst.props?.runs !== void 0;
 	inst.props = props;
 	const n = inst.yogaNode;
 	if (typeof props.width === "number") n.setWidth(props.width);
@@ -80,6 +81,7 @@ function applyProps(inst, props, _Yoga) {
 	n.setAlignContent(acMap(props.alignContent));
 	n.setJustifyContent(jcMap(props.justifyContent));
 	n.setAlignItems(aiMap(props.alignItems));
+	if (hadRuns || props.runs !== void 0) refreshMeasure(inst, _Yoga);
 }
 function wrapMap(v) {
 	switch (v) {
@@ -125,11 +127,13 @@ function measureText(text) {
 	};
 }
 function ownText(inst) {
+	if (inst.props.runs !== void 0) return inst.props.runs.map((r) => r.text).join("");
 	return inst.children.filter((c) => c.type === "text").map((c) => c.text).join("");
 }
 function refreshMeasure(inst, _Yoga) {
-	const hasText = inst.children.some((c) => c.type === "text");
+	const hasText = inst.props.runs !== void 0 || inst.children.some((c) => c.type === "text");
 	const hasBox = inst.children.some((c) => c.type === "box");
+	if (hasText && hasBox) noteWarning("flowtty: a box has both text and child boxes (e.g. <Text>a <Text bold>b</Text></Text>). <Text> is a box, not an inline span, so they do not flow as one line. Use <Span> for styled pieces inside a <Text>, or put separate <Text>s in a <Box flexDirection=\"row\">.");
 	if (hasText && !hasBox) {
 		const text = ownText(inst);
 		const mode = inst.props.wrap ?? "none";
@@ -186,6 +190,15 @@ function insertBefore(parent, child, before, Yoga) {
 function computeLayout(container, width, height) {
 	for (const root of container.children) root.yogaNode.calculateLayout(width, height);
 }
+function contentHeight(container) {
+	let bottom = 0;
+	for (const root of container.children) {
+		const { top, height } = layoutOf(root);
+		const edge = top + height;
+		if (Number.isFinite(edge) && edge > bottom) bottom = edge;
+	}
+	return Math.ceil(bottom);
+}
 function layoutOf(inst, offsetX = 0, offsetY = 0) {
 	const n = inst.yogaNode;
 	return {
@@ -215,6 +228,22 @@ function textStyleOf(inst) {
 	if (p.backgroundColor !== void 0) style.bg = p.backgroundColor;
 	return style;
 }
+function runStyles(runs, base) {
+	const out = [];
+	for (const run of runs) {
+		const style = { ...base };
+		if (run.color !== void 0) style.fg = run.color;
+		if (run.backgroundColor !== void 0) style.bg = run.backgroundColor;
+		if (run.bold !== void 0) style.bold = run.bold;
+		if (run.dim !== void 0) style.dim = run.dim;
+		if (run.underline !== void 0) style.underline = run.underline;
+		if (run.inverse !== void 0) style.inverse = run.inverse;
+		if (run.strikethrough !== void 0) style.strikethrough = run.strikethrough;
+		if (run.link !== void 0) style.link = run.link;
+		for (const _ch of run.text) out.push(style);
+	}
+	return out;
+}
 function setClipped(buffer, x, y, char, style, clip) {
 	if (clip !== null) {
 		if (x < clip.left || y < clip.top || x >= clip.left + clip.width || y >= clip.top + clip.height) return;
@@ -333,14 +362,25 @@ function paintInstance(inst, buffer, offsetX, offsetY, inheritedBg = void 0, cli
 		const lines = mode === "none" ? text.split("\n") : wrapText(text, content.width, mode);
 		const textStyle = textStyleOf(inst);
 		if (textStyle.bg === void 0 && effectiveBg !== void 0) textStyle.bg = effectiveBg;
+		const styles = inst.props.runs !== void 0 ? runStyles(inst.props.runs, textStyle) : null;
+		const source = styles ? [...text] : null;
+		let at = 0;
 		for (let row = 0; row < lines.length; row++) {
-			if (row >= content.height) break;
 			const chars = [...lines[row] ?? ""];
 			for (let col = 0; col < chars.length; col++) {
-				if (col >= content.width) break;
 				const ch = chars[col];
+				let style = textStyle;
+				if (styles && source) {
+					let found = at;
+					while (found < source.length && source[found] !== ch) found++;
+					if (found < source.length) {
+						style = styles[found];
+						at = found + 1;
+					} else style = styles[Math.min(at, styles.length - 1)] ?? textStyle;
+				}
+				if (row >= content.height || col >= content.width) continue;
 				const safe = ch.charCodeAt(0) < 32 ? " " : ch;
-				setClipped(buffer, content.left + col, content.top + row, safe, textStyle, clip);
+				setClipped(buffer, content.left + col, content.top + row, safe, style, clip);
 			}
 		}
 	}
@@ -380,4 +420,4 @@ function paintInstance(inst, buffer, offsetX, offsetY, inheritedBg = void 0, cli
 	for (const child of absolutes) paintInstance(child, buffer, box.left, box.top, effectiveBg, overlayClip);
 }
 //#endregion
-export { BORDER_CHARS, appendChild, applyProps, computeLayout, createInstance, createTextInstance, getYoga, insertBefore, layoutOf, measureText, ownText, paint, refreshMeasure, removeChild };
+export { BORDER_CHARS, appendChild, applyProps, computeLayout, contentHeight, createInstance, createTextInstance, getYoga, insertBefore, layoutOf, measureText, ownText, paint, refreshMeasure, removeChild };

package/dist/{host-C98WW3Ai.d.ts → host-DnKJiaQh.d.ts}

@@ -35,7 +35,8 @@ interface Rect {
   width: number;
   height: number;
 }
-declare function computeLayout(container: Container, width: number, height: number): void;
+declare function computeLayout(container: Container, width: number, height: number | undefined): void;
+declare function contentHeight(container: Container): number;
 declare function layoutOf(inst: Instance, offsetX?: number, offsetY?: number): Rect;
 //#endregion
 //#region src/host/host.d.ts
@@ -55,6 +56,11 @@ interface BoxProps {
   justifyContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly";
   /** Cross-axis alignment of children. */
   alignItems?: "flex-start" | "flex-end" | "center" | "stretch";
+  /** The box's text as styled pieces of ONE line of text: they are joined,
+   *  measured and wrapped together as a single paragraph, and each piece paints
+   *  with its own style on top of the box's text style. `<Text>` builds this from
+   *  `<Span>` children. When set, it replaces the box's direct text children. */
+  runs?: TextRun[];
   wrap?: "wrap" | "truncate" | "none";
   color?: Color;
   bold?: boolean;
@@ -147,6 +153,18 @@ interface ScrollMetrics {
   scrollTop: number;
   maxScrollTop: number;
 }
+/** One styled piece of a box's text — see `BoxProps.runs`. */
+interface TextRun {
+  text: string;
+  color?: Color;
+  backgroundColor?: Color;
+  bold?: boolean;
+  dim?: boolean;
+  underline?: boolean;
+  inverse?: boolean;
+  strikethrough?: boolean;
+  link?: string;
+}
 interface Instance {
   type: "box";
   props: BoxProps;
@@ -181,4 +199,4 @@ declare function appendChild(parent: Instance, child: Instance | TextInstance, Y
 declare function removeChild(parent: Instance, child: Instance | TextInstance, Yoga: Yoga): void;
 declare function insertBefore(parent: Instance, child: Instance | TextInstance, before: Instance | TextInstance, Yoga: Yoga): void;
 //#endregion
-export { GRID_CHARS as C, getYoga as D, YogaNode as E, DEFAULT_BORDER_STYLE as S, Yoga as T, computeLayout as _, ScrollMetrics as a, BorderChars as b, applyProps as c, insertBefore as d, measureText as f, Rect as g, removeChild as h, Instance as i, createInstance as l, refreshMeasure as m, Container as n, TextInstance as o, ownText as p, HostType as r, appendChild as s, BoxProps as t, createTextInstance as u, layoutOf as v, GridChars as w, BorderStyle as x, BORDER_CHARS as y };
+export { BorderStyle as C, Yoga as D, GridChars as E, YogaNode as O, BorderChars as S, GRID_CHARS as T, Rect as _, ScrollMetrics as a, layoutOf as b, appendChild as c, createTextInstance as d, insertBefore as f, removeChild as g, refreshMeasure as h, Instance as i, getYoga as k, applyProps as l, ownText as m, Container as n, TextInstance as o, measureText as p, HostType as r, TextRun as s, BoxProps as t, createInstance as u, computeLayout as v, DEFAULT_BORDER_STYLE as w, BORDER_CHARS as x, contentHeight as y };

package/dist/index.d.ts

@@ -1,6 +1,10 @@
-import { C as GRID_CHARS, S as DEFAULT_BORDER_STYLE, a as ScrollMetrics, b as BorderChars, t as BoxProps, w as GridChars, x as BorderStyle } from "./host-C98WW3Ai.js";
+import { C as BorderStyle, E as GridChars, S as BorderChars, T as GRID_CHARS, a as ScrollMetrics, s as TextRun, t as BoxProps, w as DEFAULT_BORDER_STYLE } from "./host-DnKJiaQh.js";
 import { a as NAMED_COLORS, i as Color, n as Cell, o as NamedColor, r as Style, t as Buffer } from "./cells-C-GthybI.js";
-import { a as NamedKey, i as NAMED_KEYS, n as Key, r as KeyName, t as Backend } from "./backend-CT8SGLO5.js";
+import { a as NamedKey, i as NAMED_KEYS, n as Key, r as KeyName, t as Backend } from "./backend-DPFtzaxG.js";
+//#region src/warnings.d.ts
+/** Warnings noted since the last call; clears the list. */
+export declare function takeWarnings(): string[];
+//#endregion
 //#region src/wrap.d.ts
 type WrapMode = "wrap" | "truncate" | "none";
 /**
@@ -190,4 +194,4 @@ interface MultiSelectOptions {
 }
 declare function reduce$1<T>(items: SelectItem<T>[], state: MultiSelectState, key: Key, opts?: MultiSelectOptions): MultiSelectAction;
 //#endregion
-export { type Backend, type BorderChars, type BorderStyle, type BoxProps, Buffer, type Cell, type Color, DEFAULT_BORDER_STYLE, type EditorAction, type EditorOptions, type EditorState, GRID_CHARS, type GridChars, type InputRow, type Key, type KeyName, type MultiSelectAction, type MultiSelectOptions, type MultiSelectState, NAMED_COLORS, NAMED_KEYS, type NamedColor, type NamedKey, type ScrollMetrics, type SelectAction, type SelectItem, type SelectState, type Style, type VisualLine, type WrapMode, reduce as editorReducer, reduce$1 as multiSelectReducer, reduce$2 as selectReducer };
+export { type Backend, type BorderChars, type BorderStyle, type BoxProps, Buffer, type Cell, type Color, DEFAULT_BORDER_STYLE, type EditorAction, type EditorOptions, type EditorState, GRID_CHARS, type GridChars, type InputRow, type Key, type KeyName, type MultiSelectAction, type MultiSelectOptions, type MultiSelectState, NAMED_COLORS, NAMED_KEYS, type NamedColor, type NamedKey, type ScrollMetrics, type SelectAction, type SelectItem, type SelectState, type Style, type TextRun, type VisualLine, type WrapMode, reduce as editorReducer, reduce$1 as multiSelectReducer, reduce$2 as selectReducer };

package/dist/index.js

@@ -1,4 +1,4 @@
-import { a as Buffer, i as GRID_CHARS, r as DEFAULT_BORDER_STYLE, t as wrapText } from "./wrap-D5f0P1iA.js";
+import { i as GRID_CHARS, o as takeWarnings, r as DEFAULT_BORDER_STYLE, s as Buffer, t as wrapText } from "./wrap-DvO7jrLD.js";
 import { t as NAMED_KEYS } from "./keys-Ck-RALk_.js";
 //#region src/visualLines.ts
 function splitVisualLines(text, mode, width) {
@@ -653,7 +653,7 @@ function reduce$2(items, state, key) {
 			index: visible[Math.min(state.cursor, n - 1)]
 		};
 	}
-	if (key.name === "down" || key.name === "j" && !key.ctrl && !key.meta) {
+	if (key.name === "down") {
 		if (n === 0) return { kind: "noop" };
 		return {
 			kind: "state",
@@ -663,7 +663,7 @@ function reduce$2(items, state, key) {
 			}
 		};
 	}
-	if (key.name === "up" || key.name === "k" && !key.ctrl && !key.meta) {
+	if (key.name === "up") {
 		if (n === 0) return { kind: "noop" };
 		return {
 			kind: "state",
@@ -718,4 +718,4 @@ function reduce$1(items, state, key, opts = {}) {
 	return { kind: "noop" };
 }
 //#endregion
-export { Buffer, DEFAULT_BORDER_STYLE, GRID_CHARS, NAMED_COLORS, NAMED_KEYS, caretPosition, charWidth, reduce as editorReducer, inputRows, reduce$1 as multiSelectReducer, rowIndexAt, reduce$2 as selectReducer, splitVisualLines, stringWidth, visibleIndices, windowAround, wrapText };
+export { Buffer, DEFAULT_BORDER_STYLE, GRID_CHARS, NAMED_COLORS, NAMED_KEYS, caretPosition, charWidth, reduce as editorReducer, inputRows, reduce$1 as multiSelectReducer, rowIndexAt, reduce$2 as selectReducer, splitVisualLines, stringWidth, takeWarnings, visibleIndices, windowAround, wrapText };

package/dist/testing/index.d.ts

@@ -1,5 +1,5 @@
 import { t as Buffer } from "../cells-C-GthybI.js";
-import { n as Key, t as Backend } from "../backend-CT8SGLO5.js";
+import { n as Key, t as Backend } from "../backend-DPFtzaxG.js";
 //#region src/testing/test-backend.d.ts
 export declare class TestBackend implements Backend {
   private readonly cols;

package/dist/{wrap-D5f0P1iA.js → wrap-DvO7jrLD.js}

@@ -35,6 +35,18 @@ var Buffer = class {
 	}
 };
 //#endregion
+//#region src/warnings.ts
+const pending = /* @__PURE__ */ new Set();
+function noteWarning(message) {
+	pending.add(message);
+}
+/** Warnings noted since the last call; clears the list. */
+function takeWarnings() {
+	const out = [...pending];
+	pending.clear();
+	return out;
+}
+//#endregion
 //#region src/host/borders.ts
 /** The library-wide default for components that draw a box-border chrome
 *  (DialogHost wrappers, Menu panels, Table grids). Declared once so the
@@ -177,4 +189,4 @@ function wrapLine(line, width, out) {
 	if (current) out.push(current);
 }
 //#endregion
-export { Buffer as a, GRID_CHARS as i, BORDER_CHARS as n, DEFAULT_BORDER_STYLE as r, wrapText as t };
+export { noteWarning as a, GRID_CHARS as i, BORDER_CHARS as n, takeWarnings as o, DEFAULT_BORDER_STYLE as r, Buffer as s, wrapText as t };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flowtty/core",
-  "version": "1.0.0-alpha.12",
+  "version": "1.0.0-alpha.13",
   "type": "module",
   "license": "MIT",
   "repository": {