webmcpx 0.1.0 → 0.2.0

package/agent/session.js

@@ -0,0 +1,114 @@
+// What the CLI and the MCP server share: one browser (started on first use), one tab, and the tool list
+// the agent sees: the page's own tools plus the standard ones the page does not already have.
+import { attach, launch } from "./browser.js";
+import { Page, stale } from "./page.js";
+import { runStandard, standardTools } from "./standard.js";
+
+export class Session {
+  #options;
+  #browser;
+  #page;
+  #ready;
+  #queue = Promise.resolve();
+
+  /** @param {{headed?: boolean, browser?: string, cdp?: string, onChange?: () => void}} options */
+  constructor(options = {}) {
+    this.#options = options;
+  }
+
+  #start() {
+    this.#ready ??= (async () => {
+      const { cdp, headed, browser, onChange } = this.#options;
+      this.#browser = cdp ? await attach(cdp) : await launch({ headed, executable: browser });
+      return Page.create(this.#browser.cdp, { onChange });
+    })().catch((e) => {
+      this.#ready = undefined;
+      throw e;
+    });
+    return this.#ready;
+  }
+
+  /** Runs page work one at a time: there is one tab, so a navigation must not interleave with a call. */
+  #serial(work) {
+    const run = this.#queue.then(work);
+    this.#queue = run.catch(() => {});
+    return run;
+  }
+
+  /** @returns {Promise<{url: string, title: string, tools: Tool[] | null}>} */
+  goto(url) {
+    return this.#serial(async () => {
+      this.#page = await this.#start();
+      const page = await this.#page.open(normalize(url));
+      return { ...page, tools: page.tools && withStandard(page.tools) };
+    });
+  }
+
+  /** The current tool list (empty before a page is open, or without WebMCP). */
+  tools() {
+    return this.#serial(async () => (this.#page ? withStandard((await this.#page.tools()) ?? []) : []));
+  }
+
+  /** Calls a tool from the latest list; a page tool whose list went stale is found again by name and origin. */
+  call(tool, input) {
+    return this.#serial(async () => {
+      if (!this.#page) throw new Error("no page is open yet: call open_page first");
+      const page = this.#page;
+      if (tool.standard) return runStandard(tool.name, input, (what) => page.read(what));
+      try {
+        return await page.call(tool, input);
+      } catch (e) {
+        if (!stale(e)) throw e;
+        // The document the tool was listed in is gone: run the same tool in the new one only when no
+        // other tool shares its name and origin there or then; otherwise refuse rather than guess.
+        const now = ((await page.tools()) ?? []).filter((t) => t.name === tool.name && t.origin === tool.origin);
+        const again = tool.unique && now.length === 1 ? now[0] : undefined;
+        if (!again) throw new Error(`the page changed and no longer has the tool "${tool.name}": call open_page again`);
+        return page.call(again, input);
+      }
+    });
+  }
+
+  close() {
+    this.#browser?.close();
+  }
+}
+
+/** The page's tools, then each standard tool the page does not already register. */
+function withStandard(tools) {
+  const names = new Set(tools.map((t) => t.name));
+  return [...tools, ...standardTools().filter((t) => !names.has(t.name))];
+}
+
+/** `example.com` → `https://example.com`; `localhost:3000` → `http://localhost:3000`. */
+export function normalize(url) {
+  const raw = String(url ?? "").trim();
+  if (!raw) throw new Error("give a URL, e.g. https://example.com or http://localhost:3000");
+  if (/^[a-z][a-z0-9+.-]*:\/\//i.test(raw) || raw.startsWith("about:") || raw.startsWith("file:")) return raw;
+  const local = /^(localhost|127\.|\[::1\]|0\.0\.0\.0)/.test(raw);
+  return `${local ? "http" : "https"}://${raw}`;
+}
+
+/** Whether a tool result reports failure: a webmcpx envelope (`"ok": false`) or an MCP result (`"isError": true`). */
+export function failed(text) {
+  try {
+    const value = JSON.parse(text);
+    return value?.ok === false || value?.isError === true;
+  } catch {
+    return false;
+  }
+}
+
+/** A result some sites already shape like MCP (`{content: [...]}`, e.g. Shopify), or undefined. */
+export function mcpResult(text) {
+  try {
+    const value = JSON.parse(text);
+    if (!Array.isArray(value?.content)) return undefined;
+    const { content, structuredContent, isError } = value;
+    return { content, ...(structuredContent && { structuredContent }), ...(isError === true && { isError }) };
+  } catch {
+    return undefined;
+  }
+}
+
+/** @typedef {import("./page.js").PageTool & {standard?: boolean}} Tool */

package/agent/standard.js

@@ -0,0 +1,57 @@
+// The webmcpx standard tools, run by the agent bridge itself: the page is only read (through the
+// loader's own `readPage`, evaluated by DevTools, which the page's CSP does not apply to) and the text
+// engine runs here in Node. Nothing is injected into the page besides the W3C polyfill.
+import { readFileSync } from "node:fs";
+import { CODES, TOOLS } from "../src/generated.js";
+import { readPage } from "../src/loader.js";
+
+export const STANDARD = ["get_page_context", "search_page", "fetch_as_markdown"];
+
+/** Source of a page expression: `${READ_PAGE}("blocks")`. */
+export const READ_PAGE = `(${readPage})`;
+
+let engine;
+const load = () =>
+  (engine ??= import("../wasm/webmcpx_wasm.js")
+    .then(async (m) => {
+      await m.default({ module_or_path: readFileSync(new URL("../wasm/webmcpx_wasm_bg.wasm", import.meta.url)) });
+      return m;
+    })
+    .catch((e) => {
+      engine = undefined;
+      throw e;
+    }));
+
+const envelope = (body) => JSON.stringify(body);
+const err = (code, message) => envelope({ ok: false, error: { code, message, retryable: CODES[code] } });
+
+/** The standard tools as page-tool descriptors (`standard: true`), for listing next to the site's. */
+export const standardTools = () =>
+  STANDARD.map((name) => {
+    const { description, inputSchema, annotations } = TOOLS[name];
+    return { name, description, inputSchema, annotations: { ...annotations }, standard: true };
+  });
+
+/**
+ * Runs a standard tool. `read(what)` returns `readPage(what)` evaluated in the page.
+ * Like the in-page tools, it never rejects: any input and any failure yield an envelope.
+ */
+export async function runStandard(name, input, read) {
+  const args = input && typeof input === "object" && !Array.isArray(input) ? input : {};
+  try {
+    if (name === "get_page_context") return envelope({ ok: true, data: await read("context") });
+    if (name === "search_page" && typeof args.query !== "string") return err("INVALID_INPUT", "`query` must be a string");
+    const page = await read("blocks");
+    let m;
+    try {
+      m = await load();
+    } catch (e) {
+      return err("UNAVAILABLE", `the text engine could not load: ${e?.message ?? e}`);
+    }
+    if (name === "search_page") return m.search(page, args.query, args.limit ?? 0);
+    if (name === "fetch_as_markdown") return m.markdown(page, String(args.cursor ?? ""), args.max_chars ?? 0);
+    return err("NOT_FOUND", `no standard tool named ${name}`);
+  } catch (e) {
+    return err("UNAVAILABLE", String(e?.message ?? e));
+  }
+}

package/bin/webmcpx.js

@@ -0,0 +1,152 @@
+#!/usr/bin/env node
+// npx webmcpx: WebMCP for any agent, in any Chromium, today.
+//   webmcpx mcp                      MCP server: your agent calls the tools of any page it opens
+//   webmcpx tools <url>              list a page's WebMCP tools (great on localhost)
+//   webmcpx call <url> <tool> [json] call one and print the result
+import { parseArgs } from "node:util";
+import { describe, named, serve } from "../agent/mcp.js";
+import { Session, failed, mcpResult } from "../agent/session.js";
+
+const tty = process.stdout.isTTY && !process.env.NO_COLOR;
+const paint = (code) => (s) => (tty ? `\x1b[${code}m${s}\x1b[0m` : s);
+const bold = paint(1);
+const dim = paint(2);
+const green = paint(32);
+const yellow = paint(33);
+
+const HELP = `${bold("webmcpx")}: WebMCP for any agent, in any Chromium, today.
+
+${bold("Give your agent the tools of every page it opens")}
+  Claude Code   claude mcp add webmcpx -- npx -y webmcpx mcp
+  Codex         codex mcp add webmcpx -- npx -y webmcpx mcp
+  Cursor, VS Code, Windsurf (mcp.json):
+                { "mcpServers": { "webmcpx": { "command": "npx", "args": ["-y", "webmcpx", "mcp"] } } }
+
+${bold("Check your own site's tools")} ${dim("(no Chrome flags)")}
+  npx webmcpx tools localhost:3000
+  npx webmcpx call localhost:3000 search_page '{"query": "pricing"}'
+
+${bold("Commands")}
+  mcp                         MCP server over stdio
+  tools <url>                 list the page's WebMCP tools
+  call <url> <tool> [json]    call one tool and print its result
+
+${bold("Options")}
+  --headed                    show the browser window
+  --browser <path>            Chrome, Chromium, Edge or Brave to use (or WEBMCPX_CHROME)
+  --cdp <url>                 use a browser you started with --remote-debugging-port
+
+Every page gets search_page, fetch_as_markdown and get_page_context, plus the site's own tools.
+The linter is the Rust CLI: cargo install webmcpx. Docs: https://webmcpx.dev`;
+
+const usage = (message) => {
+  console.error(`${message}\n\nRun "npx webmcpx --help" for usage.`);
+  process.exit(2);
+};
+
+function parse(argv) {
+  try {
+    return parseArgs({
+      args: argv,
+      allowPositionals: true,
+      options: {
+        headed: { type: "boolean" },
+        browser: { type: "string" },
+        cdp: { type: "string" },
+        help: { type: "boolean", short: "h" },
+        version: { type: "boolean", short: "v" },
+      },
+    });
+  } catch (e) {
+    return usage(e.message);
+  }
+}
+
+const firstLine = (s, max = 72) => {
+  const line = String(s ?? "").split("\n")[0];
+  return line.length > max ? `${line.slice(0, max - 1)}…` : line;
+};
+
+function printTools(page) {
+  if (page.tools === null) return console.log(describe(page));
+  const own = page.tools.filter((t) => !t.standard);
+  const standard = page.tools.filter((t) => t.standard);
+  const width = Math.max(0, ...page.tools.map((t) => t.name.length)) + 2;
+  const row = (t) => {
+    const a = t.annotations ?? {};
+    const tag = a.readOnlyHint ? dim("read-only ") : a.consequentialHint ? yellow("acts      ") : "          ";
+    return `  ${bold(t.name.padEnd(width))}${tag}${dim(firstLine(t.description))}`;
+  };
+  console.log(`${bold(page.title || page.url)} ${dim(page.url)}\n`);
+  if (own.length) {
+    console.log(green(`✓ ${own.length} WebMCP tool${own.length === 1 ? "" : "s"} registered by the site`));
+    for (const t of own) console.log(row(t));
+  } else {
+    console.log(yellow("○ The site registers no WebMCP tools of its own.") + dim(" Add them: https://webmcpx.dev/#fix"));
+  }
+  if (standard.length) {
+    console.log(`\n${dim("+ standard tools webmcpx adds to every page")}`);
+    for (const t of standard) console.log(row(t));
+  }
+  console.log(dim(`\nTry one: npx webmcpx call ${page.url} search_page '{"query": "..."}'`));
+}
+
+async function main() {
+  const { values, positionals } = parse(process.argv.slice(2));
+  const [command, ...rest] = positionals;
+  if (values.version) {
+    const { readFileSync } = await import("node:fs");
+    return console.log(JSON.parse(readFileSync(new URL("../package.json", import.meta.url), "utf8")).version);
+  }
+  if (values.help || !command || command === "help") return console.log(HELP);
+  const options = { headed: values.headed, browser: values.browser, cdp: values.cdp };
+
+  if (command === "mcp") return serve(options);
+  if (command === "lint") usage("The linter is the Rust CLI: cargo install webmcpx, then webmcpx lint <dir>.");
+  if (command !== "tools" && command !== "call") usage(`Unknown command "${command}".`);
+
+  const [url, name, json] = rest;
+  if (!url) usage(`Give a URL: npx webmcpx ${command} localhost:3000`);
+  if (command === "call" && !name) usage("Give a tool name: npx webmcpx call <url> <tool> [json]");
+  let input = {};
+  if (json) {
+    try {
+      input = JSON.parse(json);
+    } catch {
+      usage(`The input is not JSON: ${json}`);
+    }
+    if (!input || typeof input !== "object" || Array.isArray(input)) usage(`The input must be a JSON object, like '{"query": "pricing"}'.`);
+  }
+
+  const session = new Session(options);
+  try {
+    const page = await session.goto(url);
+    if (command === "tools") return printTools(page);
+    const entries = named(page.tools ?? []);
+    const tool = (entries.find((e) => e.tool.name === name) ?? entries.find((e) => e.name === name))?.tool;
+    if (!tool) {
+      console.error(`webmcpx: ${page.url} has no tool named "${name}". Run: npx webmcpx tools ${url}`);
+      process.exitCode = 2;
+      return;
+    }
+    const out = await session.call(tool, input);
+    const mcp = mcpResult(out);
+    let pretty = out;
+    try {
+      pretty = mcp
+        ? mcp.content.map((c) => (c.type === "text" ? c.text : JSON.stringify(c))).join("\n")
+        : JSON.stringify(JSON.parse(out), null, 2);
+    } catch {
+      // not JSON: print as is
+    }
+    console.log(pretty);
+    if (failed(out)) process.exitCode = 1;
+  } finally {
+    session.close();
+  }
+}
+
+main().catch((e) => {
+  console.error(`webmcpx: ${e.message}`);
+  process.exit(1);
+});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "webmcpx",
-  "version": "0.1.0",
-  "description": "Standard WebMCP tools for any website: one script tag, zero config.",
+  "version": "0.2.0",
+  "description": "Standard WebMCP tools for any website, and an MCP server that gives any agent the WebMCP tools of the pages it opens.",
   "type": "module",
   "license": "MIT",
   "homepage": "https://webmcpx.dev",
@@ -11,22 +11,45 @@
     "directory": "packages/webmcpx"
   },
   "keywords": [
-    "webmcp",
-    "mcp",
+    "agent",
     "ai-agents",
+    "mcp",
+    "mcp-server",
     "model-context",
-    "wasm"
+    "polyfill",
+    "react",
+    "svelte",
+    "vue",
+    "wasm",
+    "webmcp"
   ],
   "exports": {
     ".": {
       "types": "./src/index.d.ts",
       "default": "./src/index.js"
     },
-    "./auto": "./src/auto.js"
+    "./auto": "./src/auto.js",
+    "./react": {
+      "types": "./src/react.d.ts",
+      "default": "./src/react.js"
+    },
+    "./vue": {
+      "types": "./src/vue.d.ts",
+      "default": "./src/vue.js"
+    },
+    "./svelte": {
+      "types": "./src/svelte.d.ts",
+      "default": "./src/svelte.js"
+    }
   },
   "types": "./src/index.d.ts",
