mountly-mcp 4.0.0 → 4.0.1

package/README.md

@@ -23,6 +23,11 @@ npx mountly-mcp create my-app --framework react
 cd my-app && pnpm install && pnpm dev
 ```
 
+`--framework` takes `react`, `vue`, `svelte`, or `vanilla`. Vanilla pulls in no
+framework and no adapter: a View is just `mount` / `update` / `unmount`, so
+`publishMcpView` takes the object directly and the bridge drives it the same
+way it drives the others.
+
 ## Build with Agent Skills
 
 | Skill | Try it |

package/dist/create.d.ts

@@ -1,4 +1,4 @@
-declare const SUPPORTED: readonly ["react", "vue", "svelte"];
+declare const SUPPORTED: readonly ["react", "vue", "svelte", "vanilla"];
 type Framework = (typeof SUPPORTED)[number];
 export interface CreateArgs {
     name: string;

package/dist/create.js

@@ -14,7 +14,12 @@ import { fileURLToPath } from "url";
 var __dirname = dirname(fileURLToPath(import.meta.url));
 var PACKAGE_ROOT = resolve(__dirname, "..");
 var TEMPLATES = resolve(PACKAGE_ROOT, "templates");
-var SUPPORTED = ["react", "vue", "svelte"];
+function ownVersion() {
+  const pkg = JSON.parse(readFileSync(join(PACKAGE_ROOT, "package.json"), "utf8"));
+  if (!pkg.version) throw new Error("mountly-mcp: cannot read own version from package.json");
+  return pkg.version;
+}
+var SUPPORTED = ["react", "vue", "svelte", "vanilla"];
 function parseCreateArgs(argv) {
   const name = argv[0];
   if (!name || name.startsWith("-")) {
@@ -82,7 +87,8 @@ async function createProject(args) {
     name: args.name,
     slug,
     uri: `ui://${slug}/dashboard`,
