@swifttui/web 0.0.14 → 0.0.16

package/dist/src/WebHostSceneRuntime.js

@@ -0,0 +1,651 @@
+import { applyWebHostTerminalStyle, normalizeWebHostTerminalStyle, webTUITerminalBackgroundColor } from "./WebHostTerminalStyle.js";
+import { encodeKeyInputMessage, encodeMouseInputMessage, encodePasteInputMessage } from "./WebHostSurfaceTransport.js";
+import { canRenderBoxDrawing, drawBoxDrawing } from "./BoxDrawingRenderer.js";
+import { AccessibilityTreeMounter } from "./AccessibilityTree.js";
+//#region src/WebHostSceneRuntime.ts
+var WebHostSceneRuntime = class {
+	descriptor;
+	element;
+	terminalMount;
+	bridge;
+	onInput;
+	onFrameDiagnostic;
+	synchronizeAccessibilityFocus;
+	wheelMode;
+	imageCache = /* @__PURE__ */ new Map();
+	currentStyle;
+	canvas;
+	accessibilityTree;
+	diagnosticText;
+	resizeObserver;
+	detachInputHandlers;
+	currentFrame;
+	columns = 80;
+	rows = 24;
+	cellWidth = 8;
+	cellHeight = 18;
+	activePointerButton = "primary";
+	hasCapturedPointer = false;
+	lastSentResize;
+	isVisible = false;
+	constructor(options) {
+		this.descriptor = options.descriptor;
+		this.currentStyle = normalizeWebHostTerminalStyle(options.style);
+		this.bridge = options.bridge;
+		this.onInput = options.onInput;
+		this.onFrameDiagnostic = options.onFrameDiagnostic;
+		this.synchronizeAccessibilityFocus = options.synchronizeAccessibilityFocus ?? true;
+		this.wheelMode = options.wheelMode ?? (options.captureWheelInput === false ? "passive" : "capture");
+		this.element = document.createElement("section");
+		this.element.className = "webhost-scene";
+		this.element.dataset.sceneId = options.descriptor.id;
+		this.element.hidden = true;
+		const header = document.createElement("div");
+		header.className = "webhost-scene__header";
+		header.textContent = options.descriptor.title ?? options.descriptor.id;
+		this.terminalMount = document.createElement("div");
+		this.terminalMount.className = "webhost-scene__terminal";
+		this.terminalMount.tabIndex = 0;
+		this.element.append(header, this.terminalMount);
+		options.mount.appendChild(this.element);
+		this.applyVisibility();
+	}
+	async mount() {
+		if (this.canvas) return;
+		const canvas = document.createElement("canvas");
+		canvas.className = "webhost-scene__surface";
+		canvas.setAttribute("aria-hidden", "true");
+		this.canvas = canvas;
+		this.accessibilityTree = new AccessibilityTreeMounter();
+		this.terminalMount.replaceChildren(canvas, this.accessibilityTree.element, this.accessibilityTree.announcerElement);
+		this.installInputHandlers();
+		this.installResizeObserver();
+		this.bridge?.bindOutput({
+			presentSurface: (frame) => this.presentSurface(frame),
+			writeClipboard: (text) => this.writeClipboard(text),
+			notifyRuntimeIssue: (issue) => this.notifyRuntimeIssue(issue),
+			recordFrameDiagnostic: (diagnostic) => this.recordFrameDiagnostic(diagnostic),
+			writeOutput: (text) => this.writeOutput(text),
+			writeError: (text) => this.writeOutput(text)
+		});
+		this.applyStyle(this.currentStyle);
+		this.measureCells();
+		this.resizeToMount();
+		this.draw();
+		this.syncAccessibilityTree();
+	}
+	setVisible(visible) {
+		this.isVisible = visible;
+		this.applyVisibility();
+		if (visible) {
+			this.resizeToMount();
+			if (this.synchronizeAccessibilityFocus) this.terminalMount.focus?.({ preventScroll: true });
+		}
+	}
+	setStyle(style) {
+		this.currentStyle = normalizeWebHostTerminalStyle(style);
+		this.applyStyle(this.currentStyle);
+		this.bridge?.updateRenderStyle(this.currentStyle);
+		this.measureCells();
+		this.resizeToMount();
+		this.draw();
+		this.syncAccessibilityTree();
+	}
+	resize(columns, rows) {
+		this.columns = Math.max(1, Math.round(columns));
+		this.rows = Math.max(1, Math.round(rows));
+		this.resizeCanvas();
+		this.draw();
+		this.syncAccessibilityTree();
+	}
+	writeOutput(text) {
+		if (!this.diagnosticText) {
+			const diagnosticText = document.createElement("pre");
+			diagnosticText.className = "webhost-scene__diagnostic";
+			this.diagnosticText = diagnosticText;
+			this.terminalMount.appendChild(diagnosticText);
+		}
+		this.diagnosticText.textContent = `${this.diagnosticText.textContent ?? ""}${text}`;
+	}
+	notifyRuntimeIssue(issue) {
+		console.log(issue.description);
+	}
+	recordFrameDiagnostic(diagnostic) {
+		this.onFrameDiagnostic?.(diagnostic);
+	}
+	async writeClipboard(text) {
+		const clipboard = globalThis.navigator?.clipboard;
+		if (!clipboard?.writeText) return;
+		try {
+			await clipboard.writeText(text);
+		} catch {}
+	}
+	sendInput(chunk) {
+		this.onInput(chunk);
+	}
+	dispose() {
+		this.detachInputHandlers?.();
+		this.resizeObserver?.disconnect();
+		this.element.remove();
+	}
+	presentSurface(frame) {
+		const previousFrame = this.currentFrame;
+		this.currentFrame = frame;
+		this.columns = Math.max(1, Math.round(frame.width));
+		this.rows = Math.max(1, Math.round(frame.height));
+		const resized = this.resizeCanvas();
+		this.draw(previousFrame && !resized ? frame.damage : void 0);
+		this.syncAccessibilityTree();
+	}
+	applyStyle(style) {
+		applyWebHostTerminalStyle(this.element, style);
+		this.element.style.padding = "0.75rem";
+		this.element.style.borderRadius = "16px";
+		this.element.style.boxShadow = "0 20px 50px rgba(0, 0, 0, 0.28)";
+		this.element.style.overflow = "hidden";
+		this.element.style.gap = "0.5rem";
+		this.element.style.gridTemplateRows = "auto 1fr";
+		this.terminalMount.style.position = "relative";
+		this.terminalMount.style.overflow = "hidden";
+		this.terminalMount.style.overscrollBehavior = "contain";
+		this.terminalMount.style.outline = "none";
+		this.terminalMount.style.background = webTUITerminalBackgroundColor(this.currentStyle);
+		this.terminalMount.style.minHeight = `${this.cellHeight * 8}px`;
+		if (this.canvas) {
+			this.canvas.style.display = "block";
+			this.canvas.style.width = "100%";
+			this.canvas.style.height = "100%";
+		}
+	}
+	applyVisibility() {
+		this.element.hidden = !this.isVisible;
+		this.element.style.setProperty("display", this.isVisible ? "grid" : "none", "important");
+	}
+	installResizeObserver() {
+		if (typeof ResizeObserver === "undefined") return;
+		this.resizeObserver = new ResizeObserver(() => {
+			this.resizeToMount();
+		});
+		this.resizeObserver.observe(this.terminalMount);
+	}
+	installInputHandlers() {
+		const handleKeyDown = (event) => {
+			if (event.metaKey || event.isComposing) return;
+			const key = keyInputFromKeyboardEvent(event);
+			if (!key) return;
+			this.onInput(encodeKeyInputMessage({
+				...key,
+				modifiers: modifierMask(event)
+			}));
+			event.preventDefault();
+		};
+		const handlePaste = (event) => {
+			const text = event.clipboardData?.getData("text/plain") ?? "";
+			if (!text) return;
+			this.onInput(encodePasteInputMessage(text));
+			event.preventDefault();
+		};
+		const handlePointerDown = (event) => {
+			const location = this.cellLocation(event);
+			if (!location) return;
+			const button = pointerButton(event.button);
+			this.activePointerButton = button;
+			this.hasCapturedPointer = true;
+			this.terminalMount.focus?.({ preventScroll: true });
+			this.terminalMount.setPointerCapture?.(event.pointerId);
+			this.onInput(encodeMouseInputMessage({
+				kind: "down",
+				x: location.x,
+				y: location.y,
+				button,
+				modifiers: modifierMask(event)
+			}));
+			event.preventDefault();
+		};
+		const handlePointerUp = (event) => {
+			const location = this.hasCapturedPointer ? this.rawCellLocation(event) : this.cellLocation(event);
+			this.terminalMount.releasePointerCapture?.(event.pointerId);
+			this.hasCapturedPointer = false;
+			if (!location) return;
+			this.onInput(encodeMouseInputMessage({
+				kind: "up",
+				x: location.x,
+				y: location.y,
+				button: pointerButton(event.button) ?? this.activePointerButton,
+				modifiers: modifierMask(event)
+			}));
+			event.preventDefault();
+		};
+		const handlePointerMove = (event) => {
+			const location = event.buttons && this.hasCapturedPointer ? this.rawCellLocation(event) : this.cellLocation(event);
+			if (!location) return;
+			this.onInput(encodeMouseInputMessage({
+				kind: event.buttons ? "dragged" : "moved",
+				x: location.x,
+				y: location.y,
+				button: this.activePointerButton,
+				modifiers: modifierMask(event)
+			}));
+		};
+		const handleWheel = (event) => {
+			if (this.wheelMode === "passive") return;
+			const location = this.cellLocation(event);
+			if (!location) return;
+			if (this.wheelMode === "chain" && !this.wheelTargetCanScroll(location, event.deltaX, event.deltaY)) return;
+			this.onInput(encodeMouseInputMessage({
+				kind: "scrolled",
+				x: location.x,
+				y: location.y,
+				deltaX: normalizedWheelDelta(event.deltaX),
+				deltaY: normalizedWheelDelta(event.deltaY),
+				modifiers: modifierMask(event)
+			}));
+			event.preventDefault();
+		};
+		this.terminalMount.addEventListener("keydown", handleKeyDown);
+		this.terminalMount.addEventListener("paste", handlePaste);
+		this.terminalMount.addEventListener("pointerdown", handlePointerDown);
+		this.terminalMount.addEventListener("pointerup", handlePointerUp);
+		this.terminalMount.addEventListener("pointermove", handlePointerMove);
+		this.terminalMount.addEventListener("wheel", handleWheel, { passive: false });
+		this.detachInputHandlers = () => {
+			this.terminalMount.removeEventListener("keydown", handleKeyDown);
+			this.terminalMount.removeEventListener("paste", handlePaste);
+			this.terminalMount.removeEventListener("pointerdown", handlePointerDown);
+			this.terminalMount.removeEventListener("pointerup", handlePointerUp);
+			this.terminalMount.removeEventListener("pointermove", handlePointerMove);
+			this.terminalMount.removeEventListener("wheel", handleWheel);
+		};
+	}
+	resizeToMount() {
+		this.measureCells();
+		const rect = this.terminalMount.getBoundingClientRect?.();
+		const width = rect?.width && rect.width > 0 ? rect.width : this.columns * this.cellWidth;
+		const height = rect?.height && rect.height > 0 ? rect.height : this.rows * this.cellHeight;
+		const nextColumns = Math.max(1, Math.floor(width / this.cellWidth));
+		const nextRows = Math.max(1, Math.floor(height / this.cellHeight));
+		this.columns = nextColumns;
+		this.rows = nextRows;
+		this.sendResizeIfNeeded();
+		this.resizeCanvas();
+	}
+	sendResizeIfNeeded() {
+		const current = {
+			columns: this.columns,
+			rows: this.rows,
+			cellWidth: this.cellWidth,
+			cellHeight: this.cellHeight
+		};
+		if (this.lastSentResize && this.lastSentResize.columns === current.columns && this.lastSentResize.rows === current.rows && this.lastSentResize.cellWidth === current.cellWidth && this.lastSentResize.cellHeight === current.cellHeight) return;
+		this.lastSentResize = current;
+		this.bridge?.resize(current.columns, current.rows, current.cellWidth, current.cellHeight);
+	}
+	resizeCanvas() {
+		if (!this.canvas) return false;
+		const cssWidth = Math.max(1, this.columns * this.cellWidth);
+		const cssHeight = Math.max(1, this.rows * this.cellHeight);
+		const scale = globalThis.window?.devicePixelRatio || 1;
+		const width = Math.ceil(cssWidth * scale);
+		const height = Math.ceil(cssHeight * scale);
+		const styleWidth = `${cssWidth}px`;
+		const styleHeight = `${cssHeight}px`;
+		if (this.canvas.width === width && this.canvas.height === height && this.canvas.style.width === styleWidth && this.canvas.style.height === styleHeight) return false;
+		this.canvas.width = width;
+		this.canvas.height = height;
+		this.canvas.style.width = styleWidth;
+		this.canvas.style.height = styleHeight;
+		return true;
+	}
+	measureCells() {
+		const context = (this.canvas ?? document.createElement("canvas")).getContext?.("2d");
+		if (!context) {
+			this.cellWidth = Math.max(1, Math.round(this.currentStyle.fontSize * .62));
+			this.cellHeight = Math.max(1, Math.round(this.currentStyle.fontSize * 1.35));
+			return;
+		}
+		context.font = this.fontForStyle();
+		this.cellWidth = Math.max(1, Math.ceil(context.measureText("W").width));
+		this.cellHeight = Math.max(1, Math.ceil(this.currentStyle.fontSize * 1.35));
+	}
+	draw(damage) {
+		const canvas = this.canvas;
+		const context = canvas?.getContext("2d");
+		if (!canvas || !context) return;
+		const frame = this.currentFrame;
+		const dirtyRegion = frame ? this.dirtyRegionForDamage(damage, frame) : void 0;
+		if (dirtyRegion?.rects.length === 0) return;
+		const scale = globalThis.window?.devicePixelRatio || 1;
+		context.setTransform(scale, 0, 0, scale, 0, 0);
+		context.textBaseline = "alphabetic";
+		context.fillStyle = webTUITerminalBackgroundColor(this.currentStyle);
+		if (dirtyRegion) for (const rect of dirtyRegion.rects) {
+			context.clearRect(rect.x, rect.y, rect.width, rect.height);
+			context.fillRect(rect.x, rect.y, rect.width, rect.height);
+		}
+		else {
+			context.clearRect(0, 0, canvas.width / scale, canvas.height / scale);
+			context.fillRect(0, 0, this.columns * this.cellWidth, this.rows * this.cellHeight);
+		}
+		if (!frame) return;
+		this.drawRows(context, frame, dirtyRegion);
+		this.drawImages(context, frame.images ?? [], dirtyRegion);
+	}
+	drawRows(context, frame, dirtyRegion) {
+		if (dirtyRegion) {
+			for (const [y, ranges] of dirtyRegion.rows) {
+				const row = frame.rows[y] ?? [];
+				this.drawRow(context, frame, row, y, ranges);
+			}
+			return;
+		}
+		for (let y = 0; y < frame.rows.length; y += 1) {
+			const row = frame.rows[y] ?? [];
+			this.drawRow(context, frame, row, y);
+		}
+	}
+	drawRow(context, frame, row, y, ranges) {
+		for (const cell of row) {
+			const [x, text, span, styleIndex] = cell;
+			if (ranges !== void 0 && !cellIntersectsRanges(x, span, ranges)) continue;
+			const style = frame.styles[styleIndex] ?? void 0;
+			this.drawCell(context, x, y, text, span, style);
+		}
+	}
+	syncAccessibilityTree() {
+		const tree = this.accessibilityTree;
+		if (!tree || !this.currentFrame) return;
+		tree.present(this.currentFrame.accessibilityTree ?? [], {
+			cellWidth: this.cellWidth,
+			cellHeight: this.cellHeight
+		}, this.currentFrame.accessibilityAnnouncements ?? [], { synchronizeFocus: this.synchronizeAccessibilityFocus });
+	}
+	drawImages(context, images, dirtyRegion) {
+		for (const image of images) this.drawImage(context, image, dirtyRegion);
+	}
+	drawImage(context, image, dirtyRegion) {
+		const decodedImage = this.cachedImage(image);
+		if (!decodedImage) return;
+		const [boundsX, boundsY, boundsWidth, boundsHeight] = image.bounds;
+		const [clipX, clipY, clipWidth, clipHeight] = image.visibleBounds;
+		if (boundsWidth <= 0 || boundsHeight <= 0 || clipWidth <= 0 || clipHeight <= 0) return;
+		if (dirtyRegion && !dirtyRegionIntersectsCellRect(dirtyRegion, clipX, clipY, clipWidth, clipHeight)) return;
+		context.save();
+		context.beginPath();
+		context.rect(clipX * this.cellWidth, clipY * this.cellHeight, clipWidth * this.cellWidth, clipHeight * this.cellHeight);
+		context.clip();
+		context.drawImage(decodedImage, boundsX * this.cellWidth, boundsY * this.cellHeight, boundsWidth * this.cellWidth, boundsHeight * this.cellHeight);
+		context.restore();
+	}
+	cachedImage(image) {
+		const cached = this.imageCache.get(image.id);
+		if (cached?.image) return cached.image;
+		if (!cached?.promise && image.dataBase64) {
+			const promise = decodeImage(image.dataBase64, image.format);
+			this.imageCache.set(image.id, { promise });
+			promise.then((decodedImage) => {
+				if (this.imageCache.get(image.id)?.promise !== promise) return;
+				this.imageCache.set(image.id, { image: decodedImage });
+				this.draw();
+			}).catch(() => {
+				this.imageCache.delete(image.id);
+			});
+		}
+	}
+	drawCell(context, x, y, text, span, style) {
+		const rectX = x * this.cellWidth;
+		const rectY = y * this.cellHeight;
+		const width = Math.max(1, span) * this.cellWidth;
+		const background = resolvedBackground(style, this.currentStyle);
+		const foreground = resolvedForeground(style, this.currentStyle);
+		const opacity = style?.opacity ?? 1;
+		if (background) {
+			context.globalAlpha = opacity;
+			context.fillStyle = background;
+			context.fillRect(rectX, rectY, width, this.cellHeight);
+		}
+		if (text !== " ") {
+			context.globalAlpha = opacity;
+			context.fillStyle = foreground;
+			context.strokeStyle = foreground;
+			if (!canRenderBoxDrawing(text) || !drawBoxDrawing(context, text, {
+				x: rectX,
+				y: rectY,
+				width,
+				height: this.cellHeight
+			})) {
+				context.font = this.fontForStyle(style);
+				context.fillText(text, rectX, rectY + Math.floor((this.cellHeight + this.currentStyle.fontSize) / 2) - 2);
+			}
+		}
+		this.drawTextLine(context, rectX, rectY, width, style?.underline, "underline", foreground);
+		this.drawTextLine(context, rectX, rectY, width, style?.strikethrough, "strike", foreground);
+		context.globalAlpha = 1;
+	}
+	dirtyRegionForDamage(damage, frame) {
+		if (!damage || damage.requiresFullTextRepaint || damage.requiresFullGraphicsReplay) return;
+		const rects = [];
+		const rows = /* @__PURE__ */ new Map();
+		for (const [row, ranges] of damage.textRows) {
+			if (row < 0 || row >= frame.height) continue;
+			if (ranges.length === 0) {
+				rects.push(this.cellRect(0, row, frame.width));
+				rows.set(row, "full");
+				continue;
+			}
+			const rowRanges = rows.get(row) === "full" ? [] : [...rows.get(row) ?? []];
+			for (const [start, end] of ranges) {
+				const lowerBound = Math.max(0, Math.min(frame.width, Math.floor(start)));
+				const upperBound = Math.max(lowerBound, Math.min(frame.width, Math.ceil(end)));
+				if (lowerBound >= upperBound) continue;
+				rects.push(this.cellRect(lowerBound, row, upperBound - lowerBound));
+				rowRanges.push({
+					start: lowerBound,
+					end: upperBound
+				});
+			}
+			if (rows.get(row) !== "full" && rowRanges.length > 0) rows.set(row, normalizeCellRanges(rowRanges));
+		}
+		return {
+			rects,
+			rows
+		};
+	}
+	cellRect(x, y, span) {
+		return {
+			x: x * this.cellWidth,
+			y: y * this.cellHeight,
+			width: Math.max(1, span) * this.cellWidth,
+			height: this.cellHeight
+		};
+	}
+	drawTextLine(context, x, y, width, line, placement, fallbackColor) {
+		if (!line) return;
+		context.strokeStyle = line.color ?? fallbackColor;
+		context.lineWidth = line.pattern === "double" ? 2 : 1;
+		if (line.pattern === "dot") context.setLineDash([1, 3]);
+		else if (line.pattern === "dash") context.setLineDash([4, 3]);
+		else context.setLineDash([]);
+		const lineY = placement === "underline" ? y + this.cellHeight - 2 : y + Math.floor(this.cellHeight / 2);
+		context.beginPath();
+		context.moveTo(x, lineY);
+		context.lineTo(x + width, lineY);
+		context.stroke();
+		context.setLineDash([]);
+	}
+	fontForStyle(style) {
+		const emphasis = style?.em ?? 0;
+		return `${(emphasis & 2) !== 0 ? "italic " : ""}${(emphasis & 1) !== 0 ? "700 " : ""}${this.currentStyle.fontSize}px ${this.currentStyle.fontFamily}`;
+	}
+	/**
+	* Whether any scrollable region under `location` can still scroll in the
+	* wheel's direction. Mirrors the Swift host's scroll hit-test: a region
+	* qualifies when its viewport contains the cell AND it has remaining headroom
+	* in the delta's direction. Used by "chain" wheel mode to decide capture vs.
+	* fall-through. With no published `scrollRegions`, nothing can scroll, so the
+	* wheel chains to the page (a scene with no ScrollView stays fully passive).
+	*/
+	wheelTargetCanScroll(location, deltaX, deltaY) {
+		const regions = this.currentFrame?.scrollRegions;
+		if (!regions || regions.length === 0) return false;
+		const cellX = Math.floor(location.x);
+		const cellY = Math.floor(location.y);
+		for (const region of regions) {
+			const [rx, ry, rw, rh] = region.rect;
+			if (cellX < rx || cellY < ry || cellX >= rx + rw || cellY >= ry + rh) continue;
+			if (regionCanScrollInDirection(region, deltaX, deltaY)) return true;
+		}
+		return false;
+	}
+	cellLocation(event) {
+		const location = this.rawCellLocation(event);
+		if (!location) return;
+		const cellX = Math.floor(location.x);
+		const cellY = Math.floor(location.y);
+		if (cellX < 0 || cellY < 0 || cellX >= this.columns || cellY >= this.rows) return;
+		return location;
+	}
+	rawCellLocation(event) {
+		const rect = this.canvas?.getBoundingClientRect?.() ?? this.terminalMount.getBoundingClientRect?.();
+		if (!rect) return;
+		return {
+			x: (event.clientX - rect.left) / this.cellWidth,
+			y: (event.clientY - rect.top) / this.cellHeight
+		};
+	}
+};
+async function decodeImage(dataBase64, format) {
+	const bytes = decodeBase64Bytes(dataBase64);
+	const blob = new Blob([bytes], { type: `image/${format}` });
+	if (typeof createImageBitmap === "function") return createImageBitmap(blob);
+	return new Promise((resolve, reject) => {
+		const image = new Image();
+		const url = URL.createObjectURL(blob);
+		image.onload = () => {
+			URL.revokeObjectURL(url);
+			resolve(image);
+		};
+		image.onerror = () => {
+			URL.revokeObjectURL(url);
+			reject(/* @__PURE__ */ new Error(`Failed to decode ${format} image`));
+		};
+		image.src = url;
+	});
+}
+function decodeBase64Bytes(value) {
+	if (typeof atob === "function") {
+		const binary = atob(value);
+		const bytes = new Uint8Array(binary.length);
+		for (let index = 0; index < binary.length; index += 1) bytes[index] = binary.charCodeAt(index);
+		return bytes;
+	}
+	return new Uint8Array(Buffer.from(value, "base64"));
+}
+function keyInputFromKeyboardEvent(event) {
+	switch (event.key) {
+		case "Enter": return { key: "return" };
+		case " ": return { key: "space" };
+		case "Tab": return { key: "tab" };
+		case "ArrowLeft": return { key: "arrowLeft" };
+		case "ArrowRight": return { key: "arrowRight" };
+		case "ArrowUp": return { key: "arrowUp" };
+		case "ArrowDown": return { key: "arrowDown" };
+		case "Backspace": return { key: "backspace" };
+		case "Escape": return { key: "escape" };
+		case "Home": return { key: "home" };
+		case "End": return { key: "end" };
+		default: {
+			const characters = Array.from(event.key);
+			if (characters.length !== 1) return;
+			return {
+				key: "character",
+				character: characters[0]
+			};
+		}
+	}
+}
+function pointerButton(button) {
+	switch (button) {
+		case 1: return "middle";
+		case 2: return "secondary";
+		default: return "primary";
+	}
+}
+function modifierMask(event) {
+	let mask = 0;
+	if (event.shiftKey) mask |= 1;
+	if (event.altKey) mask |= 2;
+	if (event.ctrlKey) mask |= 4;
+	return mask;
+}
+function normalizedWheelDelta(delta) {
+	if (delta > 0) return 1;
+	if (delta < 0) return -1;
+	return 0;
+}
+/**
+* Whether a published scroll region has remaining headroom in the wheel's
+* direction, recomputing the per-direction extent from offset/content/viewport.
+* Mirrors SwiftTUI's clamp (`min(max(0, offset), max(0, content - viewport))`)
+* so the host and the app agree on "at edge". Wheel sign convention matches the
+* app: `deltaY > 0` scrolls down (offset grows toward the content bottom).
+* Diagonal wheels qualify if either axis has headroom.
+*/
+function regionCanScrollInDirection(region, deltaX, deltaY) {
+	const [, , viewportWidth, viewportHeight] = region.rect;
+	const [offsetX, offsetY] = region.offset;
+	const [contentWidth, contentHeight] = region.content;
+	const maxX = Math.max(0, contentWidth - viewportWidth);
+	const maxY = Math.max(0, contentHeight - viewportHeight);
+	const clampedX = Math.min(Math.max(0, offsetX), maxX);
+	const clampedY = Math.min(Math.max(0, offsetY), maxY);
+	if (deltaY > 0 && clampedY < maxY) return true;
+	if (deltaY < 0 && clampedY > 0) return true;
+	if (deltaX > 0 && clampedX < maxX) return true;
+	if (deltaX < 0 && clampedX > 0) return true;
+	return false;
+}
+function normalizeCellRanges(ranges) {
+	const sorted = ranges.filter((range) => range.end > range.start).sort((lhs, rhs) => lhs.start - rhs.start || lhs.end - rhs.end);
+	const normalized = [];
+	for (const range of sorted) {
+		const previous = normalized[normalized.length - 1];
+		if (previous && range.start <= previous.end) {
+			previous.end = Math.max(previous.end, range.end);
+			continue;
+		}
+		normalized.push({ ...range });
+	}
+	return normalized;
+}
+function cellIntersectsRanges(x, span, ranges) {
+	if (ranges === "full") return true;
+	const start = Math.floor(x);
+	const end = start + Math.max(1, Math.ceil(span));
+	return ranges.some((range) => start < range.end && end > range.start);
+}
+function dirtyRegionIntersectsCellRect(region, x, y, width, height) {
+	const startRow = Math.max(0, Math.floor(y));
+	const endRow = Math.max(startRow, Math.ceil(y + height));
+	const rectRange = {
+		start: Math.floor(x),
+		end: Math.floor(x) + Math.max(1, Math.ceil(width))
+	};
+	for (let row = startRow; row < endRow; row += 1) {
+		const ranges = region.rows.get(row);
+		if (!ranges) continue;
+		if (cellIntersectsRanges(rectRange.start, rectRange.end - rectRange.start, ranges)) return true;
+	}
+	return false;
+}
+function resolvedForeground(style, terminalStyle) {
+	if ((style?.em ?? 0) & 16) return style?.bg ?? terminalStyle.theme.background;
+	return style?.fg ?? terminalStyle.theme.foreground;
+}
+function resolvedBackground(style, terminalStyle) {
+	if ((style?.em ?? 0) & 16) return style?.fg ?? terminalStyle.theme.foreground;
+	return style?.bg;
+}
+//#endregion
+export { WebHostSceneRuntime };
+
+//# sourceMappingURL=WebHostSceneRuntime.js.map