+  "bin": {
+    "webmcpx": "bin/webmcpx.js"
+  },
   "files": [
     "src",
+    "agent",
+    "bin",
     "wasm/webmcpx_wasm.js",
     "wasm/webmcpx_wasm_bg.wasm",
     "README.md",
@@ -36,12 +59,37 @@
     "./src/auto.js"
   ],
   "scripts": {
-    "test": "node --test"
+    "test": "node --test --experimental-test-module-mocks"
+  },
+  "engines": {
+    "node": ">=22"
+  },
+  "dependencies": {
+    "@w3c/webmcp-polyfill": "0.1.0"
   },
   "devDependencies": {
-    "linkedom": "0.18.15"
+    "linkedom": "0.18.15",
+    "react": "19.3.1",
+    "svelte": "5.57.3",
+    "vue": "3.5.45"
   },
   "bugs": {
     "url": "https://github.com/webmcpx/webmcpx/issues"
+  },
+  "peerDependencies": {
+    "react": ">=16.8",
+    "vue": ">=2.7",
+    "svelte": ">=3"
+  },
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    },
+    "vue": {
+      "optional": true
+    },
+    "svelte": {
+      "optional": true
+    }
   }
 }

package/src/auto.js

@@ -1,4 +1,13 @@
-// Drop-in: <script type="module" src="https://cdn.jsdelivr.net/npm/webmcpx/src/auto.js"></script>
-import { register } from "./index.js";
+// Drop-in: <script type="module" src="https://cdn.jsdelivr.net/npm/webmcpx@0.2/src/auto.js"></script>
+// Registers the standard tools, and turns every <form toolname> into a tool (that code loads only
+// on pages that have one).
+import { register } from "./loader.js";
 
 register();
