@vantageos/mosaic 0.4.0 → 0.5.0

package/dist/server/resource.d.ts

@@ -0,0 +1,90 @@
+declare const MCP_APP_MIME_TYPE: "text/html;profile=mcp-app";
+interface McpAppCsp {
+    connectDomains?: string[];
+    resourceDomains?: string[];
+    frameDomains?: string[];
+    baseUriDomains?: string[];
+}
+type OpenAiEntrypoint = {
+    type: "global";
+} | {
+    type: "thread";
+} | {
+    type: "file";
+    extensions: string[];
+};
+/** ChatGPT display modes. `pip` is not one (openai/mcp-extensions docs/spec.md l.843-890). */
+type ChatGptDisplayMode = "inline" | "fullscreen";
+interface McpAppOpenAiInput {
+    /** `openai/outputTemplate`: compatibility alias of `_meta.ui.resourceUri` (tool level; fleet ruling, additive). */
+    outputTemplate?: string;
+    /** `_meta["openai/ui"].availableDisplayModes` on the resource content item (spec l.843-890). */
+    availableDisplayModes?: ChatGptDisplayMode[];
+    /** `_meta["openai/ui"].preferredDisplayMode` on the resource content item (spec l.843-890). */
+    preferredDisplayMode?: ChatGptDisplayMode;
+    /** `_meta["openai/ui"].entrypoints` on the tool descriptor (spec l.59, l.116). */
+    entrypoints?: OpenAiEntrypoint[];
+}
+/** Who sees a tool: `"model"` (agent tool list) and/or `"app"` (callable from the view). */
+type ToolVisibility = "model" | "app";
+interface McpAppResourceInput {
+    uri: `ui://${string}`;
+    html: string;
+    csp?: McpAppCsp;
+    /** The URL this MCP server is served at. Claude's `ui.domain` is DERIVED from it. */
+    servedUrl?: string;
+    prefersBorder?: boolean;
+    openai?: McpAppOpenAiInput;
+    /**
+     * Tool-level `_meta.ui.visibility` (MCP Apps spec 2026-01-26, ext-apps-spec.mdx l.332,
+     * l.395-401). Omitted = the spec default `["model", "app"]`. `["app"]` makes an app-only tool
+     * (refresh, UI-only sort/filter; l.1490) that hosts MUST keep out of the agent's tool list.
+     * OpenAI: ignored when the App is invoked as an entrypoint.
+     */
+    visibility?: ToolVisibility[];
+    /**
+     * Allow Claude host fonts (`hostContext.styles.css.fonts`): adds `https://assets.claude.ai` to
+     * `csp.resourceDomains` (Claude transparent-theming page).
+     */
+    hostFonts?: boolean;
+}
+interface McpAppResourceMetaUi {
+    csp: Required<McpAppCsp>;
+    prefersBorder?: boolean;
+    domain?: string;
+}
+interface McpAppResourceOutput {
+    resource: {
+        uri: `ui://${string}`;
+        mimeType: typeof MCP_APP_MIME_TYPE;
+        text: string;
+        _meta: {
+            ui: McpAppResourceMetaUi;
+            "openai/ui"?: {
+                availableDisplayModes?: ChatGptDisplayMode[];
+                preferredDisplayMode?: ChatGptDisplayMode;
+            };
+        };
+    };
+    toolMeta: {
+        ui: {
+            resourceUri: `ui://${string}`;
+            visibility?: ToolVisibility[];
+        };
+        "openai/outputTemplate"?: string;
+        "openai/ui"?: {
+            entrypoints: OpenAiEntrypoint[];
+        };
+    };
+}
+/**
+ * Claude's stable app origin: `{sha256(mcpServerUrl) first 32 hex}.claudemcpcontent.com`.
+ * Source: https://claude.com/docs/connectors/building/mcp-apps/getting-started, section
+ * "Set ui.domain for Claude" (same derivation as the `@modelcontextprotocol/ext-apps/server`
+ * example). Known answer: "https://example.com/mcp" ->
+ * "c3d80a4ed901ee05b21755a88273b4a4.claudemcpcontent.com".
+ */
+declare function deriveClaudeAppDomain(servedUrl: string): string;
+declare function buildMcpAppResource(input: McpAppResourceInput): McpAppResourceOutput;
+
+export { type ChatGptDisplayMode, MCP_APP_MIME_TYPE, type McpAppCsp, type McpAppOpenAiInput, type McpAppResourceInput, type McpAppResourceMetaUi, type McpAppResourceOutput, type OpenAiEntrypoint, type ToolVisibility, buildMcpAppResource, deriveClaudeAppDomain };

