@miragon/modeler-shell 0.0.0-stage → 0.2.0

package/dist/testing-vscode-stub.cjs

@@ -0,0 +1,332 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/testing-vscode-stub.ts
+var testing_vscode_stub_exports = {};
+__export(testing_vscode_stub_exports, {
+  STUB_SETTING_KEY: () => STUB_SETTING_KEY,
+  colorThemeKindOf: () => colorThemeKindOf,
+  installVsCodeWebviewStub: () => installVsCodeWebviewStub,
+  stubOptionsFromSearch: () => stubOptionsFromSearch
+});
+module.exports = __toCommonJS(testing_vscode_stub_exports);
+
+// src/core/appearance.ts
+function resolveAppearance(requested, themes) {
+  const [fallback] = themes;
+  if (fallback === void 0) {
+    throw new Error(
+      "@miragon/modeler-shell: resolveAppearance needs at least one theme the modeler can show"
+    );
+  }
+  const theme = themes.includes(requested.theme) ? requested.theme : fallback;
+  return withKontrast(theme, requested.kontrast);
+}
+function withKontrast(theme, kontrast) {
+  return kontrast === "hoch" ? { theme, kontrast } : { theme };
+}
+function appearanceFromColorThemeKind(kind) {
+  switch (kind) {
+    case 2:
+      return { theme: "dark" };
+    case 3:
+      return { theme: "dark", kontrast: "hoch" };
+    case 4:
+      return { theme: "light", kontrast: "hoch" };
+    default:
+      return { theme: "light" };
+  }
+}
+function requestedAppearance(kind, setting) {
+  const fromKind = appearanceFromColorThemeKind(kind);
+  const theme = setting === "light" || setting === "dark" ? setting : fromKind.theme;
+  return withKontrast(theme, fromKind.kontrast);
+}
+function appearanceAttributes(appearance) {
+  return appearance.kontrast === "hoch" ? { "data-cd-theme": appearance.theme, "data-cd-kontrast": "hoch" } : { "data-cd-theme": appearance.theme };
+}
+
+// src/vscode/extension/html.ts
+var NONCE_ALPHABET = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+var NONCE_LENGTH = 32;
+var UNBIASED_BYTE_LIMIT = 256 - 256 % NONCE_ALPHABET.length;
+var CSP_NONCE = /^[A-Za-z0-9+/_-]+={0,2}$/;
+var DEFAULT_BODY = '<div id="app"></div>';
+function createNonce() {
+  let nonce = "";
+  while (nonce.length < NONCE_LENGTH) {
+    for (const byte of crypto.getRandomValues(new Uint8Array(NONCE_LENGTH))) {
+      if (byte < UNBIASED_BYTE_LIMIT && nonce.length < NONCE_LENGTH) {
+        nonce += NONCE_ALPHABET.charAt(byte % NONCE_ALPHABET.length);
+      }
+    }
+  }
+  return nonce;
+}
+function escapeHtml(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+function attribute(name, value) {
+  return `${name}="${escapeHtml(value)}"`;
+}
+function contentSecurityPolicy(cspSource, nonce, inlineStyles) {
+  return [
+    "default-src 'none'",
+    `img-src ${cspSource} data: blob:`,
+    inlineStyles ? `style-src ${cspSource} 'unsafe-inline'` : `style-src ${cspSource}`,
+    `font-src ${cspSource} data:`,
+    `script-src 'nonce-${nonce}'`
+  ].join("; ");
+}
+function renderWebviewHtml(options) {
+  const nonce = options.nonce ?? createNonce();
+  if (!CSP_NONCE.test(nonce)) {
+    throw new Error(`@miragon/modeler-shell: renderWebviewHtml got an invalid nonce "${nonce}"`);
+  }
+  const appearance = appearanceAttributes(options.appearance);
+  const kontrast = appearance["data-cd-kontrast"];
+  const htmlAttributes = [
+    attribute("lang", options.lang),
+    attribute("class", "cd-shell-document"),
+    attribute("data-cd-theme", appearance["data-cd-theme"]),
+    ...kontrast ? [attribute("data-cd-kontrast", kontrast)] : []
+  ].join(" ");
+  const stylesheets = (options.styleUris ?? []).map(
+    (uri) => `
+    <link ${attribute("rel", "stylesheet")} ${attribute("href", uri)} />`
+  );
+  return `<!doctype html>
+<html ${htmlAttributes}>
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="Content-Security-Policy" ${attribute("content", contentSecurityPolicy(options.cspSource, nonce, options.inlineStyles !== false))} />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />${stylesheets.join("")}
+    <title>${escapeHtml(options.title)}</title>
+  </head>
+  <body>
+    ${options.body ?? DEFAULT_BODY}
+    <script ${attribute("nonce", nonce)} ${attribute("src", options.scriptUri)}></script>
+  </body>
+</html>
+`;
+}
+
+// src/vscode/protocol.ts
+var APPEARANCE_MESSAGE_TYPE = "modelerShell.appearance";
+function appearanceMessage(appearance) {
+  return {
+    type: APPEARANCE_MESSAGE_TYPE,
+    appearance: appearance.kontrast ? { theme: appearance.theme, kontrast: appearance.kontrast } : { theme: appearance.theme }
+  };
+}
+
+// src/vscode/extension/theme-bridge.ts
+function isColorThemeSetting(value) {
+  return value === "automatic" || value === "light" || value === "dark";
+}
+function readColorThemeSetting(vscode, settingKey) {
+  const separator = settingKey.lastIndexOf(".");
+  const value = separator < 0 ? vscode.workspace.getConfiguration().get(settingKey) : vscode.workspace.getConfiguration(settingKey.slice(0, separator)).get(settingKey.slice(separator + 1));
+  return isColorThemeSetting(value) ? value : void 0;
+}
+function currentAppearance(vscode, options) {
+  const setting = options.settingKey ? readColorThemeSetting(vscode, options.settingKey) : void 0;
+  return resolveAppearance(requestedAppearance(vscode.window.activeColorTheme.kind, setting), options.themes);
+}
+function connectThemeBridge(vscode, panel, options) {
+  if (options.themes.length === 0) {
+    throw new Error("@miragon/modeler-shell: connectThemeBridge needs at least one theme");
+  }
+  const { settingKey } = options;
+  const post = () => {
+    void panel.webview.postMessage(appearanceMessage(currentAppearance(vscode, options)));
+  };
+  let wasVisible = panel.visible;
+  const subscriptions = [
+    vscode.window.onDidChangeActiveColorTheme(post),
+    panel.onDidChangeViewState(({ webviewPanel }) => {
+      const becameVisible = webviewPanel.visible && !wasVisible;
+      wasVisible = webviewPanel.visible;
+      if (becameVisible) post();
+    })
+  ];
+  if (settingKey) {
+    subscriptions.push(
+      vscode.workspace.onDidChangeConfiguration((event) => {
+        if (event.affectsConfiguration(settingKey)) post();
+      })
+    );
+  }
+  let disposed = false;
+  const dispose = () => {
+    if (disposed) return;
+    disposed = true;
+    for (const subscription of subscriptions.splice(0)) subscription.dispose();
+  };
+  subscriptions.push(panel.onDidDispose(dispose));
+  return { dispose };
+}
+
+// src/testing/vscode-stub.ts
+var BODY_CLASSES = {
+  1: ["vscode-light"],
+  2: ["vscode-dark"],
+  3: ["vscode-high-contrast"],
+  4: ["vscode-high-contrast-light", "vscode-high-contrast"]
+};
+var ALL_BODY_CLASSES = Object.values(BODY_CLASSES).flat();
+var REDUCE_MOTION_BODY_CLASS = "vscode-reduce-motion";
+var VSCODE_DEFAULT_STYLES = `@layer vscode-default {
+  body { margin: 0; padding: 0 20px; color: currentColor; font-family: serif; font-size: 17px; }
+  kbd { box-shadow: inset 0 -1px 0 currentColor; vertical-align: middle; padding: 1px 3px; border-radius: 3px; font-family: serif; }
+  code { font-family: serif; padding: 1px 3px; border-radius: 4px; }
+  a:focus, input:focus, select:focus, textarea:focus { outline: 1px solid -webkit-focus-ring-color; outline-offset: -1px; }
+}`;
+var STUB_SETTING_KEY = "miragon.modeler.colorTheme";
+function colorThemeKindOf(appearance) {
+  if (appearance.kontrast) return appearance.theme === "dark" ? 3 : 4;
+  return appearance.theme === "dark" ? 2 : 1;
+}
+function stubOptionsFromSearch(search) {
+  const params = new URLSearchParams(search);
+  const theme = params.get("theme") === "dark" ? "dark" : "light";
+  const setting = params.get("colorTheme");
+  return {
+    requested: params.get("kontrast") === "hoch" ? { theme, kontrast: "hoch" } : { theme },
+    colorTheme: setting === "automatic" || setting === "light" || setting === "dark" ? setting : void 0,
+    reduceMotion: params.has("reduceMotion")
+  };
+}
+function installVsCodeWebviewStub(options) {
+  const settingKey = options.settingKey ?? STUB_SETTING_KEY;
+  const scope = window;
+  let kind = colorThemeKindOf(options.requested);
+  let setting = options.colorTheme;
+  const themeListeners = /* @__PURE__ */ new Set();
+  const configurationListeners = /* @__PURE__ */ new Set();
+  const vscode = {
+    window: {
+      get activeColorTheme() {
+        return { kind };
+      },
+      onDidChangeActiveColorTheme(listener) {
+        themeListeners.add(listener);
+        return { dispose: () => themeListeners.delete(listener) };
+      }
+    },
+    workspace: {
+      getConfiguration: (section) => ({
+        get: (key) => (section ? `${section}.${key}` : key) === settingKey ? setting : void 0
+      }),
+      onDidChangeConfiguration(listener) {
+        configurationListeners.add(listener);
+        return { dispose: () => configurationListeners.delete(listener) };
+      }
+    }
+  };
+  const none = { dispose: () => void 0 };
+  let posted = 0;
+  let delivered = 0;
+  window.addEventListener("message", () => delivered++);
+  const panel = {
+    webview: {
+      postMessage(message) {
+        posted++;
+        window.postMessage(message, "*");
+      }
+    },
+    visible: true,
+    onDidChangeViewState: () => none,
+    onDidDispose: () => none
+  };
+  const bridgeOptions = { themes: options.themes, settingKey };
+  const defaults = document.createElement("style");
+  defaults.id = "_defaultStyles";
+  defaults.textContent = VSCODE_DEFAULT_STYLES;
+  document.head.prepend(defaults);
+  const html = new DOMParser().parseFromString(
+    renderWebviewHtml({
+      cspSource: window.location.origin,
+      scriptUri: "webview.js",
+      title: document.title,
+      lang: options.lang ?? "en",
+      appearance: currentAppearance(vscode, bridgeOptions)
+    }),
+    "text/html"
+  ).documentElement;
+  for (const name of html.getAttributeNames()) {
+    if (name === "class") document.documentElement.classList.add(...html.classList);
+    else document.documentElement.setAttribute(name, html.getAttribute(name) ?? "");
+  }
+  const setBodyClasses = (next) => {
+    document.body.classList.remove(...ALL_BODY_CLASSES);
+    document.body.classList.add(...BODY_CLASSES[next]);
+  };
+  setBodyClasses(kind);
+  document.body.classList.toggle(REDUCE_MOTION_BODY_CLASS, options.reduceMotion === true);
+  connectThemeBridge(vscode, panel, bridgeOptions);
+  let state = options.state;
+  const sent = [];
+  let acquired = false;
+  scope.acquireVsCodeApi = () => {
+    if (acquired) throw new Error("An instance of the VS Code API has already been acquired");
+    acquired = true;
+    return {
+      getState: () => state,
+      setState(next) {
+        state = next;
+      },
+      postMessage(message) {
+        sent.push(message);
+      }
+    };
+  };
+  const stub = {
+    get kind() {
+      return kind;
+    },
+    setColorThemeKind(next) {
+      kind = next;
+      setBodyClasses(next);
+      for (const listener of [...themeListeners]) listener({ kind: next });
+    },
+    setColorTheme(next) {
+      setting = next;
+      for (const listener of [...configurationListeners]) {
+        listener({ affectsConfiguration: (section) => settingKey.startsWith(section) });
+      }
+    },
+    setReduceMotion(reduceMotion) {
+      document.body.classList.toggle(REDUCE_MOTION_BODY_CLASS, reduceMotion);
+    },
+    pendingMessages: () => posted - delivered,
+    posted: sent,
+    state: () => state
+  };
+  scope.__modelerShellVsCodeStub = stub;
+  return stub;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  STUB_SETTING_KEY,
+  colorThemeKindOf,
+  installVsCodeWebviewStub,
+  stubOptionsFromSearch
+});
+//# sourceMappingURL=testing-vscode-stub.cjs.map