+const doc = globalThis.document;
+const forms = () => import("./tool.js").then((m) => m.forms());
+if (doc?.querySelector("form[toolname]")) forms();
+else if (doc) {
+  const watch = new MutationObserver(() => doc.querySelector("form[toolname]") && (watch.disconnect(), forms()));
+  watch.observe(doc.documentElement, { subtree: true, childList: true, attributes: true, attributeFilter: ["toolname"] });
+}

package/src/generated.js

@@ -17,3 +17,11 @@ export const CODES = {
   REQUIRES_USER: false,
   UNAVAILABLE: true,
 };
+
+/** Authoring limits, in chars (webmcpx-core `limits`). */
+export const LIMITS = {
+  NAME_WARN: 30,
+  DESCRIPTION_WARN: 500,
+  TOOLS_WARN: 20,
+  OUTPUT_MAX: 20000,
+};

package/src/index.d.ts

@@ -40,3 +40,43 @@ export const TOOLS: Record<ToolName, {
 export type Envelope<T = unknown> =
   | { ok: true; data: T; truncated?: true; next_cursor?: string; hint?: string }
   | { ok: false; error: { code: string; message: string; retryable: boolean }; hint?: string };
+
+/** An input field: a JSON type ("string", "number?" for optional), a list of choices, or a property schema. */
+export type InputField = string | readonly (string | number)[] | Record<string, unknown>;
+
+export interface ToolDefinition<I = any, O = unknown> {
+  /** 1–128 of A-Z a-z 0-9 _ . - (keep it under 30). */
+  name: string;
+  /** What it does and when to use it (under 500 chars). */
+  description: string;
+  /** Shorthand: `{ sku: "string", "qty?": "number", size: ["S", "M"] }`. */
+  input?: Record<string, InputField>;
+  /** A full JSON Schema instead of `input` (checked: type, enum, required, properties, bounds, pattern...). */
+  inputSchema?: { type: "object"; [key: string]: unknown };
+  /** Returns the data for `{ ok: true, data }`. Throw for errors; an error with a webmcpx `code` keeps it. */
+  run(input: I, client?: unknown): O | Promise<O>;
+  /** Only reads (readOnlyHint). */
+  readOnly?: boolean;
+  /** Changes something for the user: cart, booking, message (consequentialHint). */
+  acts?: boolean;
+  /** Returns third-party content, like reviews or comments (untrustedContentHint). */
+  untrusted?: boolean;
+  /** Abort to unregister. */
+  signal?: AbortSignal;
+}
+
+export interface ToolHandle {
+  /** Resolves true once registered, false where WebMCP is missing or the host refused it. */
+  ready: Promise<boolean>;
+  /** Unregisters the tool. */
+  dispose(): void;
+}
+
+/** Registers one of your own tools with the webmcpx contract. A no-op where WebMCP is missing. */
+export function tool<I = any, O = unknown>(definition: ToolDefinition<I, O>): ToolHandle;
+
+/** Exposes every `<form toolname>` as a tool (WebMCP declarative API), following DOM changes. */
+export function forms(): { dispose(): void };
+
+/** The JSON Schema an input shorthand stands for. */
+export function schema(input?: Record<string, InputField>): object;

package/src/index.js

@@ -1,139 +1,3 @@
-// webmcpx loader: registers the standard WebMCP tools. Owns the DOM and registerTool();
-// all text processing runs in a WebAssembly module loaded on the first tool call.
-import { CODES, TOOLS } from "./generated.js";
-
-const RECORD = "\x1e";
-const FIELD = "\x1f";
-const KINDS = {
-  H1: "h1", H2: "h2", H3: "h3", H4: "h4", H5: "h5", H6: "h6",
-  P: "p", LI: "li", PRE: "pre", BLOCKQUOTE: "quote",
-  DT: "p", DD: "p", FIGCAPTION: "p", SUMMARY: "p",
-};
-const SKIP = new Set(["SCRIPT", "STYLE", "NOSCRIPT", "TEMPLATE", "SVG", "NAV", "FOOTER", "ASIDE"]);
-const DEFAULT_TOOLS = ["get_page_context", "search_page", "fetch_as_markdown"];
-
-const envelope = (body) => JSON.stringify(body);
-const ok = (data) => envelope({ ok: true, data });
-const err = (code, message, hint) =>
-  envelope({ ok: false, error: { code, message, retryable: CODES[code] }, ...(hint && { hint }) });
-
-let wasm;
-const engine = (source) =>
-  (wasm ??= import("../wasm/webmcpx_wasm.js")
-    .then(async (m) => (await m.default(source ? { module_or_path: source } : undefined), m))
-    .catch((e) => {
-      wasm = undefined;
-      throw e;
-    }));
-
-const pageUrl = () => location.href.split("#")[0];
-const text = (s) => (s ?? "").replace(/\s+/g, " ").trim();
-
-const skipped = (el) => SKIP.has(el.tagName) || el.hasAttribute("hidden") || el.getAttribute("aria-hidden") === "true";
-
-/** Serializes readable content of `root` as a block stream (see webmcpx-std `blocks`). */
-function blocks(root) {
-  let out = "";
-  let anchor = "";
-  const base = pageUrl();
-  const visit = (el) => {
-    for (const child of el.children) {
-      if (skipped(child)) continue;
-      if (child.id) anchor = `${base}#${child.id}`;
-      // A table row is one block ("Monday | Closed"), so search keeps a value next to its label.
-      const row = child.tagName === "TR" && [...child.children].filter((c) => !skipped(c)).map((c) => text(c.textContent)).join(" | ");
-      const kind = row ? "p" : KINDS[child.tagName] ?? (child.children.length === 0 && "p");
-      if (kind) out += kind + FIELD + (row || child.textContent) + FIELD + anchor + RECORD;
-      else visit(child);
-    }
-  };
-  visit(root);
-  return out;
-}
-
-function contentRoot(root) {
-  if (typeof root === "string") return document.querySelector(root) ?? document.body;
-  return root ?? document.querySelector("main, [role=main], article") ?? document.body;
-}
-
-function pageContext() {
-  const base = pageUrl();
-  return ok({
-    title: document.title,
-    url: location.href,
-    lang: document.documentElement.lang || undefined,
-    description: document.querySelector('meta[name="description"]')?.getAttribute("content") || undefined,
-    headings: [...document.querySelectorAll("h1, h2, h3")].slice(0, 30).map((h) => ({
-      level: Number(h.tagName[1]),
-      text: text(h.textContent).slice(0, 120),
-      url: h.id ? `${base}#${h.id}` : undefined,
-    })),
-    selection: text(globalThis.getSelection?.()?.toString()).slice(0, 1000) || undefined,
-  });
-}
-
-function executors(options) {
-  const withEngine = (run) => async (input) => {
-    let m;
-    try {
-      m = await engine(options.wasm);
-    } catch (e) {
-      return err("UNAVAILABLE", `WebAssembly could not load: ${e?.message ?? e}`,
-        "If the page sets a Content-Security-Policy, add 'wasm-unsafe-eval' to script-src.");
-    }
-    return run(m, blocks(contentRoot(options.root)), input);
-  };
-  return {
-    get_page_context: async () => pageContext(),
-    search_page: withEngine((m, page, { query, limit }) =>
-      typeof query === "string" ? m.search(page, query, limit ?? 0) : err("INVALID_INPUT", "`query` must be a string")),
-    fetch_as_markdown: withEngine((m, page, { cursor, max_chars }) => m.markdown(page, String(cursor ?? ""), max_chars ?? 0)),
-    search_site: async ({ query, limit = 5 }, { signal } = {}) => {
-      if (typeof query !== "string" || !query.trim()) return err("INVALID_INPUT", "`query` must be a non-empty string");
-      const found = await options.searchSite(query, { limit, signal });
-      if (!found?.length) return err("NOT_FOUND", "no page matches the query", "Try fewer or different words.");
-      return ok({ results: found.slice(0, limit).map(({ title, url, snippet }) => ({ title, url, snippet })) });
-    },
-  };
-}
-
-/** Tools resolve with an envelope and never reject: hosts drop rejection reasons (webmcp#282). */
-const guard = (run) => async (input, client) => {
-  try {
-    return await run(typeof input === "string" ? JSON.parse(input || "{}") : input ?? {}, client);
-  } catch (e) {
-    return err("UNAVAILABLE", String(e?.message ?? e));
-  }
-};
-
-/**
- * Registers webmcpx standard tools on the current document.
- * @param {import("./index").Options} [options]
- * @returns {Promise<import("./index").Registration>}
- */
-export async function register(options = {}) {
-  const mc = globalThis.document?.modelContext ?? globalThis.navigator?.modelContext;
-  const controller = new AbortController();
-  const result = { registered: [], failed: [], dispose: () => controller.abort() };
-  if (typeof mc?.registerTool !== "function") return result;
-
-  const run = executors(options);
-  const names = options.tools ?? [...DEFAULT_TOOLS, ...(options.searchSite ? ["search_site"] : [])];
-  await Promise.all(names.map(async (name) => {
-    if (!TOOLS[name]) return result.failed.push({ name, error: "unknown tool" });
-    if (name === "search_site" && !options.searchSite) {
-      return result.failed.push({ name, error: "search_site needs options.searchSite" });
-    }
-    try {
-      // Never assign onto `mc`: some agent browsers expose a frozen object (webmcp#293).
-      await mc.registerTool({ ...TOOLS[name], execute: guard(run[name]) }, { signal: controller.signal });
-      result.registered.push(name);
-    } catch (e) {
-      result.failed.push({ name, error: String(e?.message ?? e) });
-    }
-  }));
-  result.registered.sort();
-  return result;
-}
-
-export { TOOLS };
+// webmcpx: the standard WebMCP tools, your own tools and <form toolname>, in one package.
+export { readPage, register, TOOLS } from "./loader.js";
+export { forms, schema, tool } from "./tool.js";