@swifttui/web 0.3.8 → 0.4.1

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import { ResolvedWebHostTerminalPalette, ResolvedWebHostTerminalStyle, WebHostANSIColors, WebHostTerminalAppearance, WebHostTerminalCursorStyle, WebHostTerminalPalette, WebHostTerminalRenderStyle, WebHostTerminalStyle, WebHostTerminalTheme, applyWebHostTerminalStyle, decodeWebHostTerminalRenderStyleBase64, encodeWebHostTerminalRenderStyleBase64, mergeWebHostTerminalStyle, normalizeWebHostTerminalStyle, resolveWebHostTerminalRenderStyle, webTUITerminalBackgroundColor } from "./src/WebHostTerminalStyle.js";
-import { SUPPORTED_SURFACE_VERSION, WebHostAccessibilityAnnouncement, WebHostAccessibilityLiveRegion, WebHostAccessibilityNode, WebHostAccessibilityPoint, WebHostFocusPresentation, WebHostFocusSemantics, WebHostFrameDiagnosticRecord, WebHostKeyInput, WebHostMouseInput, WebHostOutputDecoder, WebHostOutputRecord, WebHostOutputSink, WebHostRuntimeIssue, WebHostScrollRegion, WebHostSurfaceCell, WebHostSurfaceDamage, WebHostSurfaceDamageRange, WebHostSurfaceDamageTextRow, WebHostSurfaceDeltaFrame, WebHostSurfaceDeltaRow, WebHostSurfaceFrame, WebHostSurfaceImage, WebHostSurfaceImageFormat, WebHostSurfaceLineStyle, WebHostSurfaceLinkRow, WebHostSurfaceLinkRun, WebHostSurfaceRect, WebHostSurfaceSize, WebHostSurfaceStyle, encodeCapabilitiesControlMessage, encodeKeyInputMessage, encodeMouseInputMessage, encodePasteInputMessage, encodeRenderStyleControlMessage, encodeResizeControlMessage } from "./src/WebHostSurfaceTransport.js";
+import { SUPPORTED_SURFACE_VERSION, WebHostAccessibilityAnnouncement, WebHostAccessibilityLiveRegion, WebHostAccessibilityNode, WebHostAccessibilityPoint, WebHostFocusPresentation, WebHostFocusSemantics, WebHostFrameDiagnosticRecord, WebHostKeyInput, WebHostMouseInput, WebHostOutputDecoder, WebHostOutputRecord, WebHostOutputSink, WebHostResyncRequest, WebHostRuntimeIssue, WebHostScrollRegion, WebHostSurfaceCell, WebHostSurfaceDamage, WebHostSurfaceDamageRange, WebHostSurfaceDamageTextRow, WebHostSurfaceDeltaFrame, WebHostSurfaceDeltaRow, WebHostSurfaceFrame, WebHostSurfaceImage, WebHostSurfaceImageFormat, WebHostSurfaceLineStyle, WebHostSurfaceLinkRow, WebHostSurfaceLinkRun, WebHostSurfaceRect, WebHostSurfaceSize, WebHostSurfaceStyle, encodeCapabilitiesControlMessage, encodeKeyInputMessage, encodeMouseInputMessage, encodePasteInputMessage, encodeRenderStyleControlMessage, encodeResizeControlMessage, encodeResyncControlMessage } from "./src/WebHostSurfaceTransport.js";
 import { SurfaceMetrics, WebHostSurfacePainter, WebHostSurfaceRendererKind, resolvedSurfaceBackground, resolvedSurfaceForeground } from "./src/SurfaceRenderer.js";
 import { WebHostSceneDescriptor, WebHostSceneManifest, WebHostSceneManifestSource, loadWebHostSceneManifest, normalizeWebHostSceneManifest, webTUISceneManifestFromDescriptors, webTUISceneManifestToJSON } from "./src/WebHostSceneManifest.js";
 import { WebHostSceneBridge, WebHostSceneRuntime, WebHostSceneRuntimeOptions, WheelMode } from "./src/WebHostSceneRuntime.js";
@@ -9,4 +9,4 @@ import { DomSurfacePainter } from "./src/DomSurfacePainter.js";
 import { StdIOPipe } from "./src/wasi/StdIOPipe.js";
 import { JSPIConstructors, WasmEngineCapabilities, WasmEngineFamily, WasmEngineProbeSignals, classifyWasmEngineFamily, collectWasmEngineProbeSignals, jspiConstructors, mainThreadStackProfileEnvironmentDefaults, resolveWasmEngineCapabilities, stackProfileEnvironmentDefaults } from "./src/wasi/WasmEngineCapabilities.js";
 import { BrowserWASIBridge, BrowserWASIBridgeOptions, BrowserWASIOutputSink } from "./src/wasi/BrowserWASIBridge.js";
-export { BrowserWASIBridge, BrowserWASIBridgeOptions, BrowserWASIOutputSink, DomSurfacePainter, JSPIConstructors, ResolvedWebHostTerminalPalette, ResolvedWebHostTerminalStyle, SUPPORTED_SURFACE_VERSION, StdIOPipe, SurfaceMetrics, WasmEngineCapabilities, WasmEngineFamily, WasmEngineProbeSignals, WebHostANSIColors, WebHostAccessibilityAnnouncement, WebHostAccessibilityLiveRegion, WebHostAccessibilityNode, WebHostAccessibilityPoint, WebHostAppController, WebHostAppOptions, WebHostBridgeFactory, WebHostBridgeFactoryOptions, WebHostEmbeddedHostConfig, WebHostFocusPresentation, WebHostFocusSemantics, WebHostFrameDiagnosticRecord, WebHostKeyInput, WebHostMouseInput, WebHostOutputDecoder, WebHostOutputRecord, WebHostOutputSink, WebHostRuntimeIssue, WebHostSceneBridge, WebHostSceneDescriptor, WebHostSceneManifest, WebHostSceneManifestSource, WebHostSceneRuntime, WebHostSceneRuntimeOptions, WebHostScrollRegion, WebHostSurfaceCell, WebHostSurfaceDamage, WebHostSurfaceDamageRange, WebHostSurfaceDamageTextRow, WebHostSurfaceDeltaFrame, WebHostSurfaceDeltaRow, WebHostSurfaceFrame, WebHostSurfaceImage, WebHostSurfaceImageFormat, WebHostSurfaceLineStyle, WebHostSurfaceLinkRow, WebHostSurfaceLinkRun, WebHostSurfacePainter, WebHostSurfaceRect, WebHostSurfaceRendererKind, WebHostSurfaceSize, WebHostSurfaceStyle, WebHostTerminalAppearance, WebHostTerminalCursorStyle, WebHostTerminalPalette, WebHostTerminalRenderStyle, WebHostTerminalStyle, WebHostTerminalTheme, WebHostVisibilityDocument, WebSocketSceneBridge, WebSocketSceneBridgeFactory, WebSocketSceneBridgeOptions, WebSocketSceneSocket, WheelMode, applyWebHostTerminalStyle, classifyWasmEngineFamily, collectWasmEngineProbeSignals, createWebHostApp, decodeWebHostTerminalRenderStyleBase64, encodeCapabilitiesControlMessage, encodeKeyInputMessage, encodeMouseInputMessage, encodePasteInputMessage, encodeRenderStyleControlMessage, encodeResizeControlMessage, encodeWebHostTerminalRenderStyleBase64, jspiConstructors, loadWebHostSceneManifest, mainThreadStackProfileEnvironmentDefaults, mergeWebHostTerminalStyle, normalizeWebHostSceneManifest, normalizeWebHostTerminalStyle, resolveWasmEngineCapabilities, resolveWebHostTerminalRenderStyle, resolvedSurfaceBackground, resolvedSurfaceForeground, stackProfileEnvironmentDefaults, webSocketSceneURL, webTUISceneManifestFromDescriptors, webTUISceneManifestToJSON, webTUITerminalBackgroundColor };
+export { BrowserWASIBridge, BrowserWASIBridgeOptions, BrowserWASIOutputSink, DomSurfacePainter, JSPIConstructors, ResolvedWebHostTerminalPalette, ResolvedWebHostTerminalStyle, SUPPORTED_SURFACE_VERSION, StdIOPipe, SurfaceMetrics, WasmEngineCapabilities, WasmEngineFamily, WasmEngineProbeSignals, WebHostANSIColors, WebHostAccessibilityAnnouncement, WebHostAccessibilityLiveRegion, WebHostAccessibilityNode, WebHostAccessibilityPoint, WebHostAppController, WebHostAppOptions, WebHostBridgeFactory, WebHostBridgeFactoryOptions, WebHostEmbeddedHostConfig, WebHostFocusPresentation, WebHostFocusSemantics, WebHostFrameDiagnosticRecord, WebHostKeyInput, WebHostMouseInput, WebHostOutputDecoder, WebHostOutputRecord, WebHostOutputSink, WebHostResyncRequest, WebHostRuntimeIssue, WebHostSceneBridge, WebHostSceneDescriptor, WebHostSceneManifest, WebHostSceneManifestSource, WebHostSceneRuntime, WebHostSceneRuntimeOptions, WebHostScrollRegion, WebHostSurfaceCell, WebHostSurfaceDamage, WebHostSurfaceDamageRange, WebHostSurfaceDamageTextRow, WebHostSurfaceDeltaFrame, WebHostSurfaceDeltaRow, WebHostSurfaceFrame, WebHostSurfaceImage, WebHostSurfaceImageFormat, WebHostSurfaceLineStyle, WebHostSurfaceLinkRow, WebHostSurfaceLinkRun, WebHostSurfacePainter, WebHostSurfaceRect, WebHostSurfaceRendererKind, WebHostSurfaceSize, WebHostSurfaceStyle, WebHostTerminalAppearance, WebHostTerminalCursorStyle, WebHostTerminalPalette, WebHostTerminalRenderStyle, WebHostTerminalStyle, WebHostTerminalTheme, WebHostVisibilityDocument, WebSocketSceneBridge, WebSocketSceneBridgeFactory, WebSocketSceneBridgeOptions, WebSocketSceneSocket, WheelMode, applyWebHostTerminalStyle, classifyWasmEngineFamily, collectWasmEngineProbeSignals, createWebHostApp, decodeWebHostTerminalRenderStyleBase64, encodeCapabilitiesControlMessage, encodeKeyInputMessage, encodeMouseInputMessage, encodePasteInputMessage, encodeRenderStyleControlMessage, encodeResizeControlMessage, encodeResyncControlMessage, encodeWebHostTerminalRenderStyleBase64, jspiConstructors, loadWebHostSceneManifest, mainThreadStackProfileEnvironmentDefaults, mergeWebHostTerminalStyle, normalizeWebHostSceneManifest, normalizeWebHostTerminalStyle, resolveWasmEngineCapabilities, resolveWebHostTerminalRenderStyle, resolvedSurfaceBackground, resolvedSurfaceForeground, stackProfileEnvironmentDefaults, webSocketSceneURL, webTUISceneManifestFromDescriptors, webTUISceneManifestToJSON, webTUITerminalBackgroundColor };

package/dist/index.js

@@ -1,7 +1,7 @@
 import { StdIOPipe } from "./src/wasi/StdIOPipe.js";
 import { classifyWasmEngineFamily, collectWasmEngineProbeSignals, jspiConstructors, mainThreadStackProfileEnvironmentDefaults, resolveWasmEngineCapabilities, stackProfileEnvironmentDefaults } from "./src/wasi/WasmEngineCapabilities.js";
 import { applyWebHostTerminalStyle, decodeWebHostTerminalRenderStyleBase64, encodeWebHostTerminalRenderStyleBase64, mergeWebHostTerminalStyle, normalizeWebHostTerminalStyle, resolveWebHostTerminalRenderStyle, webTUITerminalBackgroundColor } from "./src/WebHostTerminalStyle.js";
-import { SUPPORTED_SURFACE_VERSION, WebHostOutputDecoder, encodeCapabilitiesControlMessage, encodeKeyInputMessage, encodeMouseInputMessage, encodePasteInputMessage, encodeRenderStyleControlMessage, encodeResizeControlMessage } from "./src/WebHostSurfaceTransport.js";
+import { SUPPORTED_SURFACE_VERSION, WebHostOutputDecoder, encodeCapabilitiesControlMessage, encodeKeyInputMessage, encodeMouseInputMessage, encodePasteInputMessage, encodeRenderStyleControlMessage, encodeResizeControlMessage, encodeResyncControlMessage } from "./src/WebHostSurfaceTransport.js";
 import { BrowserWASIBridge } from "./src/wasi/BrowserWASIBridge.js";
 import { WebSocketSceneBridge, webSocketSceneURL } from "./src/WebSocketSceneBridge.js";
 import { loadWebHostSceneManifest, normalizeWebHostSceneManifest, webTUISceneManifestFromDescriptors, webTUISceneManifestToJSON } from "./src/WebHostSceneManifest.js";
@@ -9,4 +9,4 @@ import { resolvedSurfaceBackground, resolvedSurfaceForeground } from "./src/Surf
 import { DomSurfacePainter } from "./src/DomSurfacePainter.js";
 import { WebHostSceneRuntime } from "./src/WebHostSceneRuntime.js";
 import { createWebHostApp } from "./src/WebHostApp.js";
-export { BrowserWASIBridge, DomSurfacePainter, SUPPORTED_SURFACE_VERSION, StdIOPipe, WebHostOutputDecoder, WebHostSceneRuntime, WebSocketSceneBridge, applyWebHostTerminalStyle, classifyWasmEngineFamily, collectWasmEngineProbeSignals, createWebHostApp, decodeWebHostTerminalRenderStyleBase64, encodeCapabilitiesControlMessage, encodeKeyInputMessage, encodeMouseInputMessage, encodePasteInputMessage, encodeRenderStyleControlMessage, encodeResizeControlMessage, encodeWebHostTerminalRenderStyleBase64, jspiConstructors, loadWebHostSceneManifest, mainThreadStackProfileEnvironmentDefaults, mergeWebHostTerminalStyle, normalizeWebHostSceneManifest, normalizeWebHostTerminalStyle, resolveWasmEngineCapabilities, resolveWebHostTerminalRenderStyle, resolvedSurfaceBackground, resolvedSurfaceForeground, stackProfileEnvironmentDefaults, webSocketSceneURL, webTUISceneManifestFromDescriptors, webTUISceneManifestToJSON, webTUITerminalBackgroundColor };
+export { BrowserWASIBridge, DomSurfacePainter, SUPPORTED_SURFACE_VERSION, StdIOPipe, WebHostOutputDecoder, WebHostSceneRuntime, WebSocketSceneBridge, applyWebHostTerminalStyle, classifyWasmEngineFamily, collectWasmEngineProbeSignals, createWebHostApp, decodeWebHostTerminalRenderStyleBase64, encodeCapabilitiesControlMessage, encodeKeyInputMessage, encodeMouseInputMessage, encodePasteInputMessage, encodeRenderStyleControlMessage, encodeResizeControlMessage, encodeResyncControlMessage, encodeWebHostTerminalRenderStyleBase64, jspiConstructors, loadWebHostSceneManifest, mainThreadStackProfileEnvironmentDefaults, mergeWebHostTerminalStyle, normalizeWebHostSceneManifest, normalizeWebHostTerminalStyle, resolveWasmEngineCapabilities, resolveWebHostTerminalRenderStyle, resolvedSurfaceBackground, resolvedSurfaceForeground, stackProfileEnvironmentDefaults, webSocketSceneURL, webTUISceneManifestFromDescriptors, webTUISceneManifestToJSON, webTUITerminalBackgroundColor };

package/dist/src/AccessibilityTree.js