package/dist/testing-vscode-stub.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/testing-vscode-stub.ts","../src/core/appearance.ts","../src/vscode/extension/html.ts","../src/vscode/protocol.ts","../src/vscode/extension/theme-bridge.ts","../src/testing/vscode-stub.ts"],"sourcesContent":["// \"@miragon/modeler-shell/testing/vscode-stub\": a stand-in for VS Code around a webview test page.\nexport * from \"./testing/vscode-stub.js\";\n","/** The modes a Miragon modeler can show (guide §13.3). */\nexport type Theme = \"light\" | \"dark\";\n\n/** High contrast; written as `data-cd-kontrast=\"hoch\"` on the same element as `data-cd-theme`. */\nexport type Kontrast = \"hoch\";\n\nexport interface Appearance {\n  theme: Theme;\n  kontrast?: Kontrast | undefined;\n}\n\n/**\n * The one appearance decision of guide §13.5: a theme the modeler cannot show is never shown\n * (`themes[0]` wins, so `[\"light\"]` stays light whatever the host requests); `kontrast` always\n * passes through. Throws when `themes` is empty.\n */\nexport function resolveAppearance(requested: Appearance, themes: readonly Theme[]): Appearance {\n  const [fallback] = themes;\n  if (fallback === undefined) {\n    throw new Error(\n      \"@miragon/modeler-shell: resolveAppearance needs at least one theme the modeler can show\",\n    );\n  }\n  const theme = themes.includes(requested.theme) ? requested.theme : fallback;\n  return withKontrast(theme, requested.kontrast);\n}\n\n// Appearances arrive through postMessage and settings, so only the one known value passes.\nfunction withKontrast(theme: Theme, kontrast: unknown): Appearance {\n  return kontrast === \"hoch\" ? { theme, kontrast } : { theme };\n}\n\n/**\n * The appearance VS Code requests for `vscode.window.activeColorTheme.kind`:\n * 1 Light → light, 2 Dark → dark, 3 HighContrast → dark + hoch, 4 HighContrastLight → light + hoch;\n * any other value → light.\n */\nexport function appearanceFromColorThemeKind(kind: number): Appearance {\n  switch (kind) {\n    case 2:\n      return { theme: \"dark\" };\n    case 3:\n      return { theme: \"dark\", kontrast: \"hoch\" };\n    case 4:\n      return { theme: \"light\", kontrast: \"hoch\" };\n    default:\n      return { theme: \"light\" };\n  }\n}\n\n/** The values of the setting `miragon.<modeler>.colorTheme` (it ships once a modeler can show dark). */\nexport type ColorThemeSetting = \"automatic\" | \"light\" | \"dark\";\n\n/**\n * The requested appearance in an IDE host: the setting's theme unless it is `automatic` (or\n * missing), the contrast always from the color theme kind.\n */\nexport function requestedAppearance(kind: number, setting?: ColorThemeSetting | undefined): Appearance {\n  const fromKind = appearanceFromColorThemeKind(kind);\n  const theme = setting === \"light\" || setting === \"dark\" ? setting : fromKind.theme;\n  return withKontrast(theme, fromKind.kontrast);\n}\n\n/**\n * The fallback signal inside a VS Code webview: the body classes `vscode-high-contrast-light`\n * (checked first, VS Code adds `vscode-high-contrast` to it as well), `vscode-high-contrast`,\n * `vscode-dark`, `vscode-light`. `undefined` when none is set. Never use them for styling.\n */\nexport function appearanceFromBodyClasses(classes: Iterable<string>): Appearance | undefined {\n  const present = new Set(classes);\n  if (present.has(\"vscode-high-contrast-light\")) return { theme: \"light\", kontrast: \"hoch\" };\n  if (present.has(\"vscode-high-contrast\")) return { theme: \"dark\", kontrast: \"hoch\" };\n  if (present.has(\"vscode-dark\")) return { theme: \"dark\" };\n  if (present.has(\"vscode-light\")) return { theme: \"light\" };\n  return undefined;\n}\n\n/**\n * VS Code's `workbench.reduceMotion` as the webview sees it: the body class `vscode-reduce-motion`\n * (the webview host page sets it). Never use it for styling; the shell mirrors it as\n * `REDUCED_MOTION_CLASS` on `<html>`.\n */\nexport function reducedMotionFromBodyClasses(classes: Iterable<string>): boolean {\n  return new Set(classes).has(\"vscode-reduce-motion\");\n}\n\n/**\n * On `<html>` while the host asks for reduced motion although the OS does not (VS Code's\n * `workbench.reduceMotion`): the shell's animations stop as under `prefers-reduced-motion`, and an\n * explicit fit jumps.\n */\nexport const REDUCED_MOTION_CLASS = \"cd-shell-reduce-motion\";\n\nexport interface AppearanceAttributes {\n  \"data-cd-theme\": Theme;\n  \"data-cd-kontrast\"?: Kontrast;\n}\n\n/** The attributes for `<html>` (own document) or the modeler container (foreign page). */\nexport function appearanceAttributes(appearance: Appearance): AppearanceAttributes {\n  return appearance.kontrast === \"hoch\"\n    ? { \"data-cd-theme\": appearance.theme, \"data-cd-kontrast\": \"hoch\" }\n    : { \"data-cd-theme\": appearance.theme };\n}\n","import { appearanceAttributes, type Appearance } from \"../../core/index.js\";\n\nexport interface WebviewHtmlOptions {\n  /** `webview.cspSource` */\n  cspSource: string;\n  /** The bundle, `webview.asWebviewUri(…).toString()`. */\n  scriptUri: string;\n  /** Stylesheets in load order (token CSS first, see API.md). */\n  styleUris?: readonly string[] | undefined;\n  /** `<title>` */\n  title: string;\n  /** The tool's UI language for `<html lang>`; English modelers pass `\"en\"`. */\n  lang: string;\n  /** Resolved appearance (`currentAppearance`), written before the first paint. */\n  appearance: Appearance;\n  /** Markup inside `<body>` before the script; default `<div id=\"app\"></div>`. */\n  body?: string | undefined;\n  /** Script nonce; default `createNonce()`. */\n  nonce?: string | undefined;\n  /**\n   * Allow inline styles (`style-src … 'unsafe-inline'`), default `true`: renderers write `style`\n   * attributes into markup (palette entries, SVG strings). The shell and diagram-js themselves\n   * only style through the CSSOM and run without it; pass `false` once the renderer does too.\n   */\n  inlineStyles?: boolean | undefined;\n}\n\nconst NONCE_ALPHABET = \"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789\";\nconst NONCE_LENGTH = 32;\n/** Bytes at or above this limit are rejected, so every character is equally likely. */\nconst UNBIASED_BYTE_LIMIT = 256 - (256 % NONCE_ALPHABET.length);\n/** The `base64-value` of a CSP `nonce-source`. */\nconst CSP_NONCE = /^[A-Za-z0-9+/_-]+={0,2}$/;\n\nconst DEFAULT_BODY = '<div id=\"app\"></div>';\n\n/** 32 characters `[A-Za-z0-9]` from `crypto.getRandomValues`. */\nexport function createNonce(): string {\n  let nonce = \"\";\n  while (nonce.length < NONCE_LENGTH) {\n    for (const byte of crypto.getRandomValues(new Uint8Array(NONCE_LENGTH))) {\n      if (byte < UNBIASED_BYTE_LIMIT && nonce.length < NONCE_LENGTH) {\n        nonce += NONCE_ALPHABET.charAt(byte % NONCE_ALPHABET.length);\n      }\n    }\n  }\n  return nonce;\n}\n\nfunction escapeHtml(value: string): string {\n  return value.replace(/&/g, \"&amp;\").replace(/</g, \"&lt;\").replace(/>/g, \"&gt;\").replace(/\"/g, \"&quot;\");\n}\n\nfunction attribute(name: string, value: string): string {\n  return `${name}=\"${escapeHtml(value)}\"`;\n}\n\nfunction contentSecurityPolicy(cspSource: string, nonce: string, inlineStyles: boolean): string {\n  return [\n    \"default-src 'none'\",\n    `img-src ${cspSource} data: blob:`,\n    inlineStyles ? `style-src ${cspSource} 'unsafe-inline'` : `style-src ${cspSource}`,\n    `font-src ${cspSource} data:`,\n    `script-src 'nonce-${nonce}'`,\n  ].join(\"; \");\n}\n\n/**\n * The webview document: `<html lang class=\"cd-shell-document\" data-cd-theme [data-cd-kontrast]>`,\n * the CSP (`default-src 'none'`, `img-src <cspSource> data: blob:`, `style-src <cspSource>` plus\n * `'unsafe-inline'` unless `inlineStyles: false`, `font-src <cspSource> data:`,\n * `script-src 'nonce-…'`), the stylesheets, `body` and the nonce'd script. Attribute values and the\n * title are escaped; `body` is markup and is not. Throws for a `nonce` that is not a CSP base64\n * value.\n */\nexport function renderWebviewHtml(options: WebviewHtmlOptions): string {\n  const nonce = options.nonce ?? createNonce();\n  if (!CSP_NONCE.test(nonce)) {\n    throw new Error(`@miragon/modeler-shell: renderWebviewHtml got an invalid nonce \"${nonce}\"`);\n  }\n  const appearance = appearanceAttributes(options.appearance);\n  const kontrast = appearance[\"data-cd-kontrast\"];\n  const htmlAttributes = [\n    attribute(\"lang\", options.lang),\n    attribute(\"class\", \"cd-shell-document\"),\n    attribute(\"data-cd-theme\", appearance[\"data-cd-theme\"]),\n    ...(kontrast ? [attribute(\"data-cd-kontrast\", kontrast)] : []),\n  ].join(\" \");\n  const stylesheets = (options.styleUris ?? []).map(\n    (uri) => `\\n    <link ${attribute(\"rel\", \"stylesheet\")} ${attribute(\"href\", uri)} />`,\n  );\n\n  return `<!doctype html>\n<html ${htmlAttributes}>\n  <head>\n    <meta charset=\"UTF-8\" />\n    <meta http-equiv=\"Content-Security-Policy\" ${attribute(\"content\", contentSecurityPolicy(options.cspSource, nonce, options.inlineStyles !== false))} />\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />${stylesheets.join(\"\")}\n    <title>${escapeHtml(options.title)}</title>\n  </head>\n  <body>\n    ${options.body ?? DEFAULT_BODY}\n    <script ${attribute(\"nonce\", nonce)} ${attribute(\"src\", options.scriptUri)}></script>\n  </body>\n</html>\n`;\n}\n","import type { Appearance } from \"../core/index.js\";\n\n/** The one message the theme bridge posts to the webview. */\nexport const APPEARANCE_MESSAGE_TYPE = \"modelerShell.appearance\";\n\nexport interface AppearanceMessage {\n  type: typeof APPEARANCE_MESSAGE_TYPE;\n  /** Already resolved against the modeler's themes. */\n  appearance: Appearance;\n}\n\n/** A plain, JSON-safe message (no `kontrast: undefined` key). */\nexport function appearanceMessage(appearance: Appearance): AppearanceMessage {\n  return {\n    type: APPEARANCE_MESSAGE_TYPE,\n    appearance: appearance.kontrast\n      ? { theme: appearance.theme, kontrast: appearance.kontrast }\n      : { theme: appearance.theme },\n  };\n}\n\nfunction isRecord(value: unknown): value is Record<string, unknown> {\n  return typeof value === \"object\" && value !== null && !Array.isArray(value);\n}\n\n/** Type guard for `MessageEvent.data` in the webview. */\nexport function isAppearanceMessage(value: unknown): value is AppearanceMessage {\n  if (!isRecord(value) || value.type !== APPEARANCE_MESSAGE_TYPE || !isRecord(value.appearance)) return false;\n  const { theme, kontrast } = value.appearance;\n  return (theme === \"light\" || theme === \"dark\") && (kontrast === undefined || kontrast === \"hoch\");\n}\n","import {\n  requestedAppearance,\n  resolveAppearance,\n  type Appearance,\n  type ColorThemeSetting,\n  type Theme,\n} from \"../../core/index.js\";\nimport { appearanceMessage } from \"../protocol.js\";\nimport type { DisposableLike, VsCodeLike, WebviewPanelLike } from \"./types.js\";\n\nexport interface ThemeBridgeOptions {\n  /** The modes the modeler can show, a static value of the modeler package (`[\"light\"]` today). */\n  themes: readonly Theme[];\n  /** Full key of `miragon.<modeler>.colorTheme`; omit until the modeler can show dark. */\n  settingKey?: string | undefined;\n}\n\nfunction isColorThemeSetting(value: unknown): value is ColorThemeSetting {\n  return value === \"automatic\" || value === \"light\" || value === \"dark\";\n}\n\nfunction readColorThemeSetting(vscode: VsCodeLike, settingKey: string): ColorThemeSetting | undefined {\n  const separator = settingKey.lastIndexOf(\".\");\n  const value =\n    separator < 0\n      ? vscode.workspace.getConfiguration().get<unknown>(settingKey)\n      : vscode.workspace\n          .getConfiguration(settingKey.slice(0, separator))\n          .get<unknown>(settingKey.slice(separator + 1));\n  return isColorThemeSetting(value) ? value : undefined;\n}\n\n/**\n * The resolved appearance right now: color theme kind (and setting) through `resolveAppearance`.\n * A setting value outside `automatic | light | dark` counts as `automatic`.\n */\nexport function currentAppearance(vscode: VsCodeLike, options: ThemeBridgeOptions): Appearance {\n  const setting = options.settingKey ? readColorThemeSetting(vscode, options.settingKey) : undefined;\n  return resolveAppearance(requestedAppearance(vscode.window.activeColorTheme.kind, setting), options.themes);\n}\n\n/**\n * Posts an `AppearanceMessage` to the panel's webview on `onDidChangeActiveColorTheme`, on a change\n * of `settingKey` and whenever the panel becomes visible again (hidden retained webviews may miss\n * messages). Disposes itself with the panel. Throws when `themes` is empty.\n */\nexport function connectThemeBridge(\n  vscode: VsCodeLike,\n  panel: WebviewPanelLike,\n  options: ThemeBridgeOptions,\n): DisposableLike {\n  if (options.themes.length === 0) {\n    throw new Error(\"@miragon/modeler-shell: connectThemeBridge needs at least one theme\");\n  }\n  const { settingKey } = options;\n  const post = (): void => {\n    void panel.webview.postMessage(appearanceMessage(currentAppearance(vscode, options)));\n  };\n\n  let wasVisible = panel.visible;\n  const subscriptions: DisposableLike[] = [\n    vscode.window.onDidChangeActiveColorTheme(post),\n    panel.onDidChangeViewState(({ webviewPanel }) => {\n      const becameVisible = webviewPanel.visible && !wasVisible;\n      wasVisible = webviewPanel.visible;\n      if (becameVisible) post();\n    }),\n  ];\n  if (settingKey) {\n    subscriptions.push(\n      vscode.workspace.onDidChangeConfiguration((event) => {\n        if (event.affectsConfiguration(settingKey)) post();\n      }),\n    );\n  }\n\n  let disposed = false;\n  const dispose = (): void => {\n    if (disposed) return;\n    disposed = true;\n    for (const subscription of subscriptions.splice(0)) subscription.dispose();\n  };\n  subscriptions.push(panel.onDidDispose(dispose));\n  return { dispose };\n}\n","import type { Appearance, ColorThemeSetting, Theme } from \"../core/index.js\";\nimport {\n  connectThemeBridge,\n  currentAppearance,\n  renderWebviewHtml,\n  type ColorThemeLike,\n  type DisposableLike,\n  type VsCodeLike,\n  type WebviewPanelLike,\n} from \"../vscode/extension/index.js\";\n\n/*\n * Runs in the page, in front of a modeler's webview bundle: a stand-in for the VS Code around it,\n * so a modeler's e2e suite runs the conformance kit for the `ide` host without VS Code.\n */\n\n/** `vscode.ColorThemeKind`: 1 Light, 2 Dark, 3 High Contrast, 4 High Contrast Light. */\nexport type ColorThemeKind = 1 | 2 | 3 | 4;\n\n/** The body classes VS Code's webview host page sets per color theme (High Contrast Light keeps both). */\nconst BODY_CLASSES: Readonly<Record<ColorThemeKind, readonly string[]>> = {\n  1: [\"vscode-light\"],\n  2: [\"vscode-dark\"],\n  3: [\"vscode-high-contrast\"],\n  4: [\"vscode-high-contrast-light\", \"vscode-high-contrast\"],\n};\nconst ALL_BODY_CLASSES = Object.values(BODY_CLASSES).flat();\nconst REDUCE_MOTION_BODY_CLASS = \"vscode-reduce-motion\";\n\n/**\n * The rules of VS Code's default webview stylesheet the shell's own-document reset must beat\n * (implementation notes, \"VS Code: host hygiene\"), with deliberately foreign values so a leak shows.\n */\nconst VSCODE_DEFAULT_STYLES = `@layer vscode-default {\n  body { margin: 0; padding: 0 20px; color: currentColor; font-family: serif; font-size: 17px; }\n  kbd { box-shadow: inset 0 -1px 0 currentColor; vertical-align: middle; padding: 1px 3px; border-radius: 3px; font-family: serif; }\n  code { font-family: serif; padding: 1px 3px; border-radius: 4px; }\n  a:focus, input:focus, select:focus, textarea:focus { outline: 1px solid -webkit-focus-ring-color; outline-offset: -1px; }\n}`;\n\n/** The default setting key the stub answers when `colorTheme` is given without one. */\nexport const STUB_SETTING_KEY = \"miragon.modeler.colorTheme\";\n\n/** The VS Code color theme that requests `appearance` (guide §13.3). */\nexport function colorThemeKindOf(appearance: Appearance): ColorThemeKind {\n  if (appearance.kontrast) return appearance.theme === \"dark\" ? 3 : 4;\n  return appearance.theme === \"dark\" ? 2 : 1;\n}\n\nexport interface VsCodeWebviewStubOptions {\n  /** What VS Code requests: its color theme, as the appearance the kit asks for. */\n  requested: Appearance;\n  /** The modes the modeler declares (what its extension passes to the theme bridge). */\n  themes: readonly Theme[];\n  /** `<html lang>`; default `\"en\"`. */\n  lang?: string | undefined;\n  /** The value of the modeler's `colorTheme` setting (from its dark-mode release on). */\n  colorTheme?: ColorThemeSetting | undefined;\n  /** The full setting key the stub answers and the bridge listens to; default `STUB_SETTING_KEY`. */\n  settingKey?: string | undefined;\n  /** VS Code's `workbench.reduceMotion` (the body class `vscode-reduce-motion`). */\n  reduceMotion?: boolean | undefined;\n  /** What `getState()` of the stubbed `acquireVsCodeApi()` returns at first. */\n  state?: unknown;\n}\n\n/** The stubbed `acquireVsCodeApi()`. */\nexport interface StubbedVsCodeApi {\n  getState(): unknown;\n  setState(state: unknown): void;\n  postMessage(message: unknown): void;\n}\n\nexport interface VsCodeWebviewStub {\n  readonly kind: ColorThemeKind;\n  /** What VS Code does on a color theme change: body classes first, then the extension's bridge posts. */\n  setColorThemeKind(kind: ColorThemeKind): void;\n  /** Changes the `colorTheme` setting, as the user does in the settings editor. */\n  setColorTheme(setting: ColorThemeSetting | undefined): void;\n  setReduceMotion(reduceMotion: boolean): void;\n  /** Messages the bridge posted that have not reached the window yet. */\n  pendingMessages(): number;\n  /** What the webview posted with `acquireVsCodeApi().postMessage`. */\n  readonly posted: readonly unknown[];\n  /** The webview state as the last `setState` left it. */\n  state(): unknown;\n}\n\n/** The page globals the stub sets. */\nexport type StubWindow = Window & {\n  /** The stub of `installVsCodeWebviewStub`, for a Playwright suite to drive. */\n  __modelerShellVsCodeStub?: VsCodeWebviewStub;\n  acquireVsCodeApi?: () => StubbedVsCodeApi;\n};\n\n/**\n * The stub's options from a query string (`theme`, `kontrast=hoch`, `colorTheme`, `reduceMotion`),\n * the counterpart of `vsCodeStubSearch` of `@miragon/modeler-shell/testing`.\n */\nexport function stubOptionsFromSearch(\n  search: string,\n): Pick<VsCodeWebviewStubOptions, \"requested\" | \"colorTheme\" | \"reduceMotion\"> {\n  const params = new URLSearchParams(search);\n  const theme: Theme = params.get(\"theme\") === \"dark\" ? \"dark\" : \"light\";\n  const setting = params.get(\"colorTheme\");\n  return {\n    requested: params.get(\"kontrast\") === \"hoch\" ? { theme, kontrast: \"hoch\" } : { theme },\n    colorTheme: setting === \"automatic\" || setting === \"light\" || setting === \"dark\" ? setting : undefined,\n    reduceMotion: params.has(\"reduceMotion\"),\n  };\n}\n\n/**\n * Stands in for VS Code around the page: its default stylesheet in `@layer vscode-default`, `<html>`\n * with the attributes `renderWebviewHtml` writes before the first paint, `<body>` with the host\n * page's theme (and reduce-motion) classes, `acquireVsCodeApi()`, and the real `connectThemeBridge`\n * running against a fake `vscode` namespace whose panel posts to this window. Call it before the\n * modeler's webview code runs; also exposed as `window.__modelerShellVsCodeStub`.\n */\nexport function installVsCodeWebviewStub(options: VsCodeWebviewStubOptions): VsCodeWebviewStub {\n  const settingKey = options.settingKey ?? STUB_SETTING_KEY;\n  const scope = window as StubWindow;\n  let kind = colorThemeKindOf(options.requested);\n  let setting = options.colorTheme;\n  const themeListeners = new Set<(theme: ColorThemeLike) => unknown>();\n  const configurationListeners = new Set<\n    (event: { affectsConfiguration(section: string): boolean }) => unknown\n  >();\n  const vscode: VsCodeLike = {\n    window: {\n      get activeColorTheme() {\n        return { kind };\n      },\n      onDidChangeActiveColorTheme(listener) {\n        themeListeners.add(listener);\n        return { dispose: () => themeListeners.delete(listener) };\n      },\n    },\n    workspace: {\n      getConfiguration: (section?: string) => ({\n        get: <T>(key: string): T | undefined =>\n          (section ? `${section}.${key}` : key) === settingKey ? (setting as T | undefined) : undefined,\n      }),\n      onDidChangeConfiguration(listener) {\n        configurationListeners.add(listener);\n        return { dispose: () => configurationListeners.delete(listener) };\n      },\n    },\n  };\n  const none: DisposableLike = { dispose: () => undefined };\n  let posted = 0;\n  let delivered = 0;\n  // Registered before the modeler's listeners, so it counts a message before the shell applies it.\n  window.addEventListener(\"message\", () => delivered++);\n  const panel: WebviewPanelLike = {\n    webview: {\n      postMessage(message) {\n        posted++;\n        window.postMessage(message, \"*\");\n      },\n    },\n    visible: true,\n    onDidChangeViewState: () => none,\n    onDidDispose: () => none,\n  };\n  const bridgeOptions = { themes: options.themes, settingKey };\n\n  const defaults = document.createElement(\"style\");\n  defaults.id = \"_defaultStyles\";\n  defaults.textContent = VSCODE_DEFAULT_STYLES;\n  document.head.prepend(defaults);\n\n  const html = new DOMParser().parseFromString(\n    renderWebviewHtml({\n      cspSource: window.location.origin,\n      scriptUri: \"webview.js\",\n      title: document.title,\n      lang: options.lang ?? \"en\",\n      appearance: currentAppearance(vscode, bridgeOptions),\n    }),\n    \"text/html\",\n  ).documentElement;\n  for (const name of html.getAttributeNames()) {\n    if (name === \"class\") document.documentElement.classList.add(...html.classList);\n    else document.documentElement.setAttribute(name, html.getAttribute(name) ?? \"\");\n  }\n\n  const setBodyClasses = (next: ColorThemeKind): void => {\n    document.body.classList.remove(...ALL_BODY_CLASSES);\n    document.body.classList.add(...BODY_CLASSES[next]);\n  };\n  setBodyClasses(kind);\n  document.body.classList.toggle(REDUCE_MOTION_BODY_CLASS, options.reduceMotion === true);\n  connectThemeBridge(vscode, panel, bridgeOptions);\n\n  let state = options.state;\n  const sent: unknown[] = [];\n  let acquired = false;\n  scope.acquireVsCodeApi = () => {\n    if (acquired) throw new Error(\"An instance of the VS Code API has already been acquired\");\n    acquired = true;\n    return {\n      getState: () => state,\n      setState(next) {\n        state = next;\n      },\n      postMessage(message) {\n        sent.push(message);\n      },\n    };\n  };\n\n  const stub: VsCodeWebviewStub = {\n    get kind() {\n      return kind;\n    },\n    setColorThemeKind(next) {\n      kind = next;\n      setBodyClasses(next);\n      for (const listener of [...themeListeners]) listener({ kind: next });\n    },\n    setColorTheme(next) {\n      setting = next;\n      for (const listener of [...configurationListeners]) {\n        listener({ affectsConfiguration: (section) => settingKey.startsWith(section) });\n      }\n    },\n    setReduceMotion(reduceMotion) {\n      document.body.classList.toggle(REDUCE_MOTION_BODY_CLASS, reduceMotion);\n    },\n    pendingMessages: () => posted - delivered,\n    posted: sent,\n    state: () => state,\n  };\n  scope.__modelerShellVsCodeStub = stub;\n  return stub;\n}\n"],"mappings":"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","names":[]}

