@tinkerlandai/indiana-iam 0.0.0-stage → 0.1.0

package/README.md

@@ -1,3 +1,93 @@
-# Temporary Holding Version
+# @tinkerlandai/indiana-iam
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Build-time generator for the Indiana App Manifest (IAM). On every production build it scans your App's source, generates
+and validates the IAM, and writes the release descriptor your pages use to bind visual changes to that exact source.
+Indiana's App page map edits pages from these files; the browser SDK applies the published changes.
+
+Install it as a development dependency (Node.js 22 or later):
+
+```sh
+npm install --save-dev @tinkerlandai/indiana-iam
+```
+
+## Next.js (15.4.1 or later)
+
+```js
+// next.config.mjs
+import { withIndianaIam } from "@tinkerlandai/indiana-iam/next";
+
+export default withIndianaIam({
+  // your Next.js config
+});
+```
+
+`next build` then:
+
+1. scans the source and exposes `process.env.INDIANA_IAM_RELEASE_URL`;
+2. after compilation (`compiler.runAfterProductionCompile`), packages the compiled CSS, validates the IAM, writes it
+   to a temporary folder outside your checkout and serves `public/.well-known/indiana/releases/<id>.json`.
+
+Point the visual SDK at the descriptor:
+
+```tsx
+<script
+  type="module"
+  src="https://tinker.cash/web-view/visual-sdk"
+  data-indiana-environment="<environment ID>"
+  data-indiana-manifest-url={process.env.INDIANA_IAM_RELEASE_URL}
+/>
+```
+
+`next dev` and other phases leave your config unchanged. Add `public/.well-known/indiana/` to `.gitignore`.
+
+## Vite and React Router
+
+```js
+// vite.config.mjs
+import { indianaIam } from "@tinkerlandai/indiana-iam/vite";
+
+export default { plugins: [indianaIam()] };
+```
+
+Client builds expose `import.meta.env.INDIANA_IAM_RELEASE_URL` and write the descriptor into the build output folder.
+Server builds are skipped.
+
+## Options
+
+Both integrations accept `{ enabled, name, strict, rootFont, omitSvgResources, logger, apiKey, baseUrl, upload }`;
+`withIndianaIam` also takes `root`. By default a source the scanner cannot read prints a warning and the build continues without an IAM;
+`strict: true` fails the build instead. The same source always produces the same release ID and IAM bytes.
+
+## Other builds
+
+```sh
+indiana-iam generate --root . --out <new folder outside the checkout>
+indiana-iam validate --file <folder>/indiana-app-manifest.json
+indiana-iam prepare --root .
+indiana-iam anchor --root . --out <plan.json> [--apply]
+```
+
+`anchor` adds reviewable `data-indiana-id` attributes to JSX elements so saved changes keep targeting the same elements
+across releases.
+
+## Scope
+
+Supported source: Next.js App Router and Pages Router, and React Router / single-root React apps built with Vite.
+The scanner reads source files only; it never runs your build, imports your code or reads env files. Only the upload
+step calls Indiana, and only when a key is set.
+Values that look like credentials, tokens, emails or private URLs are removed, but review what your pages contain.
+
+## Upload
+
+Create a Key with only the `app-manifests:write` permission (Console → developer settings) and set it as
+`INDIANA_IAM_KEY` in your build environment. Each production build then registers the IAM, stores it through a
+server-signed URL and asks Indiana to validate it; the validated version becomes the environment's current version.
+Rebuilding unchanged source only makes the existing version current again.
+
+- Uploads go to `https://tinker.cash`; set `INDIANA_IAM_BASE_URL` (or the `baseUrl` option) for another Indiana
+  environment.
+- On Vercel only production deployments upload by default; `upload: "always"` uploads every build and
+  `upload: false` never uploads.
+- A failed upload prints a warning and the build continues, unless `strict: true`.
+- The App's Owner or Admin must turn on the App page map first.
+- `INDIANA_IAM_KEY=<key> indiana-iam upload --file <manifest>` uploads a file generated elsewhere.

package/assets/document-controller.js