@@ -1,3 +1,4 @@
+import { normalizeLiveRegion, normalizePoliteness } from "./normalizeWireTokens.js";
 //#region src/AccessibilityTree.ts
 var AccessibilityTreeMounter = class {
 	element;
@@ -15,7 +16,14 @@ var AccessibilityTreeMounter = class {
 		applyScreenReaderOnlyStyle(this.announcerElement);
 	}
 	present(nodes, metrics, announcements = [], options = {}) {
-		const visibleNodes = nodes.filter((node) => !node.hidden);
+		const visibleNodes = nodes.filter((node) => !node.hidden).map((node) => ({
+			...node,
+			liveRegion: normalizeLiveRegion(node.liveRegion)
+		}));
+		const normalizedAnnouncements = announcements.map((announcement) => ({
+			...announcement,
+			politeness: normalizePoliteness(announcement.politeness)
+		}));
 		const previousById = this.nodesById;
 		const nextById = /* @__PURE__ */ new Map();
 		for (const node of visibleNodes) {
@@ -30,7 +38,7 @@ var AccessibilityTreeMounter = class {
 			if (!element) continue;
 			((node.parentId ? nextById.get(node.parentId) : void 0) ?? this.element).appendChild(element);
 		}
-		this.announceLiveRegionChanges(visibleNodes, announcements);
+		this.announceLiveRegionChanges(visibleNodes, normalizedAnnouncements);
 		const focused = visibleNodes.find((node) => node.isFocused);
 		if ((options.synchronizeFocus ?? true) && focused) this.nodesById.get(focused.id)?.focus?.({ preventScroll: true });
 	}

package/dist/src/AccessibilityTree.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccessibilityTree.js","names":[],"sources":["../../src/AccessibilityTree.ts"],"sourcesContent":["import type {\n  WebHostAccessibilityAnnouncement,\n  WebHostAccessibilityNode,\n} from \"./WebHostSurfaceTransport.ts\";\n\ninterface AccessibilityTreeMetrics {\n  cellWidth: number;\n  cellHeight: number;\n}\n\ninterface AccessibilityTreePresentationOptions {\n  synchronizeFocus?: boolean;\n}\n\ninterface RoleMapping {\n  role?: string;\n  level?: number;\n}\n\nexport class AccessibilityTreeMounter {\n  readonly element: HTMLElement;\n  readonly announcerElement: HTMLElement;\n\n  private nodesById = new Map<string, HTMLElement>();\n  private previousLabelsById = new Map<string, string>();\n  private hasLiveRegionBaseline = false;\n\n  constructor() {\n    this.element = document.createElement(\"div\");\n    this.element.className = \"webhost-scene__accessibility-tree\";\n    applyScreenReaderOnlyStyle(this.element);\n\n    this.announcerElement = document.createElement(\"div\");\n    this.announcerElement.className = \"webhost-scene__accessibility-announcer\";\n    this.announcerElement.setAttribute(\"aria-atomic\", \"true\");\n    applyScreenReaderOnlyStyle(this.announcerElement);\n  }\n\n  present(\n    nodes: WebHostAccessibilityNode[],\n    metrics: AccessibilityTreeMetrics,\n    announcements: WebHostAccessibilityAnnouncement[] = [],\n    options: AccessibilityTreePresentationOptions = {}\n  ): void {\n    // Nodes the app marked hidden stay out of the assistive-technology tree,\n    // mirroring the Android host's overlay filter. Hidden is per-node on the\n    // wire, so children of a hidden node re-parent to the mount root.\n    const visibleNodes = nodes.filter((node) => !node.hidden);\n    const previousById = this.nodesById;\n    const nextById = new Map<string, HTMLElement>();\n\n    for (const node of visibleNodes) {\n      const existing = previousById.get(node.id);\n      const element = existing ?? document.createElement(\"div\");\n      this.applyNodeAttributes(element, node, metrics);\n      nextById.set(node.id, element);\n    }\n\n    for (const id of previousById.keys()) {\n      if (!nextById.has(id)) {\n        previousById.get(id)?.remove();\n      }\n    }\n\n    this.nodesById = nextById;\n\n    for (const node of visibleNodes) {\n      const element = nextById.get(node.id);\n      if (!element) {\n        continue;\n      }\n\n      const parent = node.parentId ? nextById.get(node.parentId) : undefined;\n      (parent ?? this.element).appendChild(element);\n    }\n\n    this.announceLiveRegionChanges(visibleNodes, announcements);\n\n    const focused = visibleNodes.find((node) => node.isFocused);\n    if ((options.synchronizeFocus ?? true) && focused) {\n      this.nodesById.get(focused.id)?.focus?.({ preventScroll: true });\n    }\n  }\n\n  private applyNodeAttributes(\n    element: HTMLElement,\n    node: WebHostAccessibilityNode,\n    metrics: AccessibilityTreeMetrics\n  ): void {\n    element.id = `swifttui-a11y-${stableDOMId(node.id)}`;\n    element.dataset.accessibilityId = node.id;\n    element.tabIndex = node.isFocused ? 0 : -1;\n\n    const role = roleMapping(node.role);\n    setOrRemoveAttribute(element, \"role\", role.role);\n    setOrRemoveAttribute(\n      element,\n      \"aria-level\",\n      role.level !== undefined ? String(role.level) : undefined\n    );\n    setOrRemoveAttribute(element, \"aria-label\", node.label || undefined);\n    setOrRemoveAttribute(element, \"aria-description\", node.hint || undefined);\n    setOrRemoveAttribute(element, \"aria-live\", node.liveRegion || undefined);\n    if (node.isFocused) {\n      element.dataset.focused = \"true\";\n    } else {\n      delete element.dataset.focused;\n    }\n\n    const [x, y, width, height] = node.rect;\n    element.style.position = \"absolute\";\n    element.style.left = `${x * metrics.cellWidth}px`;\n    element.style.top = `${y * metrics.cellHeight}px`;\n    element.style.width = `${Math.max(1, width) * metrics.cellWidth}px`;\n    element.style.height = `${Math.max(1, height) * metrics.cellHeight}px`;\n  }\n\n  private announceLiveRegionChanges(\n    nodes: WebHostAccessibilityNode[],\n    announcements: WebHostAccessibilityAnnouncement[]\n  ): void {\n    const candidates = nodes.filter(\n      (node) => node.liveRegion && node.liveRegion !== \"off\" && node.label\n    );\n    const currentLabelsById = new Map(candidates.map((node) => [node.id, node.label ?? \"\"]));\n    const imperativeAssertive = announcements.filter(\n      (announcement) => announcement.politeness === \"assertive\"\n    );\n    const imperativePolite = announcements.filter(\n      (announcement) => announcement.politeness === \"polite\"\n    );\n\n    if (!this.hasLiveRegionBaseline) {\n      this.previousLabelsById = currentLabelsById;\n      this.hasLiveRegionBaseline = true;\n      this.publishAnnouncements([], imperativeAssertive, [], imperativePolite);\n      return;\n    }\n\n    const changed = candidates.filter((node) => {\n      const previous = this.previousLabelsById.get(node.id);\n      return previous !== undefined && previous !== node.label;\n    });\n    this.previousLabelsById = currentLabelsById;\n\n    const assertive = changed.filter((node) => node.liveRegion === \"assertive\");\n    const polite = changed.filter((node) => node.liveRegion === \"polite\");\n    this.publishAnnouncements(assertive, imperativeAssertive, polite, imperativePolite);\n  }\n\n  private publishAnnouncements(\n    assertive: WebHostAccessibilityNode[],\n    imperativeAssertive: WebHostAccessibilityAnnouncement[],\n    polite: WebHostAccessibilityNode[],\n    imperativePolite: WebHostAccessibilityAnnouncement[]\n  ): void {\n    const ordered = [...assertive, ...imperativeAssertive, ...polite, ...imperativePolite];\n    if (ordered.length === 0) {\n      return;\n    }\n\n    const politeness = assertive.length > 0 || imperativeAssertive.length > 0\n      ? \"assertive\"\n      : \"polite\";\n    this.announcerElement.setAttribute(\"aria-live\", politeness);\n    this.announcerElement.textContent = ordered.map((entry) => {\n      if (\"message\" in entry) {\n        return entry.message;\n      }\n      return entry.label ?? \"\";\n    }).join(\"\\n\");\n  }\n}\n\nfunction setOrRemoveAttribute(\n  element: HTMLElement,\n  name: string,\n  value: string | undefined\n): void {\n  if (value === undefined) {\n    element.removeAttribute(name);\n    return;\n  }\n  element.setAttribute(name, value);\n}\n\nfunction applyScreenReaderOnlyStyle(\n  element: HTMLElement\n): void {\n  element.style.position = \"absolute\";\n  element.style.left = \"0\";\n  element.style.top = \"0\";\n  element.style.width = \"1px\";\n  element.style.height = \"1px\";\n  element.style.overflow = \"hidden\";\n  element.style.clipPath = \"inset(50%)\";\n  element.style.whiteSpace = \"nowrap\";\n}\n\nfunction roleMapping(\n  role: string\n): RoleMapping {\n  const heading = /^heading\\(level: ([0-9]+)\\)$/.exec(role);\n  if (heading) {\n    return {\n      role: \"heading\",\n      level: Math.max(1, Math.min(6, Number(heading[1]))),\n    };\n  }\n\n  const custom = /^custom\\((.+)\\)$/.exec(role);\n  if (custom) {\n    return { role: custom[1] };\n  }\n\n  switch (role) {\n  case \"alert\":\n  case \"button\":\n  case \"cell\":\n  case \"checkbox\":\n  case \"grid\":\n  case \"group\":\n  case \"link\":\n  case \"list\":\n  case \"menu\":\n  case \"region\":\n  case \"separator\":\n  case \"slider\":\n  case \"status\":\n  case \"tab\":\n  case \"table\":\n  case \"timer\":\n    return { role };\n  case \"columnHeader\":\n    return { role: \"columnheader\" };\n  case \"confirmationDialog\":\n  case \"sheet\":\n    return { role: \"dialog\" };\n  case \"disclosureGroup\":\n  case \"scrollView\":\n  case \"scrollViewWithIndicators\":\n  case \"section\":\n    return { role: \"region\" };\n  case \"image\":\n    return { role: \"img\" };\n  case \"menuItem\":\n    return { role: \"menuitem\" };\n  case \"picker\":\n    return { role: \"combobox\" };\n  case \"progressBar\":\n    return { role: \"progressbar\" };\n  case \"rowHeader\":\n    return { role: \"rowheader\" };\n  case \"secureField\":\n  case \"textEditor\":\n  case \"textField\":\n    return { role: \"textbox\" };\n  case \"stepper\":\n    return { role: \"spinbutton\" };\n  case \"tabPanel\":\n    return { role: \"tabpanel\" };\n  case \"tableRow\":\n    return { role: \"row\" };\n  case \"tabView\":\n    return { role: \"tablist\" };\n  case \"toggle\":\n    return { role: \"checkbox\" };\n  default:\n    return { role: \"group\" };\n  }\n}\n\nfunction stableDOMId(\n  id: string\n): string {\n  return Array.from(id).map((character) => {\n    if (/^[a-zA-Z0-9_-]$/.test(character)) {\n      return character;\n    }\n    return `-${character.codePointAt(0)?.toString(16) ?? \"0\"}-`;\n  }).join(\"\");\n}\n"],"mappings":"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"}
+{"version":3,"file":"AccessibilityTree.js","names":[],"sources":["../../src/AccessibilityTree.ts"],"sourcesContent":["import type {\n  WebHostAccessibilityAnnouncement,\n  WebHostAccessibilityNode,\n} from \"./WebHostSurfaceTransport.ts\";\nimport {\n  normalizeLiveRegion,\n  normalizePoliteness,\n} from \"./normalizeWireTokens.ts\";\n\ninterface AccessibilityTreeMetrics {\n  cellWidth: number;\n  cellHeight: number;\n}\n\ninterface AccessibilityTreePresentationOptions {\n  synchronizeFocus?: boolean;\n}\n\ninterface RoleMapping {\n  role?: string;\n  level?: number;\n}\n\nexport class AccessibilityTreeMounter {\n  readonly element: HTMLElement;\n  readonly announcerElement: HTMLElement;\n\n  private nodesById = new Map<string, HTMLElement>();\n  private previousLabelsById = new Map<string, string>();\n  private hasLiveRegionBaseline = false;\n\n  constructor() {\n    this.element = document.createElement(\"div\");\n    this.element.className = \"webhost-scene__accessibility-tree\";\n    applyScreenReaderOnlyStyle(this.element);\n\n    this.announcerElement = document.createElement(\"div\");\n    this.announcerElement.className = \"webhost-scene__accessibility-announcer\";\n    this.announcerElement.setAttribute(\"aria-atomic\", \"true\");\n    applyScreenReaderOnlyStyle(this.announcerElement);\n  }\n\n  present(\n    nodes: WebHostAccessibilityNode[],\n    metrics: AccessibilityTreeMetrics,\n    announcements: WebHostAccessibilityAnnouncement[] = [],\n    options: AccessibilityTreePresentationOptions = {}\n  ): void {\n    // Nodes the app marked hidden stay out of the assistive-technology tree,\n    // mirroring the Android host's overlay filter. Hidden is per-node on the\n    // wire, so children of a hidden node re-parent to the mount root.\n    const visibleNodes = nodes\n      .filter((node) => !node.hidden)\n      .map((node) => ({\n        ...node,\n        liveRegion: normalizeLiveRegion(node.liveRegion),\n      }));\n    const normalizedAnnouncements = announcements.map((announcement) => ({\n      ...announcement,\n      politeness: normalizePoliteness(announcement.politeness),\n    }));\n    const previousById = this.nodesById;\n    const nextById = new Map<string, HTMLElement>();\n\n    for (const node of visibleNodes) {\n      const existing = previousById.get(node.id);\n      const element = existing ?? document.createElement(\"div\");\n      this.applyNodeAttributes(element, node, metrics);\n      nextById.set(node.id, element);\n    }\n\n    for (const id of previousById.keys()) {\n      if (!nextById.has(id)) {\n        previousById.get(id)?.remove();\n      }\n    }\n\n    this.nodesById = nextById;\n\n    for (const node of visibleNodes) {\n      const element = nextById.get(node.id);\n      if (!element) {\n        continue;\n      }\n\n      const parent = node.parentId ? nextById.get(node.parentId) : undefined;\n      (parent ?? this.element).appendChild(element);\n    }\n\n    this.announceLiveRegionChanges(visibleNodes, normalizedAnnouncements);\n\n    const focused = visibleNodes.find((node) => node.isFocused);\n    if ((options.synchronizeFocus ?? true) && focused) {\n      this.nodesById.get(focused.id)?.focus?.({ preventScroll: true });\n    }\n  }\n\n  private applyNodeAttributes(\n    element: HTMLElement,\n    node: WebHostAccessibilityNode,\n    metrics: AccessibilityTreeMetrics\n  ): void {\n    element.id = `swifttui-a11y-${stableDOMId(node.id)}`;\n    element.dataset.accessibilityId = node.id;\n    element.tabIndex = node.isFocused ? 0 : -1;\n\n    const role = roleMapping(node.role);\n    setOrRemoveAttribute(element, \"role\", role.role);\n    setOrRemoveAttribute(\n      element,\n      \"aria-level\",\n      role.level !== undefined ? String(role.level) : undefined\n    );\n    setOrRemoveAttribute(element, \"aria-label\", node.label || undefined);\n    setOrRemoveAttribute(element, \"aria-description\", node.hint || undefined);\n    setOrRemoveAttribute(element, \"aria-live\", node.liveRegion || undefined);\n    if (node.isFocused) {\n      element.dataset.focused = \"true\";\n    } else {\n      delete element.dataset.focused;\n    }\n\n    const [x, y, width, height] = node.rect;\n    element.style.position = \"absolute\";\n    element.style.left = `${x * metrics.cellWidth}px`;\n    element.style.top = `${y * metrics.cellHeight}px`;\n    element.style.width = `${Math.max(1, width) * metrics.cellWidth}px`;\n    element.style.height = `${Math.max(1, height) * metrics.cellHeight}px`;\n  }\n\n  private announceLiveRegionChanges(\n    nodes: WebHostAccessibilityNode[],\n    announcements: WebHostAccessibilityAnnouncement[]\n  ): void {\n    const candidates = nodes.filter(\n      (node) => node.liveRegion && node.liveRegion !== \"off\" && node.label\n    );\n    const currentLabelsById = new Map(candidates.map((node) => [node.id, node.label ?? \"\"]));\n    const imperativeAssertive = announcements.filter(\n      (announcement) => announcement.politeness === \"assertive\"\n    );\n    const imperativePolite = announcements.filter(\n      (announcement) => announcement.politeness === \"polite\"\n    );\n\n    if (!this.hasLiveRegionBaseline) {\n      this.previousLabelsById = currentLabelsById;\n      this.hasLiveRegionBaseline = true;\n      this.publishAnnouncements([], imperativeAssertive, [], imperativePolite);\n      return;\n    }\n\n    const changed = candidates.filter((node) => {\n      const previous = this.previousLabelsById.get(node.id);\n      return previous !== undefined && previous !== node.label;\n    });\n    this.previousLabelsById = currentLabelsById;\n\n    const assertive = changed.filter((node) => node.liveRegion === \"assertive\");\n    const polite = changed.filter((node) => node.liveRegion === \"polite\");\n    this.publishAnnouncements(assertive, imperativeAssertive, polite, imperativePolite);\n  }\n\n  private publishAnnouncements(\n    assertive: WebHostAccessibilityNode[],\n    imperativeAssertive: WebHostAccessibilityAnnouncement[],\n    polite: WebHostAccessibilityNode[],\n    imperativePolite: WebHostAccessibilityAnnouncement[]\n  ): void {\n    const ordered = [...assertive, ...imperativeAssertive, ...polite, ...imperativePolite];\n    if (ordered.length === 0) {\n      return;\n    }\n\n    const politeness = assertive.length > 0 || imperativeAssertive.length > 0\n      ? \"assertive\"\n      : \"polite\";\n    this.announcerElement.setAttribute(\"aria-live\", politeness);\n    this.announcerElement.textContent = ordered.map((entry) => {\n      if (\"message\" in entry) {\n        return entry.message;\n      }\n      return entry.label ?? \"\";\n    }).join(\"\\n\");\n  }\n}\n\nfunction setOrRemoveAttribute(\n  element: HTMLElement,\n  name: string,\n  value: string | undefined\n): void {\n  if (value === undefined) {\n    element.removeAttribute(name);\n    return;\n  }\n  element.setAttribute(name, value);\n}\n\nfunction applyScreenReaderOnlyStyle(\n  element: HTMLElement\n): void {\n  element.style.position = \"absolute\";\n  element.style.left = \"0\";\n  element.style.top = \"0\";\n  element.style.width = \"1px\";\n  element.style.height = \"1px\";\n  element.style.overflow = \"hidden\";\n  element.style.clipPath = \"inset(50%)\";\n  element.style.whiteSpace = \"nowrap\";\n}\n\nfunction roleMapping(\n  role: string\n): RoleMapping {\n  const heading = /^heading\\(level: ([0-9]+)\\)$/.exec(role);\n  if (heading) {\n    return {\n      role: \"heading\",\n      level: Math.max(1, Math.min(6, Number(heading[1]))),\n    };\n  }\n\n  const custom = /^custom\\((.+)\\)$/.exec(role);\n  if (custom) {\n    return { role: custom[1] };\n  }\n\n  switch (role) {\n  case \"alert\":\n  case \"button\":\n  case \"cell\":\n  case \"checkbox\":\n  case \"grid\":\n  case \"group\":\n  case \"link\":\n  case \"list\":\n  case \"menu\":\n  case \"region\":\n  case \"separator\":\n  case \"slider\":\n  case \"status\":\n  case \"tab\":\n  case \"table\":\n  case \"timer\":\n    return { role };\n  case \"columnHeader\":\n    return { role: \"columnheader\" };\n  case \"confirmationDialog\":\n  case \"sheet\":\n    return { role: \"dialog\" };\n  case \"disclosureGroup\":\n  case \"scrollView\":\n  case \"scrollViewWithIndicators\":\n  case \"section\":\n    return { role: \"region\" };\n  case \"image\":\n    return { role: \"img\" };\n  case \"menuItem\":\n    return { role: \"menuitem\" };\n  case \"picker\":\n    return { role: \"combobox\" };\n  case \"progressBar\":\n    return { role: \"progressbar\" };\n  case \"rowHeader\":\n    return { role: \"rowheader\" };\n  case \"secureField\":\n  case \"textEditor\":\n  case \"textField\":\n    return { role: \"textbox\" };\n  case \"stepper\":\n    return { role: \"spinbutton\" };\n  case \"tabPanel\":\n    return { role: \"tabpanel\" };\n  case \"tableRow\":\n    return { role: \"row\" };\n  case \"tabView\":\n    return { role: \"tablist\" };\n  case \"toggle\":\n    return { role: \"checkbox\" };\n  default:\n    return { role: \"group\" };\n  }\n}\n\nfunction stableDOMId(\n  id: string\n): string {\n  return Array.from(id).map((character) => {\n    if (/^[a-zA-Z0-9_-]$/.test(character)) {\n      return character;\n    }\n    return `-${character.codePointAt(0)?.toString(16) ?? \"0\"}-`;\n  }).join(\"\");\n}\n"],"mappings":";;AAuBA,IAAa,2BAAb,MAAsC;CACpC;CACA;CAEA,4BAAoB,IAAI,IAAyB;CACjD,qCAA6B,IAAI,IAAoB;CACrD,wBAAgC;CAEhC,cAAc;EACZ,KAAK,UAAU,SAAS,cAAc,KAAK;EAC3C,KAAK,QAAQ,YAAY;EACzB,2BAA2B,KAAK,OAAO;EAEvC,KAAK,mBAAmB,SAAS,cAAc,KAAK;EACpD,KAAK,iBAAiB,YAAY;EAClC,KAAK,iBAAiB,aAAa,eAAe,MAAM;EACxD,2BAA2B,KAAK,gBAAgB;CAClD;CAEA,QACE,OACA,SACA,gBAAoD,CAAC,GACrD,UAAgD,CAAC,GAC3C;EAIN,MAAM,eAAe,MAClB,QAAQ,SAAS,CAAC,KAAK,MAAM,CAAC,CAC9B,KAAK,UAAU;GACd,GAAG;GACH,YAAY,oBAAoB,KAAK,UAAU;EACjD,EAAE;EACJ,MAAM,0BAA0B,cAAc,KAAK,kBAAkB;GACnE,GAAG;GACH,YAAY,oBAAoB,aAAa,UAAU;EACzD,EAAE;EACF,MAAM,eAAe,KAAK;EAC1B,MAAM,2BAAW,IAAI,IAAyB;EAE9C,KAAK,MAAM,QAAQ,cAAc;GAE/B,MAAM,UADW,aAAa,IAAI,KAAK,EAChB,KAAK,SAAS,cAAc,KAAK;GACxD,KAAK,oBAAoB,SAAS,MAAM,OAAO;GAC/C,SAAS,IAAI,KAAK,IAAI,OAAO;EAC/B;EAEA,KAAK,MAAM,MAAM,aAAa,KAAK,GACjC,IAAI,CAAC,SAAS,IAAI,EAAE,GAClB,aAAa,IAAI,EAAE,CAAC,EAAE,OAAO;EAIjC,KAAK,YAAY;EAEjB,KAAK,MAAM,QAAQ,cAAc;GAC/B,MAAM,UAAU,SAAS,IAAI,KAAK,EAAE;GACpC,IAAI,CAAC,SACH;GAIF,EADe,KAAK,WAAW,SAAS,IAAI,KAAK,QAAQ,IAAI,KAAA,MAClD,KAAK,QAAA,CAAS,YAAY,OAAO;EAC9C;EAEA,KAAK,0BAA0B,cAAc,uBAAuB;EAEpE,MAAM,UAAU,aAAa,MAAM,SAAS,KAAK,SAAS;EAC1D,KAAK,QAAQ,oBAAoB,SAAS,SACxC,KAAK,UAAU,IAAI,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,eAAe,KAAK,CAAC;CAEnE;CAEA,oBACE,SACA,MACA,SACM;EACN,QAAQ,KAAK,iBAAiB,YAAY,KAAK,EAAE;EACjD,QAAQ,QAAQ,kBAAkB,KAAK;EACvC,QAAQ,WAAW,KAAK,YAAY,IAAI;EAExC,MAAM,OAAO,YAAY,KAAK,IAAI;EAClC,qBAAqB,SAAS,QAAQ,KAAK,IAAI;EAC/C,qBACE,SACA,cACA,KAAK,UAAU,KAAA,IAAY,OAAO,KAAK,KAAK,IAAI,KAAA,CAClD;EACA,qBAAqB,SAAS,cAAc,KAAK,SAAS,KAAA,CAAS;EACnE,qBAAqB,SAAS,oBAAoB,KAAK,QAAQ,KAAA,CAAS;EACxE,qBAAqB,SAAS,aAAa,KAAK,cAAc,KAAA,CAAS;EACvE,IAAI,KAAK,WACP,QAAQ,QAAQ,UAAU;OAE1B,OAAO,QAAQ,QAAQ;EAGzB,MAAM,CAAC,GAAG,GAAG,OAAO,UAAU,KAAK;EACnC,QAAQ,MAAM,WAAW;EACzB,QAAQ,MAAM,OAAO,GAAG,IAAI,QAAQ,UAAU;EAC9C,QAAQ,MAAM,MAAM,GAAG,IAAI,QAAQ,WAAW;EAC9C,QAAQ,MAAM,QAAQ,GAAG,KAAK,IAAI,GAAG,KAAK,IAAI,QAAQ,UAAU;EAChE,QAAQ,MAAM,SAAS,GAAG,KAAK,IAAI,GAAG,MAAM,IAAI,QAAQ,WAAW;CACrE;CAEA,0BACE,OACA,eACM;EACN,MAAM,aAAa,MAAM,QACtB,SAAS,KAAK,cAAc,KAAK,eAAe,SAAS,KAAK,KACjE;EACA,MAAM,oBAAoB,IAAI,IAAI,WAAW,KAAK,SAAS,CAAC,KAAK,IAAI,KAAK,SAAS,EAAE,CAAC,CAAC;EACvF,MAAM,sBAAsB,cAAc,QACvC,iBAAiB,aAAa,eAAe,WAChD;EACA,MAAM,mBAAmB,cAAc,QACpC,iBAAiB,aAAa,eAAe,QAChD;EAEA,IAAI,CAAC,KAAK,uBAAuB;GAC/B,KAAK,qBAAqB;GAC1B,KAAK,wBAAwB;GAC7B,KAAK,qBAAqB,CAAC,GAAG,qBAAqB,CAAC,GAAG,gBAAgB;GACvE;EACF;EAEA,MAAM,UAAU,WAAW,QAAQ,SAAS;GAC1C,MAAM,WAAW,KAAK,mBAAmB,IAAI,KAAK,EAAE;GACpD,OAAO,aAAa,KAAA,KAAa,aAAa,KAAK;EACrD,CAAC;EACD,KAAK,qBAAqB;EAE1B,MAAM,YAAY,QAAQ,QAAQ,SAAS,KAAK,eAAe,WAAW;EAC1E,MAAM,SAAS,QAAQ,QAAQ,SAAS,KAAK,eAAe,QAAQ;EACpE,KAAK,qBAAqB,WAAW,qBAAqB,QAAQ,gBAAgB;CACpF;CAEA,qBACE,WACA,qBACA,QACA,kBACM;EACN,MAAM,UAAU;GAAC,GAAG;GAAW,GAAG;GAAqB,GAAG;GAAQ,GAAG;EAAgB;EACrF,IAAI,QAAQ,WAAW,GACrB;EAGF,MAAM,aAAa,UAAU,SAAS,KAAK,oBAAoB,SAAS,IACpE,cACA;EACJ,KAAK,iBAAiB,aAAa,aAAa,UAAU;EAC1D,KAAK,iBAAiB,cAAc,QAAQ,KAAK,UAAU;GACzD,IAAI,aAAa,OACf,OAAO,MAAM;GAEf,OAAO,MAAM,SAAS;EACxB,CAAC,CAAC,CAAC,KAAK,IAAI;CACd;AACF;AAEA,SAAS,qBACP,SACA,MACA,OACM;CACN,IAAI,UAAU,KAAA,GAAW;EACvB,QAAQ,gBAAgB,IAAI;EAC5B;CACF;CACA,QAAQ,aAAa,MAAM,KAAK;AAClC;AAEA,SAAS,2BACP,SACM;CACN,QAAQ,MAAM,WAAW;CACzB,QAAQ,MAAM,OAAO;CACrB,QAAQ,MAAM,MAAM;CACpB,QAAQ,MAAM,QAAQ;CACtB,QAAQ,MAAM,SAAS;CACvB,QAAQ,MAAM,WAAW;CACzB,QAAQ,MAAM,WAAW;CACzB,QAAQ,MAAM,aAAa;AAC7B;AAEA,SAAS,YACP,MACa;CACb,MAAM,UAAU,+BAA+B,KAAK,IAAI;CACxD,IAAI,SACF,OAAO;EACL,MAAM;EACN,OAAO,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,OAAO,QAAQ,EAAE,CAAC,CAAC;CACpD;CAGF,MAAM,SAAS,mBAAmB,KAAK,IAAI;CAC3C,IAAI,QACF,OAAO,EAAE,MAAM,OAAO,GAAG;CAG3B,QAAQ,MAAR;EACA,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK,SACH,OAAO,EAAE,KAAK;EAChB,KAAK,gBACH,OAAO,EAAE,MAAM,eAAe;EAChC,KAAK;EACL,KAAK,SACH,OAAO,EAAE,MAAM,SAAS;EAC1B,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK,WACH,OAAO,EAAE,MAAM,SAAS;EAC1B,KAAK,SACH,OAAO,EAAE,MAAM,MAAM;EACvB,KAAK,YACH,OAAO,EAAE,MAAM,WAAW;EAC5B,KAAK,UACH,OAAO,EAAE,MAAM,WAAW;EAC5B,KAAK,eACH,OAAO,EAAE,MAAM,cAAc;EAC/B,KAAK,aACH,OAAO,EAAE,MAAM,YAAY;EAC7B,KAAK;EACL,KAAK;EACL,KAAK,aACH,OAAO,EAAE,MAAM,UAAU;EAC3B,KAAK,WACH,OAAO,EAAE,MAAM,aAAa;EAC9B,KAAK,YACH,OAAO,EAAE,MAAM,WAAW;EAC5B,KAAK,YACH,OAAO,EAAE,MAAM,MAAM;EACvB,KAAK,WACH,OAAO,EAAE,MAAM,UAAU;EAC3B,KAAK,UACH,OAAO,EAAE,MAAM,WAAW;EAC5B,SACE,OAAO,EAAE,MAAM,QAAQ;CACzB;AACF;AAEA,SAAS,YACP,IACQ;CACR,OAAO,MAAM,KAAK,EAAE,CAAC,CAAC,KAAK,cAAc;EACvC,IAAI,kBAAkB,KAAK,SAAS,GAClC,OAAO;EAET,OAAO,IAAI,UAAU,YAAY,CAAC,CAAC,EAAE,SAAS,EAAE,KAAK,IAAI;CAC3D,CAAC,CAAC,CAAC,KAAK,EAAE;AACZ"}