-    framework: args.framework
+    framework: args.framework,
+    mcpVersion: ownVersion()
   });
   process.stdout.write(
     [

package/dist/create.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/create.ts"],"sourcesContent":["import {\n  cpSync,\n  existsSync,\n  mkdirSync,\n  readFileSync,\n  readdirSync,\n  statSync,\n  unlinkSync,\n  writeFileSync,\n} from \"node:fs\";\nimport { dirname, join, resolve } from \"node:path\";\nimport { fileURLToPath } from \"node:url\";\n\nconst __dirname = dirname(fileURLToPath(import.meta.url));\n/** Package root: dist/cli.js → .. ; src/cli.ts during tests → .. when run via dist. */\nconst PACKAGE_ROOT = resolve(__dirname, \"..\");\nconst TEMPLATES = resolve(PACKAGE_ROOT, \"templates\");\n\nconst SUPPORTED = [\"react\", \"vue\", \"svelte\"] as const;\ntype Framework = (typeof SUPPORTED)[number];\n\nexport interface CreateArgs {\n  name: string;\n  framework: Framework;\n  dir: string;\n}\n\nexport function parseCreateArgs(argv: ReadonlyArray<string>): CreateArgs {\n  const name = argv[0];\n  if (!name || name.startsWith(\"-\")) {\n    throw new Error(\n      \"mountly-mcp create requires a project name. e.g. mountly-mcp create my-app --framework react\",\n    );\n  }\n\n  let framework: Framework = \"react\";\n  let dir = `./${name}`;\n\n  for (let i = 1; i < argv.length; i += 1) {\n    const arg = argv[i];\n    if (arg === \"--framework\" || arg === \"-f\") {\n      const value = argv[++i];\n      if (value === undefined) throw new Error(`mountly-mcp: ${arg} needs a value`);\n      if (!SUPPORTED.includes(value as Framework)) {\n        throw new Error(\n          `mountly-mcp: framework \"${value}\" not supported. Available: ${SUPPORTED.join(\", \")}`,\n        );\n      }\n      framework = value as Framework;\n    } else if (arg === \"--dir\") {\n      const value = argv[++i];\n      if (value === undefined) throw new Error(\"mountly-mcp: --dir needs a value\");\n      dir = value;\n    } else {\n      throw new Error(`mountly-mcp: unknown create option '${arg}'`);\n    }\n  }\n\n  return { name, framework, dir };\n}\n\nfunction slugify(name: string): string {\n  return name\n    .trim()\n    .toLowerCase()\n    .replace(/[^a-z0-9]+/g, \"-\")\n    .replace(/^-+|-+$/g, \"\");\n}\n\nfunction renderTemplates(dir: string, ctx: Record<string, string>): void {\n  for (const entry of readdirSync(dir)) {\n    const full = join(dir, entry);\n    if (statSync(full).isDirectory()) {\n      renderTemplates(full, ctx);\n      continue;\n    }\n    if (!entry.endsWith(\".tmpl\")) continue;\n    let content = readFileSync(full, \"utf8\");\n    for (const [key, value] of Object.entries(ctx)) {\n      content = content.split(`{{${key}}}`).join(value);\n    }\n    writeFileSync(full.replace(/\\.tmpl$/, \"\"), content);\n    unlinkSync(full);\n  }\n}\n\nexport async function createProject(args: CreateArgs): Promise<void> {\n  const target = resolve(args.dir);\n  if (existsSync(target)) {\n    throw new Error(`mountly-mcp: target directory already exists: ${target}`);\n  }\n\n  const tplDir = join(TEMPLATES, args.framework);\n  if (!existsSync(tplDir)) {\n    throw new Error(\n      `mountly-mcp: template for framework \"${args.framework}\" is missing at ${tplDir}`,\n    );\n  }\n\n  mkdirSync(target, { recursive: true });\n  cpSync(tplDir, target, { recursive: true });\n\n  const slug = slugify(args.name) || \"app\";\n  renderTemplates(target, {\n    name: args.name,\n    slug,\n    uri: `ui://${slug}/dashboard`,\n    framework: args.framework,\n  });\n\n  process.stdout.write(\n    [\n      \"\",\n      `✓ Created MCP App ${args.name} (${args.framework}) at ${target}`,\n      \"\",\n      \"Next steps:\",\n      `  cd ${args.dir}`,\n      \"  pnpm install\",\n      \"  pnpm dev          # sandboxed host + live reload\",\n      \"  pnpm verify       # conformance check\",\n      \"\",\n      \"Do not clone the Mountly monorepo for greenfield apps — this scaffold is the canonical path.\",\n      \"\",\n    ].join(\"\\n\"),\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/create.ts"],"sourcesContent":["import {\n  cpSync,\n  existsSync,\n  mkdirSync,\n  readFileSync,\n  readdirSync,\n  statSync,\n  unlinkSync,\n  writeFileSync,\n} from \"node:fs\";\nimport { dirname, join, resolve } from \"node:path\";\nimport { fileURLToPath } from \"node:url\";\n\nconst __dirname = dirname(fileURLToPath(import.meta.url));\n/** Package root: dist/cli.js → .. ; src/cli.ts during tests → .. when run via dist. */\nconst PACKAGE_ROOT = resolve(__dirname, \"..\");\nconst TEMPLATES = resolve(PACKAGE_ROOT, \"templates\");\n\n/**\n * The version of mountly-mcp doing the scaffolding, so the generated\n * package.json pins the API this CLI actually ships.\n *\n * Hardcoding the pin in the templates meant a major release left them behind:\n * `^3.1.0` cannot resolve to 4.0.0, so every scaffolded app installed a\n * package without the exports its own vite.config imported.\n */\nfunction ownVersion(): string {\n  const pkg = JSON.parse(readFileSync(join(PACKAGE_ROOT, \"package.json\"), \"utf8\")) as {\n    version?: string;\n  };\n  if (!pkg.version) throw new Error(\"mountly-mcp: cannot read own version from package.json\");\n  return pkg.version;\n}\n\nconst SUPPORTED = [\"react\", \"vue\", \"svelte\", \"vanilla\"] as const;\ntype Framework = (typeof SUPPORTED)[number];\n\nexport interface CreateArgs {\n  name: string;\n  framework: Framework;\n  dir: string;\n}\n\nexport function parseCreateArgs(argv: ReadonlyArray<string>): CreateArgs {\n  const name = argv[0];\n  if (!name || name.startsWith(\"-\")) {\n    throw new Error(\n      \"mountly-mcp create requires a project name. e.g. mountly-mcp create my-app --framework react\",\n    );\n  }\n\n  let framework: Framework = \"react\";\n  let dir = `./${name}`;\n\n  for (let i = 1; i < argv.length; i += 1) {\n    const arg = argv[i];\n    if (arg === \"--framework\" || arg === \"-f\") {\n      const value = argv[++i];\n      if (value === undefined) throw new Error(`mountly-mcp: ${arg} needs a value`);\n      if (!SUPPORTED.includes(value as Framework)) {\n        throw new Error(\n          `mountly-mcp: framework \"${value}\" not supported. Available: ${SUPPORTED.join(\", \")}`,\n        );\n      }\n      framework = value as Framework;\n    } else if (arg === \"--dir\") {\n      const value = argv[++i];\n      if (value === undefined) throw new Error(\"mountly-mcp: --dir needs a value\");\n      dir = value;\n    } else {\n      throw new Error(`mountly-mcp: unknown create option '${arg}'`);\n    }\n  }\n\n  return { name, framework, dir };\n}\n\nfunction slugify(name: string): string {\n  return name\n    .trim()\n    .toLowerCase()\n    .replace(/[^a-z0-9]+/g, \"-\")\n    .replace(/^-+|-+$/g, \"\");\n}\n\nfunction renderTemplates(dir: string, ctx: Record<string, string>): void {\n  for (const entry of readdirSync(dir)) {\n    const full = join(dir, entry);\n    if (statSync(full).isDirectory()) {\n      renderTemplates(full, ctx);\n      continue;\n    }\n    if (!entry.endsWith(\".tmpl\")) continue;\n    let content = readFileSync(full, \"utf8\");\n    for (const [key, value] of Object.entries(ctx)) {\n      content = content.split(`{{${key}}}`).join(value);\n    }\n    writeFileSync(full.replace(/\\.tmpl$/, \"\"), content);\n    unlinkSync(full);\n  }\n}\n\nexport async function createProject(args: CreateArgs): Promise<void> {\n  const target = resolve(args.dir);\n  if (existsSync(target)) {\n    throw new Error(`mountly-mcp: target directory already exists: ${target}`);\n  }\n\n  const tplDir = join(TEMPLATES, args.framework);\n  if (!existsSync(tplDir)) {\n    throw new Error(\n      `mountly-mcp: template for framework \"${args.framework}\" is missing at ${tplDir}`,\n    );\n  }\n\n  mkdirSync(target, { recursive: true });\n  cpSync(tplDir, target, { recursive: true });\n\n  const slug = slugify(args.name) || \"app\";\n  renderTemplates(target, {\n    name: args.name,\n    slug,\n    uri: `ui://${slug}/dashboard`,\n    framework: args.framework,\n    mcpVersion: ownVersion(),\n  });\n\n  process.stdout.write(\n    [\n      \"\",\n      `✓ Created MCP App ${args.name} (${args.framework}) at ${target}`,\n      \"\",\n      \"Next steps:\",\n      `  cd ${args.dir}`,\n      \"  pnpm install\",\n      \"  pnpm dev          # sandboxed host + live reload\",\n      \"  pnpm verify       # conformance check\",\n      \"\",\n      \"Do not clone the Mountly monorepo for greenfield apps — this scaffold is the canonical path.\",\n      \"\",\n    ].join(\"\\n\"),\n  );\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mountly-mcp",
-  "version": "4.0.0",
+  "version": "4.0.1",
   "description": "Build MCP Apps (SEP-1865) views from React, Vue or Svelte components — new or existing. One build emits the ui:// resource, its sidecar, and the MCP server wiring.",
   "keywords": [
     "chatgpt",
@@ -107,8 +107,8 @@
   "dependencies": {
     "@modelcontextprotocol/ext-apps": "^1.7.5",
     "@modelcontextprotocol/sdk": "^1.30.0",
-    "mountly": "^0.4.0",
-    "mountly-react": "^2.0.2",
+    "mountly": "^0.5.0",
+    "mountly-react": "^2.0.3",
     "zod": "^4.4.3"
   },
   "devDependencies": {
@@ -125,16 +125,16 @@
     "tsup": "^8.5.1",
     "typescript": "^7.0.2",
     "vite": "^8.1.5",
-    "mountly-svelte": "^2.0.3",
-    "mountly-vue": "^2.0.3"
+    "mountly-svelte": "^2.0.4",
+    "mountly-vue": "^2.0.4"
   },
   "peerDependencies": {
     "@json-render/core": "^0.20.0",
     "@json-render/react": "^0.20.0",
     "ai": "^7.0.65",
     "axe-core": ">=4.10.0",
-    "mountly-svelte": "^2.0.3",
-    "mountly-vue": "^2.0.3",
+    "mountly-svelte": "^2.0.4",
+    "mountly-vue": "^2.0.4",
     "playwright": ">=1.62.1",
     "react": "^19",
     "react-dom": "^19",

package/templates/react/package.json.tmpl

@@ -12,7 +12,7 @@
   },
   "dependencies": {
     "@modelcontextprotocol/sdk": "^1.30.0",
-    "mountly-mcp": "^3.1.0",
+    "mountly-mcp": "^{{mcpVersion}}",
     "react": "^19.2.8",
     "react-dom": "^19.2.8",
     "zod": "^4.4.3"

package/templates/svelte/package.json.tmpl

@@ -12,7 +12,7 @@
   },
   "dependencies": {
     "@modelcontextprotocol/sdk": "^1.30.0",
-    "mountly-mcp": "^3.1.0",
+    "mountly-mcp": "^{{mcpVersion}}",
     "mountly-svelte": "^2.0.3",
     "svelte": "^5.56.9",
     "zod": "^4.4.3"

package/templates/vanilla/.gitignore.tmpl

@@ -0,0 +1,4 @@
+node_modules
+dist
+.DS_Store
+*.log

package/templates/vanilla/README.md.tmpl

@@ -0,0 +1,20 @@
+# {{name}}
+
+MCP App scaffolded with `mountly-mcp create`.
+
+```bash
+pnpm install
+pnpm dev      # sandboxed host on :5179
+pnpm verify   # conformance
+```
+
+- View: `src/view.ts` (`publishMcpView`)
+- Server: `server.mjs` (`registerMcpApps`)
+- Fixtures: `mcp.fixtures.json` (tool args when using `--server`)
+
+No framework, no adapter: a View is just `mount` / `update` / `unmount`, so
+`publishMcpView` takes the object directly. The bridge drives it exactly as it
+drives a React, Vue or Svelte View. Add a framework later by swapping
+`publishMcpView(...)` for that framework's `createMcpView(Component)`.
+
+Do not clone the Mountly monorepo for greenfield apps — this project is the canonical path.

package/templates/vanilla/mcp.fixtures.json.tmpl

@@ -0,0 +1,4 @@
+{
+  "server-usage": { "topic": "server usage" },
+  "billing": { "topic": "billing" }
+}

package/templates/vanilla/package.json.tmpl

@@ -0,0 +1,22 @@
+{
+  "name": "{{name}}",
+  "version": "0.0.1",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "build": "vite build",
+    "dev": "mountly-mcp dev --server ./server.mjs",
+    "verify": "mountly-mcp verify",
+    "verify:strict": "mountly-mcp verify --strict",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@modelcontextprotocol/sdk": "^1.30.0",
+    "mountly-mcp": "^{{mcpVersion}}",
+    "zod": "^4.4.3"
+  },
+  "devDependencies": {
+    "typescript": "^5.9.0",
+    "vite": "^8.2.1"
+  }
+}

package/templates/vanilla/server.mjs.tmpl

@@ -0,0 +1,70 @@
+import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
+import { readMcpAppManifest } from "mountly-mcp/artifact";
+import { registerMcpApps } from "mountly-mcp/server";
+import { z } from "zod";
+
+const URI = "{{uri}}";
+
+function sampleCards() {
+  return [
+    { label: "Requests", value: Math.floor(1200 + Math.random() * 200) },
+    { label: "Latency", value: `${Math.floor(30 + Math.random() * 20)} ms` },
+    { label: "Uptime", value: "99.9%" },
+  ];
+}
+
+/** Default export for `mountly-mcp dev --server ./server.mjs`. */
+export default async function createServer() {
+  const server = new McpServer(
+    { name: "{{slug}}", version: "0.0.1" },
+    { capabilities: { tools: {}, resources: {} } },
+  );
+
+  const { artifacts } = await readMcpAppManifest("dist/mountly-mcp.manifest.json");
+
+  await registerMcpApps(server, {
+    views: artifacts.map((artifact) => ({ artifact })),
+    tools: [
+      {
+        name: "showDashboard",
+        resourceUri: URI,
+        config: {
+          description: "Show an interactive metrics dashboard",
+          inputSchema: {
+            topic: z.string().describe("Dashboard topic"),
+          },
+        },
+        handler: async ({ topic }) => ({
+          structuredContent: {
+            topic,
+            cards: [
+              { label: "Requests", value: 1284 },
+              { label: "Latency", value: "42 ms" },
+              { label: "Uptime", value: "99.9%" },
+            ],
+          },
+        }),
+      },
+      {
+        name: "refreshDashboard",
+        resourceUri: URI,
+        visibility: ["app"],
+        config: {
+          description: "Refresh dashboard metrics (app-only)",
+          inputSchema: {
+            reason: z.string().optional(),
+          },
+        },
+        handler: async ({ reason }) => ({
+          structuredContent: {
+            refreshedAt: new Date().toISOString(),
+            cards: sampleCards(),
+            reason: reason ?? null,
+          },
+        }),
+      },
+    ],
+  });
+
+  return server;
+}

package/templates/vanilla/src/view.ts.tmpl

@@ -0,0 +1,177 @@
+import { publishMcpView, type McpViewProps } from "mountly-mcp";
+
+/**
+ * No framework, no adapter. A View is just `mount` / `update` / `unmount`, so
+ * `publishMcpView` takes this object directly — the bridge drives it exactly
+ * as it drives a React, Vue or Svelte View.
+ */
+
+interface DashboardCard {
+  label: string;
+  value: string | number;
+}
+
+interface DashboardData {
+  topic?: string;
+  refreshedAt?: string;
+  cards?: DashboardCard[];
+}
+
+interface DashboardResult {
+  structuredContent?: DashboardData;
+}
+
+const STYLES = `
+:host, :root { color-scheme: light dark; }
+.card {
+  font-family: system-ui, -apple-system, sans-serif;
+  border: 1px solid var(--color-border-primary, #e5e5e5);
+  border-radius: 12px;
+  padding: 20px;
+  background: var(--color-background-secondary, #fafafa);
+  color: var(--color-text-primary, #171717);
+}
+.eyebrow {
+  margin: 0 0 8px;
+  color: var(--color-text-secondary, #737373);
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: .1em;
+}
+h1 { margin: 0 0 16px; font-size: 20px; font-weight: 600; }
+.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 16px; }
+.metric {
+  border: 1px solid var(--color-border-primary, #e5e5e5);
+  border-radius: 8px;
+  padding: 12px;
+  background: var(--color-background-primary, #fff);
+}
+.label {
+  color: var(--color-text-secondary, #737373);
+  font-size: 11px;
+  text-transform: uppercase;
+}
+.value { margin-top: 4px; font-size: 22px; font-weight: 600; }
+.row { display: flex; align-items: center; gap: 10px; }
+button {
+  border: 1px solid var(--color-border-primary, #e5e5e5);
+  border-radius: 8px;
+  padding: 8px 14px;
+  background: var(--color-background-primary, #fff);
+  color: inherit;
+  cursor: pointer;
+  font: inherit;
+  font-size: 13px;
+}
+button:disabled { opacity: .6; cursor: wait; }
+.status { font-size: 12px; color: var(--color-text-secondary, #737373); }
+`;
+
+/** Per-container state, so several instances on one page stay independent. */
+const instances = new WeakMap<Element, { data?: DashboardData; status: string; busy: boolean }>();
+
+function el(tag: string, className?: string, text?: string): HTMLElement {
+  const node = document.createElement(tag);
+  if (className) node.className = className;
+  // textContent, never innerHTML: tool results are data, not markup.
+  if (text !== undefined) node.textContent = text;
+  return node;
+}
+
+function render(container: Element, props: McpViewProps): void {
+  const state = instances.get(container);
+  if (!state) return;
+
+  const data = state.data;
+  const cards = data?.cards ?? [];
+
+  container.replaceChildren();
+
+  const style = document.createElement("style");
+  style.textContent = STYLES;
+
+  const card = el("div", "card");
+  card.append(el("p", "eyebrow", "MCP App · Mountly"));
+  card.append(el("h1", undefined, data?.topic ? `${data.topic} Dashboard` : "Dashboard"));
+
+  const grid = el("div", "grid");
+  const shown: DashboardCard[] = cards.length > 0 ? cards : [
+    { label: "—", value: "—" },
+    { label: "—", value: "—" },
+    { label: "—", value: "—" },
+  ];
+  for (const c of shown) {
+    const metric = el("div", "metric");
+    metric.append(el("div", "label", c.label));
+    metric.append(el("div", "value", String(c.value)));
+    grid.append(metric);
+  }
+  card.append(grid);
+
+  const row = el("div", "row");
+  const button = el("button") as HTMLButtonElement;
+  button.type = "button";
+  button.textContent = "Refresh data";
+  button.disabled = state.busy;
+  button.addEventListener("click", () => void refresh(container, props));
+  const status = el("span", "status", state.status);
+  row.append(button, status);
+  card.append(row);
+
+  container.append(style, card);
+}
+
+async function refresh(container: Element, props: McpViewProps): Promise<void> {
+  const state = instances.get(container);
+  if (!state || state.busy) return;
+  state.busy = true;
+  state.status = "Refreshing…";
+  render(container, props);
+
+  try {
+    const next = (await props.mcp.callServerTool({
+      name: "refreshDashboard",
+      arguments: { reason: "User clicked refresh" },
+    })) as DashboardResult;
+    const content = next.structuredContent;
+    if (content) {
+      state.data = { ...state.data, ...content, topic: content.topic ?? state.data?.topic };
+    }
+    state.status = content?.refreshedAt
+      ? `Refreshed ${new Date(content.refreshedAt).toLocaleTimeString()}`
+      : "Refreshed.";
+  } catch (error) {
+    state.status = error instanceof Error ? error.message : "Refresh failed.";
+  } finally {
+    state.busy = false;
+    render(container, props);
+  }
+}
+
+publishMcpView({
+  mount(container, props) {
+    const typed = props as McpViewProps;
+    instances.set(container, {
+      data: (typed.toolResult as DashboardResult | undefined)?.structuredContent,
+      status: "Connected.",
+      busy: false,
+    });
+    render(container, typed);
+  },
+
+  // The bridge calls this on every new tool-result or host-context change.
+  // Updating in place keeps focus and scroll, which a remount would lose.
+  update(container, props) {
+    const typed = props as McpViewProps;
+    const state = instances.get(container);
+    if (!state) return;
+    const incoming = (typed.toolResult as DashboardResult | undefined)?.structuredContent;
+    if (incoming) state.data = incoming;
+    render(container, typed);
+  },
+
+  unmount(container) {
+    instances.delete(container);
+    container.replaceChildren();
+  },
+});

package/templates/vanilla/tsconfig.json.tmpl

@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "strict": true,
+    "skipLibCheck": true,
+    "noEmit": true,
+    "isolatedModules": true,
+    "resolveJsonModule": true
+  },
+  "include": ["src/**/*.ts"]
+}

package/templates/vanilla/vite.config.ts.tmpl

@@ -0,0 +1,20 @@
+import { defineConfig } from "vite";
+import { mountlyMcpViews } from "mountly-mcp/vite";
+
+export default defineConfig({
+  plugins: [
+    mountlyMcpViews({
+      apps: [
+        {
+          entry: "src/view.ts",
+          uri: "{{uri}}",
+          name: "dashboard",
+          description: "Interactive metrics dashboard",
+          displayModes: ["inline", "fullscreen"],
+          prefersBorder: true,
+          awaitToolResult: true,
+        },
+      ],
+    }),
+  ],
+});

package/templates/vue/package.json.tmpl

@@ -12,7 +12,7 @@
   },
   "dependencies": {
     "@modelcontextprotocol/sdk": "^1.30.0",
-    "mountly-mcp": "^3.1.0",
+    "mountly-mcp": "^{{mcpVersion}}",
     "mountly-vue": "^2.0.3",
     "vue": "^3.5.41",
     "zod": "^4.4.3"