@@ -0,0 +1,215 @@
+/* Indiana UI simulation runtime 0.2.0. No merchant code, requests, authentication or purchases. */
+(() => {
+  "use strict";
+  // Modelled html/body remain mapped wrappers. Mirror their classes onto the
+  // actual document roots so UA color-scheme and viewport backgrounds agree.
+  for (const [name, root] of [["html", document.documentElement], ["body", document.body]]) {
+    const model = document.querySelector('[data-iam-adapter="' + name + '"]');
+    if (model) root.className = model.getAttribute("class") || "";
+  }
+  let machine = null;
+  const patches = new Map();
+  const node = id => [...document.querySelectorAll("[data-iam-node]")].find(e => e.dataset.iamNode === id);
+  function renderState() {
+    if (!machine) return;
+    for (const binding of machine.bindings()) {
+      const el = node(binding.nodeId); if (!el) continue;
+      if (binding.property === "visible") el.hidden = !binding.value;
+      else if (binding.property === "className") el.setAttribute('class',binding.value);
+      else if (binding.property === "text") el.textContent = String(binding.value);
+      else el[binding.property] = binding.value;
+    }
+    for (const patch of patches.values()) applyPatch(patch);
+  }
+  function applyPatch(data) {
+    const el = node(data.nodeId); if (!el) return;
+    if (data.property === "text" && typeof data.value === "string" && data.value.length <= 4000 && el.children.length === 0) el.textContent = data.value;
+    if (data.property === "fontSize" && Number.isFinite(data.value) && data.value >= 8 && data.value <= 120) el.style.fontSize = data.value + "px";
+    if (data.property === "color" && /^#[0-9a-f]{6}$/i.test(data.value)) el.style.color = data.value;
+  }
+  function uiEvent(el, event, payload = {}) {
+    if (!machine || !el || el.disabled || el.closest("[hidden]")) return false;
+    try {
+      const result = machine.dispatch(el.dataset.iamNode, event, payload);
+      if (!result) return false;
+      renderState(); send("stateChanged", result); return true;
+    } catch { send("simulated", { message: "此状态变化无法安全模拟，已保留原状态。" }); return true; }
+  }
+  let channel = null,
+    selecting = true,
+    selected = null;
+  const send = (type, payload = {}) => {
+    if (channel)
+      parent.postMessage(
+        { channel: "iam-preview-v1", nonce: channel, type, ...payload },
+        "*",
+      );
+  };
+  const describe = (el) => {
+    const style = getComputedStyle(el);
+    return {
+      nodeId: el.dataset.iamNode,
+      tag: el.tagName.toLowerCase(),
+      text: (el.textContent || "").slice(0, 4000),
+      canEditText: el.children.length === 0,
+      fontSize: parseFloat(style.fontSize),
+      color: style.color,
+    };
+  };
+  const choose = (el) => {
+    if (selected) {
+      selected.style.outline = "";
+      selected.style.outlineOffset = "";
+    }
+    selected = el;
+    selected.style.outline = "2px solid #1c7258";
+    selected.style.outlineOffset = "3px";
+    send("selected", { element: describe(el) });
+  };
+  addEventListener("message", (event) => {
+    if (
+      event.source !== parent ||
+      !event.data ||
+      event.data.channel !== "iam-preview-v1"
+    )
+      return;
+    const data = event.data;
+    if (!channel && data.type === "init" && typeof data.nonce === "string") {
+      channel = data.nonce;
+      if (data.graph && typeof data.routeKey === "string") {
+        machine = createStateMachine(data.graph, data.routeKey, data.renderKey);
+        const renderKey = data.renderKey ?? data.graph.routes.find(route => route.routeKey === data.routeKey)?.initialRenderKey;
+        activeTransitions = data.graph.transitions.filter(t => t.routeKey === data.routeKey && t.renderKey === renderKey);
+        renderState();
+      }
+      send("ready");
+      return;
+    }
+    if (!channel || data.nonce !== channel) return;
+    if (data.type === "previewValues" && machine) {
+      try { const result = machine.preview(data.values); renderState(); send("stateChanged", result); }
+      catch { send("simulated", { message: "界面预览值无效，已保留原状态。" }); }
+    }
+    if (data.type === "mode") {
+      selecting = data.selecting === true;
+      document.body.style.cursor = selecting ? "crosshair" : "";
+    }
+    if (data.type === "anchor" && typeof data.id === "string")
+      document.getElementById(data.id)?.scrollIntoView({ behavior: "smooth" });
+    if (data.type === "select" && typeof data.nodeId === "string") {
+      const el = node(data.nodeId);
+      if (el) {
+        choose(el);
+        el.scrollIntoView({ block: "center", behavior: "smooth" });
+      }
+    }
+    if (data.type === "patch" && typeof data.nodeId === "string") {
+      const el = [...document.querySelectorAll("[data-iam-node]")].find(
+        (e) => e.dataset.iamNode === data.nodeId,
+      );
+      if (!el) return;
+      patches.set(data.nodeId + ":" + data.property, data);
+      if (
+        data.property === "text" &&
+        typeof data.value === "string" &&
+        data.value.length <= 4000 &&
+        el.children.length === 0
+      )
+        el.textContent = data.value;
+      if (
+        data.property === "fontSize" &&
+        Number.isFinite(data.value) &&
+        data.value >= 8 &&
+        data.value <= 120
+      )
+        el.style.fontSize = data.value + "px";
+      if (data.property === "color" && /^#[0-9a-f]{6}$/i.test(data.value))
+        el.style.color = data.value;
+      send("patched", { element: describe(el) });
+    }
+  });
+  for (const event of ["input", "change"]) document.addEventListener(event, e => {
+    if (selecting) return;
+    const match = eventTarget(e.target, event);
+    if (!match) return;
+    const { el, transition } = match;
+    const payload = {};
+    for (const key of Object.keys(transition.trigger.payload)) payload[key] = key === "checked" ? el.checked : el.value;
+    uiEvent(el, event, payload);
+  }, true);
+  let activeTransitions = [];
+  function eventTarget(target, event) {
+    for (let el = target; el?.dataset; el = el.parentElement) {
+      const transition = activeTransitions.find(t => t.trigger.nodeId === el.dataset.iamNode && t.trigger.event === event);
+      if (transition) return { el, transition };
+    }
+    return null;
+  }
+  document.addEventListener(
+    "submit",
+    (event) => {
+      event.preventDefault();
+      send("simulated", { message: "此界面仅作模拟，表单不会提交。" });
+    },
+    true,
+  );
+  document.addEventListener(
+    "click",
+    (event) => {
+      const el = event.target.closest?.("[data-iam-node]");
+      if (!el) return;
+      if (selecting) {
+        event.preventDefault();
+        event.stopImmediatePropagation();
+        choose(el);
+        return;
+      }
+      const link = event.target.closest("a");
+      const action = eventTarget(event.target, "click");
+      if (action) {
+        const payload = {};
+        for (const key of Object.keys(action.transition.trigger.payload)) payload[key] = key === "checked" ? action.el.checked : action.el.value;
+        event.preventDefault();
+        uiEvent(action.el, "click", payload);
+        // A UI-only handler (for example closing a mobile menu) does not
+        // cancel the link's separately declared navigation.
+        if (!link) return;
+      }
+      if (link) {
+        event.preventDefault();
+        const href = link.getAttribute("href") || "";
+        if (href.startsWith("#")) {
+          document
+            .getElementById(href.slice(1))
+            ?.scrollIntoView({ behavior: "smooth" });
+          return;
+        }
+        send("navigate", { href, nodeId: link.dataset.iamNode });
+        return;
+      }
+      const button = event.target.closest("button");
+      if (button) {
+        event.preventDefault();
+        const state = button.dataset.iamToggle;
+        if (state) {
+          const branches = [
+              ...document.querySelectorAll("[data-iam-state]"),
+            ].filter((e) => e.dataset.iamState === state),
+            active = branches.find((e) => e.dataset.iamBranch === "true");
+          if (active) {
+            const next = active.hidden;
+            for (const branch of branches)
+              branch.hidden = branch.dataset.iamBranch !== String(next);
+            button.setAttribute("aria-expanded", String(next));
+            send("simulated", {
+              message: "已按源码模拟界面状态，未执行业务。",
+            });
+            return;
+          }
+        }
+        send("simulated", { message: "按钮仅展示界面，不执行业务操作。" });
+      }
+    },
+    true,
+  );
+})();

package/assets/document-runtime.js

@@ -0,0 +1,295 @@
+/* Generated by scripts/build-runtime.mjs. */
+(() => {
+/* Indiana declarative UI state machine. Pure computation; no merchant callbacks. */
+function createStateMachine(graph, routeKey, renderKey) {
+  {
+    renderKey ??= graph.routes.find(route => route.routeKey === routeKey)?.initialRenderKey;
+    if (!graph.renders.some(render => render.renderKey === renderKey && render.routeKey === routeKey)) throw new Error("Unknown UI render");
+  }
+  const owns = row => row.routeKey === routeKey && row.renderKey === renderKey;
+  const variables = new Map(graph.variables.filter(owns).map(v => [v.variableKey, v]));
+  const transitions = graph.transitions.filter(t => owns(t) && t.simulation === "implemented");
+  let values = Object.fromEntries([...variables].map(([key, v]) => [key, v.initialValue]));
+  const read = (expression, payload, snapshot, depth = 0) => {
+    if (depth > 24) throw new Error("Expression budget exceeded");
+    const next = e => read(e, payload, snapshot, depth + 1);
+    switch (expression.op) {
+      case "const": return expression.value;
+      case "var": {
+        if (!variables.has(expression.key)) throw new Error("Unknown variable");
+        return snapshot[expression.key];
+      }
+      case "event": {
+        if (!Object.hasOwn(payload, expression.key)) throw new Error("Missing event input");
+        return payload[expression.key];
+      }
+      case "not": return !next(expression.arg);
+      case "eq": return next(expression.left) === next(expression.right);
+      case "ne": return next(expression.left) !== next(expression.right);
+      case "add":
+      case "subtract": {
+        const left = next(expression.left), right = next(expression.right);
+        if (typeof left !== "number" || typeof right !== "number" || !Number.isFinite(left) || !Number.isFinite(right)) throw new Error("Invalid numeric expression");
+        const value = expression.op === "add" ? left + right : left - right;
+        if (!Number.isFinite(value)) throw new Error("Invalid numeric result");
+        return value;
+      }
+      case "all": return expression.args.every(e => next(e) === true);
+      case "any": return expression.args.some(e => next(e) === true);
+      case "classes": return expression.parts.filter(part=>next(part.when)===true).map(part=>part.value).join(' ');
+      default: throw new Error("Unsupported expression");
+    }
+  };
+  return {
+    snapshot: () => ({ ...values }),
+    preview(input) {
+      if (!input || Array.isArray(input) || typeof input !== "object" || Object.keys(input).length > variables.size) throw new Error("Invalid preview values");
+      const writes = Object.create(null);
+      for (const [key, value] of Object.entries(input)) {
+        const variable = variables.get(key);
+        if (!variable || typeof value !== variable.valueType || typeof value === "string" && value.length > 4000 || typeof value === "number" && !Number.isFinite(value)) throw new Error("Invalid preview value");
+        writes[key] = value;
+      }
+      values = { ...values, ...writes };
+      return { values: { ...values }, evidence: "manual-ui-preview" };
+    },
+    reset: () => { values = Object.fromEntries([...variables].map(([key, v]) => [key, v.initialValue])); },
+    bindings: () => graph.bindings.filter(owns).map(b => ({ ...b, value: read(b.value, {}, values) })),
+    dispatch(nodeId, event, payload = {}) {
+      const candidates = transitions.filter(t => t.trigger.nodeId === nodeId && t.trigger.event === event);
+      for (const t of candidates) {
+        const expected = Object.keys(t.trigger.payload);
+        if (Object.keys(payload).some(key => !expected.includes(key)) || expected.some(key => typeof payload[key] !== t.trigger.payload[key] || typeof payload[key] === "string" && payload[key].length > 4000)) throw new Error("Invalid event input");
+      }
+      const eligible = candidates.filter(t => read(t.guard, payload, values) === true);
+      if (eligible.length > 1) throw new Error("Ambiguous UI transition");
+      if (!eligible.length) return null;
+      const t = eligible[0], writes = Object.create(null);
+      for (const w of t.stateWrites) {
+        const value = read(w.value, payload, values), variable = variables.get(w.variableKey);
+        if (!variable || typeof value !== variable.valueType || typeof value === "string" && value.length > 4000 || typeof value === "number" && !Number.isFinite(value)) throw new Error("Invalid state write");
+        writes[w.variableKey] = value;
+      }
+      values = { ...values, ...writes };
+      return { transitionKey: t.transitionKey, values: { ...values } };
+    },
+  };
+}
+
+/* Indiana UI simulation runtime 0.2.0. No merchant code, requests, authentication or purchases. */
+(() => {
+  "use strict";
+  // Modelled html/body remain mapped wrappers. Mirror their classes onto the
+  // actual document roots so UA color-scheme and viewport backgrounds agree.
+  for (const [name, root] of [["html", document.documentElement], ["body", document.body]]) {
+    const model = document.querySelector('[data-iam-adapter="' + name + '"]');
+    if (model) root.className = model.getAttribute("class") || "";
+  }
+  let machine = null;
+  const patches = new Map();
+  const node = id => [...document.querySelectorAll("[data-iam-node]")].find(e => e.dataset.iamNode === id);
+  function renderState() {
+    if (!machine) return;
+    for (const binding of machine.bindings()) {
+      const el = node(binding.nodeId); if (!el) continue;
+      if (binding.property === "visible") el.hidden = !binding.value;
+      else if (binding.property === "className") el.setAttribute('class',binding.value);
+      else if (binding.property === "text") el.textContent = String(binding.value);
+      else el[binding.property] = binding.value;
+    }
+    for (const patch of patches.values()) applyPatch(patch);
+  }
+  function applyPatch(data) {
+    const el = node(data.nodeId); if (!el) return;
+    if (data.property === "text" && typeof data.value === "string" && data.value.length <= 4000 && el.children.length === 0) el.textContent = data.value;
+    if (data.property === "fontSize" && Number.isFinite(data.value) && data.value >= 8 && data.value <= 120) el.style.fontSize = data.value + "px";
+    if (data.property === "color" && /^#[0-9a-f]{6}$/i.test(data.value)) el.style.color = data.value;
+  }
+  function uiEvent(el, event, payload = {}) {
+    if (!machine || !el || el.disabled || el.closest("[hidden]")) return false;
+    try {
+      const result = machine.dispatch(el.dataset.iamNode, event, payload);
+      if (!result) return false;
+      renderState(); send("stateChanged", result); return true;
+    } catch { send("simulated", { message: "此状态变化无法安全模拟，已保留原状态。" }); return true; }
+  }
+  let channel = null,
+    selecting = true,
+    selected = null;
+  const send = (type, payload = {}) => {
+    if (channel)
+      parent.postMessage(
+        { channel: "iam-preview-v1", nonce: channel, type, ...payload },
+        "*",
+      );
+  };
+  const describe = (el) => {
+    const style = getComputedStyle(el);
+    return {
+      nodeId: el.dataset.iamNode,
+      tag: el.tagName.toLowerCase(),
+      text: (el.textContent || "").slice(0, 4000),
+      canEditText: el.children.length === 0,
+      fontSize: parseFloat(style.fontSize),
+      color: style.color,
+    };
+  };
+  const choose = (el) => {
+    if (selected) {
+      selected.style.outline = "";
+      selected.style.outlineOffset = "";
+    }
+    selected = el;
+    selected.style.outline = "2px solid #1c7258";
+    selected.style.outlineOffset = "3px";
+    send("selected", { element: describe(el) });
+  };
+  addEventListener("message", (event) => {
+    if (
+      event.source !== parent ||
+      !event.data ||
+      event.data.channel !== "iam-preview-v1"
+    )
+      return;
+    const data = event.data;
+    if (!channel && data.type === "init" && typeof data.nonce === "string") {
+      channel = data.nonce;
+      if (data.graph && typeof data.routeKey === "string") {
+        machine = createStateMachine(data.graph, data.routeKey, data.renderKey);
+        const renderKey = data.renderKey ?? data.graph.routes.find(route => route.routeKey === data.routeKey)?.initialRenderKey;
+        activeTransitions = data.graph.transitions.filter(t => t.routeKey === data.routeKey && t.renderKey === renderKey);
+        renderState();
+      }
+      send("ready");
+      return;
+    }
+    if (!channel || data.nonce !== channel) return;
+    if (data.type === "previewValues" && machine) {
+      try { const result = machine.preview(data.values); renderState(); send("stateChanged", result); }
+      catch { send("simulated", { message: "界面预览值无效，已保留原状态。" }); }
+    }
+    if (data.type === "mode") {
+      selecting = data.selecting === true;
+      document.body.style.cursor = selecting ? "crosshair" : "";
+    }
+    if (data.type === "anchor" && typeof data.id === "string")
+      document.getElementById(data.id)?.scrollIntoView({ behavior: "smooth" });
+    if (data.type === "select" && typeof data.nodeId === "string") {
+      const el = node(data.nodeId);
+      if (el) {
+        choose(el);
+        el.scrollIntoView({ block: "center", behavior: "smooth" });
+      }
+    }
+    if (data.type === "patch" && typeof data.nodeId === "string") {
+      const el = [...document.querySelectorAll("[data-iam-node]")].find(
+        (e) => e.dataset.iamNode === data.nodeId,
+      );
+      if (!el) return;
+      patches.set(data.nodeId + ":" + data.property, data);
+      if (
+        data.property === "text" &&
+        typeof data.value === "string" &&
+        data.value.length <= 4000 &&
+        el.children.length === 0
+      )
+        el.textContent = data.value;
+      if (
+        data.property === "fontSize" &&
+        Number.isFinite(data.value) &&
+        data.value >= 8 &&
+        data.value <= 120
+      )
+        el.style.fontSize = data.value + "px";
+      if (data.property === "color" && /^#[0-9a-f]{6}$/i.test(data.value))
+        el.style.color = data.value;
+      send("patched", { element: describe(el) });
+    }
+  });
+  for (const event of ["input", "change"]) document.addEventListener(event, e => {
+    if (selecting) return;
+    const match = eventTarget(e.target, event);
+    if (!match) return;
+    const { el, transition } = match;
+    const payload = {};
+    for (const key of Object.keys(transition.trigger.payload)) payload[key] = key === "checked" ? el.checked : el.value;
+    uiEvent(el, event, payload);
+  }, true);
+  let activeTransitions = [];
+  function eventTarget(target, event) {
+    for (let el = target; el?.dataset; el = el.parentElement) {
+      const transition = activeTransitions.find(t => t.trigger.nodeId === el.dataset.iamNode && t.trigger.event === event);
+      if (transition) return { el, transition };
+    }
+    return null;
+  }
+  document.addEventListener(
+    "submit",
+    (event) => {
+      event.preventDefault();
+      send("simulated", { message: "此界面仅作模拟，表单不会提交。" });
+    },
+    true,
+  );
+  document.addEventListener(
+    "click",
+    (event) => {
+      const el = event.target.closest?.("[data-iam-node]");
+      if (!el) return;
+      if (selecting) {
+        event.preventDefault();
+        event.stopImmediatePropagation();
+        choose(el);
+        return;
+      }
+      const link = event.target.closest("a");
+      const action = eventTarget(event.target, "click");
+      if (action) {
+        const payload = {};
+        for (const key of Object.keys(action.transition.trigger.payload)) payload[key] = key === "checked" ? action.el.checked : action.el.value;
+        event.preventDefault();
+        uiEvent(action.el, "click", payload);
+        // A UI-only handler (for example closing a mobile menu) does not
+        // cancel the link's separately declared navigation.
+        if (!link) return;
+      }
+      if (link) {
+        event.preventDefault();
+        const href = link.getAttribute("href") || "";
+        if (href.startsWith("#")) {
+          document
+            .getElementById(href.slice(1))
+            ?.scrollIntoView({ behavior: "smooth" });
+          return;
+        }
+        send("navigate", { href, nodeId: link.dataset.iamNode });
+        return;
+      }
+      const button = event.target.closest("button");
+      if (button) {
+        event.preventDefault();
+        const state = button.dataset.iamToggle;
+        if (state) {
+          const branches = [
+              ...document.querySelectorAll("[data-iam-state]"),
+            ].filter((e) => e.dataset.iamState === state),
+            active = branches.find((e) => e.dataset.iamBranch === "true");
+          if (active) {
+            const next = active.hidden;
+            for (const branch of branches)
+              branch.hidden = branch.dataset.iamBranch !== String(next);
+            button.setAttribute("aria-expanded", String(next));
+            send("simulated", {
+              message: "已按源码模拟界面状态，未执行业务。",
+            });
+            return;
+          }
+        }
+        send("simulated", { message: "按钮仅展示界面，不执行业务操作。" });
+      }
+    },
+    true,
+  );
+})();
+
+})();

package/assets/preview-keyboard.js

@@ -0,0 +1,12 @@
+/* Console keyboard bridge, independent of the immutable merchant projection runtime. */
+(() => {
+  let nonce;
+  addEventListener("message", event => {
+    const data = event.data;
+    if (event.source === parent && data?.channel === "iam-preview-v1" && data.type === "init" && typeof data.nonce === "string" && !nonce) nonce = data.nonce;
+  });
+  addEventListener("keydown", event => {
+    if (!nonce || event.key !== "Escape" || event.defaultPrevented || event.isComposing || event.target?.tagName === "SELECT") return;
+    parent.postMessage({ channel: "iam-preview-v1", nonce, type: "escape" }, "*");
+  });
+})();