package/dist/src/CanvasSurfacePainter.js

@@ -1,6 +1,7 @@
 import { webTUITerminalBackgroundColor } from "./WebHostTerminalStyle.js";
 import { canRenderBoxDrawing, drawBoxDrawing } from "./BoxDrawingRenderer.js";
 import { resolvedSurfaceBackground, resolvedSurfaceForeground } from "./SurfaceRenderer.js";
+import { isSupportedImageFormat, normalizeScalingMode } from "./normalizeWireTokens.js";
 //#region src/CanvasSurfacePainter.ts
 /**
 * Draws SwiftTUI surface frames onto a 2D canvas: background fills, per-cell
@@ -68,7 +69,13 @@ var CanvasSurfacePainter = class {
 		}
 	}
 	drawImages(context, images, metrics, dirtyRegion) {
-		for (const image of images) this.drawImage(context, image, metrics, dirtyRegion);
+		for (const image of images) {
+			if (!isSupportedImageFormat(image.format)) continue;
+			this.drawImage(context, {
+				...image,
+				scalingMode: normalizeScalingMode(image.scalingMode)
+			}, metrics, dirtyRegion);
+		}
 	}
 	drawImage(context, image, metrics, dirtyRegion) {
 		const decodedImage = this.cachedImage(image);

package/dist/src/CanvasSurfacePainter.js.map

@@ -1 +1 @@
-{"version":3,"file":"CanvasSurfacePainter.js","names":[],"sources":["../../src/CanvasSurfacePainter.ts"],"sourcesContent":["import {\n  canRenderBoxDrawing,\n  drawBoxDrawing,\n} from \"./BoxDrawingRenderer.ts\";\nimport {\n  resolvedSurfaceBackground,\n  resolvedSurfaceForeground,\n  type SurfaceMetrics,\n  type WebHostSurfacePainter,\n} from \"./SurfaceRenderer.ts\";\nimport {\n  type ResolvedWebHostTerminalStyle,\n  webTUITerminalBackgroundColor,\n} from \"./WebHostTerminalStyle.ts\";\nimport type {\n  WebHostSurfaceDamage,\n  WebHostSurfaceFrame,\n  WebHostSurfaceImage,\n  WebHostSurfaceImageFormat,\n  WebHostSurfaceStyle,\n} from \"./WebHostSurfaceTransport.ts\";\n\n/**\n * A read-only snapshot of the cell grid geometry and active style the painter\n * needs for a single paint pass — see {@link SurfaceMetrics}, shared with the\n * DOM painter. The alias keeps this painter's original public name stable.\n */\nexport type CanvasSurfaceMetrics = SurfaceMetrics;\n\ninterface CachedWebHostImage {\n  image?: CanvasImageSource;\n  promise?: Promise<CanvasImageSource>;\n}\n\ninterface DirtyRect {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\ninterface DirtyCellRange {\n  start: number;\n  end: number;\n}\n\ntype DirtyRowRanges = \"full\" | DirtyCellRange[];\n\ninterface DirtyRegion {\n  rects: DirtyRect[];\n  rows: Map<number, DirtyRowRanges>;\n}\n\n/**\n * Draws SwiftTUI surface frames onto a 2D canvas: background fills, per-cell\n * text/box-drawing/decorations, surface images, and damage-scoped dirty-region\n * painting. The painter caches decoded images and asks the host to repaint once\n * an image finishes decoding (via the `requestRedraw` callback).\n *\n * Geometry and style are supplied per paint via {@link CanvasSurfaceMetrics};\n * the painter holds only the canvas handle, the image cache, and the redraw\n * callback as durable state.\n */\nexport class CanvasSurfacePainter implements WebHostSurfacePainter {\n  private readonly imageCache = new Map<string, CachedWebHostImage>();\n  private canvas?: HTMLCanvasElement;\n  private requestRedraw: () => void = () => {};\n\n  /**\n   * Binds the canvas the painter draws into and the callback used to request a\n   * full repaint after an asynchronous image decode completes.\n   */\n  attach(\n    canvas: HTMLCanvasElement,\n    requestRedraw: () => void\n  ): void {\n    this.canvas = canvas;\n    this.requestRedraw = requestRedraw;\n  }\n\n  paint(\n    metrics: CanvasSurfaceMetrics,\n    frame: WebHostSurfaceFrame | undefined,\n    damage?: WebHostSurfaceDamage\n  ): void {\n    const canvas = this.canvas;\n    const context = canvas?.getContext(\"2d\");\n    if (!canvas || !context) {\n      return;\n    }\n\n    const dirtyRegion = frame\n      ? this.dirtyRegionForDamage(damage, frame, metrics)\n      : undefined;\n    if (dirtyRegion?.rects.length === 0) {\n      return;\n    }\n\n    const scale = globalThis.window?.devicePixelRatio || 1;\n    context.setTransform(scale, 0, 0, scale, 0, 0);\n    context.textBaseline = \"alphabetic\";\n\n    context.fillStyle = webTUITerminalBackgroundColor(metrics.style);\n    if (dirtyRegion) {\n      for (const rect of dirtyRegion.rects) {\n        context.clearRect(rect.x, rect.y, rect.width, rect.height);\n        context.fillRect(rect.x, rect.y, rect.width, rect.height);\n      }\n    } else {\n      context.clearRect(0, 0, canvas.width / scale, canvas.height / scale);\n      context.fillRect(0, 0, metrics.columns * metrics.cellWidth, metrics.rows * metrics.cellHeight);\n    }\n\n    if (!frame) {\n      return;\n    }\n\n    this.drawRows(context, frame, metrics, dirtyRegion);\n    this.drawImages(context, frame.images ?? [], metrics, dirtyRegion);\n  }\n\n  private drawRows(\n    context: CanvasRenderingContext2D,\n    frame: WebHostSurfaceFrame,\n    metrics: CanvasSurfaceMetrics,\n    dirtyRegion?: DirtyRegion\n  ): void {\n    if (dirtyRegion) {\n      for (const [y, ranges] of dirtyRegion.rows) {\n        const row = frame.rows[y] ?? [];\n        this.drawRow(context, frame, metrics, row, y, ranges);\n      }\n      return;\n    }\n\n    for (let y = 0; y < frame.rows.length; y += 1) {\n      const row = frame.rows[y] ?? [];\n      this.drawRow(context, frame, metrics, row, y);\n    }\n  }\n\n  private drawRow(\n    context: CanvasRenderingContext2D,\n    frame: WebHostSurfaceFrame,\n    metrics: CanvasSurfaceMetrics,\n    row: WebHostSurfaceFrame[\"rows\"][number],\n    y: number,\n    ranges?: DirtyRowRanges\n  ): void {\n    for (const cell of row) {\n      const [x, text, span, styleIndex] = cell;\n      if (ranges !== undefined && !cellIntersectsRanges(x, span, ranges)) {\n        continue;\n      }\n      const style = frame.styles[styleIndex] ?? undefined;\n      this.drawCell(context, metrics, x, y, text, span, style);\n    }\n  }\n\n  private drawImages(\n    context: CanvasRenderingContext2D,\n    images: WebHostSurfaceImage[],\n    metrics: CanvasSurfaceMetrics,\n    dirtyRegion?: DirtyRegion\n  ): void {\n    for (const image of images) {\n      this.drawImage(context, image, metrics, dirtyRegion);\n    }\n  }\n\n  private drawImage(\n    context: CanvasRenderingContext2D,\n    image: WebHostSurfaceImage,\n    metrics: CanvasSurfaceMetrics,\n    dirtyRegion?: DirtyRegion\n  ): void {\n    const decodedImage = this.cachedImage(image);\n    if (!decodedImage) {\n      return;\n    }\n\n    const [boundsX, boundsY, boundsWidth, boundsHeight] = image.bounds;\n    const [clipX, clipY, clipWidth, clipHeight] = image.visibleBounds;\n    if (boundsWidth <= 0 || boundsHeight <= 0 || clipWidth <= 0 || clipHeight <= 0) {\n      return;\n    }\n    if (\n      dirtyRegion\n      && !dirtyRegionIntersectsCellRect(dirtyRegion, clipX, clipY, clipWidth, clipHeight)\n    ) {\n      return;\n    }\n\n    context.save();\n    context.beginPath();\n    context.rect(\n      clipX * metrics.cellWidth,\n      clipY * metrics.cellHeight,\n      clipWidth * metrics.cellWidth,\n      clipHeight * metrics.cellHeight\n    );\n    context.clip();\n    context.drawImage(\n      decodedImage,\n      boundsX * metrics.cellWidth,\n      boundsY * metrics.cellHeight,\n      boundsWidth * metrics.cellWidth,\n      boundsHeight * metrics.cellHeight\n    );\n    context.restore();\n  }\n\n  private cachedImage(\n    image: WebHostSurfaceImage\n  ): CanvasImageSource | undefined {\n    const cached = this.imageCache.get(image.id);\n    if (cached?.image) {\n      return cached.image;\n    }\n\n    if (!cached?.promise && image.dataBase64) {\n      const promise = decodeImage(image.dataBase64, image.format);\n      this.imageCache.set(image.id, { promise });\n      void promise.then((decodedImage) => {\n        const latest = this.imageCache.get(image.id);\n        if (latest?.promise !== promise) {\n          return;\n        }\n        this.imageCache.set(image.id, { image: decodedImage });\n        this.requestRedraw();\n      }).catch(() => {\n        this.imageCache.delete(image.id);\n      });\n    }\n\n    return undefined;\n  }\n\n  private drawCell(\n    context: CanvasRenderingContext2D,\n    metrics: CanvasSurfaceMetrics,\n    x: number,\n    y: number,\n    text: string,\n    span: number,\n    style?: WebHostSurfaceStyle | null\n  ): void {\n    const rectX = x * metrics.cellWidth;\n    const rectY = y * metrics.cellHeight;\n    const width = Math.max(1, span) * metrics.cellWidth;\n    const background = resolvedSurfaceBackground(style, metrics.style);\n    const foreground = resolvedSurfaceForeground(style, metrics.style);\n    const opacity = style?.opacity ?? 1;\n\n    if (background) {\n      context.globalAlpha = opacity;\n      context.fillStyle = background;\n      context.fillRect(rectX, rectY, width, metrics.cellHeight);\n    }\n\n    if (text !== \" \") {\n      context.globalAlpha = opacity;\n      context.fillStyle = foreground;\n      context.strokeStyle = foreground;\n      if (!canRenderBoxDrawing(text) || !drawBoxDrawing(context, text, {\n        x: rectX,\n        y: rectY,\n        width,\n        height: metrics.cellHeight,\n      })) {\n        context.font = fontForStyle(metrics.style, style);\n        context.fillText(\n          text,\n          rectX,\n          rectY + Math.floor((metrics.cellHeight + metrics.style.fontSize) / 2) - 2\n        );\n      }\n    }\n\n    this.drawTextLine(context, metrics, rectX, rectY, width, style?.underline, \"underline\", foreground);\n    this.drawTextLine(context, metrics, rectX, rectY, width, style?.strikethrough, \"strike\", foreground);\n    context.globalAlpha = 1;\n  }\n\n  private dirtyRegionForDamage(\n    damage: WebHostSurfaceDamage | undefined,\n    frame: WebHostSurfaceFrame,\n    metrics: CanvasSurfaceMetrics\n  ): DirtyRegion | undefined {\n    if (!damage || damage.requiresFullTextRepaint || damage.requiresFullGraphicsReplay) {\n      return undefined;\n    }\n\n    const rects: DirtyRect[] = [];\n    const rows = new Map<number, DirtyRowRanges>();\n    for (const [row, ranges] of damage.textRows) {\n      if (row < 0 || row >= frame.height) {\n        continue;\n      }\n      if (ranges.length === 0) {\n        rects.push(cellRect(metrics, 0, row, frame.width));\n        rows.set(row, \"full\");\n        continue;\n      }\n      const rowRanges: DirtyCellRange[] = rows.get(row) === \"full\"\n        ? []\n        : [...(rows.get(row) as DirtyCellRange[] | undefined ?? [])];\n      for (const [start, end] of ranges) {\n        const lowerBound = Math.max(0, Math.min(frame.width, Math.floor(start)));\n        const upperBound = Math.max(lowerBound, Math.min(frame.width, Math.ceil(end)));\n        if (lowerBound >= upperBound) {\n          continue;\n        }\n        rects.push(cellRect(metrics, lowerBound, row, upperBound - lowerBound));\n        rowRanges.push({ start: lowerBound, end: upperBound });\n      }\n      if (rows.get(row) !== \"full\" && rowRanges.length > 0) {\n        rows.set(row, normalizeCellRanges(rowRanges));\n      }\n    }\n    return { rects, rows };\n  }\n\n  private drawTextLine(\n    context: CanvasRenderingContext2D,\n    metrics: CanvasSurfaceMetrics,\n    x: number,\n    y: number,\n    width: number,\n    line: WebHostSurfaceStyle[\"underline\"],\n    placement: \"underline\" | \"strike\",\n    fallbackColor: string\n  ): void {\n    if (!line) {\n      return;\n    }\n    context.strokeStyle = line.color ?? fallbackColor;\n    context.lineWidth = line.pattern === \"double\" ? 2 : 1;\n    if (line.pattern === \"dot\") {\n      context.setLineDash([1, 3]);\n    } else if (line.pattern === \"dash\") {\n      context.setLineDash([4, 3]);\n    } else {\n      context.setLineDash([]);\n    }\n\n    const lineY = placement === \"underline\"\n      ? y + metrics.cellHeight - 2\n      : y + Math.floor(metrics.cellHeight / 2);\n    context.beginPath();\n    context.moveTo(x, lineY);\n    context.lineTo(x + width, lineY);\n    context.stroke();\n    context.setLineDash([]);\n  }\n}\n\n/**\n * The CSS font string for a cell, folding the surface emphasis bits (bold,\n * italic) over the host terminal's font size/family. Exposed so the host can\n * reuse the exact same metric when measuring cell dimensions.\n */\nexport function fontForStyle(\n  terminalStyle: ResolvedWebHostTerminalStyle,\n  style?: WebHostSurfaceStyle | null\n): string {\n  const emphasis = style?.em ?? 0;\n  const italic = (emphasis & 2) !== 0 ? \"italic \" : \"\";\n  const weight = (emphasis & 1) !== 0 ? \"700 \" : \"\";\n  return `${italic}${weight}${terminalStyle.fontSize}px ${terminalStyle.fontFamily}`;\n}\n\nfunction cellRect(\n  metrics: CanvasSurfaceMetrics,\n  x: number,\n  y: number,\n  span: number\n): DirtyRect {\n  return {\n    x: x * metrics.cellWidth,\n    y: y * metrics.cellHeight,\n    width: Math.max(1, span) * metrics.cellWidth,\n    height: metrics.cellHeight,\n  };\n}\n\nasync function decodeImage(\n  dataBase64: string,\n  format: WebHostSurfaceImageFormat\n): Promise<CanvasImageSource> {\n  const bytes = decodeBase64Bytes(dataBase64);\n  const blob = new Blob([bytes], { type: `image/${format}` });\n\n  if (typeof createImageBitmap === \"function\") {\n    // Animated GIFs collapse to their first frame in createImageBitmap\n    // — that matches the Kitty path's first-frame composite. Phase 7\n    // will replace this with a frame ticker.\n    return createImageBitmap(blob);\n  }\n\n  return new Promise((resolve, reject) => {\n    const image = new Image();\n    const url = URL.createObjectURL(blob);\n    image.onload = () => {\n      URL.revokeObjectURL(url);\n      resolve(image);\n    };\n    image.onerror = () => {\n      URL.revokeObjectURL(url);\n      reject(new Error(`Failed to decode ${format} image`));\n    };\n    image.src = url;\n  });\n}\n\nfunction decodeBase64Bytes(\n  value: string\n): Uint8Array {\n  if (typeof atob === \"function\") {\n    const binary = atob(value);\n    const bytes = new Uint8Array(binary.length);\n    for (let index = 0; index < binary.length; index += 1) {\n      bytes[index] = binary.charCodeAt(index);\n    }\n    return bytes;\n  }\n\n  return new Uint8Array(Buffer.from(value, \"base64\"));\n}\n\nfunction normalizeCellRanges(\n  ranges: DirtyCellRange[]\n): DirtyCellRange[] {\n  const sorted = ranges\n    .filter((range) => range.end > range.start)\n    .sort((lhs, rhs) => lhs.start - rhs.start || lhs.end - rhs.end);\n  const normalized: DirtyCellRange[] = [];\n  for (const range of sorted) {\n    const previous = normalized[normalized.length - 1];\n    if (previous && range.start <= previous.end) {\n      previous.end = Math.max(previous.end, range.end);\n      continue;\n    }\n    normalized.push({ ...range });\n  }\n  return normalized;\n}\n\nfunction cellIntersectsRanges(\n  x: number,\n  span: number,\n  ranges: DirtyRowRanges\n): boolean {\n  if (ranges === \"full\") {\n    return true;\n  }\n  const start = Math.floor(x);\n  const end = start + Math.max(1, Math.ceil(span));\n  return ranges.some((range) => start < range.end && end > range.start);\n}\n\nfunction dirtyRegionIntersectsCellRect(\n  region: DirtyRegion,\n  x: number,\n  y: number,\n  width: number,\n  height: number\n): boolean {\n  const startRow = Math.max(0, Math.floor(y));\n  const endRow = Math.max(startRow, Math.ceil(y + height));\n  const rectRange = {\n    start: Math.floor(x),\n    end: Math.floor(x) + Math.max(1, Math.ceil(width)),\n  };\n  for (let row = startRow; row < endRow; row += 1) {\n    const ranges = region.rows.get(row);\n    if (!ranges) {\n      continue;\n    }\n    if (cellIntersectsRanges(rectRange.start, rectRange.end - rectRange.start, ranges)) {\n      return true;\n    }\n  }\n  return false;\n}\n\n"],"mappings":"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"}
+{"version":3,"file":"CanvasSurfacePainter.js","names":[],"sources":["../../src/CanvasSurfacePainter.ts"],"sourcesContent":["import {\n  canRenderBoxDrawing,\n  drawBoxDrawing,\n} from \"./BoxDrawingRenderer.ts\";\nimport {\n  resolvedSurfaceBackground,\n  resolvedSurfaceForeground,\n  type SurfaceMetrics,\n  type WebHostSurfacePainter,\n} from \"./SurfaceRenderer.ts\";\nimport {\n  isSupportedImageFormat,\n  normalizeScalingMode,\n  type NormalizedSurfaceImageFormat,\n} from \"./normalizeWireTokens.ts\";\nimport {\n  type ResolvedWebHostTerminalStyle,\n  webTUITerminalBackgroundColor,\n} from \"./WebHostTerminalStyle.ts\";\nimport type {\n  WebHostSurfaceDamage,\n  WebHostSurfaceFrame,\n  WebHostSurfaceImage,\n  WebHostSurfaceStyle,\n} from \"./WebHostSurfaceTransport.ts\";\n\n/**\n * A read-only snapshot of the cell grid geometry and active style the painter\n * needs for a single paint pass — see {@link SurfaceMetrics}, shared with the\n * DOM painter. The alias keeps this painter's original public name stable.\n */\nexport type CanvasSurfaceMetrics = SurfaceMetrics;\n\ninterface CachedWebHostImage {\n  image?: CanvasImageSource;\n  promise?: Promise<CanvasImageSource>;\n}\n\ninterface DirtyRect {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\ninterface DirtyCellRange {\n  start: number;\n  end: number;\n}\n\ntype DirtyRowRanges = \"full\" | DirtyCellRange[];\n\ninterface DirtyRegion {\n  rects: DirtyRect[];\n  rows: Map<number, DirtyRowRanges>;\n}\n\n/**\n * Draws SwiftTUI surface frames onto a 2D canvas: background fills, per-cell\n * text/box-drawing/decorations, surface images, and damage-scoped dirty-region\n * painting. The painter caches decoded images and asks the host to repaint once\n * an image finishes decoding (via the `requestRedraw` callback).\n *\n * Geometry and style are supplied per paint via {@link CanvasSurfaceMetrics};\n * the painter holds only the canvas handle, the image cache, and the redraw\n * callback as durable state.\n */\nexport class CanvasSurfacePainter implements WebHostSurfacePainter {\n  private readonly imageCache = new Map<string, CachedWebHostImage>();\n  private canvas?: HTMLCanvasElement;\n  private requestRedraw: () => void = () => {};\n\n  /**\n   * Binds the canvas the painter draws into and the callback used to request a\n   * full repaint after an asynchronous image decode completes.\n   */\n  attach(\n    canvas: HTMLCanvasElement,\n    requestRedraw: () => void\n  ): void {\n    this.canvas = canvas;\n    this.requestRedraw = requestRedraw;\n  }\n\n  paint(\n    metrics: CanvasSurfaceMetrics,\n    frame: WebHostSurfaceFrame | undefined,\n    damage?: WebHostSurfaceDamage\n  ): void {\n    const canvas = this.canvas;\n    const context = canvas?.getContext(\"2d\");\n    if (!canvas || !context) {\n      return;\n    }\n\n    const dirtyRegion = frame\n      ? this.dirtyRegionForDamage(damage, frame, metrics)\n      : undefined;\n    if (dirtyRegion?.rects.length === 0) {\n      return;\n    }\n\n    const scale = globalThis.window?.devicePixelRatio || 1;\n    context.setTransform(scale, 0, 0, scale, 0, 0);\n    context.textBaseline = \"alphabetic\";\n\n    context.fillStyle = webTUITerminalBackgroundColor(metrics.style);\n    if (dirtyRegion) {\n      for (const rect of dirtyRegion.rects) {\n        context.clearRect(rect.x, rect.y, rect.width, rect.height);\n        context.fillRect(rect.x, rect.y, rect.width, rect.height);\n      }\n    } else {\n      context.clearRect(0, 0, canvas.width / scale, canvas.height / scale);\n      context.fillRect(0, 0, metrics.columns * metrics.cellWidth, metrics.rows * metrics.cellHeight);\n    }\n\n    if (!frame) {\n      return;\n    }\n\n    this.drawRows(context, frame, metrics, dirtyRegion);\n    this.drawImages(context, frame.images ?? [], metrics, dirtyRegion);\n  }\n\n  private drawRows(\n    context: CanvasRenderingContext2D,\n    frame: WebHostSurfaceFrame,\n    metrics: CanvasSurfaceMetrics,\n    dirtyRegion?: DirtyRegion\n  ): void {\n    if (dirtyRegion) {\n      for (const [y, ranges] of dirtyRegion.rows) {\n        const row = frame.rows[y] ?? [];\n        this.drawRow(context, frame, metrics, row, y, ranges);\n      }\n      return;\n    }\n\n    for (let y = 0; y < frame.rows.length; y += 1) {\n      const row = frame.rows[y] ?? [];\n      this.drawRow(context, frame, metrics, row, y);\n    }\n  }\n\n  private drawRow(\n    context: CanvasRenderingContext2D,\n    frame: WebHostSurfaceFrame,\n    metrics: CanvasSurfaceMetrics,\n    row: WebHostSurfaceFrame[\"rows\"][number],\n    y: number,\n    ranges?: DirtyRowRanges\n  ): void {\n    for (const cell of row) {\n      const [x, text, span, styleIndex] = cell;\n      if (ranges !== undefined && !cellIntersectsRanges(x, span, ranges)) {\n        continue;\n      }\n      const style = frame.styles[styleIndex] ?? undefined;\n      this.drawCell(context, metrics, x, y, text, span, style);\n    }\n  }\n\n  private drawImages(\n    context: CanvasRenderingContext2D,\n    images: WebHostSurfaceImage[],\n    metrics: CanvasSurfaceMetrics,\n    dirtyRegion?: DirtyRegion\n  ): void {\n    for (const image of images) {\n      if (!isSupportedImageFormat(image.format)) {\n        continue;\n      }\n      this.drawImage(\n        context,\n        {\n          ...image,\n          scalingMode: normalizeScalingMode(image.scalingMode),\n        },\n        metrics,\n        dirtyRegion\n      );\n    }\n  }\n\n  private drawImage(\n    context: CanvasRenderingContext2D,\n    image: WebHostSurfaceImage,\n    metrics: CanvasSurfaceMetrics,\n    dirtyRegion?: DirtyRegion\n  ): void {\n    const decodedImage = this.cachedImage(image);\n    if (!decodedImage) {\n      return;\n    }\n\n    const [boundsX, boundsY, boundsWidth, boundsHeight] = image.bounds;\n    const [clipX, clipY, clipWidth, clipHeight] = image.visibleBounds;\n    if (boundsWidth <= 0 || boundsHeight <= 0 || clipWidth <= 0 || clipHeight <= 0) {\n      return;\n    }\n    if (\n      dirtyRegion\n      && !dirtyRegionIntersectsCellRect(dirtyRegion, clipX, clipY, clipWidth, clipHeight)\n    ) {\n      return;\n    }\n\n    context.save();\n    context.beginPath();\n    context.rect(\n      clipX * metrics.cellWidth,\n      clipY * metrics.cellHeight,\n      clipWidth * metrics.cellWidth,\n      clipHeight * metrics.cellHeight\n    );\n    context.clip();\n    context.drawImage(\n      decodedImage,\n      boundsX * metrics.cellWidth,\n      boundsY * metrics.cellHeight,\n      boundsWidth * metrics.cellWidth,\n      boundsHeight * metrics.cellHeight\n    );\n    context.restore();\n  }\n\n  private cachedImage(\n    image: WebHostSurfaceImage\n  ): CanvasImageSource | undefined {\n    const cached = this.imageCache.get(image.id);\n    if (cached?.image) {\n      return cached.image;\n    }\n\n    if (!cached?.promise && image.dataBase64) {\n      const promise = decodeImage(image.dataBase64, image.format);\n      this.imageCache.set(image.id, { promise });\n      void promise.then((decodedImage) => {\n        const latest = this.imageCache.get(image.id);\n        if (latest?.promise !== promise) {\n          return;\n        }\n        this.imageCache.set(image.id, { image: decodedImage });\n        this.requestRedraw();\n      }).catch(() => {\n        this.imageCache.delete(image.id);\n      });\n    }\n\n    return undefined;\n  }\n\n  private drawCell(\n    context: CanvasRenderingContext2D,\n    metrics: CanvasSurfaceMetrics,\n    x: number,\n    y: number,\n    text: string,\n    span: number,\n    style?: WebHostSurfaceStyle | null\n  ): void {\n    const rectX = x * metrics.cellWidth;\n    const rectY = y * metrics.cellHeight;\n    const width = Math.max(1, span) * metrics.cellWidth;\n    const background = resolvedSurfaceBackground(style, metrics.style);\n    const foreground = resolvedSurfaceForeground(style, metrics.style);\n    const opacity = style?.opacity ?? 1;\n\n    if (background) {\n      context.globalAlpha = opacity;\n      context.fillStyle = background;\n      context.fillRect(rectX, rectY, width, metrics.cellHeight);\n    }\n\n    if (text !== \" \") {\n      context.globalAlpha = opacity;\n      context.fillStyle = foreground;\n      context.strokeStyle = foreground;\n      if (!canRenderBoxDrawing(text) || !drawBoxDrawing(context, text, {\n        x: rectX,\n        y: rectY,\n        width,\n        height: metrics.cellHeight,\n      })) {\n        context.font = fontForStyle(metrics.style, style);\n        context.fillText(\n          text,\n          rectX,\n          rectY + Math.floor((metrics.cellHeight + metrics.style.fontSize) / 2) - 2\n        );\n      }\n    }\n\n    this.drawTextLine(context, metrics, rectX, rectY, width, style?.underline, \"underline\", foreground);\n    this.drawTextLine(context, metrics, rectX, rectY, width, style?.strikethrough, \"strike\", foreground);\n    context.globalAlpha = 1;\n  }\n\n  private dirtyRegionForDamage(\n    damage: WebHostSurfaceDamage | undefined,\n    frame: WebHostSurfaceFrame,\n    metrics: CanvasSurfaceMetrics\n  ): DirtyRegion | undefined {\n    if (!damage || damage.requiresFullTextRepaint || damage.requiresFullGraphicsReplay) {\n      return undefined;\n    }\n\n    const rects: DirtyRect[] = [];\n    const rows = new Map<number, DirtyRowRanges>();\n    for (const [row, ranges] of damage.textRows) {\n      if (row < 0 || row >= frame.height) {\n        continue;\n      }\n      if (ranges.length === 0) {\n        rects.push(cellRect(metrics, 0, row, frame.width));\n        rows.set(row, \"full\");\n        continue;\n      }\n      const rowRanges: DirtyCellRange[] = rows.get(row) === \"full\"\n        ? []\n        : [...(rows.get(row) as DirtyCellRange[] | undefined ?? [])];\n      for (const [start, end] of ranges) {\n        const lowerBound = Math.max(0, Math.min(frame.width, Math.floor(start)));\n        const upperBound = Math.max(lowerBound, Math.min(frame.width, Math.ceil(end)));\n        if (lowerBound >= upperBound) {\n          continue;\n        }\n        rects.push(cellRect(metrics, lowerBound, row, upperBound - lowerBound));\n        rowRanges.push({ start: lowerBound, end: upperBound });\n      }\n      if (rows.get(row) !== \"full\" && rowRanges.length > 0) {\n        rows.set(row, normalizeCellRanges(rowRanges));\n      }\n    }\n    return { rects, rows };\n  }\n\n  private drawTextLine(\n    context: CanvasRenderingContext2D,\n    metrics: CanvasSurfaceMetrics,\n    x: number,\n    y: number,\n    width: number,\n    line: WebHostSurfaceStyle[\"underline\"],\n    placement: \"underline\" | \"strike\",\n    fallbackColor: string\n  ): void {\n    if (!line) {\n      return;\n    }\n    context.strokeStyle = line.color ?? fallbackColor;\n    context.lineWidth = line.pattern === \"double\" ? 2 : 1;\n    if (line.pattern === \"dot\") {\n      context.setLineDash([1, 3]);\n    } else if (line.pattern === \"dash\") {\n      context.setLineDash([4, 3]);\n    } else {\n      context.setLineDash([]);\n    }\n\n    const lineY = placement === \"underline\"\n      ? y + metrics.cellHeight - 2\n      : y + Math.floor(metrics.cellHeight / 2);\n    context.beginPath();\n    context.moveTo(x, lineY);\n    context.lineTo(x + width, lineY);\n    context.stroke();\n    context.setLineDash([]);\n  }\n}\n\n/**\n * The CSS font string for a cell, folding the surface emphasis bits (bold,\n * italic) over the host terminal's font size/family. Exposed so the host can\n * reuse the exact same metric when measuring cell dimensions.\n */\nexport function fontForStyle(\n  terminalStyle: ResolvedWebHostTerminalStyle,\n  style?: WebHostSurfaceStyle | null\n): string {\n  const emphasis = style?.em ?? 0;\n  const italic = (emphasis & 2) !== 0 ? \"italic \" : \"\";\n  const weight = (emphasis & 1) !== 0 ? \"700 \" : \"\";\n  return `${italic}${weight}${terminalStyle.fontSize}px ${terminalStyle.fontFamily}`;\n}\n\nfunction cellRect(\n  metrics: CanvasSurfaceMetrics,\n  x: number,\n  y: number,\n  span: number\n): DirtyRect {\n  return {\n    x: x * metrics.cellWidth,\n    y: y * metrics.cellHeight,\n    width: Math.max(1, span) * metrics.cellWidth,\n    height: metrics.cellHeight,\n  };\n}\n\nasync function decodeImage(\n  dataBase64: string,\n  format: NormalizedSurfaceImageFormat\n): Promise<CanvasImageSource> {\n  const bytes = decodeBase64Bytes(dataBase64);\n  const blob = new Blob([bytes], { type: `image/${format}` });\n\n  if (typeof createImageBitmap === \"function\") {\n    // Animated GIFs collapse to their first frame in createImageBitmap\n    // — that matches the Kitty path's first-frame composite. Phase 7\n    // will replace this with a frame ticker.\n    return createImageBitmap(blob);\n  }\n\n  return new Promise((resolve, reject) => {\n    const image = new Image();\n    const url = URL.createObjectURL(blob);\n    image.onload = () => {\n      URL.revokeObjectURL(url);\n      resolve(image);\n    };\n    image.onerror = () => {\n      URL.revokeObjectURL(url);\n      reject(new Error(`Failed to decode ${format} image`));\n    };\n    image.src = url;\n  });\n}\n\nfunction decodeBase64Bytes(\n  value: string\n): Uint8Array {\n  if (typeof atob === \"function\") {\n    const binary = atob(value);\n    const bytes = new Uint8Array(binary.length);\n    for (let index = 0; index < binary.length; index += 1) {\n      bytes[index] = binary.charCodeAt(index);\n    }\n    return bytes;\n  }\n\n  return new Uint8Array(Buffer.from(value, \"base64\"));\n}\n\nfunction normalizeCellRanges(\n  ranges: DirtyCellRange[]\n): DirtyCellRange[] {\n  const sorted = ranges\n    .filter((range) => range.end > range.start)\n    .sort((lhs, rhs) => lhs.start - rhs.start || lhs.end - rhs.end);\n  const normalized: DirtyCellRange[] = [];\n  for (const range of sorted) {\n    const previous = normalized[normalized.length - 1];\n    if (previous && range.start <= previous.end) {\n      previous.end = Math.max(previous.end, range.end);\n      continue;\n    }\n    normalized.push({ ...range });\n  }\n  return normalized;\n}\n\nfunction cellIntersectsRanges(\n  x: number,\n  span: number,\n  ranges: DirtyRowRanges\n): boolean {\n  if (ranges === \"full\") {\n    return true;\n  }\n  const start = Math.floor(x);\n  const end = start + Math.max(1, Math.ceil(span));\n  return ranges.some((range) => start < range.end && end > range.start);\n}\n\nfunction dirtyRegionIntersectsCellRect(\n  region: DirtyRegion,\n  x: number,\n  y: number,\n  width: number,\n  height: number\n): boolean {\n  const startRow = Math.max(0, Math.floor(y));\n  const endRow = Math.max(startRow, Math.ceil(y + height));\n  const rectRange = {\n    start: Math.floor(x),\n    end: Math.floor(x) + Math.max(1, Math.ceil(width)),\n  };\n  for (let row = startRow; row < endRow; row += 1) {\n    const ranges = region.rows.get(row);\n    if (!ranges) {\n      continue;\n    }\n    if (cellIntersectsRanges(rectRange.start, rectRange.end - rectRange.start, ranges)) {\n      return true;\n    }\n  }\n  return false;\n}\n"],"mappings":"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"}