package/dist/testing-vscode-stub.d.cts

@@ -0,0 +1,65 @@
+import { C as ColorThemeSetting, A as Appearance, T as Theme } from './appearance-D3FUcbu6.cjs';
+
+/** `vscode.ColorThemeKind`: 1 Light, 2 Dark, 3 High Contrast, 4 High Contrast Light. */
+type ColorThemeKind = 1 | 2 | 3 | 4;
+/** The default setting key the stub answers when `colorTheme` is given without one. */
+declare const STUB_SETTING_KEY = "miragon.modeler.colorTheme";
+/** The VS Code color theme that requests `appearance` (guide §13.3). */
+declare function colorThemeKindOf(appearance: Appearance): ColorThemeKind;
+interface VsCodeWebviewStubOptions {
+    /** What VS Code requests: its color theme, as the appearance the kit asks for. */
+    requested: Appearance;
+    /** The modes the modeler declares (what its extension passes to the theme bridge). */
+    themes: readonly Theme[];
+    /** `<html lang>`; default `"en"`. */
+    lang?: string | undefined;
+    /** The value of the modeler's `colorTheme` setting (from its dark-mode release on). */
+    colorTheme?: ColorThemeSetting | undefined;
+    /** The full setting key the stub answers and the bridge listens to; default `STUB_SETTING_KEY`. */
+    settingKey?: string | undefined;
+    /** VS Code's `workbench.reduceMotion` (the body class `vscode-reduce-motion`). */
+    reduceMotion?: boolean | undefined;
+    /** What `getState()` of the stubbed `acquireVsCodeApi()` returns at first. */
+    state?: unknown;
+}
+/** The stubbed `acquireVsCodeApi()`. */
+interface StubbedVsCodeApi {
+    getState(): unknown;
+    setState(state: unknown): void;
+    postMessage(message: unknown): void;
+}
+interface VsCodeWebviewStub {
+    readonly kind: ColorThemeKind;
+    /** What VS Code does on a color theme change: body classes first, then the extension's bridge posts. */
+    setColorThemeKind(kind: ColorThemeKind): void;
+    /** Changes the `colorTheme` setting, as the user does in the settings editor. */
+    setColorTheme(setting: ColorThemeSetting | undefined): void;
+    setReduceMotion(reduceMotion: boolean): void;
+    /** Messages the bridge posted that have not reached the window yet. */
+    pendingMessages(): number;
+    /** What the webview posted with `acquireVsCodeApi().postMessage`. */
+    readonly posted: readonly unknown[];
+    /** The webview state as the last `setState` left it. */
+    state(): unknown;
+}
+/** The page globals the stub sets. */
+type StubWindow = Window & {
+    /** The stub of `installVsCodeWebviewStub`, for a Playwright suite to drive. */
+    __modelerShellVsCodeStub?: VsCodeWebviewStub;
+    acquireVsCodeApi?: () => StubbedVsCodeApi;
+};
+/**
+ * The stub's options from a query string (`theme`, `kontrast=hoch`, `colorTheme`, `reduceMotion`),
+ * the counterpart of `vsCodeStubSearch` of `@miragon/modeler-shell/testing`.
+ */
+declare function stubOptionsFromSearch(search: string): Pick<VsCodeWebviewStubOptions, "requested" | "colorTheme" | "reduceMotion">;
+/**
+ * Stands in for VS Code around the page: its default stylesheet in `@layer vscode-default`, `<html>`
+ * with the attributes `renderWebviewHtml` writes before the first paint, `<body>` with the host
+ * page's theme (and reduce-motion) classes, `acquireVsCodeApi()`, and the real `connectThemeBridge`
+ * running against a fake `vscode` namespace whose panel posts to this window. Call it before the
+ * modeler's webview code runs; also exposed as `window.__modelerShellVsCodeStub`.
+ */
+declare function installVsCodeWebviewStub(options: VsCodeWebviewStubOptions): VsCodeWebviewStub;
+
+export { type ColorThemeKind, STUB_SETTING_KEY, type StubWindow, type StubbedVsCodeApi, type VsCodeWebviewStub, type VsCodeWebviewStubOptions, colorThemeKindOf, installVsCodeWebviewStub, stubOptionsFromSearch };