package/dist/server/resource.js

@@ -0,0 +1,147 @@
+import { createHash } from 'node:crypto';
+
+// src/server/mcp-app-resource.ts
+
+// src/host/style-variables.ts
+var MCP_STYLE_VARIABLE_KEYS = [
+  "--color-background-primary",
+  "--color-background-secondary",
+  "--color-background-tertiary",
+  "--color-background-inverse",
+  "--color-background-ghost",
+  "--color-background-info",
+  "--color-background-danger",
+  "--color-background-success",
+  "--color-background-warning",
+  "--color-background-disabled",
+  "--color-text-primary",
+  "--color-text-secondary",
+  "--color-text-tertiary",
+  "--color-text-inverse",
+  "--color-text-info",
+  "--color-text-danger",
+  "--color-text-success",
+  "--color-text-warning",
+  "--color-text-disabled",
+  "--color-text-ghost",
+  "--color-border-primary",
+  "--color-border-secondary",
+  "--color-border-tertiary",
+  "--color-border-inverse",
+  "--color-border-ghost",
+  "--color-border-info",
+  "--color-border-danger",
+  "--color-border-success",
+  "--color-border-warning",
+  "--color-border-disabled",
+  "--color-ring-primary",
+  "--color-ring-secondary",
+  "--color-ring-inverse",
+  "--color-ring-info",
+  "--color-ring-danger",
+  "--color-ring-success",
+  "--color-ring-warning",
+  "--font-sans",
+  "--font-mono",
+  "--font-weight-normal",
+  "--font-weight-medium",
+  "--font-weight-semibold",
+  "--font-weight-bold",
+  "--font-text-xs-size",
+  "--font-text-sm-size",
+  "--font-text-md-size",
+  "--font-text-lg-size",
+  "--font-heading-xs-size",
+  "--font-heading-sm-size",
+  "--font-heading-md-size",
+  "--font-heading-lg-size",
+  "--font-heading-xl-size",
+  "--font-heading-2xl-size",
+  "--font-heading-3xl-size",
+  "--font-text-xs-line-height",
+  "--font-text-sm-line-height",
+  "--font-text-md-line-height",
+  "--font-text-lg-line-height",
+  "--font-heading-xs-line-height",
+  "--font-heading-sm-line-height",
+  "--font-heading-md-line-height",
+  "--font-heading-lg-line-height",
+  "--font-heading-xl-line-height",
+  "--font-heading-2xl-line-height",
+  "--font-heading-3xl-line-height",
+  "--border-radius-xs",
+  "--border-radius-sm",
+  "--border-radius-md",
+  "--border-radius-lg",
+  "--border-radius-xl",
+  "--border-radius-full",
+  "--border-width-regular",
+  "--shadow-hairline",
+  "--shadow-sm",
+  "--shadow-md",
+  "--shadow-lg"
+];
+var CLAUDE_HOST_FONT_ORIGIN = "https://assets.claude.ai";
+new Set(MCP_STYLE_VARIABLE_KEYS);
+
+// src/server/mcp-app-resource.ts
+var MCP_APP_MIME_TYPE = "text/html;profile=mcp-app";
+function deriveClaudeAppDomain(servedUrl) {
+  const hash = createHash("sha256").update(servedUrl).digest("hex").slice(0, 32);
+  return `${hash}.claudemcpcontent.com`;
+}
+function buildMcpAppResource(input) {
+  const { uri, html, csp, servedUrl, prefersBorder, openai, visibility, hostFonts } = input;
+  const modes = [...openai?.availableDisplayModes ?? [], openai?.preferredDisplayMode];
+  if (modes.some((m) => m === "pip")) {
+    throw new Error("buildMcpAppResource: display mode pip is refused (inline | fullscreen only)");
+  }
+  let toolVisibility;
+  if (visibility !== void 0) {
+    const valid = visibility.every((v) => v === "model" || v === "app");
+    if (visibility.length === 0 || !valid) {
+      throw new Error(
+        'buildMcpAppResource: visibility must be a non-empty list of "model" | "app"'
+      );
+    }
+    toolVisibility = [...new Set(visibility)];
+  }
+  const resourceDomains = [...csp?.resourceDomains ?? []];
+  if (hostFonts && !resourceDomains.includes(CLAUDE_HOST_FONT_ORIGIN)) {
+    resourceDomains.push(CLAUDE_HOST_FONT_ORIGIN);
+  }
+  const ui = {
+    csp: {
+      connectDomains: csp?.connectDomains ?? [],
+      resourceDomains,
+      frameDomains: csp?.frameDomains ?? [],
+      baseUriDomains: csp?.baseUriDomains ?? []
+    },
+    ...prefersBorder === void 0 ? {} : { prefersBorder },
+    ...servedUrl ? { domain: deriveClaudeAppDomain(servedUrl) } : {}
+  };
+  const resourceMeta = { ui };
+  if (openai?.availableDisplayModes !== void 0 || openai?.preferredDisplayMode !== void 0) {
+    resourceMeta["openai/ui"] = {
+      ...openai.availableDisplayModes !== void 0 ? { availableDisplayModes: openai.availableDisplayModes } : {},
+      ...openai.preferredDisplayMode !== void 0 ? { preferredDisplayMode: openai.preferredDisplayMode } : {}
+    };
+  }
+  const toolMeta = {
+    ui: { resourceUri: uri, ...toolVisibility ? { visibility: toolVisibility } : {} }
+  };
+  if (openai?.outputTemplate !== void 0) {
+    toolMeta["openai/outputTemplate"] = openai.outputTemplate;
+  }
+  if (openai?.entrypoints !== void 0) {
+    toolMeta["openai/ui"] = { entrypoints: openai.entrypoints };
+  }
+  return {
+    resource: { uri, mimeType: MCP_APP_MIME_TYPE, text: html, _meta: resourceMeta },
+    toolMeta
+  };
+}
+
+export { MCP_APP_MIME_TYPE, buildMcpAppResource, deriveClaudeAppDomain };
+//# sourceMappingURL=resource.js.map
+//# sourceMappingURL=resource.js.map

