@neuroplastio/xterm-addon-hotty 0.1.0

package/dist/hotty-xterm.js

@@ -0,0 +1,2906 @@
+// src/hostcss.ts
+var DEFAULT_FG = "#ffffff";
+var DEFAULT_BG = "#000000";
+var ANSI_KEYS = ["black", "red", "green", "yellow", "blue", "magenta", "cyan", "white", "brightBlack", "brightRed", "brightGreen", "brightYellow", "brightBlue", "brightMagenta", "brightCyan", "brightWhite"];
+var DEFAULT_ANSI = ["#2e3436", "#cc0000", "#4e9a06", "#c4a000", "#3465a4", "#75507b", "#06989a", "#d3d7cf", "#555753", "#ef2929", "#8ae234", "#fce94f", "#729fcf", "#ad7fa8", "#34e2e2", "#eeeeec"];
+function palette(theme) {
+  const fg = theme?.foreground ?? DEFAULT_FG;
+  const bg = theme?.background ?? DEFAULT_BG;
+  const ansi = ANSI_KEYS.map((k, i) => theme?.[k] ?? DEFAULT_ANSI[i]);
+  return { fg, bg, ansi, dark: luminance(bg) < 0.5 };
+}
+function hostCss(theme, m) {
+  const p = palette(theme);
+  const lines = [
+    "@layer hotty-host {",
+    ":root {",
+    `  color-scheme: ${p.dark ? "dark" : "light"};`,
+    `  --hotty-fg: ${p.fg};`,
+    `  --hotty-bg: ${p.bg};`,
+    ...p.ansi.map((c, i) => `  --hotty-ansi-${i}: ${c};`),
+    // The terminal's blue: plain blue is hard to read on a dark background.
+    `  --hotty-accent: var(--hotty-ansi-${p.dark ? 12 : 4});`,
+    `  --hotty-cell-w: ${m.cellW}px;`,
+    `  --hotty-cell-h: ${m.cellH}px;`,
+    `  --hotty-font: ${fontStack(m.fontFamily)};`,
+    "  font-family: var(--hotty-font);",
+    `  font-size: ${m.fontSize}px;`,
+    // An explicit line-height, so that `1rlh` is one terminal row.
+    `  line-height: ${m.cellH}px;`,
+    "  color: var(--hotty-fg);",
+    "  background: var(--hotty-bg);",
+    "  accent-color: var(--hotty-accent);",
+    "}",
+    "body { margin: 0; }",
+    // Controls in the terminal's colours (SPEC §8), not the browser's: ansi-8
+    // is the dim grey of borders, buttons, placeholders and what is disabled.
+    // :where() keeps the base rule below the state rules after it, such as
+    // :disabled.
+    ":where(input:not([type=checkbox], [type=radio], [type=range]), textarea,",
+    "       select, button) {",
+    "  color: var(--hotty-fg);",
+    "  background: var(--hotty-bg);",
+    "  border: 1px solid var(--hotty-ansi-8);",
+    "}",
+    "button:enabled, input:is([type=button], [type=submit], [type=reset]):enabled {",
+    "  background: var(--hotty-ansi-8);",
+    "}",
+    "::placeholder, :disabled { color: var(--hotty-ansi-8); }",
+    ":focus-visible { outline: 1px solid var(--hotty-accent); }",
+    ":any-link { color: var(--hotty-accent); }",
+    "::selection { color: var(--hotty-bg); background: var(--hotty-accent); }",
+    // An element that opts in to drags selects no text, whatever the
+    // document's CSS (SPEC §9.1, §11): important in the host's layer, the
+    // first, wins over every rule of the document's.
+    "[data-on~=drag], [data-on~=drag] * { -webkit-user-select: none !important; user-select: none !important; }",
+    // The rows a document needs are measured with no scrollbar of the root's
+    // in the way (`r=auto`, `fit`, SPEC §5.2).
+    `:root[${MEASURE}] { overflow: hidden !important; }`,
+    "}"
+  ];
+  return lines.join("\n");
+}
+var MEASURE = "data-xterm-hotty-measure";
+var CLIP = "data-xterm-hotty-clip";
+var UNCLIPPED = "data-xterm-hotty-unclipped";
+function scrollCss(axes, pageScrolls) {
+  if (!axes) {
+    return [
+      "@layer hotty-host {",
+      `:root { overflow: hidden; touch-action: ${pageScrolls ? "manipulation" : "none"}; }`,
+      "* { scrollbar-width: none !important; }",
+      "::-webkit-scrollbar { display: none !important; }",
+      "}"
+    ].join("\n");
+  }
+  const pan = pageScrolls ? "manipulation" : axes === 3 ? "pan-x pan-y" : axes === 1 ? "pan-y" : "pan-x";
+  const lines = ["@layer hotty-host {", `:root { touch-action: ${pan}; }`];
+  if (axes !== 3) {
+    const clipped = axes === 1 ? "overflow-x" : "overflow-y";
+    lines.push(`:root, :root:not([${UNCLIPPED}]) [${CLIP}] { ${clipped}: hidden !important; }`);
+  }
+  lines.push("}");
+  return lines.join("\n");
+}
+function fontStack(family) {
+  const f = family.trim();
+  if (!f) return "monospace";
+  return /monospace\s*$/.test(f) ? f : `${f}, monospace`;
+}
+function luminance(color) {
+  let hex = color.trim().replace(/^#/, "");
+  if (hex.length === 3) hex = hex.replace(/./g, (c) => c + c);
+  if (!/^[0-9a-f]{6}/i.test(hex)) return 0;
+  const [r, g, b] = [0, 2, 4].map((i) => {
+    const c = parseInt(hex.slice(i, i + 2), 16) / 255;
+    return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
+  });
+  return 0.2126 * r + 0.7152 * g + 0.0722 * b;
+}
+
+// src/delta.ts
+var DeltaError = class extends Error {
+  code;
+  constructor(code, detail) {
+    super(detail);
+    this.code = code;
+  }
+};
+var OPS = ["morph", "inner", "replace", "append", "prepend", "before", "after", "remove", "attr", "unattr", "text", "var"];
+var Deltas = class {
+  doc;
+  resolver;
+  constructor(doc, resolver) {
+    this.doc = doc;
+    this.resolver = resolver;
+  }
+  /** Parses a fragment inert, cleaned and resolved. */
+  parse(html) {
+    const t = this.doc.createElement("template");
+    t.innerHTML = html;
+    this.resolver.adopt(t.content);
+    return Array.from(t.content.childNodes);
+  }
+  apply(op, target, key, payload) {
+    const find = () => {
+      if (!target) throw new DeltaError("EINVAL", `op=${op} needs t=<element id>`);
+      const el = this.doc.getElementById(target);
+      if (!el) throw new DeltaError("ENOTARGET", target);
+      return el;
+    };
+    const needKey = () => {
+      if (!key) throw new DeltaError("EINVAL", `op=${op} needs k=<name>`);
+      return key;
+    };
+    switch (op) {
+      case "":
+      case "morph": {
+        if (target === void 0) {
+          const missing = [];
+          for (const k of this.parse(payload)) {
+            if (k.nodeType !== 1) continue;
+            const id = k.getAttribute("id");
+            const old = id ? this.doc.getElementById(id) : null;
+            if (old) this.morphNode(old, k);
+            else missing.push(id ?? "(element without id)");
+          }
+          if (missing.length) throw new DeltaError("ENOTARGET", missing.join(","));
+          return;
+        }
+        const t = find();
+        const frag = this.parse(payload);
+        const elements = frag.filter((n) => n.nodeType === 1);
+        if (elements.length === 1) {
+          this.morphNode(t, elements[0]);
+        } else {
+          t.before(...frag);
+          t.remove();
+        }
+        return;
+      }
+      case "inner":
+        this.morphChildren(find(), this.parse(payload));
+        return;
+      case "replace": {
+        const t = find();
+        t.before(...this.parse(payload));
+        t.remove();
+        return;
+      }
+      case "append":
+      case "prepend": {
+        const t = find();
+        const fresh = [];
+        for (const k of this.parse(payload)) {
+          const id = k.nodeType === 1 ? k.getAttribute("id") : null;
+          const old = id ? this.doc.getElementById(id) : null;
+          if (old && old.parentNode === t) this.morphNode(old, k);
+          else fresh.push(k);
+        }
+        if (op === "append") t.append(...fresh);
+        else t.prepend(...fresh);
+        return;
+      }
+      case "before":
+        find().before(...this.parse(payload));
+        return;
+      case "after":
+        find().after(...this.parse(payload));
+        return;
+      case "remove":
+        find().remove();
+        return;
+      case "attr": {
+        const t = find();
+        const name = needKey();
+        this.resolver.set(t, name, payload);
+        syncProperty(t, name, payload, this.doc.activeElement === t);
+        return;
+      }
+      case "unattr": {
+        const t = find();
+        const name = needKey();
+        this.resolver.remove(t, name);
+        syncProperty(t, name, null, this.doc.activeElement === t);
+        return;
+      }
+      case "text": {
+        const t = find();
+        if (t.localName === "style") this.resolver.setCss(t, payload);
+        else if (t.childNodes.length === 1 && t.firstChild.nodeType === 3) t.firstChild.data = payload;
+        else t.textContent = payload;
+        return;
+      }
+      case "var": {
+        const t = find();
+        const k = needKey();
+        const name = k.startsWith("--") ? k : `--${k}`;
+        t.style?.setProperty(name, payload);
+        return;
+      }
+      default:
+        throw new DeltaError("EINVAL", `unknown op=${op}`);
+    }
+  }
+  /** Makes `old` (live) look like `neu` (parsed), keeping `old` where possible. Returns the node now in place. */
+  morphNode(old, neu) {
+    if (old.nodeType === 3 && neu.nodeType === 3) {
+      if (old.data !== neu.data) old.data = neu.data;
+      return old;
+    }
+    if (old.nodeType === 8 && neu.nodeType === 8) return old;
+    if (old.nodeType === 1 && neu.nodeType === 1) {
+      const a = old;
+      const b = neu;
+      const ia = a.getAttribute("id");
+      const ib = b.getAttribute("id");
+      if (a.localName === b.localName && a.namespaceURI === b.namespaceURI && (ia === ib || ia === null || ib === null)) {
+        this.syncAttributes(a, b);
+        if (a.localName === "style") {
+          const css = this.resolver.cssOf(b);
+          if (this.resolver.cssOf(a) !== css) this.resolver.setCss(a, css);
+        } else {
+          const kids = a.localName === "template" ? b.content.childNodes : b.childNodes;
+          this.morphChildren(a.localName === "template" ? a.content : a, Array.from(kids));
+        }
+        return a;
+      }
+    }
+    old.replaceWith(neu);
+    return neu;
+  }
+  syncAttributes(old, neu) {
+    const oldAttrs = this.resolver.attributes(old);
+    const newAttrs = this.resolver.attributes(neu);
+    const focused = this.doc.activeElement === old;
+    for (const [name, value] of newAttrs) {
+      if (focused && name === "value") continue;
+      const had = oldAttrs.find(([n]) => n === name);
+      if (!had || had[1] !== value) {
+        this.resolver.set(old, name, value);
+        syncProperty(old, name, value, focused);
+      }
+    }
+    for (const [name] of oldAttrs) {
+      if (!newAttrs.some(([n]) => n === name)) {
+        this.resolver.remove(old, name);
+        syncProperty(old, name, null, focused);
+      }
+    }
+  }
+  /** Morphs the children of `parent` (live) into `kids` (parsed). */
+  morphChildren(parent, kids) {
+    const oldKids = Array.from(parent.childNodes);
+    const idOf = (n) => n.nodeType === 1 ? n.getAttribute("id") : null;
+    const newIds = new Set(kids.map(idOf).filter((x) => x !== null));
+    const used = /* @__PURE__ */ new Set();
+    const plan = [];
+    let cursor = 0;
+    for (const nk of kids) {
+      const id = idOf(nk);
+      let match = null;
+      if (id !== null) {
+        match = oldKids.find((ok) => !used.has(ok) && idOf(ok) === id) ?? null;
+      } else {
+        for (let i = cursor; i < oldKids.length; i++) {
+          const ok = oldKids[i];
+          if (used.has(ok)) continue;
+          const okId = idOf(ok);
+          let same = false;
+          if (okId !== null && newIds.has(okId)) same = false;
+          else if (ok.nodeType === 1 && nk.nodeType === 1)
+            same = okId === null && ok.localName === nk.localName && ok.namespaceURI === nk.namespaceURI;
+          else same = ok.nodeType === nk.nodeType && (ok.nodeType === 3 || ok.nodeType === 8);
+          if (same) {
+            match = ok;
+            cursor = i + 1;
+            break;
+          }
+        }
+      }
+      if (match) used.add(match);
+      plan.push([match, nk]);
+    }
+    for (const ok of oldKids) if (!used.has(ok)) ok.remove();
+    plan.forEach(([keep, nk], i) => {
+      const want = keep ? this.morphNode(keep, nk) : nk;
+      const current = parent.childNodes[i] ?? null;
+      if (current !== want) move(parent, want, current);
+    });
+  }
+};
+function move(parent, node, before) {
+  const p = parent;
+  if (node.parentNode === parent && typeof p.moveBefore === "function") {
+    try {
+      p.moveBefore(node, before);
+      return;
+    } catch {
+    }
+  }
+  parent.insertBefore(node, before);
+}
+function syncProperty(el, name, value, focused) {
+  if (focused) return;
+  const n = name.toLowerCase();
+  if (n === "value" && "value" in el && (el.localName === "input" || el.localName === "textarea" || el.localName === "select")) {
+    el.value = value ?? "";
+  } else if (n === "checked" && el.localName === "input") {
+    el.checked = value !== null;
+  } else if (n === "selected" && el.localName === "option") {
+    el.selected = value !== null;
+  }
+}
+
+// src/network.ts
+var DIRECTIVES = ["img-src", "media-src", "font-src", "style-src"];
+function source(s) {
+  const v = s.trim().toLowerCase();
+  if (v === "https:") return v;
+  let u;
+  try {
+    u = new URL(v);
+  } catch {
+    return null;
+  }
+  if (u.protocol !== "https:" && u.protocol !== "http:") return null;
+  if (u.pathname !== "/" && u.pathname !== "" || u.search || u.hash || u.username || u.password) return null;
+  if (!/^https?:\/\/[^/]+\/?$/.test(v)) return null;
+  return u.origin;
+}
+function clean(p) {
+  const out = {};
+  for (const d of DIRECTIVES) {
+    const srcs = (p?.[d] ?? []).map(source).filter((s) => s !== null);
+    if (srcs.length) out[d] = [...new Set(srcs)];
+  }
+  return out;
+}
+function parse(content) {
+  const p = {};
+  for (const part of content.split(";")) {
+    const [name, ...srcs] = part.trim().split(/\s+/);
+    const d = (name ?? "").toLowerCase();
+    if (DIRECTIVES.includes(d)) p[d] = [...p[d] ?? [], ...srcs];
+  }
+  return clean(p);
+}
+function matches(src, url) {
+  if (src === "https:") return url.protocol === "https:";
+  return url.origin === src;
+}
+function intersect(host, doc) {
+  const out = {};
+  for (const d of DIRECTIVES) {
+    const h = host[d] ?? [];
+    const res = /* @__PURE__ */ new Set();
+    for (const s of doc[d] ?? []) {
+      if (s === "https:") {
+        for (const hs of h) if (hs === "https:" || hs.startsWith("https://")) res.add(hs);
+      } else if (h.some((hs) => matches(hs, new URL(s)))) {
+        res.add(s);
+      }
+    }
+    if (res.size) out[d] = [...res];
+  }
+  return out;
+}
+function allows(p, d, url) {
+  let u;
+  try {
+    u = new URL(url);
+  } catch {
+    return false;
+  }
+  return (p[d] ?? []).some((s) => matches(s, u));
+}
+function cspSources(p, d) {
+  return (p[d] ?? []).join(" ");
+}
+function directiveFor(tag, attr, rel = "") {
+  if (attr === "srcset") return "img-src";
+  if (attr === "poster") return "img-src";
+  if (attr === "src") {
+    if (tag === "img" || tag === "input" || tag === "image") return "img-src";
+    if (tag === "video" || tag === "audio" || tag === "source" || tag === "track") return "media-src";
+  }
+  if ((attr === "href" || attr === "xlink:href") && (tag === "image" || tag === "use" || tag === "feimage")) return "img-src";
+  if (attr === "href" && tag === "link" && rel.split(/\s+/).includes("stylesheet")) return "style-src";
+  return null;
+}
+
+// src/resources.ts
+var INVALID = "about:invalid";
+var NO_BASE = "https://hotty.invalid/";
+function network(value, ctx, d) {
+  if (!ctx) return INVALID;
+  let abs;
+  try {
+    abs = new URL(value, ctx.base).href;
+  } catch {
+    return INVALID;
+  }
+  return !abs.startsWith(NO_BASE) && allows(ctx.policy, d, abs) ? abs : INVALID;
+}
+var URL_ATTRS = /* @__PURE__ */ new Set(["src", "href", "poster", "background", "data", "action", "formaction", "xlink:href", "srcset", "cite", "longdesc", "lowsrc", "manifest", "codebase", "usemap", "ping"]);
+function isUrlAttr(name) {
+  return URL_ATTRS.has(name.toLowerCase());
+}
+var Store = class {
+  entries = /* @__PURE__ */ new Map();
+  used = 0;
+  quota;
+  /** Called with the names whose URL changed, so surfaces can re-resolve. */
+  onChange = () => {
+  };
+  constructor(quota = 64 << 20) {
+    this.quota = quota;
+  }
+  put(name, mime, bytes) {
+    const old = this.entries.get(name);
+    const next = this.used - (old?.bytes.length ?? 0) + bytes.length;
+    if (next > this.quota) throw new Error(`resource store over quota (${next} > ${this.quota} bytes)`);
+    this.used = next;
+    this.entries.set(name, { mime, bytes, url: null, deps: /* @__PURE__ */ new Set() });
+    this.changed(name, old);
+  }
+  remove(name) {
+    const old = this.entries.get(name);
+    if (!old) return false;
+    this.used -= old.bytes.length;
+    this.entries.delete(name);
+    this.changed(name, old);
+    return true;
+  }
+  /** The `blob:` URL for a resource, or `null` if there is none (yet). */
+  url(name) {
+    const e = this.entries.get(name);
+    if (!e) return null;
+    if (e.url === null) {
+      let bytes = e.bytes;
+      if (e.mime.startsWith("text/css")) {
+        e.deps.clear();
+        const css = new TextDecoder().decode(e.bytes);
+        bytes = new TextEncoder().encode(this.rewriteCss(css, e.deps));
+      }
+      e.url = URL.createObjectURL(new Blob([bytes], { type: e.mime }));
+    }
+    return e.url;
+  }
+  /** CSS text with every reference resolved; `names` collects the resources.
+   * Without a context (a stylesheet resource, shared by surfaces with
+   * different policies) nothing from the network is allowed. */
+  rewriteCss(css, names, ctx) {
+    const one = (raw, d) => {
+      const v = raw.trim();
+      if (/^cid:/i.test(v)) {
+        names.add(v.slice(4));
+        return this.url(v.slice(4)) ?? INVALID;
+      }
+      if (/^data:/i.test(v) || /^blob:/i.test(v) || v.startsWith("#")) return raw;
+      for (const dir of d) {
+        const r = network(v, ctx, dir);
+        if (r !== INVALID) return r;
+      }
+      return INVALID;
+    };
+    return css.replace(/@import\s+(?:url\(\s*)?(['"])([^'"]*)\1\s*\)?/gi, (_m, _q, u) => `@import "${one(u, ["style-src"])}"`).replace(/url\(\s*(['"]?)([^'")]*)\1\s*\)/gi, (_m, _q, u) => `url("${one(u, ["img-src", "font-src"])}")`);
+  }
+  /** Resolves one attribute value; `names` collects the resources it names.
+   * `d` is the directive that covers the attribute, if it fetches. */
+  resolveUrl(value, names, ctx, d) {
+    const v = value.trim();
+    if (/^cid:/i.test(v)) {
+      const name = v.slice(4);
+      names.add(name);
+      return this.url(name) ?? INVALID;
+    }
+    if (/^data:/i.test(v) || /^blob:/i.test(v) || v === "" || v.startsWith("#")) return value;
+    if (d) return network(v, ctx, d);
+    return /^[a-z][a-z0-9+.-]*:/i.test(v) ? INVALID : value;
+  }
+  changed(name, old) {
+    const names = /* @__PURE__ */ new Set([name]);
+    for (const [other, e] of this.entries) {
+      if (e.deps.has(name)) {
+        if (e.url) URL.revokeObjectURL(e.url);
+        e.url = null;
+        names.add(other);
+      }
+    }
+    this.onChange(names);
+    if (old?.url) URL.revokeObjectURL(old.url);
+  }
+};
+
+// src/touch.ts
+var DRAG_SLOP = 8;
+var FLING_DECAY = 0.996;
+var REST_MS = 80;
+var Touch = class {
+  /**
+   * `exclusive`: every touch here is this Touch's (the cells: xterm.js's own
+   * touch handling, which listens on the document, never sees it). Otherwise
+   * (a surface) a touch is left alone until it moves. `engage`, if given,
+   * says on a touch's start whether it is this Touch's at all: one it
+   * declines is the browser's, from start to end.
+   */
+  constructor(target, win, host, exclusive = false, engage) {
+    this.win = win;
+    this.host = host;
+    this.exclusive = exclusive;
+    this.engage = engage;
+    const on = (type, f, passive) => {
+      const l = (e) => f(e);
+      target.addEventListener(type, l, { capture: true, passive });
+      this.off.push(() => target.removeEventListener(type, l, { capture: true }));
+    };
+    on("touchstart", (e) => this.start(e), true);
+    on("touchmove", (e) => this.move(e), false);
+    on("touchend", (e) => this.end(e), !exclusive);
+    on("touchcancel", (e) => {
+      this.keep(e);
+      this.touch = null;
+    }, true);
+  }
+  win;
+  host;
+  exclusive;
+  engage;
+  touch = null;
+  fling = 0;
+  off = [];
+  dispose() {
+    this.stopFling();
+    for (const f of this.off) f();
+  }
+  keep(e) {
+    if (this.exclusive) e.stopPropagation();
+  }
+  start(e) {
+    this.keep(e);
+    this.stopFling();
+    const t = e.touches.length === 1 ? e.touches[0] : void 0;
+    if (!t || this.engage && !this.engage(e)) {
+      this.touch = null;
+      return;
+    }
+    const [x, y] = this.host.toPage(t.clientX, t.clientY);
+    this.touch = { id: t.identifier, x0: x, y0: y, x, y, t: e.timeStamp, t0: e.timeStamp, vx: 0, vy: 0, dragging: false };
+  }
+  move(e) {
+    this.keep(e);
+    const s = this.touch;
+    if (!s) return;
+    if (e.touches.length !== 1) {
+      this.touch = null;
+      return;
+    }
+    const t = [...e.changedTouches].find((c) => c.identifier === s.id);
+    if (!t) return;
+    const [x, y] = this.host.toPage(t.clientX, t.clientY);
+    if (!s.dragging && Math.hypot(x - s.x0, y - s.y0) < DRAG_SLOP) return;
+    if (!s.dragging && this.host.claim && !this.host.claim(s.x0 - x, s.y0 - y, e)) {
+      this.touch = null;
+      return;
+    }
+    s.dragging = true;
+    e.preventDefault();
+    const dx = x - s.x;
+    const dy = y - s.y;
+    const dt = Math.max(1, e.timeStamp - s.t);
+    s.vx = 0.7 * (dx / dt) + 0.3 * s.vx;
+    s.vy = 0.7 * (dy / dt) + 0.3 * s.vy;
+    s.x = x;
+    s.y = y;
+    s.t = e.timeStamp;
+    this.host.scroll(-dx, -dy, x, y);
+  }
+  end(e) {
+    this.keep(e);
+    const s = this.touch;
+    if (!s || ![...e.changedTouches].some((c) => c.identifier === s.id)) return;
+    this.touch = null;
+    if (s.dragging) {
+      if (e.timeStamp - s.t < REST_MS) this.startFling(-s.vx, -s.vy, s.x, s.y);
+      return;
+    }
+    if (this.host.tap && e.timeStamp - s.t0 < 500) {
+      e.preventDefault();
+      this.host.tap(s.x, s.y);
+    }
+  }
+  startFling(vx, vy, x, y) {
+    let last = this.win.performance.now();
+    const step = (now) => {
+      const dt = now - last;
+      last = now;
+      const decay = Math.pow(FLING_DECAY, dt);
+      vx *= decay;
+      vy *= decay;
+      if (Math.abs(vx) < 0.02 && Math.abs(vy) < 0.02) {
+        this.fling = 0;
+        return;
+      }
+      this.host.scroll(vx * dt, vy * dt, x, y);
+      this.fling = this.win.requestAnimationFrame(step);
+    };
+    this.fling = this.win.requestAnimationFrame(step);
+  }
+  stopFling() {
+    if (this.fling) this.win.cancelAnimationFrame(this.fling);
+    this.fling = 0;
+  }
+};
+
+// src/resolver.ts
+var DROP = /* @__PURE__ */ new Set(["script", "iframe", "frame", "frameset", "object", "embed", "applet", "base", "meta", "portal", "fencedframe"]);
+var DROP_ATTRS = /* @__PURE__ */ new Set(["srcdoc", "autofocus", "http-equiv", "ping", "nonce", "integrity"]);
+var Resolver = class {
+  /** The program's value of each attribute the resolver rewrote. */
+  orig = /* @__PURE__ */ new WeakMap();
+  /** The program's text of each `<style>` whose CSS names a resource. */
+  css = /* @__PURE__ */ new WeakMap();
+  /** Elements that name resources, and which. */
+  refs = /* @__PURE__ */ new Map();
+  /** Attributes the host set and the program did not write (a detached
+   * surface's `disabled`, SPEC §5.5): live, never reported. */
+  own = /* @__PURE__ */ new WeakMap();
+  store;
+  /** The document's base URL and effective network policy (set per a=doc). */
+  ctx;
+  constructor(store) {
+    this.store = store;
+  }
+  /** Cleans and resolves an inert subtree, in place. */
+  adopt(root) {
+    const walk = (node) => {
+      if (node.nodeType === 1) {
+        const el = node;
+        if (!this.allowed(el)) {
+          el.remove();
+          return;
+        }
+        this.cleanAttributes(el);
+        if (el.localName === "style") this.setCss(el, el.textContent ?? "");
+      }
+      for (const child of Array.from(node.childNodes)) walk(child);
+      if (node.nodeType === 1 && node.localName === "template") {
+        walk(node.content);
+      }
+    };
+    walk(root);
+  }
+  allowed(el) {
+    const name = el.localName;
+    if (DROP.has(name)) return false;
+    if (name === "link") {
+      const rel = (el.getAttribute("rel") ?? "").toLowerCase().split(/\s+/);
+      return rel.includes("stylesheet");
+    }
+    return true;
+  }
+  cleanAttributes(el) {
+    for (const a of Array.from(el.attributes)) {
+      const n = a.name.toLowerCase();
+      if (n.startsWith("on") || DROP_ATTRS.has(n)) {
+        el.removeAttribute(a.name);
+      } else if (isUrlAttr(n) || n === "style") {
+        this.set(el, a.name, a.value);
+      }
+    }
+  }
+  /** An attribute as the program wrote it. */
+  get(el, name) {
+    if (this.own.get(el)?.has(name)) return null;
+    return this.orig.get(el)?.get(name) ?? el.getAttribute(name);
+  }
+  /** Every attribute as the program wrote it, in order. */
+  attributes(el) {
+    const o = this.orig.get(el);
+    const own = this.own.get(el);
+    const out = [];
+    for (const a of Array.from(el.attributes)) if (!own?.has(a.name)) out.push([a.name, o?.get(a.name) ?? a.value]);
+    return out;
+  }
+  /** Sets an attribute of the host's own, which the program does not see. */
+  setOwn(el, name, value) {
+    el.setAttribute(name, value);
+    let own = this.own.get(el);
+    if (!own) this.own.set(el, own = /* @__PURE__ */ new Set());
+    own.add(name);
+  }
+  /** Removes an attribute, if it is the host's own. */
+  removeOwn(el, name) {
+    if (!this.own.get(el)?.delete(name)) return;
+    el.removeAttribute(name);
+  }
+  /** Sets an attribute to the program's value, resolving URLs and CSS. */
+  set(el, name, value) {
+    const n = name.toLowerCase();
+    if (n.startsWith("on") || DROP_ATTRS.has(n)) return;
+    const names = /* @__PURE__ */ new Set();
+    let live = value;
+    if (n === "style") live = this.store.rewriteCss(value, names, this.ctx);
+    else if (isUrlAttr(n)) {
+      const d = directiveFor(el.localName, n, el.getAttribute("rel") ?? "");
+      live = n === "srcset" ? this.srcset(value, names) : this.store.resolveUrl(value, names, this.ctx, d);
+    }
+    if ((el.localName === "a" || el.localName === "area") && n === "href") live = value;
+    try {
+      el.setAttribute(name, live);
+    } catch {
+      return;
+    }
+    this.own.get(el)?.delete(n);
+    this.remember(el, name, value, live, names);
+  }
+  remove(el, name) {
+    el.removeAttribute(name);
+    this.orig.get(el)?.delete(name);
+    this.own.get(el)?.delete(name.toLowerCase());
+  }
+  /** A `<style>`'s CSS as the program wrote it. */
+  cssOf(el) {
+    return this.css.get(el) ?? el.textContent ?? "";
+  }
+  setCss(el, text2) {
+    const names = /* @__PURE__ */ new Set();
+    const live = this.store.rewriteCss(text2, names, this.ctx);
+    if (el.textContent !== live) el.textContent = live;
+    if (live !== text2) this.css.set(el, text2);
+    else this.css.delete(el);
+    if (names.size > 0) this.track(el, names);
+  }
+  /** Re-resolves everything that names one of `names` (a resource changed);
+   * whether anything did. */
+  refresh(names) {
+    let any = false;
+    for (const [el, uses] of Array.from(this.refs)) {
+      if (!el.isConnected) {
+        this.refs.delete(el);
+        continue;
+      }
+      if (![...uses].some((u) => names.has(u))) continue;
+      any = true;
+      this.refs.delete(el);
+      const o = this.orig.get(el);
+      if (o) for (const [attr, value] of Array.from(o)) this.set(el, attr, value);
+      const css = this.css.get(el);
+      if (css !== void 0) this.setCss(el, css);
+    }
+    return any;
+  }
+  srcset(value, names) {
+    return value.split(",").map((part) => {
+      const [url, ...rest] = part.trim().split(/\s+/);
+      return [this.store.resolveUrl(url ?? "", names, this.ctx, "img-src"), ...rest].join(" ");
+    }).join(", ");
+  }
+  remember(el, name, value, live, names) {
+    let o = this.orig.get(el);
+    if (value !== live) {
+      if (!o) this.orig.set(el, o = /* @__PURE__ */ new Map());
+      o.set(name, value);
+    } else {
+      o?.delete(name);
+    }
+    if (names.size > 0) this.track(el, names);
+  }
+  track(el, names) {
+    const uses = this.refs.get(el) ?? /* @__PURE__ */ new Set();
+    for (const n of names) uses.add(n);
+    this.refs.set(el, uses);
+  }
+};
+
+// src/surface.ts
+function csp(host) {
+  const with_ = (fixed, d) => [fixed, cspSources(host, d)].filter(Boolean).join(" ");
+  return [
+    "default-src 'none'",
+    with_("img-src data: blob:", "img-src"),
+    with_("media-src data: blob:", "media-src"),
+    with_("font-src data: blob:", "font-src"),
+    with_("style-src 'unsafe-inline' blob:", "style-src"),
+    "form-action 'none'",
+    "base-uri http: https:"
+  ].join("; ");
+}
+function baseOf(doc) {
+  const href = doc.querySelector("base[href]")?.getAttribute("href") ?? "";
+  try {
+    const u = new URL(href);
+    if (u.protocol === "http:" || u.protocol === "https:") return u.href;
+  } catch {
+  }
+  return NO_BASE;
+}
+var LINE_PX = 40;
+var PAGE_FRACTION = 0.875;
+var TEXT_TYPES = /* @__PURE__ */ new Set(["text", "email", "password", "search", "tel", "url", "number", "date", "datetime-local", "month", "time", "week"]);
+var CONTROLS = "input, select, textarea, button";
+var HYPERLINK = "data-xterm-hotty-hyperlink";
+var DETACHED_CSS = `@layer hotty-host {
+* { cursor: auto !important; }
+a[href], a[href] * { cursor: text !important; }
+a[href][${HYPERLINK}], a[href][${HYPERLINK}] * { cursor: pointer !important; }
+}`;
+var Surface = class {
+  name;
+  box;
+  frame;
+  doc;
+  resolver;
+  deltas;
+  cols = 80;
+  rows = 24;
+  /** The part of the surface on screen, in cells (SPEC §5.2). */
+  win = { x: 0, y: 0, w: 80, h: 24 };
+  autoRows = false;
+  host;
+  hostStyle;
+  /** Set while the program moves focus, so no `focus` event echoes back. */
+  programFocus = false;
+  /** The document's base URL (SPEC §7.3). */
+  base = NO_BASE;
+  keyboard = false;
+  /** Detached (SPEC §5.5): nothing in the surface reaches the program. */
+  detachedState = false;
+  /** A press is on something that takes no focus (SPEC §10.1): the focus
+   * the browser gives the frame for it is not the surface's. */
+  pressNothing = false;
+  /** The element a press focuses, until the browser is done with it. */
+  pressed = null;
+  /** A press of another button than the primary one, until the browser is
+   * done with it: it neither takes nor gives back the keyboard. */
+  auxPress = false;
+  settling = null;
+  /** A drag under way (SPEC §9.1). */
+  drag = null;
+  /** A drag just ended at a release: it reported its own click, so the
+   * browser's, which follows in the same task, is not reported. */
+  dragReleased = false;
+  /** The placement asked for presses (`p=1`, SPEC §5.2). */
+  presses = false;
+  /** A mouse's or a pen's pointerdown came first: the mousedown that
+   * follows is the same press, not a tap's. */
+  pointerPress = false;
+  /** The pointer of a press with Alt held (SPEC §9.2), until its release:
+   * the gesture is the program's. */
+  altPointer = null;
+  /** Such a gesture just ended at a release: the browser's click that
+   * follows in the same task is not the surface's. */
+  altReleased = false;
+  /** One cell, in CSS pixels: a drag's detail counts cells (SPEC §9.1). */
+  cellW = 9;
+  cellH = 17;
+  css = "";
+  /** Keys whose keydown went to the program, so their keyup follows. */
+  forwarded = /* @__PURE__ */ new Set();
+  /** The rows the program heard last, while the placement asked for `fit`
+   * (`f=1`, SPEC §5.2); null when it did not. */
+  fitRows = null;
+  /** The height may have changed since the last check. */
+  fitDirty = false;
+  /** The frame a check waits for. */
+  fitFrame = 0;
+  fitObserver = null;
+  /** The axes the document asked to scroll along (`scroll`, SPEC §5.1): 1
+   * vertically, 2 horizontally, 3 both; 0, nothing scrolls. */
+  axes = 0;
+  /** Where the touch drag under way goes, once it has a direction. */
+  touchRoute = "terminal";
+  /** The box the wheel gesture under way scrolls, if it went to the
+   * document: the gesture moves no other (`scrollWheel`). */
+  wheelBox = null;
+  /** Some element may carry `CLIP`. */
+  clipping = false;
+  constructor(name, host, hostCss2, scheme) {
+    this.name = name;
+    this.host = host;
+    this.box = document.createElement("div");
+    this.box.className = "hotty-surface";
+    this.box.dataset.surface = name;
+    Object.assign(this.box.style, {
+      position: "absolute",
+      left: "0px",
+      top: "0px",
+      overflow: "hidden",
+      pointerEvents: "auto",
+      visibility: "hidden"
+    });
+    this.frame = document.createElement("iframe");
+    this.frame.setAttribute("sandbox", "allow-same-origin allow-forms");
+    this.frame.setAttribute("title", `HOTTY surface ${name}`);
+    Object.assign(this.frame.style, {
+      border: "0",
+      position: "absolute",
+      left: "0px",
+      top: "0px",
+      width: "100%",
+      height: "100%",
+      display: "block",
+      colorScheme: scheme
+    });
+    this.box.append(this.frame);
+    host.layer.append(this.box);
+    const doc = this.frame.contentDocument;
+    if (!doc) throw new Error("surface iframe has no document");
+    doc.open();
+    doc.write(
+      `<!doctype html><html><head><meta charset="utf-8"><meta http-equiv="Content-Security-Policy" content="${csp(host.policy)}"><base href="${NO_BASE}"><style id="hotty-host"></style></head><body></body></html>`
+    );
+    doc.close();
+    this.doc = doc;
+    this.hostStyle = doc.getElementById("hotty-host");
+    this.css = hostCss2;
+    this.restyle();
+    this.resolver = new Resolver(host.store);
+    this.deltas = new Deltas(doc, this.resolver);
+    this.listen();
+  }
+  setHostCss(css, scheme) {
+    this.css = css;
+    this.restyle();
+    if (this.frame.style.colorScheme !== scheme) this.frame.style.colorScheme = scheme;
+    this.refit();
+  }
+  restyle() {
+    const css = [this.css, scrollCss(this.axes, this.host.pageScrolls), ...this.detachedState ? [DETACHED_CSS] : []].join("\n");
+    if (this.hostStyle.textContent !== css) this.hostStyle.textContent = css;
+    this.clip();
+  }
+  /** Replaces the whole document (`a=doc`): its head's styles and its body.
+   * `detached` (`d=1`) detaches the surface first; without it, the surface
+   * is the program's again (SPEC §5.1, §5.5). `axes` (`scroll`) are the
+   * axes it scrolls along, 0 for none (§5.3). */
+  setDocument(html, detached = false, axes = 0) {
+    if (detached) this.detach();
+    const scrolled = this.axes !== 0;
+    this.axes = axes;
+    const parsed = new DOMParser().parseFromString(html, "text/html");
+    this.base = baseOf(parsed);
+    const request = parse(parsed.querySelector('meta[name="hotty-network" i]')?.getAttribute("content") ?? "");
+    this.resolver.ctx = { base: this.base, policy: intersect(this.host.policy, request) };
+    const ours = this.doc.head.querySelector("base");
+    if (ours && ours.getAttribute("href") !== this.base) ours.setAttribute("href", this.base);
+    this.resolver.adopt(parsed.documentElement);
+    const head = this.doc.head;
+    for (const n of Array.from(head.childNodes)) {
+      const el = n;
+      const ours2 = el.nodeType === 1 && (el.id === "hotty-host" || el.localName === "meta" || el.localName === "base");
+      if (!ours2) n.remove();
+    }
+    head.append(...Array.from(parsed.head.childNodes));
+    this.copyAttributes(parsed.documentElement, this.doc.documentElement);
+    this.copyAttributes(parsed.body, this.doc.body);
+    this.doc.body.replaceChildren(...Array.from(parsed.body.childNodes));
+    this.detachedState = detached;
+    this.sync();
+    if (scrolled) {
+      this.doc.documentElement.scrollTo(0, 0);
+      this.doc.body.scrollTo(0, 0);
+    }
+    this.refit();
+  }
+  /** A delta (SPEC §6). On a detached surface, the controls it adds are
+   * disabled too, and so is one whose `disabled` it removes. */
+  delta(op, target, key, payload) {
+    try {
+      this.deltas.apply(op, target, key, payload);
+    } finally {
+      if (this.detachedState) this.sync();
+      else this.clip();
+      this.refit();
+    }
+  }
+  // --- Ownership (SPEC §5.5) -----------------------------------------------
+  get detached() {
+    return this.detachedState;
+  }
+  /** `a=detach`: nothing in the surface reaches the program any more. A
+   * surface that has the keyboard gives it back silently, with no `change`
+   * and no `blur`, and its form controls act disabled. */
+  detach() {
+    if (!this.detachedState) {
+      this.detachedState = true;
+      this.dropDrag();
+      const had = this.keyboard || this.frameFocused();
+      this.keyboard = false;
+      this.focusedControl()?.blur();
+      if (had) this.giveBack();
+    }
+    this.sync();
+  }
+  /** Disables the form controls of a detached surface, as if each had the
+   * `disabled` attribute, or enables those it disabled, and marks its
+   * hyperlinks for the host's stylesheet. The attributes are the host's
+   * own: the document reports the program's (SPEC §16). */
+  sync() {
+    const detached = this.detachedState;
+    for (const el of Array.from(this.doc.querySelectorAll(CONTROLS))) {
+      if (!detached) this.resolver.removeOwn(el, "disabled");
+      else if (!el.hasAttribute("disabled")) this.resolver.setOwn(el, "disabled", "");
+    }
+    for (const a of Array.from(this.doc.querySelectorAll("a"))) {
+      if (detached && this.isHyperlink(a)) {
+        if (!a.hasAttribute(HYPERLINK)) this.resolver.setOwn(a, HYPERLINK, "");
+      } else this.resolver.removeOwn(a, HYPERLINK);
+    }
+    this.restyle();
+  }
+  copyAttributes(from, to) {
+    for (const [name] of this.resolver.attributes(to)) {
+      if (!from.hasAttribute(name)) this.resolver.remove(to, name);
+    }
+    for (const [name, value] of this.resolver.attributes(from)) this.resolver.set(to, name, value);
+  }
+  /** Rows the content needs at `cols` columns (`r=auto`). */
+  contentRows(cols, cellW, cellH) {
+    Object.assign(this.box.style, { display: "block", visibility: "hidden" });
+    return this.neededRows(cols, cellW, cellH);
+  }
+  /**
+   * Rows the document needs at `cols` columns: `r=auto`'s, and `fit`'s
+   * (SPEC §5.2). The frame is laid out at the width a placement gives it
+   * and a height of 1px, so the viewport adds nothing, then restored in the
+   * same task: nothing is drawn in between.
+   */
+  neededRows(cols, cellW, cellH) {
+    const f = this.frame.style;
+    const [width, height] = [f.width, f.height];
+    const root = this.doc.documentElement;
+    if (this.axes) this.resolver.setOwn(root, MEASURE, "");
+    Object.assign(f, { width: `${Math.round(cols * cellW)}px`, height: "1px" });
+    const h = root.scrollHeight;
+    Object.assign(f, { width, height });
+    if (this.axes) this.resolver.removeOwn(root, MEASURE);
+    return Math.max(1, Math.min(1e3, Math.ceil(h / cellH)));
+  }
+  /**
+   * In a document that scrolls along one axis only, the elements whose
+   * `overflow` along the other is `auto` or `scroll` are marked (`CLIP`), so
+   * that the host stylesheet clips that axis as `overflow: hidden` does
+   * (SPEC §5.3): no scrollbar, and nothing the user does scrolls it. CSS
+   * cannot select by a computed value, so the addon reads it, with its own
+   * rule off (`UNCLIPPED`), each time the document or its style may have
+   * changed: a document, a delta, the host stylesheet. Style only, no
+   * layout, and only for a document with `scroll` of 1 or 2.
+   */
+  clip() {
+    const prop = this.axes === 1 ? "overflowX" : this.axes === 2 ? "overflowY" : null;
+    if (!prop && !this.clipping) return;
+    const marked = new Set(this.doc.querySelectorAll(`[${CLIP}]`));
+    const want = /* @__PURE__ */ new Set();
+    if (prop) {
+      const root = this.doc.documentElement;
+      const win = this.frame.contentWindow;
+      this.resolver.setOwn(root, UNCLIPPED, "");
+      for (const el of [this.doc.body, ...Array.from(this.doc.body.querySelectorAll("*"))]) {
+        if (/auto|scroll/.test(win.getComputedStyle(el)[prop])) want.add(el);
+      }
+      this.resolver.removeOwn(root, UNCLIPPED);
+    }
+    for (const el of marked) if (!want.has(el)) this.resolver.removeOwn(el, CLIP);
+    for (const el of want) if (!marked.has(el)) this.resolver.setOwn(el, CLIP, "");
+    this.clipping = want.size > 0;
+  }
+  // --- Fit (SPEC §5.2: f=1 on a=place) --------------------------------------
+  /**
+   * `f=1` on the placement: from `rows`, the placement's own, the program
+   * hears `fit` whenever the rows the document needs differ from those it
+   * heard last. `null`: the placement did not ask (or is gone).
+   *
+   * What can change the height asks for a check in the next frame drawn:
+   * a document, a delta, a resource (`refresh`), the host stylesheet (cell
+   * size, font), an image, stylesheet or font loading, and, for whatever
+   * else does (the user opening a `<details>`, say), the root's and the
+   * body's boxes changing size. One check per frame, so one `fit` at most.
+   */
+  setFit(rows) {
+    this.fitRows = rows;
+    if (rows === null) {
+      this.fitObserver?.disconnect();
+      this.fitObserver = null;
+      if (this.fitFrame) this.frame.ownerDocument.defaultView?.cancelAnimationFrame(this.fitFrame);
+      this.fitFrame = 0;
+      this.fitDirty = false;
+      return;
+    }
+    if (!this.fitObserver) {
+      this.fitObserver = new ResizeObserver(() => this.refit());
+      this.fitObserver.observe(this.doc.documentElement);
+      this.fitObserver.observe(this.doc.body);
+    }
+    this.refit();
+  }
+  /** The document's height may have changed: a check in the next frame
+   * drawn. A surface out of view draws none; it checks once shown. */
+  refit() {
+    if (this.fitRows === null) return;
+    this.fitDirty = true;
+    if (this.fitFrame || this.box.style.display === "none") return;
+    this.fitFrame = this.frame.ownerDocument.defaultView.requestAnimationFrame(() => {
+      this.fitFrame = 0;
+      this.checkFit();
+    });
+  }
+  checkFit() {
+    if (this.fitRows === null || !this.fitDirty || this.box.style.display === "none") return;
+    this.fitDirty = false;
+    if (this.detachedState) return;
+    const rows = this.neededRows(this.cols, this.cellW, this.cellH);
+    if (rows === this.fitRows) return;
+    this.fitRows = rows;
+    this.emit("fit", "", { r: rows });
+  }
+  /** A resource changed (`a=res`, `a=del`): what names it resolves again. */
+  refresh(names) {
+    if (this.resolver.refresh(names)) this.refit();
+  }
+  /** The surface is `cols`×`rows` cells, and the box shows `win` of it:
+   *  the document keeps the whole size, offset by the window's corner. */
+  setSize(cols, rows, cellW, cellH, win = { x: 0, y: 0, w: cols, h: rows }) {
+    this.cols = cols;
+    this.rows = rows;
+    this.win = win;
+    this.cellW = cellW;
+    this.cellH = cellH;
+    Object.assign(this.frame.style, {
+      left: `${-Math.round(win.x * cellW)}px`,
+      top: `${-win.y * cellH}px`,
+      width: `${Math.round(cols * cellW)}px`,
+      height: `${rows * cellH}px`
+    });
+    this.box.style.width = `${Math.round(win.w * cellW)}px`;
+    this.box.style.height = `${win.h * cellH}px`;
+  }
+  /** The placement's z (SPEC §5.2): CSS z-index on the box, so overlapping
+   *  boxes stack by it, and by their order in the layer at the same z. */
+  setZ(z) {
+    this.box.style.zIndex = String(z);
+  }
+  /** Shows the surface with its top-left corner at (x, y) in the screen's pixels. */
+  show(x, y) {
+    this.box.style.left = `${x}px`;
+    this.box.style.top = `${y}px`;
+    this.box.style.visibility = "visible";
+    this.box.style.display = "block";
+    if (this.fitDirty) this.refit();
+  }
+  /** Out of view (its line left the screen): a drag under way ends
+   * (SPEC §9.1). */
+  hide() {
+    this.cancelDrag();
+    this.dropAlt();
+    this.box.style.display = "none";
+  }
+  /** No placement (hidden, or not placed yet): the document stays, and the
+   *  browser skips its style, layout and paint until it is placed again. */
+  park() {
+    this.box.style.display = "none";
+  }
+  destroy() {
+    this.setFit(null);
+    this.dropDrag();
+    this.dropAlt();
+    if (this.settling) clearTimeout(this.settling);
+    if (this.keyboard || this.frameFocused()) this.host.focusTerminal();
+    this.box.remove();
+  }
+  // --- Keyboard (PROTOCOL §8, Q-0005) -------------------------------------
+  hasKeyboard() {
+    return this.keyboard;
+  }
+  /** `a=focus`: the surface takes the keyboard, at `target` if given. */
+  focus(target) {
+    const el = target ? this.doc.getElementById(target) : null;
+    if (target && !el) throw new Error(target);
+    this.programFocus = true;
+    try {
+      this.frame.focus();
+      this.frame.contentWindow?.focus();
+      if (el) el.focus();
+      else if (!this.focusedControl()) this.tabbable()[0]?.focus();
+      this.keyboard = true;
+    } finally {
+      setTimeout(() => this.programFocus = false, 0);
+    }
+  }
+  /** `a=blur`, or the keyboard leaving: the edited control commits first. */
+  blur() {
+    this.commit();
+    if (this.keyboard) this.giveBack();
+  }
+  /** The browser's focus goes from the frame to the terminal. The frame lets
+   * go of it first: Firefox can leave the frame focused otherwise. */
+  giveBack() {
+    this.frame.blur();
+    this.host.focusTerminal();
+  }
+  commit() {
+    const active = this.focusedControl();
+    if (active) active.blur();
+  }
+  focusedControl() {
+    const a = this.doc.activeElement;
+    return a && a !== this.doc.body && a !== this.doc.documentElement ? a : null;
+  }
+  /** Whether the browser's focus is in this surface's frame. */
+  frameFocused() {
+    return this.frame.ownerDocument.activeElement === this.frame;
+  }
+  /**
+   * A press (SPEC §10.1). On an element that takes focus, the focus that
+   * follows gives the surface the keyboard (`onFocusIn`). On anything else,
+   * or anywhere in a detached surface, it takes nothing: a surface that had
+   * the keyboard gives it back (its control commits, then `blur`), and the
+   * focus the browser gives the frame anyway goes back to the terminal.
+   */
+  onPress(e) {
+    if (e.type === "pointerdown" && e.pointerType === "touch") return;
+    if (e.button !== 0) {
+      this.auxPress = true;
+      setTimeout(() => this.auxPress = false, 0);
+      return;
+    }
+    const el = this.detachedState ? null : focusTargetAt(e, this.hyper);
+    if (el) {
+      this.pressed = el;
+      this.settle();
+      return;
+    }
+    this.pressNothing = true;
+    if (this.keyboard) {
+      this.commit();
+      this.keyboard = false;
+      this.emit("blur", "");
+    }
+    this.settle();
+  }
+  /**
+   * Once the browser is done with a press (its default action focuses the
+   * frame): an element that takes focus has it, even where the browser does
+   * not focus one on a click (a button on a Mac, say); and focus the
+   * surface does not hold goes back to the terminal. The frame keeps it
+   * until then, so text selection starts as usual.
+   */
+  settle() {
+    if (this.settling) return;
+    this.settling = setTimeout(() => {
+      this.settling = null;
+      const el = this.pressed;
+      this.pressed = null;
+      this.pressNothing = false;
+      if (el && !this.keyboard && !this.detachedState && el.isConnected && this.doc.activeElement !== el) {
+        this.frame.focus();
+        el.focus({ preventScroll: true });
+      }
+      if (!this.keyboard && this.frameFocused()) this.giveBack();
+    }, 0);
+  }
+  /** An element got focus: the surface takes the keyboard if the element is
+   * one that takes focus, and the focus is neither the program's (no echo)
+   * nor a detached surface's. */
+  onFocusIn(e) {
+    if (this.programFocus || this.auxPress) return;
+    if (this.detachedState || this.pressNothing || !isElement(e.target) || !takesFocus(e.target, this.hyper)) {
+      this.settle();
+      return;
+    }
+    if (this.keyboard) return;
+    this.keyboard = true;
+    this.emit("focus", "");
+  }
+  tabbable() {
+    const all = this.doc.querySelectorAll(
+      "a[href], button, input:not([type=hidden]), select, textarea, summary, [tabindex], [contenteditable=''], [contenteditable=true]"
+    );
+    return Array.from(all).filter((el) => el.tabIndex >= 0 && !el.disabled && el.getClientRects().length > 0);
+  }
+  controlKind(el) {
+    if (!el) return "none";
+    const tag = el.localName;
+    if (tag === "textarea" || el.isContentEditable) return "textarea";
+    if (tag === "select") return "select";
+    if (tag === "input") {
+      const type = (el.type || "text").toLowerCase();
+      if (TEXT_TYPES.has(type)) return "text";
+      return "activatable";
+    }
+    if (tag === "button" || tag === "a" || tag === "summary") return "activatable";
+    return "none";
+  }
+  /** Whether the focused element uses the key; if not, the program gets it. */
+  consumes(e, kind) {
+    const plain = !e.ctrlKey && !e.altKey && !e.metaKey;
+    const k = e.key;
+    const printable = [...k].length === 1;
+    if (k === "Escape") return false;
+    switch (kind) {
+      case "text":
+        return (plain || e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) && (printable || ["Backspace", "Delete", "ArrowLeft", "ArrowRight", "Home", "End", "Enter"].includes(k));
+      case "textarea":
+        return (plain || e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) && (printable || ["Backspace", "Delete", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End", "PageUp", "PageDown", "Enter"].includes(k));
+      case "select":
+        return plain && (printable || ["ArrowUp", "ArrowDown", "Home", "End", "PageUp", "PageDown", "Enter", " "].includes(k));
+      case "activatable":
+        return plain && (k === " " || k === "Enter");
+      default:
+        return false;
+    }
+  }
+  onKey(e) {
+    if (e.isComposing || e.defaultPrevented) return;
+    if (!this.keyboard) {
+      this.settle();
+      if (this.host.browserKey(e)) return;
+      this.forward(e);
+      return;
+    }
+    if (e.key === "Tab" && !e.ctrlKey && !e.altKey && !e.metaKey) {
+      const order = this.tabbable();
+      const at = order.indexOf(this.doc.activeElement);
+      const leaving = order.length === 0 || (e.shiftKey ? at <= 0 : at === order.length - 1 || at < 0);
+      if (leaving) {
+        e.preventDefault();
+        this.blur();
+      }
+      return;
+    }
+    if (this.consumes(e, this.controlKind(this.doc.activeElement))) return;
+    if (this.host.browserKey(e)) return;
+    if (this.axes && this.scrollKey(e)) return;
+    this.forward(e);
+  }
+  /**
+   * A key a browser scrolls with, in a document that scrolls (SPEC §5.3):
+   * it scrolls the innermost box, from the focused element outward (from
+   * the root when none is), that can still move that way. Where none can,
+   * the key goes on to the program, as every key the surface does not use
+   * does (§10.2), unless `overscroll-behavior` stops it. The addon scrolls
+   * the box itself: the browser's own action could be the focused
+   * element's instead (a radio button's arrows, a number field's).
+   */
+  scrollKey(e) {
+    const k = keyScroll(e);
+    if (!k) return false;
+    const to = this.scroller(this.focusedControl(), k.axis, k.sign);
+    if (to === "terminal") return false;
+    e.preventDefault();
+    if (to === "stop") return true;
+    const y = k.axis === "y";
+    const by = k.by === "line" ? LINE_PX : k.by === "page" ? Math.max(1, (y ? to.clientHeight : to.clientWidth) * PAGE_FRACTION) : y ? to.scrollHeight : to.scrollWidth;
+    to.scrollBy(y ? { top: k.sign * by } : { left: k.sign * by });
+    return true;
+  }
+  forward(e) {
+    e.preventDefault();
+    e.stopPropagation();
+    this.forwarded.add(e.code);
+    this.host.key(e);
+  }
+  /** The release of a key the program had: the program hears it too, if it
+   *  asked the terminal for releases (SPEC §10.3). */
+  onKeyUp(e) {
+    if (!this.forwarded.delete(e.code)) return;
+    e.preventDefault();
+    e.stopPropagation();
+    this.host.key(e);
+  }
+  // --- Drags (SPEC §9.1) ----------------------------------------------------
+  /**
+   * A press of a mouse's or a pen's primary button on an element with
+   * `drag` in its `data-on` (the nearest, from the pressed one outward, and
+   * only if it has an id) starts a drag. The surface then holds the pointer
+   * until the release: captured by its root element, which no delta
+   * replaces, so every move comes here wherever it is (over the cells,
+   * another surface, or outside the page), and nothing else hears it.
+   */
+  onDragDown(e) {
+    this.cancelDrag();
+    if (this.detachedState || e.pointerType === "touch" || e.button !== 0 || !e.isPrimary) return;
+    let start = null;
+    for (const n of e.composedPath()) {
+      if (isElement(n) && listens(n, "drag")) {
+        start = n;
+        break;
+      }
+    }
+    const id = start?.getAttribute("id");
+    if (!id) return;
+    const [c, r] = this.cellOf(e);
+    const keys = keysOf(e);
+    this.drag = { pointer: e.pointerId, start: id, target: id, c, r, keys };
+    this.emit("dragstart", id, { c, r, keys });
+    try {
+      this.doc.documentElement.setPointerCapture(e.pointerId);
+    } catch {
+    }
+  }
+  /** A move during a drag: an event each time its target changes, and
+   * while it has none, each time its cell does. */
+  onDragMove(e) {
+    const d = this.drag;
+    if (!d || e.pointerId !== d.pointer) return;
+    const [c, r] = this.cellOf(e);
+    const target = this.dragTarget(this.elementAt(e, c, r));
+    const keys = keysOf(e);
+    if (target !== d.target || target === "" && (c !== d.c || r !== d.r)) {
+      this.emit("drag", target, { c, r, keys });
+    }
+    Object.assign(d, { target, c, r, keys });
+  }
+  /** The release ends the drag, wherever it is. Where it began, it is the
+   * click it would have been without the drag; anywhere else, no click. */
+  onDragUp(e) {
+    const d = this.drag;
+    if (!d || e.pointerId !== d.pointer || e.button !== 0) return;
+    this.drag = null;
+    const [c, r] = this.cellOf(e);
+    const at = this.elementAt(e, c, r);
+    const target = this.dragTarget(at);
+    this.emit("dragend", target, { c, r, keys: keysOf(e) });
+    this.dragReleased = true;
+    setTimeout(() => this.dragReleased = false, 0);
+    if (target === d.start && at) this.reportClick(ancestry(at));
+  }
+  /** The browser took the pointer away before the release. */
+  lostPointer(e) {
+    if (this.drag && e.pointerId === this.drag.pointer) this.cancelDrag();
+    if (e.pointerId === this.altPointer) this.altPointer = null;
+  }
+  /**
+   * Ends a drag under way without a release (SPEC §9.1: its placement went
+   * away, a new document came, or the pointer was lost): `dragend` with no
+   * target, at the last cell the program heard of.
+   */
+  cancelDrag() {
+    const d = this.drag;
+    if (!d) return;
+    this.dropDrag();
+    this.emit("dragend", "", { c: d.c, r: d.r, keys: d.keys });
+  }
+  /** Ends a drag under way, silently (a detached or deleted surface). */
+  dropDrag() {
+    const d = this.drag;
+    if (!d) return;
+    this.drag = null;
+    try {
+      if (this.doc.documentElement.hasPointerCapture(d.pointer)) this.doc.documentElement.releasePointerCapture(d.pointer);
+    } catch {
+    }
+  }
+  /** The surface's cell under the pointer, from its top left (the frame's
+   * origin), counting on past its edges. */
+  cellOf(e) {
+    return [Math.floor(e.clientX / this.cellW), Math.floor(e.clientY / this.cellH)];
+  }
+  /** The element under the pointer, if it is in the window (SPEC §5.2). */
+  elementAt(e, c, r) {
+    const w = this.win;
+    if (c < w.x || c >= w.x + w.w || r < w.y || r >= w.y + w.h) return null;
+    return this.doc.elementFromPoint(e.clientX, e.clientY);
+  }
+  /** A drag's target: the nearest element with an id and `drag` in its
+   * `data-on`, from `el` outward; "" where there is none. */
+  dragTarget(el) {
+    for (let n = el; n; n = n.parentElement) {
+      const id = n.getAttribute("id");
+      if (id && listens(n, "drag")) return id;
+    }
+    return "";
+  }
+  // --- Presses with Alt (SPEC §9.2) ---------------------------------------
+  /**
+   * A press of a mouse's or a pen's primary button with Alt held is the
+   * program's: the addon replays it on the cells beneath, and the surface
+   * hears nothing of it (no press, drag, click, focus or selection; its
+   * mousedown is cancelled). It holds the pointer until the release, as a
+   * drag does, so every move and the release go to the cells, wherever the
+   * pointer is. Whether it is the program's is decided here, at the press:
+   * Alt let go later changes nothing.
+   */
+  onAltDown(e) {
+    if (e.pointerType === "touch" || e.button !== 0 || !e.altKey || !e.isPrimary) return false;
+    this.cancelDrag();
+    this.dropAlt();
+    this.pointerPress = true;
+    this.altPointer = e.pointerId;
+    this.onLeave(e);
+    try {
+      this.doc.documentElement.setPointerCapture(e.pointerId);
+    } catch {
+    }
+    const [x, y] = this.toPage(e);
+    this.host.cells("down", e, x, y);
+    return true;
+  }
+  onAltMove(e) {
+    if (e.pointerId !== this.altPointer) return false;
+    const [x, y] = this.toPage(e);
+    this.host.cells("move", e, x, y);
+    return true;
+  }
+  onAltUp(e) {
+    if (e.pointerId !== this.altPointer || e.button !== 0) return false;
+    this.dropAlt();
+    this.altReleased = true;
+    setTimeout(() => this.altReleased = false, 0);
+    const [x, y] = this.toPage(e);
+    this.host.cells("up", e, x, y);
+    return true;
+  }
+  /** Ends such a gesture without a release: the frame goes away. */
+  dropAlt() {
+    const p = this.altPointer;
+    if (p === null) return;
+    this.altPointer = null;
+    try {
+      if (this.doc.documentElement.hasPointerCapture(p)) this.doc.documentElement.releasePointerCapture(p);
+    } catch {
+    }
+  }
+  /** A point of the frame's document in the page. */
+  toPage(e) {
+    const r = this.frame.getBoundingClientRect();
+    return [r.left + e.clientX, r.top + e.clientY];
+  }
+  /** `press` (SPEC §9), if the placement asked for it: `t` is the nearest
+   * element with an id. A press on a hyperlink is the terminal's. */
+  reportPress(e) {
+    if (!this.presses) return;
+    const link = this.linkIn(e);
+    if (link && this.isHyperlink(link)) return;
+    for (const n of e.composedPath()) {
+      const id = isElement(n) ? n.getAttribute("id") : null;
+      if (id) {
+        this.emit("press", id, { area: this.areaOf(n) });
+        return;
+      }
+    }
+    this.emit("press", "");
+  }
+  /**
+   * The cells an element's border box covers as the user sees it, scrolled
+   * included (SPEC §9: `area`), counted from the surface's top left cell:
+   * whole, where it is clipped or scrolled away. An edge within half a
+   * device pixel of a cell's is on it: layout rounds positions to fractions
+   * of a pixel, and the user sees no less than a device pixel.
+   */
+  areaOf(el) {
+    const b = el.getBoundingClientRect();
+    const tol = 0.5 / (this.frame.ownerDocument.defaultView?.devicePixelRatio || 1);
+    const c = Math.floor((b.left + tol) / this.cellW);
+    const r = Math.floor((b.top + tol) / this.cellH);
+    const right = Math.ceil((b.right - tol) / this.cellW);
+    const bottom = Math.ceil((b.bottom - tol) / this.cellH);
+    return { c, r, w: Math.max(0, right - c), h: Math.max(0, bottom - r) };
+  }
+  // --- Events for the program (PROTOCOL §8) --------------------------------
+  listen() {
+    const d = this.doc;
+    const win = this.frame.contentWindow;
+    d.addEventListener(
+      "pointerdown",
+      (e) => {
+        if (this.onAltDown(e)) return;
+        this.pointerPress = e.pointerType !== "touch";
+        if (this.pointerPress && e.button === 0 && e.isPrimary) this.reportPress(e);
+        this.onDragDown(e);
+        this.onPress(e);
+      },
+      true
+    );
+    d.addEventListener("pointermove", (e) => this.onAltMove(e) || this.onDragMove(e), true);
+    d.addEventListener("pointerup", (e) => this.onAltUp(e) || this.onDragUp(e), true);
+    d.addEventListener("pointercancel", (e) => this.lostPointer(e), true);
+    d.addEventListener("lostpointercapture", (e) => this.lostPointer(e), true);
+    d.addEventListener(
+      "mousedown",
+      (e) => {
+        if (this.altPointer !== null) {
+          e.preventDefault();
+          e.stopImmediatePropagation();
+          return;
+        }
+        if (!this.pointerPress && e.button === 0) this.reportPress(e);
+        this.pointerPress = false;
+        this.onPress(e);
+      },
+      true
+    );
+    d.addEventListener("focusin", (e) => this.onFocusIn(e), true);
+    d.addEventListener("click", (e) => this.onClick(e), true);
+    d.addEventListener("auxclick", (e) => this.onAuxClick(e), true);
+    d.addEventListener("mouseover", (e) => this.onOver(e), true);
+    d.addEventListener("mouseout", (e) => this.onOut(e), true);
+    d.addEventListener("submit", (e) => this.onSubmit(e), true);
+    d.addEventListener("change", (e) => this.onChange(e), true);
+    d.addEventListener("input", (e) => this.onInput(e), true);
+    d.addEventListener("keydown", (e) => this.onKey(e), true);
+    d.addEventListener("keyup", (e) => this.onKeyUp(e), true);
+    d.addEventListener("dragstart", (e) => e.preventDefault(), true);
+    d.addEventListener("wheel", (e) => this.onWheel(e), { capture: true, passive: false });
+    d.addEventListener("scroll", (e) => this.onScroll(e), true);
+    d.addEventListener("load", () => this.refit(), true);
+    d.addEventListener("error", () => this.refit(), true);
+    d.fonts.addEventListener("loadingdone", () => this.refit());
+    const toPage = (x, y) => {
+      const r = this.frame.getBoundingClientRect();
+      return [r.left + x, r.top + y];
+    };
+    if (this.host.pageScrolls) {
+      new Touch(
+        d,
+        this.frame.ownerDocument.defaultView,
+        { scroll: (dx, dy) => this.host.scrollPage(dx, dy), toPage },
+        false,
+        (e) => !this.axes && this.inScroller(e.target)
+      );
+    } else {
+      new Touch(d, this.frame.ownerDocument.defaultView, {
+        scroll: (dx, dy, x, y) => {
+          if (this.touchRoute === "terminal") this.host.wheel(new WheelEvent("wheel", { deltaX: dx, deltaY: dy, deltaMode: 0, clientX: x, clientY: y }), x, y);
+        },
+        toPage,
+        claim: (dx, dy, e) => {
+          this.touchRoute = this.axes ? this.gestureRoute(e.target, dx, dy) : "terminal";
+          return this.touchRoute !== "doc";
+        }
+      });
+    }
+    win.addEventListener("focus", () => {
+      if (!this.programFocus && !this.auxPress && !this.keyboard) this.settle();
+    });
+    win.addEventListener("blur", () => {
+      this.commit();
+      if (this.keyboard) {
+        this.keyboard = false;
+        this.emit("blur", "");
+      }
+    });
+  }
+  /**
+   * Nothing in a surface scrolls, and a wheel over it is the terminal's
+   * (SPEC §5.3, §9). Wheel events never leave an iframe, so without this
+   * the terminal's scrollback (or, on the alternate screen, the program's
+   * wheel input) would stall under the pointer. Ctrl and the wheel stay the
+   * browser's: its zoom. Where the page scrolls (the `scroll` option), the
+   * wheel is the browser's too: nothing in the frame scrolls, so it scrolls
+   * the page, as over the cells; but over an element it would scroll
+   * instead, the surface scrolls the page itself.
+   */
+  onWheel(e) {
+    if (e.ctrlKey) return;
+    if (this.axes) {
+      this.scrollWheel(e);
+      return;
+    }
+    if (this.host.pageScrolls) {
+      if (!this.inScroller(e.target)) return;
+      e.preventDefault();
+      const px = e.deltaMode === WheelEvent.DOM_DELTA_PIXEL ? 1 : e.deltaMode === WheelEvent.DOM_DELTA_LINE ? 20 : 400;
+      this.host.scrollPage(e.deltaX * px, e.deltaY * px);
+      return;
+    }
+    e.preventDefault();
+    const r = this.frame.getBoundingClientRect();
+    this.host.wheel(e, r.left + e.clientX, r.top + e.clientY);
+  }
+  /** Whether a wheel or a touch at target would scroll an element of the
+   * document, overflowing with `overflow: auto` or `scroll`: the browser
+   * gives the gesture to it before the page, and nothing in a surface
+   * scrolls (SPEC §5.3), so the gesture would go nowhere. */
+  inScroller(target) {
+    for (let n = target && isElement(target) ? target : null; n; n = n.parentElement) {
+      const s = n.ownerDocument.defaultView.getComputedStyle(n);
+      const y = /auto|scroll/.test(s.overflowY) && n.scrollHeight > n.clientHeight;
+      const x = /auto|scroll/.test(s.overflowX) && n.scrollWidth > n.clientWidth;
+      if (x || y) return true;
+    }
+    return false;
+  }
+  /**
+   * A wheel over a document that scrolls (SPEC §5.3). A gesture's first
+   * wheel decides where all of it goes, as a browser latches scrolling to
+   * what it began on: while an element under the pointer can still move
+   * that way, the browser scrolls it; where none can, the gesture goes on
+   * to the terminal, as over the cells beneath (§9), unless
+   * `overscroll-behavior` stops it. A gesture the document took goes no
+   * further when it reaches the end there, as in a browser. Where the page
+   * scrolls (the `scroll` option), the page is the terminal, and the
+   * browser chains to it from the document natively. A wheel the browser
+   * does not let the page cancel is the browser's already.
+   */
+  scrollWheel(e) {
+    if (this.host.pageScrolls || !e.cancelable) return;
+    const route = this.host.wheelGesture(this.name, () => {
+      const to = this.gestureTarget(e.target, e.deltaX, e.deltaY);
+      this.wheelBox = typeof to === "string" ? null : to;
+      return typeof to === "string" ? to : "doc";
+    });
+    const [axis, d] = mainAxis(e.deltaX, e.deltaY);
+    if (route === "doc" && this.wheelBox && this.canMove(this.wheelBox, axis, d)) return;
+    e.preventDefault();
+    if (route !== "terminal") return;
+    const r = this.frame.getBoundingClientRect();
+    this.host.wheel(e, r.left + e.clientX, r.top + e.clientY);
+  }
+  /** Where a gesture that scrolls by dx, dy pixels at `target` goes, by its
+   * main axis (SPEC §5.3). */
+  gestureRoute(target, dx, dy) {
+    const to = this.gestureTarget(target, dx, dy);
+    return typeof to === "string" ? to : "doc";
+  }
+  gestureTarget(target, dx, dy) {
+    const [axis, d] = mainAxis(dx, dy);
+    return this.scroller(target && isElement(target) ? target : null, axis, d);
+  }
+  /** Whether a box that scrolls can still move along `axis`, `d`'s way. */
+  canMove(el, axis, d) {
+    if (!d || !(this.axes & (axis === "y" ? 1 : 2))) return false;
+    const [at, span] = axis === "y" ? [el.scrollTop, el.scrollHeight - el.clientHeight] : [el.scrollLeft, el.scrollWidth - el.clientWidth];
+    const rtl = axis === "x" && this.frame.contentWindow.getComputedStyle(el).direction === "rtl";
+    const [min, max] = rtl ? [-span, 0] : [0, span];
+    return d > 0 ? at < max - 0.5 : at > min + 0.5;
+  }
+  /**
+   * What a scroll along `axis`, `d`'s way, from `from` (an element, or the
+   * root for none) moves in a document that scrolls (SPEC §5.3): the
+   * innermost box, from `from` outward, that the user scrolls along it
+   * (`overflow` `auto` or `scroll`; the root's, unless `hidden` or `clip`),
+   * that overflows there, and that can still move that way. At a box that
+   * cannot, the scroll stops if its `overscroll-behavior` is `contain` or
+   * `none`, and goes on outward otherwise. Past the root, and along an axis
+   * the document did not ask for, it is the terminal's.
+   */
+  scroller(from, axis, d) {
+    if (!d || !(this.axes & (axis === "y" ? 1 : 2))) return "terminal";
+    const win = this.frame.contentWindow;
+    const root = this.doc.documentElement;
+    const body = this.doc.body;
+    const rootStyle = win.getComputedStyle(root);
+    const fromBody = rootStyle.overflowX === "visible" && rootStyle.overflowY === "visible";
+    const prop = axis === "y" ? "overflowY" : "overflowX";
+    for (let el = from ?? root; el; el = el.parentElement) {
+      if (el === body && fromBody) continue;
+      const s = el === root ? rootStyle : win.getComputedStyle(el);
+      const scrolls = el === root ? !/hidden|clip/.test((fromBody ? win.getComputedStyle(body) : s)[prop]) : /auto|scroll/.test(s[prop]);
+      const span = axis === "y" ? el.scrollHeight - el.clientHeight : el.scrollWidth - el.clientWidth;
+      if (!scrolls || span < 1) continue;
+      if (this.canMove(el, axis, d)) return el;
+      const stops = axis === "y" ? s.overscrollBehaviorY : s.overscrollBehaviorX;
+      if (stops === "contain" || stops === "none") return "stop";
+    }
+    return "terminal";
+  }
+  /** Whatever the browser scrolled along an axis the document did not ask
+   * for (a focused element into view, say) goes back to zero. A text
+   * field's own text follows its caret (SPEC §5.3). */
+  onScroll(e) {
+    if (this.axes === 3) return;
+    const t = e.target;
+    const el = t === this.doc ? this.doc.scrollingElement : t && isElement(t) ? t : null;
+    if (!el || t !== this.doc && (el.localName === "input" || el.localName === "textarea")) return;
+    const x = !(this.axes & 2) && el.scrollLeft !== 0;
+    const y = !(this.axes & 1) && el.scrollTop !== 0;
+    if (x || y) el.scrollTo(x ? 0 : el.scrollLeft, y ? 0 : el.scrollTop);
+  }
+  /** An event for the program (SPEC §9); a detached surface sends none (§5.5). */
+  emit(kind, target, detail) {
+    if (this.detachedState) return;
+    this.host.event(this.name, kind, target, detail);
+  }
+  linkIn(e) {
+    for (const n of e.composedPath()) {
+      if (isElement(n) && n.localName === "a" && n.hasAttribute("href")) return n;
+    }
+    return null;
+  }
+  /** A link's `url` (SPEC §9): its href resolved against the document's
+   * base, or "" under hotty.invalid or when it is no URL. */
+  urlOf(link) {
+    const href = this.resolver.get(link, "href") ?? "";
+    let url = "";
+    try {
+      url = new URL(href, this.base).href;
+    } catch {
+    }
+    return url.startsWith(NO_BASE) ? "" : url;
+  }
+  /** The link's box in the page (the iframe may be offset for a window). */
+  pageBox(el) {
+    const f = this.frame.getBoundingClientRect();
+    const r = el.getBoundingClientRect();
+    return new DOMRect(f.left + r.left, f.top + r.top, r.width, r.height);
+  }
+  /** A hyperlink (SPEC §9): a link with target="_blank" and a `url`. One
+   * without a url is the program's, as any other link. */
+  isHyperlink(link) {
+    return link.getAttribute("target") === "_blank" && this.urlOf(link) !== "";
+  }
+  hyper = (link) => this.isHyperlink(link);
+  /** A link's click (SPEC §9). A hyperlink is the terminal's, as an OSC 8
+   * one is, and not reported; any other link is the program's: an event,
+   * with or without an id. The host opens nothing itself. */
+  onLink(link, e) {
+    e.preventDefault();
+    const url = this.urlOf(link);
+    if (this.isHyperlink(link)) {
+      if (e.button === 0) this.host.hyperlink("activate", e, url, this.pageBox(link));
+      return;
+    }
+    const detail = { href: this.resolver.get(link, "href") ?? "" };
+    if (url) detail.url = url;
+    detail.area = this.areaOf(link);
+    this.emit("click", link.getAttribute("id") ?? "", detail);
+  }
+  /** Other buttons on a link do nothing: no navigation, no new tab. */
+  onAuxClick(e) {
+    if (this.linkIn(e)) e.preventDefault();
+  }
+  hovered = null;
+  /** The pointer onto a hyperlink: the terminal hears it, as it does over
+   * an OSC 8 one. */
+  onOver(e) {
+    if (this.altPointer !== null) return;
+    const link = this.linkIn(e);
+    const hyper = link && this.isHyperlink(link) ? link : null;
+    if (hyper === this.hovered?.link) return;
+    this.onLeave(e);
+    const url = hyper ? this.urlOf(hyper) : "";
+    if (hyper) {
+      this.hovered = { link: hyper, url };
+      this.host.hyperlink("hover", e, url, this.pageBox(hyper));
+    }
+  }
+  onOut(e) {
+    if (this.altPointer !== null) return;
+    const to = e.relatedTarget;
+    if (this.hovered && to && this.hovered.link.contains(to)) return;
+    this.onLeave(e);
+  }
+  onLeave(e) {
+    const h = this.hovered;
+    if (!h) return;
+    this.hovered = null;
+    this.host.hyperlink("leave", e, h.url, this.pageBox(h.link));
+  }
+  onClick(e) {
+    const link = this.linkIn(e);
+    if (this.altReleased) {
+      this.altReleased = false;
+      e.preventDefault();
+      e.stopImmediatePropagation();
+      return;
+    }
+    if (this.dragReleased) {
+      this.dragReleased = false;
+      if (link) e.preventDefault();
+      return;
+    }
+    if (link) {
+      this.onLink(link, e);
+      return;
+    }
+    this.reportClick(e.composedPath());
+  }
+  /** The click of the nearest element on `path` that reports one (SPEC §9). */
+  reportClick(path) {
+    for (const n of path) {
+      if (!isElement(n)) continue;
+      if (n.localName === "a" && n.hasAttribute("href")) {
+        if (this.isHyperlink(n)) return;
+        const url = this.urlOf(n);
+        const detail = { href: this.resolver.get(n, "href") ?? "" };
+        if (url) detail.url = url;
+        detail.area = this.areaOf(n);
+        this.emit("click", n.getAttribute("id") ?? "", detail);
+        return;
+      }
+      const el = n;
+      const tag = el.localName;
+      const type = (el.getAttribute("type") ?? "").toLowerCase();
+      const wants = (el.getAttribute("data-on") ?? "").split(/\s+/).includes("click");
+      const reportable = tag === "button" || tag === "a" || tag === "summary" || tag === "input" && ["button", "submit", "reset"].includes(type) || wants;
+      if (!reportable) continue;
+      const id = el.getAttribute("id");
+      if (id) {
+        const detail = {};
+        const href = this.resolver.get(el, "href");
+        if (href !== null) detail.href = href;
+        const value = this.resolver.get(el, "value");
+        if (value !== null) detail.value = value;
+        detail.area = this.areaOf(el);
+        this.emit("click", id, detail);
+      }
+      break;
+    }
+  }
+  onSubmit(e) {
+    e.preventDefault();
+    const form = e.target;
+    const id = form.getAttribute("id");
+    if (!id) return;
+    const fields = {};
+    const data = new this.frame.contentWindow.FormData(form, e.submitter ?? void 0);
+    for (const [k, v] of data) if (typeof v === "string") fields[k] = v;
+    this.emit("submit", id, fields);
+  }
+  onChange(e) {
+    const el = e.target;
+    const id = el.getAttribute?.("id");
+    if (!id) return;
+    const type = (el.getAttribute("type") ?? "").toLowerCase();
+    if (el.localName === "input" && (type === "checkbox" || type === "radio")) {
+      this.emit("change", id, { checked: el.checked, value: this.resolver.get(el, "value") });
+    } else if ("value" in el) {
+      this.emit("change", id, { value: el.value });
+    }
+  }
+  onInput(e) {
+    const el = e.target;
+    const id = el.getAttribute?.("id");
+    if (!id) return;
+    const type = (el.getAttribute("type") ?? "").toLowerCase();
+    if (type === "checkbox" || type === "radio") return;
+    if ((el.getAttribute("data-on") ?? "").split(/\s+/).includes("input") && "value" in el) {
+      this.emit("input", id, { value: el.value });
+    }
+  }
+};
+function isElement(n) {
+  return n.nodeType === 1;
+}
+function listens(el, what) {
+  return (el.getAttribute("data-on") ?? "").split(/\s+/).includes(what);
+}
+function ancestry(el) {
+  const out = [];
+  for (let n = el; n; n = n.parentElement) out.push(n);
+  return out;
+}
+function keysOf(e) {
+  const keys = [];
+  if (e.shiftKey) keys.push("shift");
+  if (e.ctrlKey) keys.push("ctrl");
+  if (e.altKey) keys.push("alt");
+  if (e.metaKey) keys.push("meta");
+  return keys;
+}
+function takesFocus(el, hyper) {
+  if (el.matches(":disabled")) return false;
+  switch (el.localName) {
+    case "button":
+    case "select":
+    case "textarea":
+      return true;
+    case "input":
+      return el.type !== "hidden";
+    case "a":
+    case "area":
+      if (el.hasAttribute("href")) return !hyper(el);
+      break;
+    case "summary": {
+      const d = el.parentElement;
+      if (d?.localName === "details" && d.querySelector(":scope > summary") === el) return true;
+      break;
+    }
+  }
+  const ce = el.getAttribute("contenteditable");
+  if (ce !== null && ce.toLowerCase() !== "false" && el.isContentEditable) return true;
+  return el.hasAttribute("tabindex") && el.tabIndex >= 0;
+}
+function focusTargetAt(e, hyper) {
+  for (const n of e.composedPath()) {
+    if (!isElement(n)) continue;
+    if (n.localName === "a" && n.hasAttribute("href") && hyper(n)) return null;
+    if (takesFocus(n, hyper)) return n;
+    const control = n.localName === "label" ? n.control : null;
+    if (control) return takesFocus(control, hyper) ? control : null;
+  }
+  return null;
+}
+function mainAxis(dx, dy) {
+  return Math.abs(dy) >= Math.abs(dx) ? ["y", dy] : ["x", dx];
+}
+function keyScroll(e) {
+  if (e.ctrlKey || e.altKey || e.metaKey) return null;
+  if (e.shiftKey) return e.key === " " ? { axis: "y", sign: -1, by: "page" } : null;
+  switch (e.key) {
+    case "ArrowDown":
+      return { axis: "y", sign: 1, by: "line" };
+    case "ArrowUp":
+      return { axis: "y", sign: -1, by: "line" };
+    case "ArrowRight":
+      return { axis: "x", sign: 1, by: "line" };
+    case "ArrowLeft":
+      return { axis: "x", sign: -1, by: "line" };
+    case "PageDown":
+    case " ":
+      return { axis: "y", sign: 1, by: "page" };
+    case "PageUp":
+      return { axis: "y", sign: -1, by: "page" };
+    case "End":
+      return { axis: "y", sign: 1, by: "end" };
+    case "Home":
+      return { axis: "y", sign: -1, by: "end" };
+  }
+  return null;
+}
+
+// src/version.ts
+var VERSION = "0.1.0";
+var HOST = "@neuroplastio/xterm-addon-hotty";
+
+// src/wire.ts
+var OSC = 7279;
+var CHUNK = 4096;
+var MAX_COMMAND = 16 << 20;
+var Control = class _Control {
+  pairs;
+  constructor(pairs = []) {
+    this.pairs = pairs;
+  }
+  static parse(text2) {
+    const pairs = [];
+    if (text2 === "") return new _Control(pairs);
+    for (const part of text2.split(":")) {
+      const eq = part.indexOf("=");
+      if (eq <= 0) throw new Error(`bad control pair ${JSON.stringify(part)}`);
+      pairs.push([part.slice(0, eq), part.slice(eq + 1)]);
+    }
+    return new _Control(pairs);
+  }
+  get(key) {
+    for (const [k, v] of this.pairs) if (k === key) return v;
+    return void 0;
+  }
+  set(key, value) {
+    const i = this.pairs.findIndex(([k]) => k === key);
+    if (i >= 0) this.pairs[i] = [key, value];
+    else this.pairs.push([key, value]);
+    return this;
+  }
+  delete(key) {
+    const i = this.pairs.findIndex(([k]) => k === key);
+    if (i >= 0) this.pairs.splice(i, 1);
+    return this;
+  }
+  /** A continuation chunk carries nothing but `m` and `q`. */
+  onlyChunkKeys() {
+    return this.pairs.every(([k]) => k === "m" || k === "q");
+  }
+  encode() {
+    return this.pairs.map(([k, v]) => `${k}=${clean2(v)}`).join(":");
+  }
+};
+function clean2(value) {
+  return value.replace(/[^\x20-\x7e]|[:;=]/gu, "_");
+}
+var Assembler = class {
+  partial = null;
+  /** Feeds the data of one OSC 7279 sequence. */
+  feed(data) {
+    const semi = data.indexOf(";");
+    const ctlText = semi < 0 ? data : data.slice(0, semi);
+    const b64 = semi < 0 ? "" : data.slice(semi + 1);
+    let control;
+    try {
+      control = Control.parse(ctlText);
+    } catch (e) {
+      this.partial = null;
+      return [{ kind: "invalid", reason: String(e.message) }];
+    }
+    const more = control.get("m") === "1";
+    const partial = this.partial;
+    this.partial = null;
+    if (partial && control.onlyChunkKeys()) {
+      partial.b64.push(b64);
+      partial.size += b64.length;
+      if (partial.size > MAX_COMMAND) return [{ kind: "invalid", reason: "command too large" }];
+      if (more) {
+        this.partial = partial;
+        return [{ kind: "partial" }];
+      }
+      return settle([], emit(partial.control, partial.b64.join("")));
+    }
+    const out = [];
+    if (partial) out.push({ kind: "invalid", reason: "chunked command interrupted" });
+    if (more) {
+      this.partial = { control, b64: [b64], size: b64.length };
+      out.push({ kind: "partial" });
+      return out;
+    }
+    return settle(out, emit(control, b64));
+  }
+};
+function settle(out, d) {
+  if (d instanceof Promise) return d.then((x) => [...out, x]);
+  out.push(d);
+  return out;
+}
+function emit(control, b64) {
+  const fail = (e) => ({ kind: "invalid", reason: `bad payload: ${e.message}` });
+  let bytes;
+  try {
+    bytes = fromBase64(b64);
+  } catch (e) {
+    return fail(e);
+  }
+  const done = (payload) => {
+    control.delete("m").delete("o");
+    return { kind: "command", command: { control, payload } };
+  };
+  if (control.get("o") === "z") return inflate(bytes).then(done, fail);
+  return done(bytes);
+}
+function fromBase64(b64) {
+  const s = b64.replace(/\s+/g, "");
+  if (s === "") return new Uint8Array(0);
+  const bin = atob(s);
+  const out = new Uint8Array(bin.length);
+  for (let i = 0; i < bin.length; i++) out[i] = bin.charCodeAt(i);
+  return out;
+}
+function toBase64(bytes) {
+  let bin = "";
+  for (let i = 0; i < bytes.length; i += 32768) {
+    bin += String.fromCharCode(...bytes.subarray(i, i + 32768));
+  }
+  return btoa(bin);
+}
+async function inflate(bytes) {
+  const stream = new Blob([bytes]).stream().pipeThrough(new DecompressionStream("deflate"));
+  return new Uint8Array(await new Response(stream).arrayBuffer());
+}
+var utf8 = new TextDecoder("utf-8", { fatal: false });
+var utf8Encoder = new TextEncoder();
+function text(bytes) {
+  return utf8.decode(bytes);
+}
+function encode(control, payload = new Uint8Array(0)) {
+  const bytes = typeof payload === "string" ? utf8Encoder.encode(payload) : payload;
+  const b64 = toBase64(bytes);
+  const osc = (ctl, chunk) => `\x1B]${OSC};${ctl}${chunk === null ? "" : `;${chunk}`}\x1B\\`;
+  if (b64.length <= CHUNK) return osc(control.encode(), b64 === "" ? null : b64);
+  const quiet = control.get("q");
+  let out = "";
+  for (let i = 0; i < b64.length; i += CHUNK) {
+    const last = i + CHUNK >= b64.length;
+    let ctl;
+    if (i === 0) {
+      ctl = new Control([...control.pairs]).set("m", "1");
+    } else {
+      ctl = new Control([["m", last ? "0" : "1"]]);
+      if (quiet !== void 0) ctl.set("q", quiet);
+    }
+    out += osc(ctl.encode(), b64.slice(i, i + CHUNK));
+  }
+  return out;
+}
+async function decodeAll(stream) {
+  const a = new Assembler();
+  const out = [];
+  const re = /\x1b\]7279;([^\x07\x1b]*)(?:\x07|\x1b\\)/g;
+  for (const m of stream.matchAll(re)) {
+    for (const d of await a.feed(m[1])) if (d.kind === "command") out.push(d.command);
+  }
+  return out;
+}
+
+// src/addon.ts
+var mac = typeof navigator !== "undefined" && /Mac|iPhone|iPad/.test(navigator.platform || navigator.userAgent);
+function browserKeys(e) {
+  if (e.key === "F5" || e.key === "F11" || e.key === "F12") return true;
+  if (mac && e.metaKey) return true;
+  const mod = e.ctrlKey || e.metaKey;
+  const k = e.key.toLowerCase();
+  if (mod && !e.altKey && k === "r") return true;
+  if (mod && ["=", "+", "-", "0"].includes(e.key)) return true;
+  if (e.ctrlKey && e.shiftKey && ["i", "j", "c"].includes(k)) return true;
+  return false;
+}
+var GESTURE_MS = 150;
+var EVENTS = ["click", "change", "input", "submit", "press", "drag", "focus", "blur", "resize", "fit"];
+var Failure = class extends Error {
+  code;
+  constructor(code, detail) {
+    super(detail);
+    this.code = code;
+  }
+};
+var HottyAddon = class {
+  term;
+  opts;
+  store;
+  surfaces = /* @__PURE__ */ new Map();
+  placements = /* @__PURE__ */ new Map();
+  assembler = new Assembler();
+  disposables = [];
+  layer = null;
+  /** Commands held while synchronized output is on (PROTOCOL §5). */
+  held = [];
+  heldTimer = null;
+  css = "";
+  policy;
+  metrics = { cellW: 0, cellH: 0, key: "" };
+  resizeTimer = null;
+  /** A surface's key is being forwarded to the terminal (`key`), and the
+   * terminal's own focus is held off meanwhile. A program in the page may
+   * answer the key inside its dispatch, since xterm.js parses what follows
+   * user input at once: a surface that gives the keyboard back then has
+   * its focus carried out once the key is through. */
+  forwarding = false;
+  focusAfter = false;
+  /** The wheel gesture under way: the surface its last wheel was over ("" for
+   * the cells), where it goes, and when that wheel came. */
+  gesture = null;
+  constructor(options = {}) {
+    this.opts = { maxSurfaces: 64, resourceQuota: 64 << 20, ...options };
+    this.policy = clean(options.network);
+    this.store = new Store(this.opts.resourceQuota);
+    this.store.onChange = (names) => {
+      for (const s of this.surfaces.values()) s.refresh(names);
+    };
+  }
+  activate(term) {
+    this.term = term;
+    term.attachCustomKeyEventHandler((e) => !this.browserKey(e));
+    const p = term.parser;
+    this.disposables.push(
+      p.registerOscHandler(OSC, (data) => this.onOsc(data)),
+      // `CSI ? 2026 l` ends a synchronized batch: apply what was held, then
+      // let xterm handle the mode as usual.
+      p.registerCsiHandler({ prefix: "?", final: "l" }, (params) => {
+        if (params.some((x) => x === 2026)) this.release();
+        return false;
+      }),
+      // RIS: every surface goes (PROTOCOL §4).
+      p.registerEscHandler({ final: "c" }, () => {
+        this.reset();
+        return false;
+      }),
+      term.buffer.onBufferChange((b) => this.onBufferChange(b.type)),
+      term.onRender(() => {
+        this.bindTouch();
+        this.checkMetrics();
+      }),
+      term.onResize(() => this.checkMetrics()),
+      term.onScroll(() => this.reposition()),
+      term.onWriteParsed(() => this.reposition())
+    );
+  }
+  dispose() {
+    this.cellTouch?.dispose();
+    this.cellTouch = null;
+    this.reset();
+    for (const d of this.disposables) d.dispose();
+    this.disposables.length = 0;
+    this.layer?.remove();
+    this.layer = null;
+  }
+  /**
+   * An element of a surface as the program wrote it (tag, attributes, text,
+   * child elements): the shape the shared conformance vectors check
+   * (conformance/README.md). `null` if there is no such surface or element.
+   */
+  inspect(surface, id) {
+    const s = this.surfaces.get(surface);
+    const el = s?.doc.getElementById(id);
+    if (!s || !el) return null;
+    return {
+      tag: el.localName,
+      attrs: Object.fromEntries(s.resolver.attributes(el)),
+      text: el.textContent ?? "",
+      children: Array.from(el.children, (c) => [c.localName, c.getAttribute("id"), c.textContent ?? ""])
+    };
+  }
+  // --- Wire -----------------------------------------------------------------
+  onOsc(data) {
+    const decoded = this.assembler.feed(data);
+    if (decoded instanceof Promise) return decoded.then((d) => this.run(d)).then(() => true);
+    const r = this.run(decoded);
+    return r instanceof Promise ? r.then(() => true) : true;
+  }
+  run(decoded) {
+    let chain;
+    for (const d of decoded) {
+      if (d.kind === "invalid") this.opts.onInvalid?.(d.reason);
+      if (d.kind !== "command") continue;
+      const cmd = d.command;
+      chain = sequence(chain, () => this.submit(cmd));
+    }
+    return chain;
+  }
+  submit(cmd) {
+    if (this.term.modes.synchronizedOutputMode && cmd.control.get("a") !== "q") {
+      this.held.push(cmd);
+      this.heldTimer ??= setTimeout(() => this.release(), 1e3);
+      return;
+    }
+    return this.apply([cmd]);
+  }
+  release() {
+    if (this.heldTimer) clearTimeout(this.heldTimer);
+    this.heldTimer = null;
+    const batch = this.held;
+    this.held = [];
+    if (batch.length) void this.apply(batch);
+  }
+  apply(batch) {
+    const t0 = performance.now();
+    let chain;
+    for (const cmd of batch) chain = sequence(chain, () => this.handle(cmd));
+    const done = () => this.opts.onFrame?.({ commands: batch.length, applyMs: performance.now() - t0 });
+    if (chain) return chain.then(done);
+    done();
+  }
+  handle(cmd) {
+    const action = cmd.control.get("a") ?? "";
+    const quiet = Number(cmd.control.get("q") ?? "0");
+    const ok = (r) => {
+      if (quiet === 0) this.reply("ok", cmd, r ?? {});
+    };
+    const fail = (e) => {
+      const code = e instanceof Failure || e instanceof DeltaError ? e.code : "EINVAL";
+      const detail = e instanceof Error ? e.message : String(e);
+      if (quiet < 2) this.reply("err", cmd, { body: JSON.stringify({ code, detail }) });
+    };
+    try {
+      const r = this.dispatch(action, cmd);
+      if (r instanceof Promise) return r.then(ok, fail);
+      ok(r);
+    } catch (e) {
+      fail(e);
+    }
+  }
+  reply(kind, cmd, r) {
+    const c = new Control().set("a", kind);
+    for (const k of ["n", "s"]) {
+      const v = cmd.control.get(k);
+      if (v !== void 0) c.set(k, v);
+    }
+    c.set("re", cmd.control.get("a") ?? "");
+    for (const [k, v] of r.extra ?? []) c.set(k, v);
+    this.send(encode(c, r.body ?? ""));
+  }
+  send(message) {
+    this.term.input(message, false);
+  }
+  // --- Commands (PROTOCOL §3-§6) -------------------------------------------
+  dispatch(action, cmd) {
+    const c = cmd.control;
+    switch (action) {
+      case "q":
+        return { body: JSON.stringify(this.capabilities()) };
+      case "doc": {
+        const name = this.surfaceName(c);
+        let s = this.surfaces.get(name);
+        if (!s) {
+          if (this.surfaces.size >= this.opts.maxSurfaces) throw new Failure("EQUOTA", `at most ${this.opts.maxSurfaces} surfaces`);
+          s = new Surface(name, this.host(), this.hostCss(), this.scheme());
+          this.surfaces.set(name, s);
+        }
+        if (c.get("d") !== "1") s.cancelDrag();
+        const scroll = c.get("scroll");
+        s.setDocument(text(cmd.payload), c.get("d") === "1", scroll === "1" || scroll === "2" || scroll === "3" ? Number(scroll) : 0);
+        return;
+      }
+      case "place":
+        return this.place(this.existing(c), c);
+      case "hide": {
+        const s = this.existing(c);
+        s.cancelDrag();
+        if (s.hasKeyboard()) s.blur();
+        this.unplace(s.name);
+        return;
+      }
+      case "delta": {
+        const s = this.existing(c);
+        s.delta(c.get("op") ?? "morph", c.get("t"), c.get("k"), text(cmd.payload));
+        return;
+      }
+      case "res": {
+        const id = c.get("id");
+        if (!id) throw new Failure("EINVAL", "res needs id=<name>");
+        try {
+          this.store.put(id, c.get("type") ?? "application/octet-stream", cmd.payload);
+        } catch (e) {
+          throw new Failure("EQUOTA", e.message);
+        }
+        return;
+      }
+      case "del": {
+        const id = c.get("id");
+        if (id !== void 0) {
+          this.store.remove(id);
+          return;
+        }
+        const name = c.get("s");
+        if (name === void 0) {
+          this.reset();
+          return;
+        }
+        if (!this.surfaces.has(name)) throw new Failure("ENOENT", `no surface ${name}`);
+        this.remove(name);
+        return;
+      }
+      case "detach":
+        this.existing(c).detach();
+        return;
+      case "focus": {
+        const s = this.existing(c);
+        if (s.detached) throw new Failure("EDETACHED", `surface ${s.name} is detached`);
+        try {
+          s.focus(c.get("t"));
+        } catch (e) {
+          throw new Failure("ENOTARGET", e.message);
+        }
+        return;
+      }
+      case "blur":
+        this.existing(c).blur();
+        return;
+      case "":
+        throw new Failure("EINVAL", "missing a=<action>");
+      default:
+        throw new Failure("EINVAL", `unknown action a=${action}`);
+    }
+  }
+  capabilities() {
+    const { cellW, cellH } = this.cell();
+    const scale = window.devicePixelRatio || 1;
+    return {
+      v: "0.1",
+      ops: OPS,
+      events: EVENTS,
+      cell: { w: Math.round(cellW * scale), h: Math.round(cellH * scale) },
+      scale,
+      scheme: this.scheme(),
+      limits: { resources: this.store.quota, surfaces: this.opts.maxSurfaces },
+      net: this.policy,
+      scroll: true,
+      host: HOST,
+      version: VERSION
+    };
+  }
+  surfaceName(c) {
+    const s = c.get("s");
+    if (s === void 0) throw new Failure("EINVAL", "missing s=<surface>");
+    if (!/^[A-Za-z0-9_-]{1,64}$/.test(s)) throw new Failure("EINVAL", `bad surface name ${JSON.stringify(s)}`);
+    return s;
+  }
+  existing(c) {
+    const name = this.surfaceName(c);
+    const s = this.surfaces.get(name);
+    if (!s) throw new Failure("ENOENT", `no surface ${name}`);
+    return s;
+  }
+  place(s, c) {
+    const cols = Number(c.get("c"));
+    if (c.get("c") === void 0 || !Number.isInteger(cols)) throw new Failure("EINVAL", "place needs c=<cols>");
+    if (cols < 1 || cols > 1e3) throw new Failure("EINVAL", "c out of range");
+    const { cellW, cellH } = this.cell();
+    const r = c.get("r");
+    const auto = r === void 0 || r === "auto";
+    const rows = auto ? s.contentRows(cols, cellW, cellH) : Number(r);
+    if (!Number.isInteger(rows) || rows < 1 || rows > 1e3) throw new Failure("EINVAL", "r out of range");
+    const cell = (k, d) => {
+      const v = c.get(k);
+      if (v === void 0) return d;
+      const n = Number(v);
+      if (!Number.isInteger(n) || n < 0) throw new Failure("EINVAL", `bad ${k}`);
+      return n;
+    };
+    const x = cell("x", 0);
+    const y = cell("y", 0);
+    const win = { x, y, w: cell("w", cols - x), h: cell("h", rows - y) };
+    if (win.w < 1 || win.h < 1 || x + win.w > cols || y + win.h > rows) {
+      throw new Failure("EINVAL", "the window is not inside the surface");
+    }
+    const z = c.get("z") === void 0 ? 0 : Number(c.get("z"));
+    if (!Number.isInteger(z) || z < -1e3 || z > 1e3) throw new Failure("EINVAL", "z is an integer from -1000 to 1000");
+    s.autoRows = auto;
+    s.setSize(cols, rows, cellW, cellH, win);
+    s.setZ(z);
+    this.unplace(s.name);
+    s.presses = c.get("p") === "1";
+    s.setFit(c.get("f") === "1" ? rows : null);
+    const buf = this.term.buffer.active;
+    const col = buf.cursorX;
+    const row = buf.cursorY;
+    const p = { surface: s, kind: buf.type === "normal" ? "normal" : "alt", col, row, disposables: [] };
+    if (p.kind === "normal") {
+      const marker = this.term.registerMarker(0);
+      if (marker) {
+        p.marker = marker;
+        p.disposables.push(marker.onDispose(() => this.unplace(s.name)));
+      } else {
+        p.kind = "alt";
+      }
+    }
+    this.placements.set(s.name, p);
+    this.position(p);
+    if (c.get("C") !== "1") this.moveCursorBelow(win.h);
+    return { extra: [["c", String(cols)], ["r", String(rows)]] };
+  }
+  /** As the native host: index `rows` times, then carriage return. */
+  moveCursorBelow(rows) {
+    const core = this.term._core;
+    const ih = core?._inputHandler;
+    if (ih && core?.buffer) {
+      for (let i = 0; i < rows; i++) ih.lineFeed();
+      core.buffer.x = 0;
+    }
+  }
+  /** Puts every placed surface where its cells are now. */
+  reposition() {
+    for (const p of this.placements.values()) this.position(p);
+  }
+  position(p) {
+    const { cellW, cellH } = this.cell();
+    const s = p.surface;
+    let row = p.row;
+    if (p.kind === "normal") {
+      const buf = this.term.buffer.active;
+      if (buf.type !== "normal" || !p.marker || p.marker.line < 0) {
+        s.hide();
+        return;
+      }
+      row = p.marker.line - buf.viewportY;
+    }
+    if (row + s.win.h <= 0 || row >= this.term.rows) {
+      s.hide();
+      return;
+    }
+    s.setSize(s.cols, s.rows, cellW, cellH, s.win);
+    s.show(Math.round(p.col * cellW), row * cellH);
+  }
+  unplace(name) {
+    const p = this.placements.get(name);
+    if (!p) return;
+    this.placements.delete(name);
+    for (const d of p.disposables) d.dispose();
+    p.marker?.dispose();
+    p.surface.presses = false;
+    p.surface.setFit(null);
+    p.surface.park();
+  }
+  remove(name) {
+    this.unplace(name);
+    this.surfaces.get(name)?.destroy();
+    this.surfaces.delete(name);
+  }
+  reset() {
+    for (const name of Array.from(this.surfaces.keys())) this.remove(name);
+    this.held = [];
+  }
+  onBufferChange(type) {
+    for (const p of Array.from(this.placements.values())) {
+      if (p.kind === "alt" && type === "normal") this.remove(p.surface.name);
+    }
+    this.reposition();
+  }
+  // --- Geometry and look ---------------------------------------------------
+  host() {
+    return {
+      layer: this.ensureLayer(),
+      store: this.store,
+      event: (surface, kind, target, detail) => {
+        const c = new Control().set("a", "ev").set("s", surface).set("e", kind).set("t", target);
+        this.send(encode(c, detail === void 0 ? "" : JSON.stringify(detail)));
+      },
+      browserKey: (e) => this.browserKey(e),
+      key: (e) => {
+        const ta = this.term.textarea;
+        if (!ta) return;
+        const init = {
+          key: e.key,
+          code: e.code,
+          location: e.location,
+          repeat: e.repeat,
+          ctrlKey: e.ctrlKey,
+          altKey: e.altKey,
+          shiftKey: e.shiftKey,
+          metaKey: e.metaKey,
+          keyCode: e.keyCode,
+          which: e.which,
+          bubbles: true,
+          cancelable: true
+        };
+        Object.defineProperty(ta, "focus", { value: () => {
+        }, configurable: true });
+        this.forwarding = true;
+        try {
+          const ev = new KeyboardEvent(e.type, init);
+          ta.dispatchEvent(ev);
+          if (e.type === "keydown" && !ev.defaultPrevented && [...e.key].length === 1) {
+            const c = e.key.codePointAt(0);
+            ta.dispatchEvent(new KeyboardEvent("keypress", { ...init, charCode: c, keyCode: c, which: c }));
+          }
+        } finally {
+          delete ta.focus;
+          this.forwarding = false;
+          if (this.focusAfter) {
+            this.focusAfter = false;
+            this.term.focus();
+          }
+        }
+      },
+      focusTerminal: () => {
+        if (this.forwarding) this.focusAfter = true;
+        else this.term.focus();
+      },
+      policy: this.policy,
+      pageScrolls: this.pageScrolls,
+      scrollPage: (dx, dy) => this.scrollPage(dx, dy),
+      wheelGesture: (surface, decide) => {
+        const now = performance.now();
+        const g = this.gesture;
+        const same = g !== null && now - g.at < GESTURE_MS && (g.surface === surface || g.route === "terminal");
+        const route = same ? g.route : decide();
+        this.gesture = { surface, route, at: now };
+        return route;
+      },
+      // A hyperlink (SPEC §9) goes where xterm.js sends an OSC 8 one: the
+      // terminal's linkHandler, or its confirm-then-open default, and only
+      // for http and https unless the handler allows other schemes.
+      hyperlink: (kind, e, url, box) => {
+        const handler = this.term.options.linkHandler;
+        if (!handler?.allowNonHttpProtocols) {
+          try {
+            if (!["http:", "https:"].includes(new URL(url).protocol)) return;
+          } catch {
+            return;
+          }
+        }
+        const range = this.cellRange(box);
+        if (kind === "activate") {
+          if (handler) handler.activate(e, url, range);
+          else openAfterConfirm(url);
+        } else if (kind === "hover") handler?.hover?.(e, url, range);
+        else handler?.leave?.(e, url, range);
+      },
+      // Replayed on the terminal's screen, where xterm handles it as its own:
+      // scrollback, or mouse reports and arrow keys on the alternate screen.
+      wheel: (e, x, y) => this.forwardWheel(e, x, y),
+      cells: (kind, e, x, y) => this.pressCells(kind, e, x, y)
+    };
+  }
+  cellTouch = null;
+  pageScrollBound = false;
+  /** Whether the page scrolls, not the terminal (the `scroll` option). */
+  get pageScrolls() {
+    return this.opts.scroll === "page";
+  }
+  /**
+   * Wheels and touches on the cells left to the browser, which scrolls the
+   * page (`scroll: "page"`): they stop at the terminal's element, before
+   * xterm.js, which would take them for its scrollback, or turn a drag into
+   * arrow keys, and cancel the browser's scroll. Nothing here cancels it.
+   */
+  bindPageScroll(el) {
+    if (this.pageScrollBound) return;
+    this.pageScrollBound = true;
+    const stop = (e) => e.stopPropagation();
+    for (const type of ["wheel", "touchstart", "touchmove", "touchend", "touchcancel"]) {
+      el.addEventListener(type, stop, { capture: true, passive: true });
+      this.disposables.push({ dispose: () => el.removeEventListener(type, stop, { capture: true }) });
+    }
+  }
+  /** Scrolls what scrolls the terminal's page: its nearest ancestor that
+   * scrolls, or the document. */
+  scrollPage(dx, dy) {
+    let el = this.term.element?.parentElement ?? null;
+    for (; el; el = el.parentElement) {
+      const o = getComputedStyle(el).overflowY;
+      if (/auto|scroll/.test(o) && el.scrollHeight > el.clientHeight) break;
+    }
+    (el ?? document.scrollingElement ?? document.documentElement).scrollBy(dx, dy);
+  }
+  cellWheelBound = false;
+  /** A wheel over the cells begins or goes on with a gesture of the
+   * terminal's: a document that scrolls under the pointer as the terminal
+   * scrolls takes none of it (`wheelGesture`). */
+  bindCellWheel(el) {
+    if (this.cellWheelBound) return;
+    this.cellWheelBound = true;
+    const wheel = (e) => {
+      if (e.isTrusted) this.gesture = { surface: "", route: "terminal", at: performance.now() };
+    };
+    el.addEventListener("wheel", wheel, { capture: true, passive: true });
+    this.disposables.push({ dispose: () => el.removeEventListener("wheel", wheel, { capture: true }) });
+  }
+  /** Touch on the cells (the `touch` option), once the terminal is open. */
+  bindTouch() {
+    const el = this.term.element;
+    if (el && this.pageScrolls) return this.bindPageScroll(el);
+    if (el) this.bindCellWheel(el);
+    if (this.cellTouch || !el || this.opts.touch === false) return;
+    const screen = () => el.querySelector(".xterm-screen");
+    this.cellTouch = new Touch(
+      el,
+      el.ownerDocument.defaultView,
+      {
+        scroll: (dx, dy, x, y) => this.forwardWheel(new WheelEvent("wheel", { deltaX: dx, deltaY: dy, deltaMode: 0 }), x, y),
+        // A tap is the press and release a click would make: xterm.js
+        // reports them to the program as it reports a mouse.
+        tap: (x, y) => {
+          const at = { clientX: x, clientY: y, button: 0, bubbles: true, cancelable: true, view: el.ownerDocument.defaultView };
+          screen()?.dispatchEvent(new MouseEvent("mousedown", { ...at, buttons: 1 }));
+          el.ownerDocument.dispatchEvent(new MouseEvent("mouseup", { ...at, buttons: 0 }));
+        },
+        toPage: (x, y) => [x, y]
+      },
+      true
+    );
+  }
+  /** A wheel, at a point in the page, replayed on the terminal's screen,
+   * where xterm.js handles it as its own: scrollback, or mouse reports and
+   * arrow keys on the alternate screen. */
+  forwardWheel(e, x, y) {
+    const ev = new WheelEvent("wheel", {
+      deltaX: e.deltaX,
+      deltaY: e.deltaY,
+      deltaMode: e.deltaMode,
+      clientX: x,
+      clientY: y,
+      shiftKey: e.shiftKey,
+      altKey: e.altKey,
+      metaKey: e.metaKey,
+      bubbles: true,
+      cancelable: true
+    });
+    legacyWheelDelta(ev, e);
+    this.term.element?.querySelector(".xterm-screen")?.dispatchEvent(ev);
+  }
+  /**
+   * A press with Alt held on a surface, a move of its gesture, or its
+   * release (SPEC §9.2), replayed on the cells beneath, where xterm.js
+   * handles them as its own mouse: a report to the program, with Alt, or
+   * its selection (rectangular, with Alt). The press goes to the screen,
+   * where xterm.js listens for presses; the moves and the release to its
+   * document, where it listens while a button is held. The keyboard goes
+   * back to the terminal first, as on a click on the cells (§10.1): a
+   * surface that had it sends `blur`.
+   */
+  pressCells(kind, e, x, y) {
+    const el = this.term.element;
+    if (!el) return;
+    const init = {
+      clientX: x,
+      clientY: y,
+      screenX: e.screenX,
+      screenY: e.screenY,
+      button: 0,
+      buttons: e.buttons,
+      // xterm.js selects on a press whose detail is the click count.
+      detail: kind === "down" ? e.detail || 1 : e.detail,
+      altKey: e.altKey,
+      ctrlKey: e.ctrlKey,
+      shiftKey: e.shiftKey,
+      metaKey: e.metaKey,
+      bubbles: true,
+      cancelable: true,
+      view: el.ownerDocument.defaultView
+    };
+    if (kind === "down") {
+      for (const s of this.surfaces.values()) if (s.hasKeyboard()) s.blur();
+      el.querySelector(".xterm-screen")?.dispatchEvent(new MouseEvent("mousedown", init));
+      return;
+    }
+    el.ownerDocument.dispatchEvent(new MouseEvent(kind === "move" ? "mousemove" : "mouseup", init));
+  }
+  ensureLayer() {
+    if (this.layer?.isConnected) return this.layer;
+    const screen = this.term.element?.querySelector(".xterm-screen");
+    if (!screen) throw new Failure("EINVAL", "terminal is not open");
+    const layer = document.createElement("div");
+    layer.className = "hotty-layer";
+    Object.assign(layer.style, { position: "absolute", inset: "0", overflow: "hidden", zIndex: "6", pointerEvents: "none" });
+    screen.append(layer);
+    this.layer = layer;
+    return layer;
+  }
+  browserKey(e) {
+    return (this.opts.browserKeys ?? browserKeys)(e);
+  }
+  /** A box in the page as the buffer cells it covers (1-based, as xterm.js
+   * gives an OSC 8 link's range). */
+  cellRange(box) {
+    const screen = this.term.element?.querySelector(".xterm-screen")?.getBoundingClientRect();
+    const { cellW, cellH } = this.cell();
+    const top = this.term.buffer.active.viewportY;
+    const at = (x, y) => ({
+      x: Math.floor((x - (screen?.left ?? 0)) / cellW) + 1,
+      y: top + Math.floor((y - (screen?.top ?? 0)) / cellH) + 1
+    });
+    return { start: at(box.left, box.top), end: at(box.right - 1, box.bottom - 1) };
+  }
+  /** Cell size in CSS pixels (private in xterm.js), with a measured fallback. */
+  cell() {
+    const dims = this.term._core?._renderService?.dimensions?.css?.cell;
+    if (dims && dims.width > 0 && dims.height > 0) return { cellW: dims.width, cellH: dims.height };
+    const screen = this.term.element?.querySelector(".xterm-screen");
+    if (screen && this.term.cols > 0) return { cellW: screen.clientWidth / this.term.cols, cellH: screen.clientHeight / this.term.rows };
+    return { cellW: 9, cellH: 17 };
+  }
+  hostCss() {
+    const { cellW, cellH } = this.cell();
+    const o = this.term.options;
+    this.css = hostCss(o.theme, { cellW, cellH, fontFamily: o.fontFamily ?? "monospace", fontSize: o.fontSize ?? 15 });
+    return this.css;
+  }
+  scheme() {
+    return palette(this.term.options.theme).dark ? "dark" : "light";
+  }
+  /** On every render: did the cell size, font or theme change? */
+  checkMetrics() {
+    const { cellW, cellH } = this.cell();
+    const o = this.term.options;
+    const key = `${cellW}x${cellH}|${o.fontFamily}|${o.fontSize}|${JSON.stringify(o.theme ?? {})}`;
+    if (key === this.metrics.key) return;
+    const sizeChanged = this.metrics.cellW !== 0 && (cellW !== this.metrics.cellW || cellH !== this.metrics.cellH);
+    this.metrics = { cellW, cellH, key };
+    if (this.surfaces.size === 0) return;
+    const css = this.hostCss();
+    const scheme = this.scheme();
+    for (const s of this.surfaces.values()) s.setHostCss(css, scheme);
+    this.reposition();
+    if (sizeChanged) {
+      if (this.resizeTimer) clearTimeout(this.resizeTimer);
+      this.resizeTimer = setTimeout(() => {
+        for (const p of this.placements.values()) {
+          const s = p.surface;
+          if (s.detached) continue;
+          this.host().event(s.name, "resize", "", { w: Math.round(s.cols * cellW), h: s.rows * cellH });
+        }
+      }, 100);
+    }
+  }
+};
+function sequence(chain, f) {
+  if (chain) return chain.then(f);
+  const r = f();
+  return r instanceof Promise ? r : void 0;
+}
+function openAfterConfirm(uri) {
+  if (!confirm(`Do you want to navigate to ${uri}?
+
+WARNING: This link could potentially be dangerous`)) return;
+  const w = window.open();
+  if (!w) {
+    console.warn("Opening link blocked as opener could not be cleared");
+    return;
+  }
+  try {
+    w.opener = null;
+  } catch {
+  }
+  w.location.href = uri;
+}
+function legacyWheelDelta(ev, from) {
+  if (!("wheelDeltaY" in WheelEvent.prototype)) return;
+  const legacy = from;
+  const real = from.isTrusted;
+  const pixels = from.deltaMode === WheelEvent.DOM_DELTA_PIXEL ? 1 : from.deltaMode === WheelEvent.DOM_DELTA_LINE ? 20 : 400;
+  const x = real && legacy.wheelDeltaX || -from.deltaX * pixels * (120 / 50);
+  const y = real && legacy.wheelDeltaY || -from.deltaY * pixels * (120 / 50);
+  Object.defineProperty(ev, "wheelDeltaX", { value: x });
+  Object.defineProperty(ev, "wheelDeltaY", { value: y });
+}
+export {
+  Control,
+  EVENTS,
+  HOST,
+  HottyAddon,
+  OSC,
+  VERSION,
+  browserKeys,
+  decodeAll,
+  encode
+};
+//# sourceMappingURL=hotty-xterm.js.map