package/dist/testing-vscode-stub.d.ts

@@ -0,0 +1,65 @@
+import { C as ColorThemeSetting, A as Appearance, T as Theme } from './appearance-D3FUcbu6.js';
+
+/** `vscode.ColorThemeKind`: 1 Light, 2 Dark, 3 High Contrast, 4 High Contrast Light. */
+type ColorThemeKind = 1 | 2 | 3 | 4;
+/** The default setting key the stub answers when `colorTheme` is given without one. */
+declare const STUB_SETTING_KEY = "miragon.modeler.colorTheme";
+/** The VS Code color theme that requests `appearance` (guide §13.3). */
+declare function colorThemeKindOf(appearance: Appearance): ColorThemeKind;
+interface VsCodeWebviewStubOptions {
+    /** What VS Code requests: its color theme, as the appearance the kit asks for. */
+    requested: Appearance;
+    /** The modes the modeler declares (what its extension passes to the theme bridge). */
+    themes: readonly Theme[];
+    /** `<html lang>`; default `"en"`. */
+    lang?: string | undefined;
+    /** The value of the modeler's `colorTheme` setting (from its dark-mode release on). */
+    colorTheme?: ColorThemeSetting | undefined;
+    /** The full setting key the stub answers and the bridge listens to; default `STUB_SETTING_KEY`. */
+    settingKey?: string | undefined;
+    /** VS Code's `workbench.reduceMotion` (the body class `vscode-reduce-motion`). */
+    reduceMotion?: boolean | undefined;
+    /** What `getState()` of the stubbed `acquireVsCodeApi()` returns at first. */
+    state?: unknown;
+}
+/** The stubbed `acquireVsCodeApi()`. */
+interface StubbedVsCodeApi {
+    getState(): unknown;
+    setState(state: unknown): void;
+    postMessage(message: unknown): void;
+}
+interface VsCodeWebviewStub {
+    readonly kind: ColorThemeKind;
+    /** What VS Code does on a color theme change: body classes first, then the extension's bridge posts. */
+    setColorThemeKind(kind: ColorThemeKind): void;
+    /** Changes the `colorTheme` setting, as the user does in the settings editor. */
+    setColorTheme(setting: ColorThemeSetting | undefined): void;
+    setReduceMotion(reduceMotion: boolean): void;
+    /** Messages the bridge posted that have not reached the window yet. */
+    pendingMessages(): number;
+    /** What the webview posted with `acquireVsCodeApi().postMessage`. */
+    readonly posted: readonly unknown[];
+    /** The webview state as the last `setState` left it. */
+    state(): unknown;
+}
+/** The page globals the stub sets. */
+type StubWindow = Window & {
+    /** The stub of `installVsCodeWebviewStub`, for a Playwright suite to drive. */
+    __modelerShellVsCodeStub?: VsCodeWebviewStub;
+    acquireVsCodeApi?: () => StubbedVsCodeApi;
+};
+/**
+ * The stub's options from a query string (`theme`, `kontrast=hoch`, `colorTheme`, `reduceMotion`),
+ * the counterpart of `vsCodeStubSearch` of `@miragon/modeler-shell/testing`.
+ */
+declare function stubOptionsFromSearch(search: string): Pick<VsCodeWebviewStubOptions, "requested" | "colorTheme" | "reduceMotion">;
+/**
+ * Stands in for VS Code around the page: its default stylesheet in `@layer vscode-default`, `<html>`
+ * with the attributes `renderWebviewHtml` writes before the first paint, `<body>` with the host
+ * page's theme (and reduce-motion) classes, `acquireVsCodeApi()`, and the real `connectThemeBridge`
+ * running against a fake `vscode` namespace whose panel posts to this window. Call it before the
+ * modeler's webview code runs; also exposed as `window.__modelerShellVsCodeStub`.
+ */
+declare function installVsCodeWebviewStub(options: VsCodeWebviewStubOptions): VsCodeWebviewStub;
+
+export { type ColorThemeKind, STUB_SETTING_KEY, type StubWindow, type StubbedVsCodeApi, type VsCodeWebviewStub, type VsCodeWebviewStubOptions, colorThemeKindOf, installVsCodeWebviewStub, stubOptionsFromSearch };