package/dist/server/resource.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/host/style-variables.ts","../../src/server/mcp-app-resource.ts"],"names":[],"mappings":"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","file":"resource.js","sourcesContent":["/**\n * Host style variables and fonts (H02) — framework-agnostic, structural (no ext-apps import).\n *\n * Spec: MCP Apps 2026-01-26 (ext-apps-spec.mdx):\n *   l.547-555  `HostContext.styles = { variables?: Record<McpUiStyleVariableKey, string|undefined>,\n *              css?: { fonts?: string } }`\n *   l.799-888  `McpUiStyleVariableKey`, the 76 standardized keys below (extracted from the spec\n *              block by command, not retyped)\n *   l.895-905  \"Views should set default fallback values ... to account for hosts who don't pass\n *              some or all style variables\": here the mosaic-tokens defaults are the fallback,\n *              because only the variables the host passes are written.\n * Claude transparent-theming page: fonts need `https://assets.claude.ai` in `resourceDomains`;\n * html and body backgrounds are set to `transparent`.\n * Composes with ext-apps `applyHostStyleVariables` / `applyDocumentTheme` structurally; either can\n * be used instead, nothing here imports them.\n */\nexport const MCP_STYLE_VARIABLE_KEYS = [\n  \"--color-background-primary\",\n  \"--color-background-secondary\",\n  \"--color-background-tertiary\",\n  \"--color-background-inverse\",\n  \"--color-background-ghost\",\n  \"--color-background-info\",\n  \"--color-background-danger\",\n  \"--color-background-success\",\n  \"--color-background-warning\",\n  \"--color-background-disabled\",\n  \"--color-text-primary\",\n  \"--color-text-secondary\",\n  \"--color-text-tertiary\",\n  \"--color-text-inverse\",\n  \"--color-text-info\",\n  \"--color-text-danger\",\n  \"--color-text-success\",\n  \"--color-text-warning\",\n  \"--color-text-disabled\",\n  \"--color-text-ghost\",\n  \"--color-border-primary\",\n  \"--color-border-secondary\",\n  \"--color-border-tertiary\",\n  \"--color-border-inverse\",\n  \"--color-border-ghost\",\n  \"--color-border-info\",\n  \"--color-border-danger\",\n  \"--color-border-success\",\n  \"--color-border-warning\",\n  \"--color-border-disabled\",\n  \"--color-ring-primary\",\n  \"--color-ring-secondary\",\n  \"--color-ring-inverse\",\n  \"--color-ring-info\",\n  \"--color-ring-danger\",\n  \"--color-ring-success\",\n  \"--color-ring-warning\",\n  \"--font-sans\",\n  \"--font-mono\",\n  \"--font-weight-normal\",\n  \"--font-weight-medium\",\n  \"--font-weight-semibold\",\n  \"--font-weight-bold\",\n  \"--font-text-xs-size\",\n  \"--font-text-sm-size\",\n  \"--font-text-md-size\",\n  \"--font-text-lg-size\",\n  \"--font-heading-xs-size\",\n  \"--font-heading-sm-size\",\n  \"--font-heading-md-size\",\n  \"--font-heading-lg-size\",\n  \"--font-heading-xl-size\",\n  \"--font-heading-2xl-size\",\n  \"--font-heading-3xl-size\",\n  \"--font-text-xs-line-height\",\n  \"--font-text-sm-line-height\",\n  \"--font-text-md-line-height\",\n  \"--font-text-lg-line-height\",\n  \"--font-heading-xs-line-height\",\n  \"--font-heading-sm-line-height\",\n  \"--font-heading-md-line-height\",\n  \"--font-heading-lg-line-height\",\n  \"--font-heading-xl-line-height\",\n  \"--font-heading-2xl-line-height\",\n  \"--font-heading-3xl-line-height\",\n  \"--border-radius-xs\",\n  \"--border-radius-sm\",\n  \"--border-radius-md\",\n  \"--border-radius-lg\",\n  \"--border-radius-xl\",\n  \"--border-radius-full\",\n  \"--border-width-regular\",\n  \"--shadow-hairline\",\n  \"--shadow-sm\",\n  \"--shadow-md\",\n  \"--shadow-lg\",\n] as const;\nexport type McpStyleVariableKey = (typeof MCP_STYLE_VARIABLE_KEYS)[number];\nexport interface HostStyles {\n  variables: Partial<Record<McpStyleVariableKey, string>>;\n  fonts: string | undefined;\n}\n\n/**\n * Host variable -> mosaic-tokens custom properties it drives. Declared mapping (a design\n * decision, not a spec fact); `style-variables.test.ts` asserts every target exists in\n * `mosaic-tokens/src/tokens.css`.\n */\nexport const HOST_TO_MOSAIC_TOKENS: Partial<Record<McpStyleVariableKey, readonly string[]>> = {\n  \"--color-background-primary\": [\n    \"--mosaic-color-background\",\n    \"--mosaic-color-card\",\n    \"--mosaic-color-popover\",\n  ],\n  \"--color-background-secondary\": [\n    \"--mosaic-color-muted\",\n    \"--mosaic-color-secondary\",\n    \"--mosaic-color-accent\",\n  ],\n  \"--color-text-primary\": [\n    \"--mosaic-color-foreground\",\n    \"--mosaic-color-card-foreground\",\n    \"--mosaic-color-popover-foreground\",\n    \"--mosaic-color-secondary-foreground\",\n    \"--mosaic-color-accent-foreground\",\n  ],\n  \"--color-text-secondary\": [\"--mosaic-color-muted-foreground\"],\n  \"--color-border-primary\": [\"--mosaic-color-border\", \"--mosaic-color-input\"],\n  \"--color-ring-primary\": [\"--mosaic-color-ring\"],\n  \"--color-background-danger\": [\"--mosaic-color-danger-50\"],\n  \"--color-text-danger\": [\"--mosaic-color-danger-700\"],\n  \"--color-border-danger\": [\"--mosaic-color-danger-500\"],\n  \"--color-background-success\": [\"--mosaic-color-success-50\"],\n  \"--color-text-success\": [\"--mosaic-color-success-700\"],\n  \"--color-border-success\": [\"--mosaic-color-success-500\"],\n  \"--color-background-warning\": [\"--mosaic-color-warning-50\"],\n  \"--color-text-warning\": [\"--mosaic-color-warning-700\"],\n  \"--color-border-warning\": [\"--mosaic-color-warning-500\"],\n  \"--color-background-info\": [\"--mosaic-color-info-50\"],\n  \"--color-text-info\": [\"--mosaic-color-info-700\"],\n  \"--color-border-info\": [\"--mosaic-color-info-500\"],\n  \"--font-sans\": [\"--mosaic-font-sans\"],\n  \"--font-mono\": [\"--mosaic-font-mono\"],\n  \"--border-radius-xs\": [\"--mosaic-radius-xs\"],\n  \"--border-radius-sm\": [\"--mosaic-radius-sm\"],\n  \"--border-radius-md\": [\"--mosaic-radius-md\"],\n  \"--border-radius-lg\": [\"--mosaic-radius-lg\"],\n  \"--border-radius-xl\": [\"--mosaic-radius-xl\"],\n  \"--border-radius-full\": [\"--mosaic-radius-full\"],\n};\n\n/** Origin Claude serves host fonts from; add it to `resourceDomains` to load `styles.css.fonts`. */\nexport const CLAUDE_HOST_FONT_ORIGIN = \"https://assets.claude.ai\";\n\nconst KNOWN = new Set<string>(MCP_STYLE_VARIABLE_KEYS);\n\n/** Reads `hostContext.styles`; unknown keys and non-string values are dropped. */\nexport function readHostStyles(raw: unknown): HostStyles | undefined {\n  if (raw === null || typeof raw !== \"object\") return undefined;\n  const styles = (raw as Record<string, unknown>).styles;\n  if (styles === null || typeof styles !== \"object\") return undefined;\n  const s = styles as { variables?: unknown; css?: unknown };\n  const variables: HostStyles[\"variables\"] = {};\n  if (s.variables !== null && typeof s.variables === \"object\") {\n    for (const [k, v] of Object.entries(s.variables as Record<string, unknown>)) {\n      if (KNOWN.has(k) && typeof v === \"string\") variables[k as McpStyleVariableKey] = v;\n    }\n  }\n  const css = s.css !== null && typeof s.css === \"object\" ? (s.css as { fonts?: unknown }) : {};\n  return { variables, fonts: typeof css.fonts === \"string\" ? css.fonts : undefined };\n}\n\nconst applied = new WeakMap<HTMLElement, string[]>();\n\n/**\n * Writes the host variables on `root`, and the mosaic-tokens custom properties they drive.\n * Variables a previous call set and this one no longer carries are cleared; `undefined` clears\n * all. Variables the host never passed are not written, so mosaic-tokens defaults remain.\n */\nexport function applyHostStyleVariables(styles: HostStyles | undefined, root: HTMLElement): void {\n  for (const name of applied.get(root) ?? []) root.style.removeProperty(name);\n  const written: string[] = [];\n  for (const [host, value] of Object.entries(styles?.variables ?? {})) {\n    root.style.setProperty(host, value);\n    written.push(host);\n    for (const target of HOST_TO_MOSAIC_TOKENS[host as McpStyleVariableKey] ?? []) {\n      root.style.setProperty(target, value);\n      written.push(target);\n    }\n  }\n  applied.set(root, written);\n}\n\nconst FONT_ATTR = \"data-mosaic-host-fonts\";\n\n/** Injects `styles.css.fonts` as one `<style>` in `<head>`; replaced on change, removed when absent. */\nexport function applyHostFonts(css: string | undefined, doc: Document): void {\n  const existing = doc.head.querySelector(`style[${FONT_ATTR}]`);\n  if (css === undefined) {\n    existing?.remove();\n    return;\n  }\n  const el = existing ?? doc.head.appendChild(doc.createElement(\"style\"));\n  el.setAttribute(FONT_ATTR, \"\");\n  el.textContent = css;\n}\n\n/** Claude transparent theming: html and body backgrounds are explicitly `transparent`. */\nexport function applyTransparentBackground(doc: Document): void {\n  doc.documentElement.style.background = \"transparent\";\n  doc.body.style.background = \"transparent\";\n}\n","/**\n * MCP Apps resource helper — server side, pure, no React, no DOM.\n *\n * Emits the MCP Apps (spec 2026-01-26) standard keys FIRST: resource `_meta.ui`\n * ({ csp, prefersBorder?, domain? }) and tool `_meta.ui.resourceUri`. `openai/*` keys are\n * strictly additive and appear only when the caller passes the matching input; a client that\n * ignores them loses nothing.\n *\n * Composition with `@modelcontextprotocol/ext-apps/server` (read at 2.0.3): `registerAppResource`\n * only defaults the MIME type and `registerAppTool` only back-fills the deprecated flat\n * `ui/resourceUri` key; neither computes csp defaults, the Claude `domain`, or any `openai/*`\n * key. This helper produces the metadata those registrars pass through: use `resource._meta` as\n * the resource config `_meta` and the read-result content `_meta`, and `toolMeta` as the tool\n * config `_meta`.\n */\nimport { createHash } from \"node:crypto\";\nimport { CLAUDE_HOST_FONT_ORIGIN } from \"../host/style-variables.js\";\n\nexport const MCP_APP_MIME_TYPE = \"text/html;profile=mcp-app\" as const;\n\nexport interface McpAppCsp {\n  connectDomains?: string[];\n  resourceDomains?: string[];\n  frameDomains?: string[];\n  baseUriDomains?: string[];\n}\n\nexport type OpenAiEntrypoint =\n  | { type: \"global\" }\n  | { type: \"thread\" }\n  | { type: \"file\"; extensions: string[] };\n\n/** ChatGPT display modes. `pip` is not one (openai/mcp-extensions docs/spec.md l.843-890). */\nexport type ChatGptDisplayMode = \"inline\" | \"fullscreen\";\n\nexport interface McpAppOpenAiInput {\n  /** `openai/outputTemplate`: compatibility alias of `_meta.ui.resourceUri` (tool level; fleet ruling, additive). */\n  outputTemplate?: string;\n  /** `_meta[\"openai/ui\"].availableDisplayModes` on the resource content item (spec l.843-890). */\n  availableDisplayModes?: ChatGptDisplayMode[];\n  /** `_meta[\"openai/ui\"].preferredDisplayMode` on the resource content item (spec l.843-890). */\n  preferredDisplayMode?: ChatGptDisplayMode;\n  /** `_meta[\"openai/ui\"].entrypoints` on the tool descriptor (spec l.59, l.116). */\n  entrypoints?: OpenAiEntrypoint[];\n}\n\n/** Who sees a tool: `\"model\"` (agent tool list) and/or `\"app\"` (callable from the view). */\nexport type ToolVisibility = \"model\" | \"app\";\n\nexport interface McpAppResourceInput {\n  uri: `ui://${string}`;\n  html: string;\n  csp?: McpAppCsp;\n  /** The URL this MCP server is served at. Claude's `ui.domain` is DERIVED from it. */\n  servedUrl?: string;\n  prefersBorder?: boolean;\n  openai?: McpAppOpenAiInput;\n  /**\n   * Tool-level `_meta.ui.visibility` (MCP Apps spec 2026-01-26, ext-apps-spec.mdx l.332,\n   * l.395-401). Omitted = the spec default `[\"model\", \"app\"]`. `[\"app\"]` makes an app-only tool\n   * (refresh, UI-only sort/filter; l.1490) that hosts MUST keep out of the agent's tool list.\n   * OpenAI: ignored when the App is invoked as an entrypoint.\n   */\n  visibility?: ToolVisibility[];\n  /**\n   * Allow Claude host fonts (`hostContext.styles.css.fonts`): adds `https://assets.claude.ai` to\n   * `csp.resourceDomains` (Claude transparent-theming page).\n   */\n  hostFonts?: boolean;\n}\n\nexport interface McpAppResourceMetaUi {\n  csp: Required<McpAppCsp>;\n  prefersBorder?: boolean;\n  domain?: string;\n}\n\nexport interface McpAppResourceOutput {\n  resource: {\n    uri: `ui://${string}`;\n    mimeType: typeof MCP_APP_MIME_TYPE;\n    text: string;\n    _meta: {\n      ui: McpAppResourceMetaUi;\n      \"openai/ui\"?: {\n        availableDisplayModes?: ChatGptDisplayMode[];\n        preferredDisplayMode?: ChatGptDisplayMode;\n      };\n    };\n  };\n  toolMeta: {\n    ui: { resourceUri: `ui://${string}`; visibility?: ToolVisibility[] };\n    \"openai/outputTemplate\"?: string;\n    \"openai/ui\"?: { entrypoints: OpenAiEntrypoint[] };\n  };\n}\n\n/**\n * Claude's stable app origin: `{sha256(mcpServerUrl) first 32 hex}.claudemcpcontent.com`.\n * Source: https://claude.com/docs/connectors/building/mcp-apps/getting-started, section\n * \"Set ui.domain for Claude\" (same derivation as the `@modelcontextprotocol/ext-apps/server`\n * example). Known answer: \"https://example.com/mcp\" ->\n * \"c3d80a4ed901ee05b21755a88273b4a4.claudemcpcontent.com\".\n */\nexport function deriveClaudeAppDomain(servedUrl: string): string {\n  const hash = createHash(\"sha256\").update(servedUrl).digest(\"hex\").slice(0, 32);\n  return `${hash}.claudemcpcontent.com`;\n}\n\nexport function buildMcpAppResource(input: McpAppResourceInput): McpAppResourceOutput {\n  const { uri, html, csp, servedUrl, prefersBorder, openai, visibility, hostFonts } = input;\n  const modes = [...(openai?.availableDisplayModes ?? []), openai?.preferredDisplayMode];\n  if (modes.some((m) => (m as string | undefined) === \"pip\")) {\n    throw new Error(\"buildMcpAppResource: display mode pip is refused (inline | fullscreen only)\");\n  }\n\n  let toolVisibility: ToolVisibility[] | undefined;\n  if (visibility !== undefined) {\n    const valid = visibility.every((v) => (v as string) === \"model\" || (v as string) === \"app\");\n    if (visibility.length === 0 || !valid) {\n      throw new Error(\n        'buildMcpAppResource: visibility must be a non-empty list of \"model\" | \"app\"',\n      );\n    }\n    toolVisibility = [...new Set(visibility)];\n  }\n  const resourceDomains = [...(csp?.resourceDomains ?? [])];\n  if (hostFonts && !resourceDomains.includes(CLAUDE_HOST_FONT_ORIGIN)) {\n    resourceDomains.push(CLAUDE_HOST_FONT_ORIGIN);\n  }\n\n  const ui: McpAppResourceMetaUi = {\n    csp: {\n      connectDomains: csp?.connectDomains ?? [],\n      resourceDomains,\n      frameDomains: csp?.frameDomains ?? [],\n      baseUriDomains: csp?.baseUriDomains ?? [],\n    },\n    ...(prefersBorder === undefined ? {} : { prefersBorder }),\n    ...(servedUrl ? { domain: deriveClaudeAppDomain(servedUrl) } : {}),\n  };\n\n  // Standard key first, vendor keys after, only when passed.\n  const resourceMeta: McpAppResourceOutput[\"resource\"][\"_meta\"] = { ui };\n  if (openai?.availableDisplayModes !== undefined || openai?.preferredDisplayMode !== undefined) {\n    resourceMeta[\"openai/ui\"] = {\n      ...(openai.availableDisplayModes !== undefined\n        ? { availableDisplayModes: openai.availableDisplayModes }\n        : {}),\n      ...(openai.preferredDisplayMode !== undefined\n        ? { preferredDisplayMode: openai.preferredDisplayMode }\n        : {}),\n    };\n  }\n\n  const toolMeta: McpAppResourceOutput[\"toolMeta\"] = {\n    ui: { resourceUri: uri, ...(toolVisibility ? { visibility: toolVisibility } : {}) },\n  };\n  if (openai?.outputTemplate !== undefined) {\n    toolMeta[\"openai/outputTemplate\"] = openai.outputTemplate;\n  }\n  if (openai?.entrypoints !== undefined) {\n    toolMeta[\"openai/ui\"] = { entrypoints: openai.entrypoints };\n  }\n\n  return {\n    resource: { uri, mimeType: MCP_APP_MIME_TYPE, text: html, _meta: resourceMeta },\n    toolMeta,\n  };\n}\n"]}