@alchemy.run/sigil 0.0.0-alpha.6 → 0.0.0-alpha.7

package/README.md

@@ -2254,7 +2254,7 @@ Type: `number`
 Number of rows (vertical character cells).
 
 > [!NOTE]
-> When the terminal is resized narrower, ghost lines may briefly appear depending on the terminal emulator's reflow behavior.
+> On terminals that send in-band size reports (mode 2048, e.g. Ghostty, kitty, foot) the frame is repainted as soon as the report arrives, since the emulator has already rewrapped by then. Elsewhere the size comes from the PTY, which can run ahead of or behind the emulator, so resize events are coalesced: the frame is erased and repainted about 50 ms after the size stops changing and is briefly absent during a window drag. Painting mid-rewrap is what leaves ghost rows behind.
 
 ### useFocus(options?)
 

package/dist/{Text-BobFKi74.d.ts → Text-DV9CuzAT.d.ts}

@@ -1,4 +1,4 @@
-import { s as Paint } from "./paint-C19minOS.js";
+import { s as Paint } from "./paint-Cx-zC_sX.js";
 import { ReactNode } from "react";
 //#region src/glyphs.d.ts
 declare const BOXES: {

package/dist/ansi.d.ts

@@ -1,4 +1,4 @@
-import { i as ColorSupportLevel, n as ColorInfo } from "./detect-Bh4yGP6w.js";
+import { i as ColorSupportLevel, n as ColorInfo } from "./detect-Db6GbKOm.js";
 import { A as exitAlternativeScreen, C as enableBracketedPaste, D as eraseLines, E as eraseLine, F as popKittyKeyboard, I as pushKittyKeyboard, L as resetCursorColor, M as link, N as pasteEnd, O as eraseScreen, P as pasteStart, S as disableBracketedPaste, T as eraseEndLine, _ as cursorNextLine, a as CursorShape, b as cursorTo, c as OSC, d as bsu, f as clearTerminal, g as cursorLeft, h as cursorHide, i as CSI, j as kittyQuery, k as esu, l as ST, m as cursorDown, n as C1_CSI, o as DEL, p as cursorColor, r as C1_ST, s as ESC, t as BEL, u as ansiEscapes, v as cursorShape, w as enterAlternativeScreen, x as cursorUp, y as cursorShow } from "./escapes-CB_6CWOE.js";
 import { a as queryClipboard, c as setTerminalProgress, d as tmuxPassthrough, i as notify, l as setWindowTitle, n as TerminalProgressState, o as setClipboard, r as clearClipboard, s as setPointerShape, t as ClipboardSelection, u as setWorkingDirectory } from "./osc-Cn0fw77g.js";
 import { _ as tokenize, a as StyledChar, c as diffAnsiCodes, d as getLinkStartCode, f as isIntensityCode, g as styledCharsToString, h as styledCharsFromTokens, i as ControlToken, l as endCodesSet, m as reduceAnsiCodesIncremental, n as AnsiToken, o as Token, p as reduceAnsiCodes, r as CharToken, s as ansiCodesToString, t as AnsiCode, u as getEndCode, v as undoAnsiCodes } from "./tokenize-Dx1y_l5H.js";

package/dist/ansi.js

@@ -2,8 +2,8 @@ import { A as cursorShape, B as eraseScreen, C as bsu, D as cursorHide, E as cur
 import { A as isFullwidthCodePoint, C as fullwidthRanges, D as halfwidthRanges, E as halfwidthMinimalCodePoint, F as narrowMinimalCodePoint, I as narrowRanges, L as wideMaximumCodePoint, M as isWide, N as isWideNotCJKTNotEmoji, O as isAmbiguous, P as narrowMaximumCodePoint, R as wideMinimalCodePoint, S as fullwidthMinimalCodePoint, T as halfwidthMaximumCodePoint, _ as ambiguousMinimalCodePoint, a as getLinkStartCode, b as eastAsianWidthType, c as reduceAnsiCodesIncremental, d as tokenize, f as undoAnsiCodes, g as ambiguousMaximumCodePoint, i as getEndCode, j as isFullwidthGrapheme, k as isFullWidth, l as styledCharsFromTokens, n as diffAnsiCodes, o as isIntensityCode, r as endCodesSet, s as reduceAnsiCodes, t as ansiCodesToString, u as styledCharsToString, v as ambiguousRanges, w as getCategory, x as fullwidthMaximumCodePoint, y as eastAsianWidth, z as wideRanges } from "./tokenize-AjqbvtiT.js";
 import { n as widestLine, t as stringWidth } from "./string-width-CijQwpIk.js";
 import { n as sliceAnsi, r as wrapAnsi, t as cliTruncate } from "./truncate-D31fhU6i.js";
-import { i as detectHyperlinkSupport, t as createSupportsColor } from "./detect-BuTXtY6e.js";
-import { a as setPointerShape, c as setWorkingDirectory, i as setClipboard, l as tmuxPassthrough, n as notify, o as setTerminalProgress, r as queryClipboard, s as setWindowTitle, t as clearClipboard, u as cliCursor } from "./osc-CCH7xDoS.js";
+import { i as detectHyperlinkSupport, t as createSupportsColor } from "./detect-B3dL4Q11.js";
+import { a as setPointerShape, c as setWorkingDirectory, i as setClipboard, l as tmuxPassthrough, n as notify, o as setTerminalProgress, r as queryClipboard, s as setWindowTitle, t as clearClipboard, u as cliCursor } from "./osc-BFKKSqpg.js";
 import { t as stripAnsi } from "./strip-BvU4toXG.js";
 import { isatty } from "node:tty";
 //#region src/ansi/chalk.ts

package/dist/capabilities.d.ts

@@ -1,5 +1,5 @@
-import { a as Multiplexer, c as TerminalAppearance, d as detectCapabilities, f as detectColorLevel, h as detectUnicodeSupport, i as ColorSupportLevel, l as TerminalIdentity, m as detectTerminal, n as ColorInfo, o as PixelGeometry, p as detectHyperlinkSupport, r as ColorSupport, s as RgbColor, t as Capabilities, u as createSupportsColor } from "./detect-Bh4yGP6w.js";
-import { a as getTerminalQuery, i as applyTerminalQuery, n as TerminalQueryOptions, o as queryTerminal, r as TerminalQueryResult, s as refreshTerminalQuery, t as PixelSize } from "./query-vaIeGOkH.js";
-import { n as capabilities, r as getCapabilities, t as CapabilitiesStore } from "./store-CgrG9K4y.js";
-import { i as resolveColorProfile, n as ColorState, r as colorState, t as ColorPolicy } from "./color-policy-BMzMwV7Q.js";
+import { a as Multiplexer, c as TerminalAppearance, d as detectCapabilities, f as detectColorLevel, h as detectUnicodeSupport, i as ColorSupportLevel, l as TerminalIdentity, m as detectTerminal, n as ColorInfo, o as PixelGeometry, p as detectHyperlinkSupport, r as ColorSupport, s as RgbColor, t as Capabilities, u as createSupportsColor } from "./detect-Db6GbKOm.js";
+import { a as getTerminalQuery, i as applyTerminalQuery, n as TerminalQueryOptions, o as queryTerminal, r as TerminalQueryResult, s as refreshTerminalQuery, t as PixelSize } from "./query-BNc2B8GD.js";
+import { n as capabilities, r as getCapabilities, t as CapabilitiesStore } from "./store-C1P5fOUi.js";
+import { i as resolveColorProfile, n as ColorState, r as colorState, t as ColorPolicy } from "./color-policy-CCxuHIdD.js";
 export { type Capabilities, type CapabilitiesStore, type ColorInfo, type ColorPolicy, type ColorState, type ColorSupport, type ColorSupportLevel, type Multiplexer, type PixelGeometry, type PixelSize, type RgbColor, type TerminalAppearance, type TerminalIdentity, type TerminalQueryOptions, type TerminalQueryResult, applyTerminalQuery, capabilities, colorState, createSupportsColor, detectCapabilities, detectColorLevel, detectHyperlinkSupport, detectTerminal, detectUnicodeSupport, getCapabilities, getTerminalQuery, queryTerminal, refreshTerminalQuery, resolveColorProfile };

package/dist/capabilities.js

@@ -1,3 +1,3 @@
-import { a as detectTerminal, i as detectHyperlinkSupport, n as detectCapabilities, o as detectUnicodeSupport, r as detectColorLevel, t as createSupportsColor } from "./detect-BuTXtY6e.js";
-import { d as queryTerminal, f as refreshTerminalQuery, i as getCapabilities, l as getTerminalQuery, n as resolveColorProfile, r as capabilities, s as applyTerminalQuery, t as colorState } from "./color-policy-SVj1pYTA.js";
+import { a as detectTerminal, i as detectHyperlinkSupport, n as detectCapabilities, o as detectUnicodeSupport, r as detectColorLevel, t as createSupportsColor } from "./detect-B3dL4Q11.js";
+import { d as queryTerminal, f as refreshTerminalQuery, i as getCapabilities, l as getTerminalQuery, n as resolveColorProfile, r as capabilities, s as applyTerminalQuery, t as colorState } from "./color-policy-DlrZXC0f.js";
 export { applyTerminalQuery, capabilities, colorState, createSupportsColor, detectCapabilities, detectColorLevel, detectHyperlinkSupport, detectTerminal, detectUnicodeSupport, getCapabilities, getTerminalQuery, queryTerminal, refreshTerminalQuery, resolveColorProfile };

package/dist/{color-policy-BMzMwV7Q.d.ts → color-policy-CCxuHIdD.d.ts}

@@ -1,5 +1,5 @@
-import { i as ColorSupportLevel } from "./detect-Bh4yGP6w.js";
-import { t as ColorProfile } from "./color-profile-u0Nhe9Nv.js";
+import { i as ColorSupportLevel } from "./detect-Db6GbKOm.js";
+import { t as ColorProfile } from "./color-profile-CyeHnG1T.js";
 //#region src/capabilities/color-policy.d.ts
 /** A user-selected output policy. `auto` follows the target stream. */
 type ColorPolicy = "auto" | ColorProfile;

package/dist/{color-policy-SVj1pYTA.js → color-policy-DlrZXC0f.js}

@@ -1,6 +1,6 @@
 import { _ as CSI, b as OSC } from "./sgr-BhwaWAJB.js";
 import { a as isTty } from "./env-YVw64yZS.js";
-import { c as signalExit, n as detectCapabilities } from "./detect-BuTXtY6e.js";
+import { n as detectCapabilities, s as signalExit } from "./detect-B3dL4Q11.js";
 import { t as colorProfileFromLevel } from "./color-profile-DHhQHY55.js";
 //#region src/capabilities/query.ts
 /**
@@ -373,25 +373,36 @@ const createStore = (stdin, stdout) => {
 	const listeners = /* @__PURE__ */ new Set();
 	let resizeSubscribers = 0;
 	let focused;
+	let reportedSize;
 	let snapshot;
 	let snapshotQuery;
 	let snapshotColumns;
 	let snapshotRows;
 	let snapshotFocused;
+	let snapshotReportedSize;
 	const current = () => {
 		const query = getTerminalQuery(stdout);
 		const { columns, rows } = stdout;
-		if (!snapshot || query !== snapshotQuery || columns !== snapshotColumns || rows !== snapshotRows || focused !== snapshotFocused) {
+		if (!snapshot || query !== snapshotQuery || columns !== snapshotColumns || rows !== snapshotRows || focused !== snapshotFocused || reportedSize !== snapshotReportedSize) {
 			const detected = detectCapabilities({ stdout });
 			const applied = query ? applyTerminalQuery(detected, query) : detected;
-			snapshot = focused === void 0 ? applied : {
+			const sized = reportedSize ? {
 				...applied,
+				size: {
+					...applied.size,
+					...reportedSize,
+					source: "terminal"
+				}
+			} : applied;
+			snapshot = focused === void 0 ? sized : {
+				...sized,
 				focused
 			};
 			snapshotQuery = query;
 			snapshotColumns = columns;
 			snapshotRows = rows;
 			snapshotFocused = focused;
+			snapshotReportedSize = reportedSize;
 		}
 		return snapshot;
 	};
@@ -431,6 +442,7 @@ const createStore = (stdin, stdout) => {
 			integration?.setReportFeed?.(false);
 			removeExitHandler?.();
 			removeExitHandler = void 0;
+			reportedSize = void 0;
 		}
 	};
 	reportingUpdaters.set(stdout, updateReporting);
@@ -457,16 +469,22 @@ const createStore = (stdin, stdout) => {
 		const resize = sequence.match(inBandResizeReport);
 		if (resize) {
 			const [, rows, columns, pixelHeight, pixelWidth] = resize.map(Number);
-			if (columns && rows) patchTerminalQuery(stdout, {
-				textAreaPixels: pixelWidth && pixelHeight ? {
-					width: pixelWidth,
-					height: pixelHeight
-				} : void 0,
-				cellPixels: pixelWidth && pixelHeight ? {
-					width: Math.round(pixelWidth / columns),
-					height: Math.round(pixelHeight / rows)
-				} : void 0
-			});
+			if (columns && rows) {
+				reportedSize = {
+					columns,
+					rows
+				};
+				patchTerminalQuery(stdout, {
+					textAreaPixels: pixelWidth && pixelHeight ? {
+						width: pixelWidth,
+						height: pixelHeight
+					} : void 0,
+					cellPixels: pixelWidth && pixelHeight ? {
+						width: Math.round(pixelWidth / columns),
+						height: Math.round(pixelHeight / rows)
+					} : void 0
+				});
+			}
 			notify();
 			return true;
 		}

package/dist/{color-profile-u0Nhe9Nv.d.ts → color-profile-CyeHnG1T.d.ts}

@@ -1,4 +1,4 @@
-import { i as ColorSupportLevel } from "./detect-Bh4yGP6w.js";
+import { i as ColorSupportLevel } from "./detect-Db6GbKOm.js";
 //#region src/screen/cell.d.ts
 /**
 A terminal color before it is converted to an output profile.

package/dist/color.d.ts

@@ -1,5 +1,5 @@
-import { c as Color, d as RgbColor } from "./color-profile-u0Nhe9Nv.js";
-import { _ as perimeterGradient, a as LinearGradient, c as PaintContext, d as adaptive, f as ansi, g as perProfile, h as named, i as InterpolationSpace, l as PerimeterGradient, m as linearGradient, n as ColorInput, o as NamedColor, p as ansi256, r as GradientStop, s as Paint, t as AdaptiveColor, u as ProfileColor, v as rgb } from "./paint-C19minOS.js";
+import { c as Color, d as RgbColor } from "./color-profile-CyeHnG1T.js";
+import { _ as perimeterGradient, a as LinearGradient, c as PaintContext, d as adaptive, f as ansi, g as perProfile, h as named, i as InterpolationSpace, l as PerimeterGradient, m as linearGradient, n as ColorInput, o as NamedColor, p as ansi256, r as GradientStop, s as Paint, t as AdaptiveColor, u as ProfileColor, v as rgb } from "./paint-Cx-zC_sX.js";
 import { n as Rect } from "./geometry-BxXOzJgo.js";
 //#region src/color/palette.d.ts
 declare const canonicalAnsiPalette: readonly RgbColor[];

package/dist/{detect-BuTXtY6e.js → detect-B3dL4Q11.js}

@@ -356,7 +356,8 @@ function detectCapabilities({ stdout = process.stdout } = {}) {
 				columns: stdout.columns,
 				rows: stdout.rows
 			} : terminalSize(),
-			pixels: void 0
+			pixels: void 0,
+			source: "pty"
 		},
 		focused: void 0,
 		theme: {
@@ -370,4 +371,4 @@ function detectCapabilities({ stdout = process.stdout } = {}) {
 	};
 }
 //#endregion
-export { detectTerminal as a, signalExit as c, detectHyperlinkSupport as i, detectCapabilities as n, detectUnicodeSupport as o, detectColorLevel as r, terminalSize as s, createSupportsColor as t };
+export { detectTerminal as a, detectHyperlinkSupport as i, detectCapabilities as n, detectUnicodeSupport as o, detectColorLevel as r, signalExit as s, createSupportsColor as t };

package/dist/{detect-Bh4yGP6w.d.ts → detect-Db6GbKOm.d.ts}

@@ -64,11 +64,20 @@ type Capabilities = {
   /**
       Current terminal dimensions in cells, plus pixel geometry once the
       terminal has answered the query.
+  
+      `source` tells where the cell dimensions come from. `"pty"` is the
+      stream's own `columns`/`rows`, updated by the OS on SIGWINCH — which says
+      nothing about whether the emulator has finished rewrapping its screen.
+      `"terminal"` is the emulator's in-band size report (mode 2048), which
+      arrives in the input stream after the rewrap and so describes the screen
+      exactly as later output will find it. While the terminal reports, its
+      size wins over the stream's.
       */
   size: {
     columns: number;
     rows: number;
     pixels: PixelGeometry | undefined;
+    source: "pty" | "terminal";
   };
   platform: NodeJS.Platform;
   /**

package/dist/{index-DZ88EXJv.d.ts → index-D48vQhhe.d.ts}

@@ -1,6 +1,6 @@
 import { a as StyledChar } from "./tokenize-Dx1y_l5H.js";
-import { i as Cell, t as ColorProfile } from "./color-profile-u0Nhe9Nv.js";
-import { n as Screen, t as Line } from "./screen-BOSLQ8fF.js";
+import { i as Cell, t as ColorProfile } from "./color-profile-CyeHnG1T.js";
+import { n as Screen, t as Line } from "./screen-CgC2WlVM.js";
 //#region src/screen/ansi.d.ts
 /** Converts the renderer's canonical ANSI state into backend-neutral cells. */
 declare function cellsFromAnsi(text: string): Cell[];

package/dist/index.d.ts

@@ -1,10 +1,10 @@
-import { a as Multiplexer, c as TerminalAppearance, d as detectCapabilities, f as detectColorLevel, h as detectUnicodeSupport, i as ColorSupportLevel, l as TerminalIdentity, m as detectTerminal, n as ColorInfo, o as PixelGeometry, p as detectHyperlinkSupport, r as ColorSupport, s as RgbColor, t as Capabilities, u as createSupportsColor } from "./detect-Bh4yGP6w.js";
+import { a as Multiplexer, c as TerminalAppearance, d as detectCapabilities, f as detectColorLevel, h as detectUnicodeSupport, i as ColorSupportLevel, l as TerminalIdentity, m as detectTerminal, n as ColorInfo, o as PixelGeometry, p as detectHyperlinkSupport, r as ColorSupport, s as RgbColor, t as Capabilities, u as createSupportsColor } from "./detect-Db6GbKOm.js";
 import { n as TerminalProgressState, t as ClipboardSelection } from "./osc-Cn0fw77g.js";
-import { a as getTerminalQuery, i as applyTerminalQuery, n as TerminalQueryOptions, o as queryTerminal, r as TerminalQueryResult, s as refreshTerminalQuery, t as PixelSize } from "./query-vaIeGOkH.js";
-import { i as OutputStream, n as capabilities, r as getCapabilities, t as CapabilitiesStore } from "./store-CgrG9K4y.js";
-import { s as CellStyle, t as ColorProfile } from "./color-profile-u0Nhe9Nv.js";
-import { s as Paint } from "./paint-C19minOS.js";
-import { n as Text, r as Styles, t as Props$8 } from "./Text-BobFKi74.js";
+import { a as getTerminalQuery, i as applyTerminalQuery, n as TerminalQueryOptions, o as queryTerminal, r as TerminalQueryResult, s as refreshTerminalQuery, t as PixelSize } from "./query-BNc2B8GD.js";
+import { i as OutputStream, n as capabilities, r as getCapabilities, t as CapabilitiesStore } from "./store-C1P5fOUi.js";
+import { s as CellStyle, t as ColorProfile } from "./color-profile-CyeHnG1T.js";
+import { s as Paint } from "./paint-Cx-zC_sX.js";
+import { n as Text, r as Styles, t as Props$8 } from "./Text-DV9CuzAT.js";
 import { i as Node } from "./index-DDVME65c.js";
 import { t as CursorPosition } from "./cursor-position-D2LAkRG0.js";
 import { Writable } from "node:stream";
@@ -1046,6 +1046,10 @@ type WindowSize = {
 };
 /**
 A React hook that returns the current terminal window dimensions and re-renders the component whenever the terminal is resized.
+
+Reads the capabilities store, so on terminals that send in-band size reports
+(mode 2048) the dimensions are the emulator's own, arriving after it has
+rewrapped its screen; elsewhere they are the stream's `columns`/`rows`.
 */
 declare const useWindowSize: () => WindowSize;
 //#endregion

package/dist/index.js

@@ -2,12 +2,12 @@ import { C as bsu, S as ansiEscapes, V as esu, W as link, _ as CSI } from "./sgr
 import { h as tokenizeAnsi, p as graphemes } from "./tokenize-AjqbvtiT.js";
 import { t as stringWidth } from "./string-width-CijQwpIk.js";
 import { n as sliceAnsi, r as wrapAnsi } from "./truncate-D31fhU6i.js";
-import { _ as squashTextNodes, a as reconciler, c as kittyModifiers, d as FocusContext, f as Text, g as transformAnsiLine, h as emitLayoutListeners, i as useStdinContext, l as resolveFlags, m as createNode, n as useInput, o as detectKittySupport, p as addLayoutListener, r as useStdin, s as kittyFlags, t as useFocus, u as StdinContext, v as accessibilityContext } from "./use-focus-BzqAJi0n.js";
+import { _ as squashTextNodes, a as reconciler, c as kittyModifiers, d as FocusContext, f as Text, g as transformAnsiLine, h as emitLayoutListeners, i as useStdinContext, l as resolveFlags, m as createNode, n as useInput, o as detectKittySupport, p as addLayoutListener, r as useStdin, s as kittyFlags, t as useFocus, u as StdinContext, v as accessibilityContext } from "./use-focus-DSV01Ulb.js";
 import { a as isTty, i as isSigilDev, o as isWindows, r as isScreenReader, t as isInCi } from "./env-YVw64yZS.js";
-import { a as detectTerminal, c as signalExit, i as detectHyperlinkSupport, n as detectCapabilities, o as detectUnicodeSupport, r as detectColorLevel, s as terminalSize, t as createSupportsColor } from "./detect-BuTXtY6e.js";
-import { u as cliCursor } from "./osc-CCH7xDoS.js";
-import { a as registerTerminalIntegration, c as ensureTerminalQuery, d as queryTerminal, f as refreshTerminalQuery, i as getCapabilities, l as getTerminalQuery, o as getRawModeStream, r as capabilities, s as applyTerminalQuery, u as getTerminalQueryPromise } from "./color-policy-SVj1pYTA.js";
-import { a as buildCursorSuffix, c as hideCursorEscape, i as buildCursorOnlySequence, o as buildReturnToBottomPrefix, s as cursorPositionChanged, t as TerminalSession } from "./session-aZr9O8h3.js";
+import { a as detectTerminal, i as detectHyperlinkSupport, n as detectCapabilities, o as detectUnicodeSupport, r as detectColorLevel, s as signalExit, t as createSupportsColor } from "./detect-B3dL4Q11.js";
+import { u as cliCursor } from "./osc-BFKKSqpg.js";
+import { a as registerTerminalIntegration, c as ensureTerminalQuery, d as queryTerminal, f as refreshTerminalQuery, i as getCapabilities, l as getTerminalQuery, o as getRawModeStream, r as capabilities, s as applyTerminalQuery, u as getTerminalQueryPromise } from "./color-policy-DlrZXC0f.js";
+import { a as buildCursorSuffix, c as hideCursorEscape, i as buildCursorOnlySequence, o as buildReturnToBottomPrefix, s as cursorPositionChanged, t as TerminalSession } from "./session-Cg6STjFV.js";
 import { t as Yoga } from "./yoga-5jKhYCJC.js";
 import { r as createCell, t as cellAttributes } from "./cell-_ZVhbfl0.js";
 import { i as semanticTextStyleToCellStyle, n as mergeSemanticTextStyles, t as emptySemanticTextStyle } from "./semantic-text-style-DIMzC7xt.js";
@@ -1660,31 +1660,6 @@ function createRenderScheduler(render, options) {
 	};
 }
 //#endregion
-//#region src/utils.ts
-const resolveDimension = (value, fallback, defaultValue) => {
-	if (value !== void 0 && value > 0) return value;
-	if (fallback !== void 0 && fallback > 0) return fallback;
-	return defaultValue;
-};
-/**
-Get the effective terminal dimensions from the given stdout stream.
-
-Falls back to `terminal-size` for columns in piped processes where `stdout.columns` is 0, and uses standard defaults (80×24) when dimensions cannot be determined.
-*/
-const getWindowSize = (stdout) => {
-	const columns = stdout.columns ?? 0;
-	const rows = stdout.rows ?? 0;
-	if (columns && rows) return {
-		columns,
-		rows
-	};
-	const fallbackSize = terminalSize();
-	return {
-		columns: resolveDimension(columns, fallbackSize.columns, 80),
-		rows: resolveDimension(rows, fallbackSize.rows, 24)
-	};
-};
-//#endregion
 //#region src/ink.tsx
 /** @jsxImportSource react */
 const noop = () => {};
@@ -1710,6 +1685,7 @@ function bottomRows(screen, height) {
 	}
 	return cropped;
 }
+const RESIZE_SETTLE_MS = 50;
 const shouldClearTerminalForFrame = ({ isTTY, viewportRows, previousOutputHeight, nextOutputHeight, isUnmounting }) => {
 	if (!isTTY) return false;
 	const hadPreviousFrame = previousOutputHeight > 0;
@@ -1801,8 +1777,10 @@ const createInk = (options) => {
 	let lastOutputToRender = "";
 	let lastOutputHeight = 0;
 	let lastScreen;
-	let lastTerminalWidth = getWindowSize(options.stdout).columns;
-	let lastTerminalHeight = getWindowSize(options.stdout).rows;
+	const windowSize = () => capabilitiesStore.current.size;
+	let lastTerminalWidth = windowSize().columns;
+	let lastTerminalHeight = windowSize().rows;
+	let resizeSettle;
 	let fullStaticOutput = "";
 	let exitResult;
 	let unsubscribeBeforeExit;
@@ -1825,29 +1803,48 @@ const createInk = (options) => {
 	if (isSigilDev) reconciler.injectIntoDevTools();
 	if (options.patchConsole) installConsolePatch();
 	if (interactive) {
-		options.stdout.on("resize", resized);
-		unsubscribeResize = () => {
-			options.stdout.off("resize", resized);
-		};
+		let seenColumns = lastTerminalWidth;
+		let seenRows = lastTerminalHeight;
+		unsubscribeResize = capabilitiesStore.subscribe(({ size }) => {
+			if (size.columns === seenColumns && size.rows === seenRows) return;
+			seenColumns = size.columns;
+			seenRows = size.rows;
+			resized(size.source);
+		});
 	}
 	initKittyKeyboard();
 	const { promise: exitPromise, resolve: resolveExitPromise, reject: rejectExitPromise } = Promise.withResolvers();
 	exitPromise.catch(noop);
-	function resized() {
-		const currentWidth = getWindowSize(options.stdout).columns;
-		const currentHeight = getWindowSize(options.stdout).rows;
+	function resized(source) {
+		if (resizeSettle !== void 0) {
+			clearTimeout(resizeSettle);
+			resizeSettle = void 0;
+		}
+		if (source === "terminal") {
+			settleResize();
+			return;
+		}
+		resizeSettle = setTimeout(settleResize, RESIZE_SETTLE_MS);
+	}
+	function settleResize() {
+		resizeSettle = void 0;
+		if (isUnmounted || isUnmounting) return;
+		const { columns: currentWidth, rows: currentHeight } = windowSize();
 		if (currentWidth < lastTerminalWidth || currentHeight !== lastTerminalHeight) {
-			clearLiveOutput();
+			clearLiveOutput(rewrapsOnResize() ? currentWidth : void 0);
 			resetLiveOutput();
 			lastOutput = "";
 			lastOutputToRender = "";
 			lastOutputHeight = 0;
 		}
+		lastTerminalWidth = currentWidth;
+		lastTerminalHeight = currentHeight;
 		calculateLayout();
 		emitLayoutListeners(rootNode);
 		onRender();
-		lastTerminalWidth = currentWidth;
-		lastTerminalHeight = currentHeight;
+	}
+	function rewrapsOnResize() {
+		return !isWindows && capabilitiesStore.current.terminal.name !== "apple-terminal";
 	}
 	function handleAppExit(errorOrResult) {
 		if (isUnmounted || isUnmounting) return;
@@ -1872,9 +1869,9 @@ const createInk = (options) => {
 			forceRewrite: true
 		});
 	}
-	function clearLiveOutput() {
+	function clearLiveOutput(columns) {
 		if (isScreenReaderEnabled) accessiblePresenter.clear();
-		else terminal.clearFrame();
+		else terminal.clearFrame({ columns });
 	}
 	function finishLiveOutput() {
 		if (isScreenReaderEnabled) accessiblePresenter.done();
@@ -1885,7 +1882,7 @@ const createInk = (options) => {
 		else terminal.resetFrame();
 	}
 	function calculateLayout() {
-		const terminalWidth = getWindowSize(options.stdout).columns;
+		const terminalWidth = windowSize().columns;
 		rootNode.yogaNode.setWidth(terminalWidth);
 		rootNode.yogaNode.calculateLayout(void 0, void 0, Yoga.DIRECTION_LTR);
 	}
@@ -1902,6 +1899,13 @@ const createInk = (options) => {
 			}
 			return;
 		}
+		if (resizeSettle !== void 0 && !isUnmounting) {
+			if (nextRenderCommit) {
+				nextRenderCommit.resolve();
+				nextRenderCommit = void 0;
+			}
+			return;
+		}
 		if (nextRenderCommit) {
 			nextRenderCommit.resolve();
 			nextRenderCommit = void 0;
@@ -1948,7 +1952,7 @@ const createInk = (options) => {
 				if (sync) options.stdout.write(esu);
 				return;
 			}
-			const terminalWidth = getWindowSize(options.stdout).columns;
+			const terminalWidth = windowSize().columns;
 			const wrappedOutput = wrapAnsi(output, terminalWidth, {
 				trim: false,
 				hard: true
@@ -2037,6 +2041,10 @@ const createInk = (options) => {
 	function unmount(error) {
 		if (isUnmounted || isUnmounting) return;
 		isUnmounting = true;
+		if (resizeSettle !== void 0) {
+			clearTimeout(resizeSettle);
+			resizeSettle = void 0;
+		}
 		unsubscribeBeforeExit?.();
 		unsubscribeBeforeExit = void 0;
 		const { canWriteToStdout } = getWritableStreamState(options.stdout);
@@ -2221,7 +2229,7 @@ const createInk = (options) => {
 		if (!screen) return;
 		const hasStaticOutput = staticOutput !== "";
 		const isTTY = Boolean(options.stdout.isTTY);
-		const viewportRows = isTTY ? getWindowSize(options.stdout).rows : 24;
+		const viewportRows = isTTY ? windowSize().rows : 24;
 		if (isTTY && outputHeight > viewportRows) {
 			const lines = output.split("\n");
 			output = lines.slice(lines.length - viewportRows).join("\n");
@@ -2907,20 +2915,17 @@ const usePointerShape = (shape) => {
 //#region src/hooks/use-window-size.ts
 /**
 A React hook that returns the current terminal window dimensions and re-renders the component whenever the terminal is resized.
+
+Reads the capabilities store, so on terminals that send in-band size reports
+(mode 2048) the dimensions are the emulator's own, arriving after it has
+rewrapped its screen; elsewhere they are the stream's `columns`/`rows`.
 */
 const useWindowSize = () => {
-	const { stdout } = useStdout();
-	const [size, setSize] = useState(() => getWindowSize(stdout));
-	useEffect(() => {
-		const onResize = () => {
-			setSize(getWindowSize(stdout));
-		};
-		stdout.on("resize", onResize);
-		return () => {
-			stdout.off("resize", onResize);
-		};
-	}, [stdout]);
-	return size;
+	const { size } = useCapabilities();
+	return useMemo(() => ({
+		columns: size.columns,
+		rows: size.rows
+	}), [size.columns, size.rows]);
 };
 //#endregion
 //#region src/hooks/use-box-metrics.ts

package/dist/{osc-CCH7xDoS.js → osc-BFKKSqpg.js}

@@ -1,5 +1,5 @@
 import { D as cursorHide, b as OSC, j as cursorShow, x as ST } from "./sgr-BhwaWAJB.js";
-import { c as signalExit } from "./detect-BuTXtY6e.js";
+import { s as signalExit } from "./detect-B3dL4Q11.js";
 import { pathToFileURL } from "node:url";
 //#region src/ansi/cursor.ts
 let restoreRegistered = false;

package/dist/{paint-C19minOS.d.ts → paint-Cx-zC_sX.d.ts}

@@ -1,5 +1,5 @@
-import { c as TerminalAppearance } from "./detect-Bh4yGP6w.js";
-import { c as Color, d as RgbColor, t as ColorProfile } from "./color-profile-u0Nhe9Nv.js";
+import { c as TerminalAppearance } from "./detect-Db6GbKOm.js";
+import { c as Color, d as RgbColor, t as ColorProfile } from "./color-profile-CyeHnG1T.js";
 //#region src/color/paint.d.ts
 type ColorInput = Color | string;
 type InterpolationSpace = "oklab" | "lab" | "rgb" | "hsv";

package/dist/{query-vaIeGOkH.d.ts → query-BNc2B8GD.d.ts}

@@ -1,4 +1,4 @@
-import { c as TerminalAppearance, s as RgbColor, t as Capabilities } from "./detect-Bh4yGP6w.js";
+import { c as TerminalAppearance, s as RgbColor, t as Capabilities } from "./detect-Db6GbKOm.js";
 //#region src/capabilities/query.d.ts
 type PixelSize = {
   width: number;

package/dist/router.d.ts

@@ -1,4 +1,4 @@
-import { t as Props } from "./Text-BobFKi74.js";
+import { t as Props } from "./Text-DV9CuzAT.js";
 import { ReactElement, ReactNode } from "react";
 //#region src/router/history.d.ts
 /**

package/dist/router.js

@@ -1,4 +1,4 @@
-import { f as Text, n as useInput, t as useFocus } from "./use-focus-BzqAJi0n.js";
+import { f as Text, n as useInput, t as useFocus } from "./use-focus-DSV01Ulb.js";
 import { Children, Fragment, createContext, isValidElement, startTransition, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
 //#region src/router/history.ts

package/dist/{screen-BOSLQ8fF.d.ts → screen-CgC2WlVM.d.ts}

@@ -1,4 +1,4 @@
-import { i as Cell, o as CellPatch } from "./color-profile-u0Nhe9Nv.js";
+import { i as Cell, o as CellPatch } from "./color-profile-CyeHnG1T.js";
 import { n as Rect } from "./geometry-BxXOzJgo.js";
 //#region src/screen/screen.d.ts
 type Line = readonly Cell[];

package/dist/screen.d.ts

@@ -1,5 +1,5 @@
-import { _ as emptyCellStyle, a as CellContent, c as Color, d as RgbColor, f as UnderlineStyle, g as emptyCell, h as createCell, i as Cell, l as Hyperlink, m as cellsEqual, n as colorProfileFromLevel, o as CellPatch, p as cellAttributes, r as quantizeColor, s as CellStyle, t as ColorProfile, u as IndexedColor } from "./color-profile-u0Nhe9Nv.js";
+import { _ as emptyCellStyle, a as CellContent, c as Color, d as RgbColor, f as UnderlineStyle, g as emptyCell, h as createCell, i as Cell, l as Hyperlink, m as cellsEqual, n as colorProfileFromLevel, o as CellPatch, p as cellAttributes, r as quantizeColor, s as CellStyle, t as ColorProfile, u as IndexedColor } from "./color-profile-CyeHnG1T.js";
 import { n as Rect, t as Point } from "./geometry-BxXOzJgo.js";
-import { a as cellFromStyledChar, i as styledCharFromCell, n as serializeLine, o as cellsFromAnsi, r as serializeScreen, t as SerializeOptions } from "./index-DZ88EXJv.js";
-import { n as Screen, t as Line } from "./screen-BOSLQ8fF.js";
+import { a as cellFromStyledChar, i as styledCharFromCell, n as serializeLine, o as cellsFromAnsi, r as serializeScreen, t as SerializeOptions } from "./index-D48vQhhe.js";
+import { n as Screen, t as Line } from "./screen-CgC2WlVM.js";
 export { Cell, CellContent, CellPatch, CellStyle, Color, ColorProfile, Hyperlink, IndexedColor, type Line, Point, Rect, RgbColor, Screen, SerializeOptions, UnderlineStyle, cellAttributes, cellFromStyledChar, cellsEqual, cellsFromAnsi, colorProfileFromLevel, createCell, emptyCell, emptyCellStyle, quantizeColor, serializeLine, serializeScreen, styledCharFromCell };

package/dist/{session-aZr9O8h3.js → session-Cg6STjFV.js}

@@ -1,7 +1,7 @@
 import { G as pasteEnd, K as pasteStart, S as ansiEscapes } from "./sgr-BhwaWAJB.js";
-import { a as setPointerShape, c as setWorkingDirectory, i as setClipboard, l as tmuxPassthrough, n as notify, o as setTerminalProgress, s as setWindowTitle, u as cliCursor } from "./osc-CCH7xDoS.js";
-import { i as getCapabilities, t as colorState } from "./color-policy-SVj1pYTA.js";
-import { n as cellsEqual } from "./cell-_ZVhbfl0.js";
+import { a as setPointerShape, c as setWorkingDirectory, i as setClipboard, l as tmuxPassthrough, n as notify, o as setTerminalProgress, s as setWindowTitle, u as cliCursor } from "./osc-BFKKSqpg.js";
+import { i as getCapabilities, t as colorState } from "./color-policy-DlrZXC0f.js";
+import { n as cellsEqual, t as cellAttributes } from "./cell-_ZVhbfl0.js";
 import { n as serializeScreen, t as serializeLine } from "./serialize-BTkAZgw1.js";
 //#region src/cursor-position.ts
 const showCursorEscape = ansiEscapes.cursorShow;
@@ -322,13 +322,29 @@ var ScreenPresenter = class {
 	willPresent(screen, cursor, fullscreen = false, forceRewrite = false) {
 		return forceRewrite || this.#screen === void 0 || !screensEqual(this.#screen, screen) || cursorPositionChanged(cursor, this.#cursor) || fullscreen !== this.#fullscreen;
 	}
-	clear() {
-		this.#write(buildReturnToBottomPrefix(this.#cursorWasShown, this.#lineCount, this.#cursor) + ansiEscapes.eraseLines(this.#lineCount));
+	/**
+	Erases the presented frame from the cursor upward.
+	
+	`columns` is the terminal's current width. When it is narrower than the width
+	the frame was painted at, a reflowing emulator (xterm.js, Ghostty, kitty,
+	iTerm2, WezTerm, tmux, …) has already rewrapped every wider row onto several
+	physical rows before the resize event reaches us, so the erase has to cover
+	that physical footprint. Erasing only the logical row count leaves the frame's
+	top rows behind as ghosts, one more batch per resize event.
+	*/
+	clear(options = {}) {
+		this.#write(buildReturnToBottomPrefix(this.#cursorWasShown, this.#lineCount, this.#cursor) + ansiEscapes.eraseLines(this.#physicalLineCount(options.columns)));
 		this.#lineCount = 0;
 		this.#cursor = void 0;
 		this.#cursorWasShown = false;
 		this.#fullscreen = false;
 	}
+	#physicalLineCount(columns) {
+		if (this.#screen === void 0 || this.#lineCount === 0 || columns === void 0 || columns < 1) return this.#lineCount;
+		let rows = 0;
+		for (const line of this.#screen.toRows()) rows += Math.max(1, Math.ceil(contentWidth(line) / columns));
+		return rows + (this.#fullscreen ? 0 : 1);
+	}
 	reset() {
 		this.#screen = void 0;
 		this.#lineCount = 0;
@@ -353,6 +369,24 @@ var ScreenPresenter = class {
 		this.#fullscreen = fullscreen;
 	}
 };
+/**
+The columns a row occupies once written: everything up to its last visible
+cell. Trailing unstyled blanks are trimmed by the serializer and never reach
+the terminal, while styled blanks (a highlighted tab's padding) do.
+*/
+function contentWidth(line) {
+	let width = 0;
+	let end = 0;
+	for (const cell of line) {
+		width += cell.width;
+		if (!isBlank(cell)) end = width;
+	}
+	return end;
+}
+function isBlank(cell) {
+	const { style } = cell;
+	return (cell.grapheme === " " || cell.width === 0) && style.foreground === void 0 && style.background === void 0 && style.underlineColor === void 0 && style.underline === "none" && style.attributes === cellAttributes.none && cell.hyperlink === void 0;
+}
 function findFirstChangedRow(previous, next) {
 	const height = Math.max(previous.height, next.height);
 	for (let y = 0; y < height; y++) if (!rowsEqual(previous, next, y)) return y;
@@ -437,8 +471,9 @@ var TerminalSession = class {
 	willPresent(screen, options = {}) {
 		return this.#presenter.willPresent(screen, this.cursor.position, options.fullscreen, options.forceRewrite);
 	}
-	clearFrame() {
-		this.#presenter.clear();
+	/** Erases the presented frame; pass the current `columns` after a resize so the erase covers rows the emulator rewrapped. */
+	clearFrame(options = {}) {
+		this.#presenter.clear(options);
 	}
 	resetFrame() {
 		this.#presenter.reset();

package/dist/{store-CgrG9K4y.d.ts → store-C1P5fOUi.d.ts}

@@ -1,4 +1,4 @@
-import { t as Capabilities } from "./detect-Bh4yGP6w.js";
+import { t as Capabilities } from "./detect-Db6GbKOm.js";
 //#region src/stream.d.ts
 type OutputStream = NodeJS.WritableStream & {
   isTTY?: boolean;

package/dist/terminal.d.ts

@@ -1,9 +1,9 @@
 import { a as CursorShape } from "./escapes-CB_6CWOE.js";
 import { n as TerminalProgressState, t as ClipboardSelection } from "./osc-Cn0fw77g.js";
-import { i as OutputStream, t as CapabilitiesStore } from "./store-CgrG9K4y.js";
-import { t as ColorProfile } from "./color-profile-u0Nhe9Nv.js";
-import { t as ColorPolicy } from "./color-policy-BMzMwV7Q.js";
-import { n as Screen } from "./screen-BOSLQ8fF.js";
+import { i as OutputStream, t as CapabilitiesStore } from "./store-C1P5fOUi.js";
+import { t as ColorProfile } from "./color-profile-CyeHnG1T.js";
+import { t as ColorPolicy } from "./color-policy-CCxuHIdD.js";
+import { n as Screen } from "./screen-CgC2WlVM.js";
 import { t as CursorPosition } from "./cursor-position-D2LAkRG0.js";
 //#region src/input-parser.d.ts
 type InputEvent = string | {
@@ -77,7 +77,10 @@ declare class TerminalSession {
     readonly fullscreen?: boolean;
     readonly forceRewrite?: boolean;
   }): boolean;
-  clearFrame(): void;
+  /** Erases the presented frame; pass the current `columns` after a resize so the erase covers rows the emulator rewrapped. */
+  clearFrame(options?: {
+    readonly columns?: number;
+  }): void;
   resetFrame(): void;
   finishFrame(): void;
   setColorPolicy(policy: ColorPolicy): void;

package/dist/terminal.js

@@ -1,2 +1,2 @@
-import { n as TerminalInput, r as parseMouseEvent, t as TerminalSession } from "./session-aZr9O8h3.js";
+import { n as TerminalInput, r as parseMouseEvent, t as TerminalSession } from "./session-Cg6STjFV.js";
 export { TerminalInput, TerminalSession, parseMouseEvent };

package/dist/{use-focus-BzqAJi0n.js → use-focus-DSV01Ulb.js}

@@ -564,7 +564,7 @@ const detectKittySupport = (stdin, stdout, onSupported) => {
 //#endregion
 //#region package.json
 var name = "@alchemy.run/sigil";
-var version = "0.0.0-alpha.6";
+var version = "0.0.0-alpha.7";
 //#endregion
 //#region src/reconciler.ts
 if (isSigilDev) await import("./devtools-DbthxoD1.js").catch(() => {});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alchemy.run/sigil",
-  "version": "0.0.0-alpha.6",
+  "version": "0.0.0-alpha.7",
   "description": "React for CLIs. A self-contained fork of Ink with an integrated TypeScript Yoga layout engine.",
   "keywords": [
     "cli",

package/src/capabilities/detect.ts

@@ -85,8 +85,21 @@ export type Capabilities = {
   /**
 	Current terminal dimensions in cells, plus pixel geometry once the
 	terminal has answered the query.
+
+	`source` tells where the cell dimensions come from. `"pty"` is the
+	stream's own `columns`/`rows`, updated by the OS on SIGWINCH — which says
+	nothing about whether the emulator has finished rewrapping its screen.
+	`"terminal"` is the emulator's in-band size report (mode 2048), which
+	arrives in the input stream after the rewrap and so describes the screen
+	exactly as later output will find it. While the terminal reports, its
+	size wins over the stream's.
 	*/
-  size: { columns: number; rows: number; pixels: PixelGeometry | undefined };
+  size: {
+    columns: number;
+    rows: number;
+    pixels: PixelGeometry | undefined;
+    source: "pty" | "terminal";
+  };
 
   platform: NodeJS.Platform;
 
@@ -580,6 +593,7 @@ export function detectCapabilities({ stdout = process.stdout }: DetectOptions =
         ? { columns: stdout.columns, rows: stdout.rows }
         : terminalSize()),
       pixels: undefined,
+      source: "pty",
     },
     focused: undefined,
     theme: {

package/src/capabilities/store.ts

@@ -128,11 +128,17 @@ const createStore = (stdin: StoreStdin, stdout: StoreStdout): CapabilitiesStore
   let resizeSubscribers = 0;
 
   let focused: boolean | undefined;
+  // The size from the terminal's latest in-band report (mode 2048). While
+  // set it is authoritative: the report is ordered in the input stream after
+  // the emulator rewrapped, whereas the stream's `columns`/`rows` only say
+  // what the OS told the PTY, before or after the emulator caught up.
+  let reportedSize: { columns: number; rows: number } | undefined;
   let snapshot: Capabilities | undefined;
   let snapshotQuery: TerminalQueryResult | undefined;
   let snapshotColumns: number | undefined;
   let snapshotRows: number | undefined;
   let snapshotFocused: boolean | undefined;
+  let snapshotReportedSize: typeof reportedSize;
 
   const current = (): Capabilities => {
     const query = getTerminalQuery(stdout);
@@ -142,15 +148,20 @@ const createStore = (stdin: StoreStdin, stdout: StoreStdout): CapabilitiesStore
       query !== snapshotQuery ||
       columns !== snapshotColumns ||
       rows !== snapshotRows ||
-      focused !== snapshotFocused
+      focused !== snapshotFocused ||
+      reportedSize !== snapshotReportedSize
     ) {
       const detected = detectCapabilities({ stdout });
       const applied = query ? applyTerminalQuery(detected, query) : detected;
-      snapshot = focused === undefined ? applied : { ...applied, focused };
+      const sized = reportedSize
+        ? { ...applied, size: { ...applied.size, ...reportedSize, source: "terminal" as const } }
+        : applied;
+      snapshot = focused === undefined ? sized : { ...sized, focused };
       snapshotQuery = query;
       snapshotColumns = columns;
       snapshotRows = rows;
       snapshotFocused = focused;
+      snapshotReportedSize = reportedSize;
     }
 
     return snapshot;
@@ -217,6 +228,9 @@ const createStore = (stdin: StoreStdin, stdout: StoreStdout): CapabilitiesStore
       integration?.setReportFeed?.(false);
       removeExitHandler?.();
       removeExitHandler = undefined;
+      // No further reports will arrive; the stream is the only size source
+      // again and the last report would go stale on the next resize.
+      reportedSize = undefined;
     }
   };
 
@@ -255,6 +269,7 @@ const createStore = (stdin: StoreStdin, stdout: StoreStdout): CapabilitiesStore
     if (resize) {
       const [, rows, columns, pixelHeight, pixelWidth] = resize.map(Number);
       if (columns && rows) {
+        reportedSize = { columns, rows };
         patchTerminalQuery(stdout, {
           textAreaPixels:
             pixelWidth && pixelHeight ? { width: pixelWidth, height: pixelHeight } : undefined,

package/src/hooks/use-window-size.ts

@@ -1,7 +1,6 @@
-import { useState, useEffect } from "react";
+import { useMemo } from "react";
 
-import { useStdout } from "#/hooks/use-stdout.ts";
-import { getWindowSize } from "#/utils.ts";
+import { useCapabilities } from "#/hooks/use-capabilities.ts";
 
 /**
 Dimensions of the terminal window.
@@ -20,22 +19,12 @@ export type WindowSize = {
 
 /**
 A React hook that returns the current terminal window dimensions and re-renders the component whenever the terminal is resized.
+
+Reads the capabilities store, so on terminals that send in-band size reports
+(mode 2048) the dimensions are the emulator's own, arriving after it has
+rewrapped its screen; elsewhere they are the stream's `columns`/`rows`.
 */
 export const useWindowSize = (): WindowSize => {
-  const { stdout } = useStdout();
-  const [size, setSize] = useState<WindowSize>(() => getWindowSize(stdout));
-
-  useEffect(() => {
-    const onResize = () => {
-      setSize(getWindowSize(stdout));
-    };
-
-    stdout.on("resize", onResize);
-
-    return () => {
-      stdout.off("resize", onResize);
-    };
-  }, [stdout]);
-
-  return size;
+  const { size } = useCapabilities();
+  return useMemo(() => ({ columns: size.columns, rows: size.rows }), [size.columns, size.rows]);
 };

package/src/ink.tsx

@@ -33,7 +33,6 @@ import { createInlinePresenter } from "#/terminal/inline-presenter.ts";
 import { createRenderScheduler } from "#/terminal/render-scheduler.ts";
 import { TerminalSession } from "#/terminal/session.ts";
 import { type Throttled } from "#/throttle.ts";
-import { getWindowSize } from "#/utils.ts";
 import { Yoga } from "#/yoga/index.ts";
 
 const noop = () => {};
@@ -64,6 +63,11 @@ function bottomRows(screen: Screen, height: number): Screen {
   return cropped;
 }
 
+// How long the reported terminal size must hold still before a resize is
+// acted on. Window drags deliver an event per frame (~16 ms), and the
+// emulator needs a frame or so to agree with the PTY size either way.
+const RESIZE_SETTLE_MS = 50;
+
 const shouldClearTerminalForFrame = ({
   isTTY,
   viewportRows,
@@ -381,8 +385,20 @@ export const createInk = (options: Options): Ink => {
   let lastOutputToRender = "";
   let lastOutputHeight = 0;
   let lastScreen: Screen | undefined;
-  let lastTerminalWidth = getWindowSize(options.stdout).columns;
-  let lastTerminalHeight = getWindowSize(options.stdout).rows;
+  // The terminal size comes from the capabilities store: the stream's
+  // `columns`/`rows`, or — on terminals that send in-band size reports —
+  // the emulator's own figure, which is the one later output will meet.
+  const windowSize = () => capabilitiesStore.current.size;
+  let lastTerminalWidth = windowSize().columns;
+  let lastTerminalHeight = windowSize().rows;
+  // Resize events arrive in bursts (one per frame of a window drag), and the
+  // emulator's rewrap and the PTY size never update atomically — depending on
+  // the terminal app the PTY is resized before or after the screen is
+  // rewrapped. Anything written mid-burst lands on a screen whose width is
+  // not the reported one, and the rows that leaves behind can never be
+  // accounted for by a later erase. Events therefore only arm this settle
+  // timer; the frame is erased and repainted once the size has held still.
+  let resizeSettle: ReturnType<typeof setTimeout> | undefined;
 
   // This variable is used only in debug mode to store full static output
   // so that it's rerendered every time, not just new static parts, like in non-debug mode
@@ -431,11 +447,17 @@ export const createInk = (options: Options): Ink => {
   if (options.patchConsole) installConsolePatch();
 
   if (interactive) {
-    options.stdout.on("resize", resized);
-
-    unsubscribeResize = () => {
-      options.stdout.off("resize", resized);
-    };
+    // Follow the store rather than the stream's `resize` event: the store
+    // folds in the terminal's in-band size reports where available, and
+    // says which source a size came from.
+    let seenColumns = lastTerminalWidth;
+    let seenRows = lastTerminalHeight;
+    unsubscribeResize = capabilitiesStore.subscribe(({ size }) => {
+      if (size.columns === seenColumns && size.rows === seenRows) return;
+      seenColumns = size.columns;
+      seenRows = size.rows;
+      resized(size.source);
+    });
   }
 
   initKittyKeyboard();
@@ -450,9 +472,28 @@ export const createInk = (options: Options): Ink => {
 
   void exitPromise.catch(noop);
 
-  function resized(): void {
-    const currentWidth = getWindowSize(options.stdout).columns;
-    const currentHeight = getWindowSize(options.stdout).rows;
+  function resized(source: "pty" | "terminal"): void {
+    if (resizeSettle !== undefined) {
+      clearTimeout(resizeSettle);
+      resizeSettle = undefined;
+    }
+
+    // An in-band report is the emulator's own word, sent after it rewrapped
+    // and ordered with everything else in the stream, so there is nothing
+    // to wait for. A PTY size may run ahead of or behind the emulator.
+    if (source === "terminal") {
+      settleResize();
+      return;
+    }
+
+    resizeSettle = setTimeout(settleResize, RESIZE_SETTLE_MS);
+  }
+
+  function settleResize(): void {
+    resizeSettle = undefined;
+    if (isUnmounted || isUnmounting) return;
+
+    const { columns: currentWidth, rows: currentHeight } = windowSize();
 
     // A width decrease rewraps lines and any height change moves content
     // through scrollback, so the incremental render state no longer
@@ -460,11 +501,15 @@ export const createInk = (options: Options): Ink => {
     // render to be a full rewrite instead of an incremental diff that
     // would skip "unchanged" lines over stale screen content.
     if (currentWidth < lastTerminalWidth || currentHeight !== lastTerminalHeight) {
-      // Clearing erases the full previous frame line count from
-      // the cursor upward — after a height grow that also covers frame
-      // lines the emulator pulled back from scrollback, so no extra
-      // erase is needed for them.
-      clearLiveOutput();
+      // Clearing erases the full previous frame from the cursor upward —
+      // after a height grow that also covers frame lines the emulator
+      // pulled back from scrollback, so no extra erase is needed for them.
+      // The current width lets the presenter count the rows a reflowing
+      // emulator has already rewrapped after a width shrink; the logical
+      // line count alone under-erases and leaves the frame's top rows
+      // behind. Terminals that never rewrap keep the logical count, since
+      // the rewrap-aware one would erase rows above the frame there.
+      clearLiveOutput(rewrapsOnResize() ? currentWidth : undefined);
       resetLiveOutput();
       lastOutput = "";
       lastOutputToRender = "";
@@ -475,12 +520,20 @@ export const createInk = (options: Options): Ink => {
       lastOutputHeight = 0;
     }
 
+    lastTerminalWidth = currentWidth;
+    lastTerminalHeight = currentHeight;
+
     calculateLayout();
     dom.emitLayoutListeners(rootNode);
     onRender();
+  }
 
-    lastTerminalWidth = currentWidth;
-    lastTerminalHeight = currentHeight;
+  // Whether the terminal rewraps existing screen rows when its width
+  // changes. Nearly every modern emulator does (xterm.js, Ghostty, kitty,
+  // iTerm2, WezTerm, Alacritty, Windows Terminal, tmux); Apple's Terminal.app
+  // and the classic Windows console keep rows as they were written.
+  function rewrapsOnResize(): boolean {
+    return !isWindows && capabilitiesStore.current.terminal.name !== "apple-terminal";
   }
 
   function handleAppExit(errorOrResult?: unknown): void {
@@ -519,9 +572,9 @@ export const createInk = (options: Options): Ink => {
     }
   }
 
-  function clearLiveOutput(): void {
+  function clearLiveOutput(columns?: number): void {
     if (isScreenReaderEnabled) accessiblePresenter!.clear();
-    else terminal.clearFrame();
+    else terminal.clearFrame({ columns });
   }
 
   function finishLiveOutput(): void {
@@ -535,7 +588,7 @@ export const createInk = (options: Options): Ink => {
   }
 
   function calculateLayout(): void {
-    const terminalWidth = getWindowSize(options.stdout).columns;
+    const terminalWidth = windowSize().columns;
 
     rootNode.yogaNode!.setWidth(terminalWidth);
 
@@ -566,6 +619,18 @@ export const createInk = (options: Options): Ink => {
       return;
     }
 
+    // A resize burst is still settling: the emulator is rewrapping the screen
+    // under us, and the frame will be erased and repainted as a whole once it
+    // holds still. Writing now would leave rows no later erase can find.
+    if (resizeSettle !== undefined && !isUnmounting) {
+      if (nextRenderCommit) {
+        nextRenderCommit.resolve();
+        nextRenderCommit = undefined;
+      }
+
+      return;
+    }
+
     if (nextRenderCommit) {
       nextRenderCommit.resolve();
       nextRenderCommit = undefined;
@@ -642,7 +707,7 @@ export const createInk = (options: Options): Ink => {
         return;
       }
 
-      const terminalWidth = getWindowSize(options.stdout).columns;
+      const terminalWidth = windowSize().columns;
 
       const wrappedOutput = wrapAnsi(output, terminalWidth, {
         trim: false,
@@ -796,6 +861,11 @@ export const createInk = (options: Options): Ink => {
 
     isUnmounting = true;
 
+    if (resizeSettle !== undefined) {
+      clearTimeout(resizeSettle);
+      resizeSettle = undefined;
+    }
+
     unsubscribeBeforeExit?.();
     unsubscribeBeforeExit = undefined;
 
@@ -1163,7 +1233,7 @@ export const createInk = (options: Options): Ink => {
 
     // Detect fullscreen: output fills or exceeds terminal height.
     // Only apply when writing to a real TTY — piped output always gets trailing newlines.
-    const viewportRows = isTTY ? getWindowSize(options.stdout).rows : 24;
+    const viewportRows = isTTY ? windowSize().rows : 24;
 
     // Clamp the frame to the viewport, keeping its bottom rows. Rows above
     // the top margin cannot be updated or erased in place, and the

package/src/terminal/screen-presenter.ts

@@ -7,9 +7,9 @@ import {
   cursorPositionChanged,
   type CursorPosition,
 } from "#/cursor-position.ts";
-import { cellsEqual } from "#/screen/cell.ts";
+import { cellAttributes, cellsEqual, type Cell } from "#/screen/cell.ts";
 import type { ColorProfile } from "#/screen/color-profile.ts";
-import type { Screen } from "#/screen/screen.ts";
+import type { Line, Screen } from "#/screen/screen.ts";
 import { serializeLine, serializeScreen } from "#/screen/serialize.ts";
 
 type Write = (data: string) => boolean;
@@ -123,10 +123,20 @@ export class ScreenPresenter {
     );
   }
 
-  clear(): void {
+  /**
+  Erases the presented frame from the cursor upward.
+
+  `columns` is the terminal's current width. When it is narrower than the width
+  the frame was painted at, a reflowing emulator (xterm.js, Ghostty, kitty,
+  iTerm2, WezTerm, tmux, …) has already rewrapped every wider row onto several
+  physical rows before the resize event reaches us, so the erase has to cover
+  that physical footprint. Erasing only the logical row count leaves the frame's
+  top rows behind as ghosts, one more batch per resize event.
+  */
+  clear(options: { readonly columns?: number } = {}): void {
     this.#write(
       buildReturnToBottomPrefix(this.#cursorWasShown, this.#lineCount, this.#cursor) +
-        ansiEscapes.eraseLines(this.#lineCount),
+        ansiEscapes.eraseLines(this.#physicalLineCount(options.columns)),
     );
     this.#lineCount = 0;
     this.#cursor = undefined;
@@ -134,6 +144,22 @@ export class ScreenPresenter {
     this.#fullscreen = false;
   }
 
+  #physicalLineCount(columns: number | undefined): number {
+    if (
+      this.#screen === undefined ||
+      this.#lineCount === 0 ||
+      columns === undefined ||
+      columns < 1
+    ) {
+      return this.#lineCount;
+    }
+    let rows = 0;
+    for (const line of this.#screen.toRows()) {
+      rows += Math.max(1, Math.ceil(contentWidth(line) / columns));
+    }
+    return rows + (this.#fullscreen ? 0 : 1);
+  }
+
   reset(): void {
     this.#screen = undefined;
     this.#lineCount = 0;
@@ -162,6 +188,34 @@ export class ScreenPresenter {
   }
 }
 
+/**
+The columns a row occupies once written: everything up to its last visible
+cell. Trailing unstyled blanks are trimmed by the serializer and never reach
+the terminal, while styled blanks (a highlighted tab's padding) do.
+*/
+function contentWidth(line: Line): number {
+  let width = 0;
+  let end = 0;
+  for (const cell of line) {
+    width += cell.width;
+    if (!isBlank(cell)) end = width;
+  }
+  return end;
+}
+
+function isBlank(cell: Cell): boolean {
+  const { style } = cell;
+  return (
+    (cell.grapheme === " " || cell.width === 0) &&
+    style.foreground === undefined &&
+    style.background === undefined &&
+    style.underlineColor === undefined &&
+    style.underline === "none" &&
+    style.attributes === cellAttributes.none &&
+    cell.hyperlink === undefined
+  );
+}
+
 function findFirstChangedRow(previous: Screen, next: Screen): number | undefined {
   const height = Math.max(previous.height, next.height);
   for (let y = 0; y < height; y++) {

package/src/terminal/session.ts

@@ -140,8 +140,9 @@ export class TerminalSession {
     );
   }
 
-  clearFrame(): void {
-    this.#presenter.clear();
+  /** Erases the presented frame; pass the current `columns` after a resize so the erase covers rows the emulator rewrapped. */
+  clearFrame(options: { readonly columns?: number } = {}): void {
+    this.#presenter.clear(options);
   }
 
   resetFrame(): void {

package/src/testing/terminal.ts

@@ -100,7 +100,13 @@ export type TerminalApp = {
 	*/
   type: (text: string) => void;
 
-  resize: (columns: number, rows: number) => void;
+  /**
+	Resizes the PTY and the emulator. Real terminal apps never do both at
+	once: `emulatorLag` (ms) delays the emulator's rewrap behind the PTY
+	resize, simulating an app that reports the new size to the process
+	before its screen has been rewrapped.
+	*/
+  resize: (columns: number, rows: number, options?: { readonly emulatorLag?: number }) => void;
 
   /**
 	Flips the emulated OS color scheme (Ghostty engine only) — the app
@@ -306,9 +312,15 @@ export const launchTerminal = async (
     type: (text) => {
       child.write(text);
     },
-    resize: (nextColumns, nextRows) => {
+    resize: (nextColumns, nextRows, options = {}) => {
       child.resize(nextColumns, nextRows);
-      emulator.resize(nextColumns, nextRows);
+      if (options.emulatorLag === undefined) {
+        emulator.resize(nextColumns, nextRows);
+        return;
+      }
+      setTimeout(() => {
+        if (!closed) emulator.resize(nextColumns, nextRows);
+      }, options.emulatorLag);
     },
     setColorScheme: (scheme) => {
       if (!emulator.setColorScheme) {

package/src/utils.ts

@@ -1,40 +0,0 @@
-import type { OutputStream } from "#/stream.ts";
-import { terminalSize } from "#/terminal-size.ts";
-
-const resolveDimension = (
-  value: number | undefined,
-  fallback: number | undefined,
-  defaultValue: number,
-): number => {
-  if (value !== undefined && value > 0) {
-    return value;
-  }
-
-  if (fallback !== undefined && fallback > 0) {
-    return fallback;
-  }
-
-  return defaultValue;
-};
-
-/**
-Get the effective terminal dimensions from the given stdout stream.
-
-Falls back to `terminal-size` for columns in piped processes where `stdout.columns` is 0, and uses standard defaults (80×24) when dimensions cannot be determined.
-*/
-export const getWindowSize = (stdout: OutputStream): { columns: number; rows: number } => {
-  // `stdout.columns`/`rows` can be 0 or undefined in non-TTY environments.
-  const columns = stdout.columns ?? 0;
-  const rows = stdout.rows ?? 0;
-
-  if (columns && rows) {
-    return { columns, rows };
-  }
-
-  const fallbackSize = terminalSize();
-
-  return {
-    columns: resolveDimension(columns, fallbackSize.columns, 80),
-    rows: resolveDimension(rows, fallbackSize.rows, 24),
-  };
-};