package/dist/src/DomSurfacePainter.js

@@ -1,5 +1,6 @@
 import { webTUITerminalBackgroundColor } from "./WebHostTerminalStyle.js";
 import { resolvedSurfaceBackground, resolvedSurfaceForeground } from "./SurfaceRenderer.js";
+import { isSupportedImageFormat, normalizeScalingMode } from "./normalizeWireTokens.js";
 import { fontForStyle } from "./CanvasSurfacePainter.js";
 //#region src/DomSurfacePainter.ts
 /**
@@ -146,11 +147,16 @@ var DomSurfacePainter = class {
 		const layer = this.imagesLayer;
 		if (!layer) return;
 		const next = /* @__PURE__ */ new Map();
-		for (const image of images) {
+		for (const rawImage of images) {
+			if (!isSupportedImageFormat(rawImage.format)) continue;
+			const image = {
+				...rawImage,
+				scalingMode: normalizeScalingMode(rawImage.scalingMode)
+			};
 			const [boundsX, boundsY, boundsWidth, boundsHeight] = image.bounds;
 			const [clipX, clipY, clipWidth, clipHeight] = image.visibleBounds;
-			if (!image.dataBase64 || boundsWidth <= 0 || boundsHeight <= 0 || clipWidth <= 0 || clipHeight <= 0) continue;
 			const existing = this.renderedImages.get(image.id);
+			if (!existing && !image.dataBase64 || boundsWidth <= 0 || boundsHeight <= 0 || clipWidth <= 0 || clipHeight <= 0) continue;
 			const entry = existing ?? makeImageEntry();
 			entry.container.style.left = `${clipX * metrics.cellWidth}px`;
 			entry.container.style.top = `${clipY * metrics.cellHeight}px`;
@@ -160,10 +166,12 @@ var DomSurfacePainter = class {
 			entry.image.style.top = `${(boundsY - clipY) * metrics.cellHeight}px`;
 			entry.image.style.width = `${boundsWidth * metrics.cellWidth}px`;
 			entry.image.style.height = `${boundsHeight * metrics.cellHeight}px`;
-			const source = `data:image/${image.format};base64,${image.dataBase64}`;
-			if (entry.source !== source) {
-				entry.image.setAttribute("src", source);
-				entry.source = source;
+			if (image.dataBase64) {
+				const source = `data:image/${image.format};base64,${image.dataBase64}`;
+				if (entry.source !== source) {
+					entry.image.setAttribute("src", source);
+					entry.source = source;
+				}
 			}
 			if (!existing) layer.appendChild(entry.container);
 			next.set(image.id, entry);

package/dist/src/DomSurfacePainter.js.map

@@ -1 +1 @@
-{"version":3,"file":"DomSurfacePainter.js","names":[],"sources":["../../src/DomSurfacePainter.ts"],"sourcesContent":["import { fontForStyle } from \"./CanvasSurfacePainter.ts\";\nimport {\n  resolvedSurfaceBackground,\n  resolvedSurfaceForeground,\n  type SurfaceMetrics,\n  type WebHostSurfacePainter,\n} from \"./SurfaceRenderer.ts\";\nimport { webTUITerminalBackgroundColor } from \"./WebHostTerminalStyle.ts\";\nimport type {\n  WebHostSurfaceDamage,\n  WebHostSurfaceFrame,\n  WebHostSurfaceImage,\n  WebHostSurfaceLineStyle,\n  WebHostSurfaceStyle,\n} from \"./WebHostSurfaceTransport.ts\";\n\ninterface RenderedImage {\n  container: HTMLElement;\n  image: HTMLElement;\n  source: string;\n}\n\n/**\n * Draws SwiftTUI surface frames as a DOM element tree instead of canvas\n * pixels: one absolutely positioned row container per grid row, one `<span>`\n * per styled cell run, and `<img>` elements for surface images.\n *\n * Rendering cells as real text buys what canvas cannot offer — the browser's\n * own font shaping and fallback (emoji, CJK), crisp text at any page zoom, an\n * inspectable tree, and native text selection — at the cost of pixel-exact\n * box-drawing seams, which render as font glyphs here rather than the canvas\n * painter's hand-drawn strokes.\n *\n * Damage handling mirrors the canvas painter at row granularity: a frame\n * carrying scoped damage rebuilds only the touched rows' elements; geometry\n * or style changes force a full rebuild. Grid alignment across a run is kept\n * exact by stretching each glyph advance to the cell width via\n * `letter-spacing`, measured once per font/size pair.\n */\nexport class DomSurfacePainter implements WebHostSurfacePainter {\n  private root?: HTMLElement;\n  private rowsLayer?: HTMLElement;\n  private imagesLayer?: HTMLElement;\n  private rowElements: HTMLElement[] = [];\n  private renderedImages = new Map<string, RenderedImage>();\n  private appliedMetricsKey?: string;\n  private renderedGridKey?: string;\n  private hasRenderedFrame = false;\n  private letterSpacing?: { key: string; value: string };\n\n  /**\n   * Binds the container the painter renders into. The runtime owns the\n   * container's size; the painter owns everything inside it.\n   */\n  attach(\n    root: HTMLElement\n  ): void {\n    this.root = root;\n\n    const rowsLayer = createElement(\"div\");\n    rowsLayer.className = \"webhost-scene__surface-rows\";\n    fillContainer(rowsLayer.style);\n\n    const imagesLayer = createElement(\"div\");\n    imagesLayer.className = \"webhost-scene__surface-images\";\n    fillContainer(imagesLayer.style);\n    imagesLayer.style.pointerEvents = \"none\";\n\n    this.rowsLayer = rowsLayer;\n    this.imagesLayer = imagesLayer;\n    root.replaceChildren(rowsLayer, imagesLayer);\n    this.rowElements = [];\n    this.renderedImages = new Map();\n    this.appliedMetricsKey = undefined;\n    this.renderedGridKey = undefined;\n    this.hasRenderedFrame = false;\n  }\n\n  paint(\n    metrics: SurfaceMetrics,\n    frame: WebHostSurfaceFrame | undefined,\n    damage?: WebHostSurfaceDamage\n  ): void {\n    const root = this.root;\n    const rowsLayer = this.rowsLayer;\n    if (!root || !rowsLayer) {\n      return;\n    }\n\n    const metricsKey = metricsKeyFor(metrics);\n    const metricsChanged = metricsKey !== this.appliedMetricsKey;\n    if (metricsChanged) {\n      this.applyRootStyle(root, metrics);\n      this.appliedMetricsKey = metricsKey;\n    }\n\n    if (!frame) {\n      this.rowElements = [];\n      rowsLayer.replaceChildren();\n      this.reconcileImages([], metrics);\n      this.renderedGridKey = undefined;\n      this.hasRenderedFrame = false;\n      return;\n    }\n\n    const gridKey = `${frame.width}x${frame.height}x${frame.rows.length}`;\n    const fullRepaint = metricsChanged\n      || !this.hasRenderedFrame\n      || gridKey !== this.renderedGridKey\n      || !damage\n      || damage.requiresFullTextRepaint\n      || damage.requiresFullGraphicsReplay;\n    this.renderedGridKey = gridKey;\n\n    if (fullRepaint) {\n      for (let y = this.rowElements.length; y > frame.rows.length; y -= 1) {\n        this.rowElements[y - 1]?.remove();\n      }\n      this.rowElements.length = Math.min(this.rowElements.length, frame.rows.length);\n      for (let y = 0; y < frame.rows.length; y += 1) {\n        this.rebuildRow(y, frame, metrics);\n      }\n    } else {\n      for (const [row] of damage.textRows) {\n        if (row < 0 || row >= frame.rows.length) {\n          continue;\n        }\n        this.rebuildRow(row, frame, metrics);\n      }\n    }\n\n    this.reconcileImages(frame.images ?? [], metrics);\n    this.hasRenderedFrame = true;\n  }\n\n  private rebuildRow(\n    y: number,\n    frame: WebHostSurfaceFrame,\n    metrics: SurfaceMetrics\n  ): void {\n    const rowElement = this.ensureRowElement(y, metrics);\n    const children: HTMLElement[] = [];\n    for (const [x, text, span, styleIndex] of frame.rows[y] ?? []) {\n      const cellElement = buildCellElement(\n        x,\n        text,\n        span,\n        frame.styles[styleIndex] ?? undefined,\n        metrics\n      );\n      if (cellElement) {\n        children.push(cellElement);\n      }\n    }\n    rowElement.replaceChildren(...children);\n  }\n\n  private ensureRowElement(\n    y: number,\n    metrics: SurfaceMetrics\n  ): HTMLElement {\n    let rowElement = this.rowElements[y];\n    if (!rowElement) {\n      rowElement = createElement(\"div\");\n      rowElement.className = \"webhost-scene__surface-row\";\n      rowElement.style.position = \"absolute\";\n      rowElement.style.left = \"0\";\n      this.rowElements[y] = rowElement;\n      this.rowsLayer?.appendChild(rowElement);\n    }\n    rowElement.style.top = `${y * metrics.cellHeight}px`;\n    rowElement.style.height = `${metrics.cellHeight}px`;\n    rowElement.style.width = `${metrics.columns * metrics.cellWidth}px`;\n    return rowElement;\n  }\n\n  private applyRootStyle(\n    root: HTMLElement,\n    metrics: SurfaceMetrics\n  ): void {\n    const style = root.style;\n    style.position = \"relative\";\n    style.overflow = \"hidden\";\n    style.background = webTUITerminalBackgroundColor(metrics.style);\n    style.font = fontForStyle(metrics.style);\n    // Set after `font`: the shorthand resets line-height, and the grid needs\n    // every row to be exactly one cell tall.\n    style.lineHeight = `${metrics.cellHeight}px`;\n    style.letterSpacing = this.letterSpacingFor(metrics);\n    // Ligature-capable monospace fonts would merge runs like \"->\" into one\n    // glyph and break the column grid.\n    style.fontVariantLigatures = \"none\";\n    style.userSelect = \"text\";\n  }\n\n  /**\n   * The per-glyph advance correction that stretches the font's natural\n   * monospace advance to exactly `cellWidth`, so long runs stay on the cell\n   * grid instead of drifting by the sub-pixel remainder of the runtime's\n   * ceil'd cell measurement.\n   */\n  private letterSpacingFor(\n    metrics: SurfaceMetrics\n  ): string {\n    const font = fontForStyle(metrics.style);\n    const key = `${font}|${metrics.cellWidth}`;\n    if (this.letterSpacing?.key === key) {\n      return this.letterSpacing.value;\n    }\n\n    let value = \"0px\";\n    const canvas = createElement(\"canvas\") as HTMLCanvasElement;\n    const context = canvas.getContext?.(\"2d\");\n    if (context) {\n      context.font = font;\n      const advance = context.measureText(\"W\").width;\n      const correction = metrics.cellWidth - advance;\n      if (advance > 0 && Math.abs(correction) >= 0.01) {\n        value = `${Math.round(correction * 1000) / 1000}px`;\n      }\n    }\n\n    this.letterSpacing = { key, value };\n    return value;\n  }\n\n  private reconcileImages(\n    images: WebHostSurfaceImage[],\n    metrics: SurfaceMetrics\n  ): void {\n    const layer = this.imagesLayer;\n    if (!layer) {\n      return;\n    }\n\n    const next = new Map<string, RenderedImage>();\n    for (const image of images) {\n      const [boundsX, boundsY, boundsWidth, boundsHeight] = image.bounds;\n      const [clipX, clipY, clipWidth, clipHeight] = image.visibleBounds;\n      if (\n        !image.dataBase64\n        || boundsWidth <= 0\n        || boundsHeight <= 0\n        || clipWidth <= 0\n        || clipHeight <= 0\n      ) {\n        continue;\n      }\n\n      const existing = this.renderedImages.get(image.id);\n      const entry = existing ?? makeImageEntry();\n      entry.container.style.left = `${clipX * metrics.cellWidth}px`;\n      entry.container.style.top = `${clipY * metrics.cellHeight}px`;\n      entry.container.style.width = `${clipWidth * metrics.cellWidth}px`;\n      entry.container.style.height = `${clipHeight * metrics.cellHeight}px`;\n      entry.image.style.left = `${(boundsX - clipX) * metrics.cellWidth}px`;\n      entry.image.style.top = `${(boundsY - clipY) * metrics.cellHeight}px`;\n      entry.image.style.width = `${boundsWidth * metrics.cellWidth}px`;\n      entry.image.style.height = `${boundsHeight * metrics.cellHeight}px`;\n\n      const source = `data:image/${image.format};base64,${image.dataBase64}`;\n      if (entry.source !== source) {\n        entry.image.setAttribute(\"src\", source);\n        entry.source = source;\n      }\n      if (!existing) {\n        layer.appendChild(entry.container);\n      }\n      next.set(image.id, entry);\n    }\n\n    for (const [id, entry] of this.renderedImages) {\n      if (!next.has(id)) {\n        entry.container.remove();\n      }\n    }\n    this.renderedImages = next;\n  }\n}\n\n/**\n * A change key over everything the rendered tree bakes into element styles —\n * grid geometry, font, and theme colors. A key change invalidates every\n * rendered row, so the next paint restyles the root and rebuilds in full.\n */\nfunction metricsKeyFor(\n  metrics: SurfaceMetrics\n): string {\n  return [\n    metrics.columns,\n    metrics.rows,\n    metrics.cellWidth,\n    metrics.cellHeight,\n    fontForStyle(metrics.style),\n    metrics.style.theme.foreground,\n    metrics.style.theme.background,\n    metrics.style.theme.windowBackground,\n    metrics.style.backgroundOpacity,\n  ].join(\"|\");\n}\n\nfunction buildCellElement(\n  x: number,\n  text: string,\n  span: number,\n  style: WebHostSurfaceStyle | undefined,\n  metrics: SurfaceMetrics\n): HTMLElement | undefined {\n  const background = resolvedSurfaceBackground(style, metrics.style);\n  const hasDecoration = Boolean(style?.underline || style?.strikethrough);\n  if (!background && !hasDecoration && text.trim() === \"\") {\n    return undefined;\n  }\n\n  const element = createElement(\"span\");\n  element.textContent = text;\n  const elementStyle = element.style;\n  elementStyle.position = \"absolute\";\n  elementStyle.left = `${x * metrics.cellWidth}px`;\n  elementStyle.top = \"0\";\n  elementStyle.width = `${Math.max(1, span) * metrics.cellWidth}px`;\n  elementStyle.height = \"100%\";\n  elementStyle.whiteSpace = \"pre\";\n  elementStyle.color = resolvedSurfaceForeground(style, metrics.style);\n  if (background) {\n    elementStyle.backgroundColor = background;\n  }\n\n  const emphasis = style?.em ?? 0;\n  if (emphasis & 1) {\n    elementStyle.fontWeight = \"700\";\n  }\n  if (emphasis & 2) {\n    elementStyle.fontStyle = \"italic\";\n  }\n\n  const opacity = style?.opacity ?? 1;\n  if (opacity !== 1) {\n    elementStyle.opacity = String(opacity);\n  }\n\n  applyTextDecoration(elementStyle, style);\n  return element;\n}\n\nfunction applyTextDecoration(\n  elementStyle: CSSStyleDeclaration,\n  style: WebHostSurfaceStyle | undefined\n): void {\n  const lines: string[] = [];\n  if (style?.underline) {\n    lines.push(\"underline\");\n  }\n  if (style?.strikethrough) {\n    lines.push(\"line-through\");\n  }\n  if (lines.length === 0) {\n    return;\n  }\n\n  elementStyle.textDecorationLine = lines.join(\" \");\n  const pattern = style?.underline?.pattern ?? style?.strikethrough?.pattern;\n  elementStyle.textDecorationStyle = decorationStyleFor(pattern);\n  // CSS shares one decoration color across both lines; the underline's color\n  // wins when the app styles them differently.\n  const color = style?.underline?.color ?? style?.strikethrough?.color;\n  if (color) {\n    elementStyle.textDecorationColor = color;\n  }\n}\n\nfunction decorationStyleFor(\n  pattern: WebHostSurfaceLineStyle[\"pattern\"] | undefined\n): string {\n  switch (pattern) {\n  case \"dot\":\n    return \"dotted\";\n  case \"dash\":\n  case \"dashDot\":\n  case \"dashDotDot\":\n    return \"dashed\";\n  case \"double\":\n    return \"double\";\n  case \"curly\":\n    return \"wavy\";\n  default:\n    return \"solid\";\n  }\n}\n\nfunction fillContainer(\n  style: CSSStyleDeclaration\n): void {\n  style.position = \"absolute\";\n  style.left = \"0\";\n  style.top = \"0\";\n  style.width = \"100%\";\n  style.height = \"100%\";\n}\n\nfunction makeImageEntry(): RenderedImage {\n  const container = createElement(\"div\");\n  container.className = \"webhost-scene__surface-image\";\n  container.style.position = \"absolute\";\n  container.style.overflow = \"hidden\";\n\n  const image = createElement(\"img\");\n  image.style.position = \"absolute\";\n  image.setAttribute(\"alt\", \"\");\n  image.setAttribute(\"draggable\", \"false\");\n  container.appendChild(image);\n  return { container, image, source: \"\" };\n}\n\nfunction createElement(\n  tagName: string\n): HTMLElement {\n  if (typeof document === \"undefined\") {\n    throw new Error(\"document is not available\");\n  }\n  return document.createElement(tagName);\n}\n"],"mappings":"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"}
+{"version":3,"file":"DomSurfacePainter.js","names":[],"sources":["../../src/DomSurfacePainter.ts"],"sourcesContent":["import { fontForStyle } from \"./CanvasSurfacePainter.ts\";\nimport {\n  resolvedSurfaceBackground,\n  resolvedSurfaceForeground,\n  type SurfaceMetrics,\n  type WebHostSurfacePainter,\n} from \"./SurfaceRenderer.ts\";\nimport { webTUITerminalBackgroundColor } from \"./WebHostTerminalStyle.ts\";\nimport {\n  isSupportedImageFormat,\n  normalizeScalingMode,\n} from \"./normalizeWireTokens.ts\";\nimport type {\n  WebHostSurfaceDamage,\n  WebHostSurfaceFrame,\n  WebHostSurfaceImage,\n  WebHostSurfaceLineStyle,\n  WebHostSurfaceStyle,\n} from \"./WebHostSurfaceTransport.ts\";\n\ninterface RenderedImage {\n  container: HTMLElement;\n  image: HTMLElement;\n  source: string;\n}\n\n/**\n * Draws SwiftTUI surface frames as a DOM element tree instead of canvas\n * pixels: one absolutely positioned row container per grid row, one `<span>`\n * per styled cell run, and `<img>` elements for surface images.\n *\n * Rendering cells as real text buys what canvas cannot offer — the browser's\n * own font shaping and fallback (emoji, CJK), crisp text at any page zoom, an\n * inspectable tree, and native text selection — at the cost of pixel-exact\n * box-drawing seams, which render as font glyphs here rather than the canvas\n * painter's hand-drawn strokes.\n *\n * Damage handling mirrors the canvas painter at row granularity: a frame\n * carrying scoped damage rebuilds only the touched rows' elements; geometry\n * or style changes force a full rebuild. Grid alignment across a run is kept\n * exact by stretching each glyph advance to the cell width via\n * `letter-spacing`, measured once per font/size pair.\n */\nexport class DomSurfacePainter implements WebHostSurfacePainter {\n  private root?: HTMLElement;\n  private rowsLayer?: HTMLElement;\n  private imagesLayer?: HTMLElement;\n  private rowElements: HTMLElement[] = [];\n  private renderedImages = new Map<string, RenderedImage>();\n  private appliedMetricsKey?: string;\n  private renderedGridKey?: string;\n  private hasRenderedFrame = false;\n  private letterSpacing?: { key: string; value: string };\n\n  /**\n   * Binds the container the painter renders into. The runtime owns the\n   * container's size; the painter owns everything inside it.\n   */\n  attach(\n    root: HTMLElement\n  ): void {\n    this.root = root;\n\n    const rowsLayer = createElement(\"div\");\n    rowsLayer.className = \"webhost-scene__surface-rows\";\n    fillContainer(rowsLayer.style);\n\n    const imagesLayer = createElement(\"div\");\n    imagesLayer.className = \"webhost-scene__surface-images\";\n    fillContainer(imagesLayer.style);\n    imagesLayer.style.pointerEvents = \"none\";\n\n    this.rowsLayer = rowsLayer;\n    this.imagesLayer = imagesLayer;\n    root.replaceChildren(rowsLayer, imagesLayer);\n    this.rowElements = [];\n    this.renderedImages = new Map();\n    this.appliedMetricsKey = undefined;\n    this.renderedGridKey = undefined;\n    this.hasRenderedFrame = false;\n  }\n\n  paint(\n    metrics: SurfaceMetrics,\n    frame: WebHostSurfaceFrame | undefined,\n    damage?: WebHostSurfaceDamage\n  ): void {\n    const root = this.root;\n    const rowsLayer = this.rowsLayer;\n    if (!root || !rowsLayer) {\n      return;\n    }\n\n    const metricsKey = metricsKeyFor(metrics);\n    const metricsChanged = metricsKey !== this.appliedMetricsKey;\n    if (metricsChanged) {\n      this.applyRootStyle(root, metrics);\n      this.appliedMetricsKey = metricsKey;\n    }\n\n    if (!frame) {\n      this.rowElements = [];\n      rowsLayer.replaceChildren();\n      this.reconcileImages([], metrics);\n      this.renderedGridKey = undefined;\n      this.hasRenderedFrame = false;\n      return;\n    }\n\n    const gridKey = `${frame.width}x${frame.height}x${frame.rows.length}`;\n    const fullRepaint = metricsChanged\n      || !this.hasRenderedFrame\n      || gridKey !== this.renderedGridKey\n      || !damage\n      || damage.requiresFullTextRepaint\n      || damage.requiresFullGraphicsReplay;\n    this.renderedGridKey = gridKey;\n\n    if (fullRepaint) {\n      for (let y = this.rowElements.length; y > frame.rows.length; y -= 1) {\n        this.rowElements[y - 1]?.remove();\n      }\n      this.rowElements.length = Math.min(this.rowElements.length, frame.rows.length);\n      for (let y = 0; y < frame.rows.length; y += 1) {\n        this.rebuildRow(y, frame, metrics);\n      }\n    } else {\n      for (const [row] of damage.textRows) {\n        if (row < 0 || row >= frame.rows.length) {\n          continue;\n        }\n        this.rebuildRow(row, frame, metrics);\n      }\n    }\n\n    this.reconcileImages(frame.images ?? [], metrics);\n    this.hasRenderedFrame = true;\n  }\n\n  private rebuildRow(\n    y: number,\n    frame: WebHostSurfaceFrame,\n    metrics: SurfaceMetrics\n  ): void {\n    const rowElement = this.ensureRowElement(y, metrics);\n    const children: HTMLElement[] = [];\n    for (const [x, text, span, styleIndex] of frame.rows[y] ?? []) {\n      const cellElement = buildCellElement(\n        x,\n        text,\n        span,\n        frame.styles[styleIndex] ?? undefined,\n        metrics\n      );\n      if (cellElement) {\n        children.push(cellElement);\n      }\n    }\n    rowElement.replaceChildren(...children);\n  }\n\n  private ensureRowElement(\n    y: number,\n    metrics: SurfaceMetrics\n  ): HTMLElement {\n    let rowElement = this.rowElements[y];\n    if (!rowElement) {\n      rowElement = createElement(\"div\");\n      rowElement.className = \"webhost-scene__surface-row\";\n      rowElement.style.position = \"absolute\";\n      rowElement.style.left = \"0\";\n      this.rowElements[y] = rowElement;\n      this.rowsLayer?.appendChild(rowElement);\n    }\n    rowElement.style.top = `${y * metrics.cellHeight}px`;\n    rowElement.style.height = `${metrics.cellHeight}px`;\n    rowElement.style.width = `${metrics.columns * metrics.cellWidth}px`;\n    return rowElement;\n  }\n\n  private applyRootStyle(\n    root: HTMLElement,\n    metrics: SurfaceMetrics\n  ): void {\n    const style = root.style;\n    style.position = \"relative\";\n    style.overflow = \"hidden\";\n    style.background = webTUITerminalBackgroundColor(metrics.style);\n    style.font = fontForStyle(metrics.style);\n    // Set after `font`: the shorthand resets line-height, and the grid needs\n    // every row to be exactly one cell tall.\n    style.lineHeight = `${metrics.cellHeight}px`;\n    style.letterSpacing = this.letterSpacingFor(metrics);\n    // Ligature-capable monospace fonts would merge runs like \"->\" into one\n    // glyph and break the column grid.\n    style.fontVariantLigatures = \"none\";\n    style.userSelect = \"text\";\n  }\n\n  /**\n   * The per-glyph advance correction that stretches the font's natural\n   * monospace advance to exactly `cellWidth`, so long runs stay on the cell\n   * grid instead of drifting by the sub-pixel remainder of the runtime's\n   * ceil'd cell measurement.\n   */\n  private letterSpacingFor(\n    metrics: SurfaceMetrics\n  ): string {\n    const font = fontForStyle(metrics.style);\n    const key = `${font}|${metrics.cellWidth}`;\n    if (this.letterSpacing?.key === key) {\n      return this.letterSpacing.value;\n    }\n\n    let value = \"0px\";\n    const canvas = createElement(\"canvas\") as HTMLCanvasElement;\n    const context = canvas.getContext?.(\"2d\");\n    if (context) {\n      context.font = font;\n      const advance = context.measureText(\"W\").width;\n      const correction = metrics.cellWidth - advance;\n      if (advance > 0 && Math.abs(correction) >= 0.01) {\n        value = `${Math.round(correction * 1000) / 1000}px`;\n      }\n    }\n\n    this.letterSpacing = { key, value };\n    return value;\n  }\n\n  private reconcileImages(\n    images: WebHostSurfaceImage[],\n    metrics: SurfaceMetrics\n  ): void {\n    const layer = this.imagesLayer;\n    if (!layer) {\n      return;\n    }\n\n    const next = new Map<string, RenderedImage>();\n    for (const rawImage of images) {\n      if (!isSupportedImageFormat(rawImage.format)) {\n        continue;\n      }\n      const image = {\n        ...rawImage,\n        scalingMode: normalizeScalingMode(rawImage.scalingMode),\n      };\n      const [boundsX, boundsY, boundsWidth, boundsHeight] = image.bounds;\n      const [clipX, clipY, clipWidth, clipHeight] = image.visibleBounds;\n      const existing = this.renderedImages.get(image.id);\n      if (\n        (!existing && !image.dataBase64)\n        || boundsWidth <= 0\n        || boundsHeight <= 0\n        || clipWidth <= 0\n        || clipHeight <= 0\n      ) {\n        continue;\n      }\n\n      const entry = existing ?? makeImageEntry();\n      entry.container.style.left = `${clipX * metrics.cellWidth}px`;\n      entry.container.style.top = `${clipY * metrics.cellHeight}px`;\n      entry.container.style.width = `${clipWidth * metrics.cellWidth}px`;\n      entry.container.style.height = `${clipHeight * metrics.cellHeight}px`;\n      entry.image.style.left = `${(boundsX - clipX) * metrics.cellWidth}px`;\n      entry.image.style.top = `${(boundsY - clipY) * metrics.cellHeight}px`;\n      entry.image.style.width = `${boundsWidth * metrics.cellWidth}px`;\n      entry.image.style.height = `${boundsHeight * metrics.cellHeight}px`;\n\n      if (image.dataBase64) {\n        const source = `data:image/${image.format};base64,${image.dataBase64}`;\n        if (entry.source !== source) {\n          entry.image.setAttribute(\"src\", source);\n          entry.source = source;\n        }\n      }\n      if (!existing) {\n        layer.appendChild(entry.container);\n      }\n      next.set(image.id, entry);\n    }\n\n    for (const [id, entry] of this.renderedImages) {\n      if (!next.has(id)) {\n        entry.container.remove();\n      }\n    }\n    this.renderedImages = next;\n  }\n}\n\n/**\n * A change key over everything the rendered tree bakes into element styles —\n * grid geometry, font, and theme colors. A key change invalidates every\n * rendered row, so the next paint restyles the root and rebuilds in full.\n */\nfunction metricsKeyFor(\n  metrics: SurfaceMetrics\n): string {\n  return [\n    metrics.columns,\n    metrics.rows,\n    metrics.cellWidth,\n    metrics.cellHeight,\n    fontForStyle(metrics.style),\n    metrics.style.theme.foreground,\n    metrics.style.theme.background,\n    metrics.style.theme.windowBackground,\n    metrics.style.backgroundOpacity,\n  ].join(\"|\");\n}\n\nfunction buildCellElement(\n  x: number,\n  text: string,\n  span: number,\n  style: WebHostSurfaceStyle | undefined,\n  metrics: SurfaceMetrics\n): HTMLElement | undefined {\n  const background = resolvedSurfaceBackground(style, metrics.style);\n  const hasDecoration = Boolean(style?.underline || style?.strikethrough);\n  if (!background && !hasDecoration && text.trim() === \"\") {\n    return undefined;\n  }\n\n  const element = createElement(\"span\");\n  element.textContent = text;\n  const elementStyle = element.style;\n  elementStyle.position = \"absolute\";\n  elementStyle.left = `${x * metrics.cellWidth}px`;\n  elementStyle.top = \"0\";\n  elementStyle.width = `${Math.max(1, span) * metrics.cellWidth}px`;\n  elementStyle.height = \"100%\";\n  elementStyle.whiteSpace = \"pre\";\n  elementStyle.color = resolvedSurfaceForeground(style, metrics.style);\n  if (background) {\n    elementStyle.backgroundColor = background;\n  }\n\n  const emphasis = style?.em ?? 0;\n  if (emphasis & 1) {\n    elementStyle.fontWeight = \"700\";\n  }\n  if (emphasis & 2) {\n    elementStyle.fontStyle = \"italic\";\n  }\n\n  const opacity = style?.opacity ?? 1;\n  if (opacity !== 1) {\n    elementStyle.opacity = String(opacity);\n  }\n\n  applyTextDecoration(elementStyle, style);\n  return element;\n}\n\nfunction applyTextDecoration(\n  elementStyle: CSSStyleDeclaration,\n  style: WebHostSurfaceStyle | undefined\n): void {\n  const lines: string[] = [];\n  if (style?.underline) {\n    lines.push(\"underline\");\n  }\n  if (style?.strikethrough) {\n    lines.push(\"line-through\");\n  }\n  if (lines.length === 0) {\n    return;\n  }\n\n  elementStyle.textDecorationLine = lines.join(\" \");\n  const pattern = style?.underline?.pattern ?? style?.strikethrough?.pattern;\n  elementStyle.textDecorationStyle = decorationStyleFor(pattern);\n  // CSS shares one decoration color across both lines; the underline's color\n  // wins when the app styles them differently.\n  const color = style?.underline?.color ?? style?.strikethrough?.color;\n  if (color) {\n    elementStyle.textDecorationColor = color;\n  }\n}\n\nfunction decorationStyleFor(\n  pattern: WebHostSurfaceLineStyle[\"pattern\"] | undefined\n): string {\n  switch (pattern) {\n  case \"dot\":\n    return \"dotted\";\n  case \"dash\":\n  case \"dashDot\":\n  case \"dashDotDot\":\n    return \"dashed\";\n  case \"double\":\n    return \"double\";\n  case \"curly\":\n    return \"wavy\";\n  default:\n    return \"solid\";\n  }\n}\n\nfunction fillContainer(\n  style: CSSStyleDeclaration\n): void {\n  style.position = \"absolute\";\n  style.left = \"0\";\n  style.top = \"0\";\n  style.width = \"100%\";\n  style.height = \"100%\";\n}\n\nfunction makeImageEntry(): RenderedImage {\n  const container = createElement(\"div\");\n  container.className = \"webhost-scene__surface-image\";\n  container.style.position = \"absolute\";\n  container.style.overflow = \"hidden\";\n\n  const image = createElement(\"img\");\n  image.style.position = \"absolute\";\n  image.setAttribute(\"alt\", \"\");\n  image.setAttribute(\"draggable\", \"false\");\n  container.appendChild(image);\n  return { container, image, source: \"\" };\n}\n\nfunction createElement(\n  tagName: string\n): HTMLElement {\n  if (typeof document === \"undefined\") {\n    throw new Error(\"document is not available\");\n  }\n  return document.createElement(tagName);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA2CA,IAAa,oBAAb,MAAgE;CAC9D;CACA;CACA;CACA,cAAqC,CAAC;CACtC,iCAAyB,IAAI,IAA2B;CACxD;CACA;CACA,mBAA2B;CAC3B;;;;;CAMA,OACE,MACM;EACN,KAAK,OAAO;EAEZ,MAAM,YAAY,cAAc,KAAK;EACrC,UAAU,YAAY;EACtB,cAAc,UAAU,KAAK;EAE7B,MAAM,cAAc,cAAc,KAAK;EACvC,YAAY,YAAY;EACxB,cAAc,YAAY,KAAK;EAC/B,YAAY,MAAM,gBAAgB;EAElC,KAAK,YAAY;EACjB,KAAK,cAAc;EACnB,KAAK,gBAAgB,WAAW,WAAW;EAC3C,KAAK,cAAc,CAAC;EACpB,KAAK,iCAAiB,IAAI,IAAI;EAC9B,KAAK,oBAAoB,KAAA;EACzB,KAAK,kBAAkB,KAAA;EACvB,KAAK,mBAAmB;CAC1B;CAEA,MACE,SACA,OACA,QACM;EACN,MAAM,OAAO,KAAK;EAClB,MAAM,YAAY,KAAK;EACvB,IAAI,CAAC,QAAQ,CAAC,WACZ;EAGF,MAAM,aAAa,cAAc,OAAO;EACxC,MAAM,iBAAiB,eAAe,KAAK;EAC3C,IAAI,gBAAgB;GAClB,KAAK,eAAe,MAAM,OAAO;GACjC,KAAK,oBAAoB;EAC3B;EAEA,IAAI,CAAC,OAAO;GACV,KAAK,cAAc,CAAC;GACpB,UAAU,gBAAgB;GAC1B,KAAK,gBAAgB,CAAC,GAAG,OAAO;GAChC,KAAK,kBAAkB,KAAA;GACvB,KAAK,mBAAmB;GACxB;EACF;EAEA,MAAM,UAAU,GAAG,MAAM,MAAM,GAAG,MAAM,OAAO,GAAG,MAAM,KAAK;EAC7D,MAAM,cAAc,kBACf,CAAC,KAAK,oBACN,YAAY,KAAK,mBACjB,CAAC,UACD,OAAO,2BACP,OAAO;EACZ,KAAK,kBAAkB;EAEvB,IAAI,aAAa;GACf,KAAK,IAAI,IAAI,KAAK,YAAY,QAAQ,IAAI,MAAM,KAAK,QAAQ,KAAK,GAChE,KAAK,YAAY,IAAI,EAAE,EAAE,OAAO;GAElC,KAAK,YAAY,SAAS,KAAK,IAAI,KAAK,YAAY,QAAQ,MAAM,KAAK,MAAM;GAC7E,KAAK,IAAI,IAAI,GAAG,IAAI,MAAM,KAAK,QAAQ,KAAK,GAC1C,KAAK,WAAW,GAAG,OAAO,OAAO;EAErC,OACE,KAAK,MAAM,CAAC,QAAQ,OAAO,UAAU;GACnC,IAAI,MAAM,KAAK,OAAO,MAAM,KAAK,QAC/B;GAEF,KAAK,WAAW,KAAK,OAAO,OAAO;EACrC;EAGF,KAAK,gBAAgB,MAAM,UAAU,CAAC,GAAG,OAAO;EAChD,KAAK,mBAAmB;CAC1B;CAEA,WACE,GACA,OACA,SACM;EACN,MAAM,aAAa,KAAK,iBAAiB,GAAG,OAAO;EACnD,MAAM,WAA0B,CAAC;EACjC,KAAK,MAAM,CAAC,GAAG,MAAM,MAAM,eAAe,MAAM,KAAK,MAAM,CAAC,GAAG;GAC7D,MAAM,cAAc,iBAClB,GACA,MACA,MACA,MAAM,OAAO,eAAe,KAAA,GAC5B,OACF;GACA,IAAI,aACF,SAAS,KAAK,WAAW;EAE7B;EACA,WAAW,gBAAgB,GAAG,QAAQ;CACxC;CAEA,iBACE,GACA,SACa;EACb,IAAI,aAAa,KAAK,YAAY;EAClC,IAAI,CAAC,YAAY;GACf,aAAa,cAAc,KAAK;GAChC,WAAW,YAAY;GACvB,WAAW,MAAM,WAAW;GAC5B,WAAW,MAAM,OAAO;GACxB,KAAK,YAAY,KAAK;GACtB,KAAK,WAAW,YAAY,UAAU;EACxC;EACA,WAAW,MAAM,MAAM,GAAG,IAAI,QAAQ,WAAW;EACjD,WAAW,MAAM,SAAS,GAAG,QAAQ,WAAW;EAChD,WAAW,MAAM,QAAQ,GAAG,QAAQ,UAAU,QAAQ,UAAU;EAChE,OAAO;CACT;CAEA,eACE,MACA,SACM;EACN,MAAM,QAAQ,KAAK;EACnB,MAAM,WAAW;EACjB,MAAM,WAAW;EACjB,MAAM,aAAa,8BAA8B,QAAQ,KAAK;EAC9D,MAAM,OAAO,aAAa,QAAQ,KAAK;EAGvC,MAAM,aAAa,GAAG,QAAQ,WAAW;EACzC,MAAM,gBAAgB,KAAK,iBAAiB,OAAO;EAGnD,MAAM,uBAAuB;EAC7B,MAAM,aAAa;CACrB;;;;;;;CAQA,iBACE,SACQ;EACR,MAAM,OAAO,aAAa,QAAQ,KAAK;EACvC,MAAM,MAAM,GAAG,KAAK,GAAG,QAAQ;EAC/B,IAAI,KAAK,eAAe,QAAQ,KAC9B,OAAO,KAAK,cAAc;EAG5B,IAAI,QAAQ;EAEZ,MAAM,UADS,cAAc,QACR,CAAC,CAAC,aAAa,IAAI;EACxC,IAAI,SAAS;GACX,QAAQ,OAAO;GACf,MAAM,UAAU,QAAQ,YAAY,GAAG,CAAC,CAAC;GACzC,MAAM,aAAa,QAAQ,YAAY;GACvC,IAAI,UAAU,KAAK,KAAK,IAAI,UAAU,KAAK,KACzC,QAAQ,GAAG,KAAK,MAAM,aAAa,GAAI,IAAI,IAAK;EAEpD;EAEA,KAAK,gBAAgB;GAAE;GAAK;EAAM;EAClC,OAAO;CACT;CAEA,gBACE,QACA,SACM;EACN,MAAM,QAAQ,KAAK;EACnB,IAAI,CAAC,OACH;EAGF,MAAM,uBAAO,IAAI,IAA2B;EAC5C,KAAK,MAAM,YAAY,QAAQ;GAC7B,IAAI,CAAC,uBAAuB,SAAS,MAAM,GACzC;GAEF,MAAM,QAAQ;IACZ,GAAG;IACH,aAAa,qBAAqB,SAAS,WAAW;GACxD;GACA,MAAM,CAAC,SAAS,SAAS,aAAa,gBAAgB,MAAM;GAC5D,MAAM,CAAC,OAAO,OAAO,WAAW,cAAc,MAAM;GACpD,MAAM,WAAW,KAAK,eAAe,IAAI,MAAM,EAAE;GACjD,IACG,CAAC,YAAY,CAAC,MAAM,cAClB,eAAe,KACf,gBAAgB,KAChB,aAAa,KACb,cAAc,GAEjB;GAGF,MAAM,QAAQ,YAAY,eAAe;GACzC,MAAM,UAAU,MAAM,OAAO,GAAG,QAAQ,QAAQ,UAAU;GAC1D,MAAM,UAAU,MAAM,MAAM,GAAG,QAAQ,QAAQ,WAAW;GAC1D,MAAM,UAAU,MAAM,QAAQ,GAAG,YAAY,QAAQ,UAAU;GAC/D,MAAM,UAAU,MAAM,SAAS,GAAG,aAAa,QAAQ,WAAW;GAClE,MAAM,MAAM,MAAM,OAAO,IAAI,UAAU,SAAS,QAAQ,UAAU;GAClE,MAAM,MAAM,MAAM,MAAM,IAAI,UAAU,SAAS,QAAQ,WAAW;GAClE,MAAM,MAAM,MAAM,QAAQ,GAAG,cAAc,QAAQ,UAAU;GAC7D,MAAM,MAAM,MAAM,SAAS,GAAG,eAAe,QAAQ,WAAW;GAEhE,IAAI,MAAM,YAAY;IACpB,MAAM,SAAS,cAAc,MAAM,OAAO,UAAU,MAAM;IAC1D,IAAI,MAAM,WAAW,QAAQ;KAC3B,MAAM,MAAM,aAAa,OAAO,MAAM;KACtC,MAAM,SAAS;IACjB;GACF;GACA,IAAI,CAAC,UACH,MAAM,YAAY,MAAM,SAAS;GAEnC,KAAK,IAAI,MAAM,IAAI,KAAK;EAC1B;EAEA,KAAK,MAAM,CAAC,IAAI,UAAU,KAAK,gBAC7B,IAAI,CAAC,KAAK,IAAI,EAAE,GACd,MAAM,UAAU,OAAO;EAG3B,KAAK,iBAAiB;CACxB;AACF;;;;;;AAOA,SAAS,cACP,SACQ;CACR,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,aAAa,QAAQ,KAAK;EAC1B,QAAQ,MAAM,MAAM;EACpB,QAAQ,MAAM,MAAM;EACpB,QAAQ,MAAM,MAAM;EACpB,QAAQ,MAAM;CAChB,CAAC,CAAC,KAAK,GAAG;AACZ;AAEA,SAAS,iBACP,GACA,MACA,MACA,OACA,SACyB;CACzB,MAAM,aAAa,0BAA0B,OAAO,QAAQ,KAAK;CACjE,MAAM,gBAAgB,QAAQ,OAAO,aAAa,OAAO,aAAa;CACtE,IAAI,CAAC,cAAc,CAAC,iBAAiB,KAAK,KAAK,MAAM,IACnD;CAGF,MAAM,UAAU,cAAc,MAAM;CACpC,QAAQ,cAAc;CACtB,MAAM,eAAe,QAAQ;CAC7B,aAAa,WAAW;CACxB,aAAa,OAAO,GAAG,IAAI,QAAQ,UAAU;CAC7C,aAAa,MAAM;CACnB,aAAa,QAAQ,GAAG,KAAK,IAAI,GAAG,IAAI,IAAI,QAAQ,UAAU;CAC9D,aAAa,SAAS;CACtB,aAAa,aAAa;CAC1B,aAAa,QAAQ,0BAA0B,OAAO,QAAQ,KAAK;CACnE,IAAI,YACF,aAAa,kBAAkB;CAGjC,MAAM,WAAW,OAAO,MAAM;CAC9B,IAAI,WAAW,GACb,aAAa,aAAa;CAE5B,IAAI,WAAW,GACb,aAAa,YAAY;CAG3B,MAAM,UAAU,OAAO,WAAW;CAClC,IAAI,YAAY,GACd,aAAa,UAAU,OAAO,OAAO;CAGvC,oBAAoB,cAAc,KAAK;CACvC,OAAO;AACT;AAEA,SAAS,oBACP,cACA,OACM;CACN,MAAM,QAAkB,CAAC;CACzB,IAAI,OAAO,WACT,MAAM,KAAK,WAAW;CAExB,IAAI,OAAO,eACT,MAAM,KAAK,cAAc;CAE3B,IAAI,MAAM,WAAW,GACnB;CAGF,aAAa,qBAAqB,MAAM,KAAK,GAAG;CAEhD,aAAa,sBAAsB,mBADnB,OAAO,WAAW,WAAW,OAAO,eAAe,OACN;CAG7D,MAAM,QAAQ,OAAO,WAAW,SAAS,OAAO,eAAe;CAC/D,IAAI,OACF,aAAa,sBAAsB;AAEvC;AAEA,SAAS,mBACP,SACQ;CACR,QAAQ,SAAR;EACA,KAAK,OACH,OAAO;EACT,KAAK;EACL,KAAK;EACL,KAAK,cACH,OAAO;EACT,KAAK,UACH,OAAO;EACT,KAAK,SACH,OAAO;EACT,SACE,OAAO;CACT;AACF;AAEA,SAAS,cACP,OACM;CACN,MAAM,WAAW;CACjB,MAAM,OAAO;CACb,MAAM,MAAM;CACZ,MAAM,QAAQ;CACd,MAAM,SAAS;AACjB;AAEA,SAAS,iBAAgC;CACvC,MAAM,YAAY,cAAc,KAAK;CACrC,UAAU,YAAY;CACtB,UAAU,MAAM,WAAW;CAC3B,UAAU,MAAM,WAAW;CAE3B,MAAM,QAAQ,cAAc,KAAK;CACjC,MAAM,MAAM,WAAW;CACvB,MAAM,aAAa,OAAO,EAAE;CAC5B,MAAM,aAAa,aAAa,OAAO;CACvC,UAAU,YAAY,KAAK;CAC3B,OAAO;EAAE;EAAW;EAAO,QAAQ;CAAG;AACxC;AAEA,SAAS,cACP,SACa;CACb,IAAI,OAAO,aAAa,aACtB,MAAM,IAAI,MAAM,2BAA2B;CAE7C,OAAO,SAAS,cAAc,OAAO;AACvC"}

package/dist/src/WebHostSceneRuntime.js

@@ -1,4 +1,5 @@
 import { applyWebHostTerminalStyle, normalizeWebHostTerminalStyle, webTUITerminalBackgroundColor } from "./WebHostTerminalStyle.js";
+import { normalizeSemantics } from "./normalizeWireTokens.js";
 import { CanvasSurfacePainter, fontForStyle } from "./CanvasSurfacePainter.js";
 import { DomSurfacePainter } from "./DomSurfacePainter.js";
 import { InputEventEncoder } from "./InputEventEncoder.js";
@@ -220,7 +221,12 @@ var WebHostSceneRuntime = class {
 	* embedders can drive virtual-keyboard or focus affordances from it.
 	*/
 	get focusPresentation() {
-		return this.currentFrame?.focusPresentation;
+		const presentation = this.currentFrame?.focusPresentation;
+		if (!presentation) return;
+		return {
+			...presentation,
+			semantics: normalizeSemantics(presentation.semantics)
+		};
 	}
 	linkTarget(location) {
 		return linkTargetAt(this.currentFrame?.links, this.currentFrame?.linkTargets, location);