mountly-mcp 4.0.1 → 4.1.0

package/GLOSSARY.md

@@ -0,0 +1,37 @@
+# Mountly MCP glossary
+
+Public vocabulary for `mountly-mcp`. Skills, templates, CLI help, README, and
+docs must use these names.
+
+| Term                     | Meaning                                                                                      |
+| ------------------------ | -------------------------------------------------------------------------------------------- |
+| **App**                  | MCP server plus its Views (SEP-1865 product).                                                |
+| **View**                 | Iframe UI for a tool result (`ui://` resource).                                              |
+| **`ui://`**              | Required scheme for View resource URIs.                                                      |
+| **`createMcpView`**      | Wrap a React / Vue / Svelte component (`mountly-mcp/react` etc.). Vanilla: `publishMcpView`. |
+| **`mountlyMcpViews`**    | Vite plugin. Emits View HTML and `dist/mountly-mcp.manifest.json`.                           |
+| **`registerMcpApps`**    | Install Views and UI-linked tools on an unconnected `McpServer`.                             |
+| **`readMcpAppManifest`** | Load `dist/mountly-mcp.manifest.json` from `mountly-mcp/artifact`.                           |
+| **`mcp.fixtures.json`**  | Named samples for `mountly-mcp dev` (tool args with `--server`, else `structuredContent`).   |
+| **`create`**             | `mountly-mcp create`: scaffold a greenfield App.                                             |
+| **`add`**                | `mountly-mcp add`: add a second View to an existing Mountly Vite project.                    |
+| **`build`**              | `mountly-mcp build`: build Views via Vite.                                                   |
+| **`dev`**                | `mountly-mcp dev`: local sandboxed AppBridge host with live reload.                          |
+| **`verify`**             | `mountly-mcp verify`: conformance (`--strict`, `--render`).                                  |
+| **`doctor`**             | `mountly-mcp doctor`: check Node, Vite plugin, Playwright, peer floors.                      |
+
+## Do not put in MCP docs / skills / templates
+
+- Islands vocabulary, HTML island attributes, microfrontends
+- Cloning `jagreehal/mountly` or `modelcontextprotocol/ext-apps` for greenfield Views
+- Hand-writing View HTML or postMessage for Views
+- Calling Mountly the "default view layer" until hosts recommend it
+
+## Happy path
+
+```bash
+npx mountly-mcp create my-app --framework react   # react | vue | svelte | vanilla
+cd my-app && pnpm install && pnpm dev
+pnpm verify
+pnpm verify --strict --render   # CI
+```

package/README.md

@@ -1,12 +1,16 @@
 # mountly-mcp
 
-**Build MCP Apps from React, Vue, or Svelte components — new or existing.**
+Build MCP Apps Views from React, Vue, or Svelte. New apps or components you
+already ship.
 
-[MCP Apps](https://github.com/modelcontextprotocol/ext-apps) (SEP-1865) lets an
-MCP server render interactive UI inside Claude, ChatGPT and other hosts. The
-official SDK gives you the protocol. `mountly-mcp` is the view layer on top:
-write a component, get a `ui://` resource, a local host, and server registration
-without hand-writing the handshake HTML.
+[MCP Apps](https://github.com/modelcontextprotocol/ext-apps) (SEP-1865) is the
+protocol. Official packages speak the wire. `mountly-mcp` is the View kit:
+component → `ui://` resource → local host → `registerMcpApps` on your server.
+
+```bash
+npx mountly-mcp create my-app --framework react
+cd my-app && pnpm install && pnpm dev
+```
 
 ```ts
 import { createMcpView } from "mountly-mcp/react";
@@ -15,81 +19,69 @@ import Dashboard from "./Dashboard";
 createMcpView(Dashboard);
 ```
 
-That path is the default whether the dashboard is three metric cards for one
-host or a multi-View production server. Prefer the scaffolder for greenfield:
+`--framework`: `react` | `vue` | `svelte` | `vanilla`. Vanilla calls
+`publishMcpView` with `mount` / `update` / `unmount`. No framework runtime.
 
-```bash
-npx mountly-mcp create my-app --framework react
-cd my-app && pnpm install && pnpm dev
-```
+## vs ext-apps
+
+| Need                                                    | Package                          |
+| ------------------------------------------------------- | -------------------------------- |
+| Host / bridge protocol                                  | `@modelcontextprotocol/ext-apps` |
+| Component → View → `dev` → `verify` → `registerMcpApps` | `mountly-mcp`                    |
 
-`--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.
+Details: [Mountly vs ext-apps](https://mountly.dev/mcp-apps/vs-ext-apps/).
 
-## Build with Agent Skills
+## Agent Skills
 
-| Skill | Try it |
-| --- | --- |
-| [`create-mcp-app`](../../plugins/mountly-mcp/skills/create-mcp-app/SKILL.md) | _"Create an MCP App"_ |
-| [`add-app-to-server`](../../plugins/mountly-mcp/skills/add-app-to-server/SKILL.md) | _"Add UI to my MCP server"_ |
-| [`convert-web-app`](../../plugins/mountly-mcp/skills/convert-web-app/SKILL.md) | _"Turn my component into an MCP App"_ |
-| [`migrate-ext-apps`](../../plugins/mountly-mcp/skills/migrate-ext-apps/SKILL.md) | _"Migrate from ext-apps"_ |
+| Skill                                                                              | Ask for                             |
+| ---------------------------------------------------------------------------------- | ----------------------------------- |
+| [`create-mcp-app`](../../plugins/mountly-mcp/skills/create-mcp-app/SKILL.md)       | "Create an MCP App"                 |
+| [`add-app-to-server`](../../plugins/mountly-mcp/skills/add-app-to-server/SKILL.md) | "Add UI to my MCP server"           |
+| [`convert-web-app`](../../plugins/mountly-mcp/skills/convert-web-app/SKILL.md)     | "Turn my component into an MCP App" |
+| [`migrate-ext-apps`](../../plugins/mountly-mcp/skills/migrate-ext-apps/SKILL.md)   | "Migrate from ext-apps"             |
 
 ```
 /plugin marketplace add jagreehal/mountly
 /plugin install mountly-mcp@mountly
 ```
 
-Docs: [Agent Skills](https://mountly.dev/mcp-apps/agent-skills/).
-`mountly-mcp build` emits a versioned App manifest; `registerMcpApps` installs
-the Views into the MCP server you already own. Existing website components stay
-reusable as-is.
-
-The wire protocol is delegated to the official `@modelcontextprotocol/sdk` and
-`@modelcontextprotocol/ext-apps` packages in full, so server transports,
-handshakes, capabilities and message types track the spec rather than a
-reimplementation of it. Both are runtime dependencies of `mountly-mcp`.
+Or `npx skills add jagreehal/mountly`. Docs: [Agent Skills](https://mountly.dev/mcp-apps/agent-skills/).
 
 ## Install
 
 ```bash
-# React (default) — mountly + mountly-react included
+# React (default). mountly + mountly-react are included.
 npm install mountly-mcp react react-dom
 
 # Vue / Svelte
 npm install mountly-mcp mountly-vue vue   # or mountly-svelte + svelte
 ```
 
-Install `@modelcontextprotocol/sdk` directly only when your application imports
-its APIs itself, for example to configure a custom HTTP transport. Mountly's
-server entry point does not require a separate SDK install.
+Add `@modelcontextprotocol/sdk` when you import `McpServer`.
+
+Peers: Node 20+ (22 preferred), React 18 or 19. Scaffolds pin Vite 8.
+`npx mountly-mcp doctor` checks a project.
 
-## One build, one command
+## Build
 
 ```ts
 // vite.config.ts
-import vue from "@vitejs/plugin-vue";
+import { defineConfig } from "vite";
+import react from "@vitejs/plugin-react";
 import { mountlyMcpViews } from "mountly-mcp/vite";
 
 export default defineConfig({
   plugins: [
-    vue(),
+    react(),
     mountlyMcpViews({
       apps: [
         {
-          entry: "src/dashboard.ts",
+          entry: "src/view.tsx",
           uri: "ui://weather-server/dashboard",
           name: "weather_dashboard",
           displayModes: ["inline", "fullscreen"],
           csp: { connectDomains: ["https://api.weather.com"] },
         },
-        {
-          entry: "src/settings.ts",
-          uri: "ui://weather-server/settings",
-          name: "weather_settings",
-        },
       ],
     }),
   ],
@@ -100,38 +92,19 @@ export default defineConfig({
 npx mountly-mcp build
 ```
 
-Each View is built in an isolated Vite environment and emitted as self-contained
-HTML with a transitional `.meta.json` file. The canonical
-`dist/mountly-mcp.manifest.json` gives build, dev, registration, and CI one
-versioned artifact contract. The original single-View plugin shape and
-`vite build` remain supported.
+Writes HTML and `dist/mountly-mcp.manifest.json`.
 
-## One command to develop it
+## Develop
 
 ```bash
-npx mountly-mcp dev
-# multi-View project
-npx mountly-mcp dev --app weather_dashboard
+npx mountly-mcp dev --server ./server.mjs
+npx mountly-mcp dev --app weather_dashboard --server ./server.mjs
 ```
 
-Builds the View, serves it in a local MCP Apps host, and rebuilds on save.
-Config comes from the plugin already in your vite config.
+Real AppBridge host plus sandbox CSP. Tool arguments come from
+`mcp.fixtures.json`.
 
-It's a real host, not a preview: the published official `AppBridge` drives the
-handshake and host behavior, while Mountly supplies two origins and a sandbox
-proxy enforcing the CSP and permissions the App artifact declares. Sample tool
-results come from `mcp.fixtures.json`,
-one button each, so clicking between them exercises the update path:
-
-```json
-{ "annual": { "total": 99 }, "monthly": { "total": 12 } }
-```
-
-Add `--server ./server.js` (a module default-exporting your server) and the
-fixtures become tool _arguments_ instead: the view renders what your handler
-really returns, and the tool calls the view makes itself are routed there too.
-
-## Install into your production server
+## Production server
 
 ```ts
 import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
@@ -153,152 +126,57 @@ await registerMcpApps(server, {
       config: {
         inputSchema: { type: "object", properties: { location: { type: "string" } } },
       },
-      handler: async ({ location }) => ({ structuredContent: { location, temperature: 72 } }),
+      handler: async ({ location }) => ({
+        structuredContent: { location, temperature: 72 },
+      }),
     },
   ],
 });
+// connect with YOUR transport after this
 ```
 
-Call `registerMcpApps` before connecting the server. Your application retains
-ownership of authentication, transport, prompts, non-UI tools, lifecycle, and
-deployment. Views and tools are independent, so several tools can link to one
-View and app-only tools use `visibility: "app"`. Mountly negotiates the UI
-extension and degrades to text-only model tools for hosts without MCP Apps.
-
-`createMcpAppServer` and `serveStdio` remain as convenience adapters for small
-servers and existing projects.
+Call `registerMcpApps` before `connect`. You keep auth, transport, and deploy.
 
-## Verify in CI
+## Verify
 
 ```bash
+npx mountly-mcp doctor
 npx mountly-mcp verify
-npx mountly-mcp verify --strict
-npx mountly-mcp verify --render --strict
+npx mountly-mcp verify --strict --render
 ```
 
-Static verification is deterministic and offline. `--render` additionally
-launches Chromium, waits for the explicit bridge mount state, and rejects Views
-that time out, throw, or mount without content. Errors always fail; advisory
-warnings fail only under `--strict`. The same engine is exported as
-`verifyMcpApps()` from `mountly-mcp/testing` for custom test runners. Install
-Playwright and Chromium for the browser tier.
-
-## Reading tool data in a view
-
-The bridge exposes `mcp`, `toolInput`, `toolResult`, and `hostContext`. React
-and Vue consume those bridge props in their wrapper and expose them through
-hooks/composables, leaving the existing component's props unchanged. Svelte
-receives them directly as component props:
-
-```tsx
-// React
-const result = useToolResult<{ structuredContent?: Quote }>();
-const quote = result?.structuredContent;
-useHostStyles(); // adopt the host's theme variables and fonts
-```
-
-```ts
-// Vue
-const result = useToolResult<{ structuredContent?: Quote }>(); // a ref
-const quote = computed(() => result.value?.structuredContent);
-```
-
-Svelte reads the props directly via `$props()` — see `mountly-mcp/svelte`.
-
-## json-render MCP Apps integration
-
-Mountly now exposes a first-class json-render MCP facade so catalog-driven UIs
-can be shipped as MCP Apps with minimal protocol code:
-
-```ts
-import { createJsonRenderMcpApp } from "mountly-mcp/json-render/mcp";
-import { catalog } from "./catalog.js";
-import { html } from "./dist/app-html.js";
-
-const app = createJsonRenderMcpApp({
-  name: "json-render-dashboard",
-  version: "1.0.0",
-  catalog,
-  html,
-  tool: {
-    name: "render_ui",
-    title: "Render UI",
-    description: "Render an interactive dashboard from a json-render spec.",
-    resourceUri: "ui://json-render-dashboard/view.html",
-  },
-});
-```
-
-For iframe-side React hosts, use `mountly-mcp/json-render/app`:
-
-```tsx
-import { useJsonRenderApp } from "mountly-mcp/json-render/app";
+## Second View
 
-function View() {
-  const { spec, loading, connected, error } = useJsonRenderApp({
-    name: "json-render-dashboard",
-    version: "1.0.0",
-  });
-
-  if (error) return <div>{error.message}</div>;
-  if (!connected || loading || !spec) return <div>Waiting…</div>;
-  return <pre>{JSON.stringify(spec, null, 2)}</pre>;
-}
+```bash
+npx mountly-mcp add settings --framework react
 ```
 
-`buildAppHtml({ title, js, css })` is also exported from
-`mountly-mcp/json-render/app` to generate a self-contained HTML resource.
+## Glossary
 
-### Interoperability with `@json-render/mcp`
+[GLOSSARY.md](./GLOSSARY.md). Protocol: [`@modelcontextprotocol/ext-apps`](https://www.npmjs.com/package/@modelcontextprotocol/ext-apps).
 
-Mountly's facade is wire-compatible with [`@json-render/mcp`](https://www.npmjs.com/package/@json-render/mcp) in both
-directions, so you can mix the two without a bridge:
+## Advanced: json-render
 
-- **Tool input** is `{ spec }`, typed from `catalog.zodSchema()`, and the tool
-  description carries `catalog.prompt()` — the model sees the full component
-  vocabulary.
-- **Tool output** carries the spec twice: as JSON in `content[0].text` (the
-  shape `@json-render/mcp`'s iframe hook reads) and as `structuredContent.spec`
-  (what Mountly's own hosts read).
-- **`useJsonRenderApp`** reads either shape, so an iframe built with Mountly
-  renders a `@json-render/mcp` server unchanged, and vice versa.
-
-One deliberate difference: `@json-render/core` 0.19 generates a _strict_ catalog
-schema that requires `visible` and `children` on every element, which rejects
-most first-attempt model output at the SDK's input gate. Mountly accepts the
-catalog schema **or** a looser spec shape, then validates in the handler and
-renders what it can. Drop the loose branch once core relaxes those fields.
+`mountly-mcp/json-render` is optional catalog-driven UI. Start with `create` /
+`createMcpView`. Docs: [Generative UI](https://mountly.dev/concepts/generative-ui/).
 
 ## Exports
 
-| Entry                  | What's in it                                             |
-| ---------------------- | -------------------------------------------------------- |
-| `mountly-mcp`          | `runBridge`, spec types re-exported from ext-apps        |
-| `mountly-mcp/react`    | `createMcpView` + hooks                                |
-| `mountly-mcp/vue`      | `createMcpView` + composables                          |
-| `mountly-mcp/svelte`   | `createMcpView` (props-based)                          |
-| `mountly-mcp/vite`     | single- and multi-View `mountlyMcpViews()` build plugin |
-| `mountly-mcp/artifact` | versioned manifest and App artifact APIs                 |
-| `mountly-mcp/dev`      | `startDevHost()` and in-process server connectivity      |
-| `mountly-mcp/build`    | `buildMcpResource` for other bundlers                    |
-| `mountly-mcp/server`   | `registerMcpApps` plus convenience server adapters       |
-| `mountly-mcp/testing`  | static/browser conformance and report formatting         |
-
-Types use the spec's own names (`McpUiHostContext`, `McpUiDisplayMode`, …) —
-one vocabulary, no translation layer.
-
-## Agent Skills
-
-Install the plugin skills and ask your coding agent to create an MCP App:
-[Agent Skills docs](https://mountly.dev/mcp-apps/agent-skills/) ·
-[`create-mcp-app`](../../plugins/mountly-mcp/skills/create-mcp-app/SKILL.md).
-
-Greenfield without an agent: `npx mountly-mcp create my-app --framework react`.
+| Entry                     | Contents                             |
+| ------------------------- | ------------------------------------ |
+| `mountly-mcp`             | `runBridge`, `publishMcpView`, types |
+| `mountly-mcp/react`       | `createMcpView` + hooks              |
+| `mountly-mcp/vue`         | `createMcpView` + composables        |
+| `mountly-mcp/svelte`      | `createMcpView` (props)              |
+| `mountly-mcp/vite`        | `mountlyMcpViews()`                  |
+| `mountly-mcp/artifact`    | Manifest APIs                        |
+| `mountly-mcp/server`      | `registerMcpApps`                    |
+| `mountly-mcp/dev`         | Local host helpers                   |
+| `mountly-mcp/testing`     | `verifyMcpApps`                      |
+| `mountly-mcp/json-render` | Generative path                      |
 
 ## See also
 
-- [`docs/examples/mcp-release-readiness`](../../docs/examples/mcp-release-readiness) —
-  production-shaped Vite View (closest to `create`)
-- [`docs/examples/mcp-app-demo`](../../docs/examples/mcp-app-demo) — advanced
-  protocol harness (not the greenfield starter)
-- `docs/how-to-test.md`
+- [`mcp-release-readiness`](../../docs/examples/mcp-release-readiness) — production-shaped Vite View
+- [`mcp-app-demo`](../../docs/examples/mcp-app-demo) — protocol harness
+- [Host matrix](https://mountly.dev/mcp-apps/host-matrix/)

package/dist/add-DAFMA4F3.js

@@ -0,0 +1,263 @@
+import {
+  CLI_ERROR_CODES,
+  cliError
+} from "./chunk-EOWAWZH2.js";
+
+// src/add.ts
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from "fs";
+import { dirname, join, resolve } from "path";
+function parseAddArgs(argv) {
+  const name = argv[0];
+  if (!name || name.startsWith("-")) {
+    throw cliError(
+      CLI_ERROR_CODES.UNKNOWN_OPTION,
+      "mountly-mcp add requires a View name",
+      "Example: mountly-mcp add settings --framework react"
+    );
+  }
+  const args = { name };
+  for (let i = 1; i < argv.length; i += 1) {
+    const arg = argv[i];
+    const next = () => {
+      const value = argv[i + 1];
+      if (value === void 0) {
+        throw cliError(
+          CLI_ERROR_CODES.UNKNOWN_OPTION,
+          `${arg} needs a value`,
+          "See: mountly-mcp --help"
+        );
+      }
+      i += 1;
+      return value;
+    };
+    if (arg === "--entry") args.entry = next();
+    else if (arg === "--uri") args.uri = next();
+    else if (arg === "--framework" || arg === "-f") {
+      const value = next();
+      if (!["react", "vue", "svelte", "vanilla"].includes(value)) {
+        throw cliError(
+          CLI_ERROR_CODES.UNKNOWN_OPTION,
+          `framework "${value}" not supported`,
+          "Use: react | vue | svelte | vanilla"
+        );
+      }
+      args.framework = value;
+    } else if (arg === "--config" || arg === "-c") args.config = next();
+    else {
+      throw cliError(
+        CLI_ERROR_CODES.UNKNOWN_OPTION,
+        `unknown add option '${arg}'`,
+        "Options: --entry --uri --framework --config"
+      );
+    }
+  }
+  return args;
+}
+function detectFramework(cwd) {
+  const pkgPath = join(cwd, "package.json");
+  if (!existsSync(pkgPath)) return "react";
+  const pkg = JSON.parse(readFileSync(pkgPath, "utf8"));
+  const deps = { ...pkg.dependencies, ...pkg.devDependencies };
+  if (deps.vue || deps["mountly-vue"]) return "vue";
+  if (deps.svelte || deps["mountly-svelte"]) return "svelte";
+  if (deps.react) return "react";
+  return "vanilla";
+}
+function findViteConfig(cwd, explicit) {
+  if (explicit) {
+    const path = resolve(cwd, explicit);
+    if (!existsSync(path)) {
+      throw cliError(
+        CLI_ERROR_CODES.NO_VITE_CONFIG,
+        `vite config not found: ${path}`,
+        "Pass --config path/to/vite.config.ts"
+      );
+    }
+    return path;
+  }
+  for (const name of ["vite.config.ts", "vite.config.mts", "vite.config.js", "vite.config.mjs"]) {
+    const path = join(cwd, name);
+    if (existsSync(path)) return path;
+  }
+  throw cliError(
+    CLI_ERROR_CODES.NO_VITE_CONFIG,
+    "no vite.config.* in this directory",
+    "Run from a Mountly MCP project, or: npx mountly-mcp create my-app --framework react"
+  );
+}
+function slugify(name) {
+  return name.trim().toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
+}
+function viewSource(framework, componentName) {
+  if (framework === "react") {
+    return `import { createMcpView, useToolResult } from "mountly-mcp/react";
+
+interface Result {
+  structuredContent?: { title?: string };
+}
+
+function ${componentName}() {
+  const result = useToolResult<Result>();
+  const title = result?.structuredContent?.title ?? "${componentName}";
+  return (
+    <main style={{ fontFamily: "system-ui", padding: 20 }}>
+      <h1>{title}</h1>
+      <p>Edit <code>src/${slugify(componentName)}.tsx</code> \u2014 data comes from useToolResult().</p>
+    </main>
+  );
+}
+
+createMcpView(${componentName});
+`;
+  }
+  if (framework === "vue") {
+    return `import { createMcpView } from "mountly-mcp/vue";
+import ${componentName} from "./${componentName}.vue";
+
+createMcpView(${componentName});
+`;
+  }
+  if (framework === "svelte") {
+    return `import { createMcpView } from "mountly-mcp/svelte";
+import ${componentName} from "./${componentName}.svelte";
+
+createMcpView(${componentName});
+`;
+  }
+  return `import { publishMcpView, type McpViewProps } from "mountly-mcp";
+
+publishMcpView({
+  mount(el, props: McpViewProps) {
+    el.innerHTML = "<main style=\\"font-family:system-ui;padding:20px\\"><h1>${componentName}</h1><pre></pre></main>";
+    const pre = el.querySelector("pre");
+    if (pre) pre.textContent = JSON.stringify(props.toolResult?.structuredContent ?? {}, null, 2);
+  },
+  update(el, props: McpViewProps) {
+    const pre = el.querySelector("pre");
+    if (pre) pre.textContent = JSON.stringify(props.toolResult?.structuredContent ?? {}, null, 2);
+  },
+  unmount(el) {
+    el.innerHTML = "";
+  },
+});
+`;
+}
+function vueComponent(componentName) {
+  return `<script setup lang="ts">
+import { computed } from "vue";
+import { useToolResult } from "mountly-mcp/vue";
+
+const result = useToolResult<{ structuredContent?: { title?: string } }>();
+const title = computed(() => result.value?.structuredContent?.title ?? "${componentName}");
+</script>
+
+<template>
+  <main style="font-family: system-ui; padding: 20px">
+    <h1>{{ title }}</h1>
+    <p>Edit this View \u2014 data comes from useToolResult().</p>
+  </main>
+</template>
+`;
+}
+function svelteComponent(componentName) {
+  return `<script lang="ts">
+  let { toolResult } = $props();
+  const title = $derived(toolResult?.structuredContent?.title ?? "${componentName}");
+</script>
+
+<main style="font-family: system-ui; padding: 20px">
+  <h1>{title}</h1>
+  <p>Edit this View \u2014 toolResult arrives as a prop.</p>
+</main>
+`;
+}
+function addView(args, cwd = process.cwd()) {
+  const framework = args.framework ?? detectFramework(cwd);
+  const configPath = findViteConfig(cwd, args.config);
+  const configSource = readFileSync(configPath, "utf8");
+  if (!/mountlyMcpViews\s*\(/.test(configSource)) {
+    throw cliError(
+      CLI_ERROR_CODES.MISSING_VITE_PLUGIN,
+      `no mountlyMcpViews() in ${configPath}`,
+      `Add mountlyMcpViews({ apps: [...] }) from "mountly-mcp/vite" to ${configPath}`
+    );
+  }
+  const slug = slugify(args.name) || "view";
+  const pascal = slug.split("-").map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
+  const uri = args.uri ?? `ui://app/${slug}`;
+  if (!uri.startsWith("ui://")) {
+    throw cliError(
+      CLI_ERROR_CODES.INVALID_UI_URI,
+      `uri must start with ui:// (received '${uri}')`,
+      "Example: --uri ui://my-server/settings"
+    );
+  }
+  const entry = args.entry ?? `src/${slug}.${framework === "react" ? "tsx" : "ts"}`;
+  const entryPath = resolve(cwd, entry);
+  if (existsSync(entryPath)) {
+    throw cliError(
+      CLI_ERROR_CODES.TARGET_EXISTS,
+      `entry already exists: ${entryPath}`,
+      "Pass a different --entry or remove the file first"
+    );
+  }
+  if (configSource.includes(JSON.stringify(uri)) || configSource.includes(JSON.stringify(slug))) {
+    throw cliError(
+      CLI_ERROR_CODES.TARGET_EXISTS,
+      `${configPath} already declares a View named '${slug}' or uri '${uri}'`,
+      "Pick another name, or pass --uri to use a different resource URI"
+    );
+  }
+  const appBlock = `{
+          entry: ${JSON.stringify(entry)},
+          uri: ${JSON.stringify(uri)},
+          name: ${JSON.stringify(slug)},
+          displayModes: ["inline", "fullscreen"],
+          prefersBorder: true,
+          awaitToolResult: true,
+        }`;
+  let next;
+  if (/apps:\s*\[\s*\]/.test(configSource)) {
+    next = configSource.replace(/apps:\s*\[\s*\]/, `apps: [
+        ${appBlock},
+      ]`);
+  } else if (/apps:\s*\[/.test(configSource)) {
+    next = configSource.replace(/apps:\s*\[/, `apps: [
+        ${appBlock},`);
+  } else {
+    throw cliError(
+      CLI_ERROR_CODES.MISSING_VITE_PLUGIN,
+      `could not find apps: [] in ${configPath}`,
+      "Add an apps array inside mountlyMcpViews({ ... })"
+    );
+  }
+  mkdirSync(dirname(entryPath), { recursive: true });
+  writeFileSync(entryPath, viewSource(framework, pascal));
+  if (framework === "vue") {
+    writeFileSync(join(dirname(entryPath), `${pascal}.vue`), vueComponent(pascal));
+  }
+  if (framework === "svelte") {
+    writeFileSync(join(dirname(entryPath), `${pascal}.svelte`), svelteComponent(pascal));
+  }
+  writeFileSync(configPath, next);
+  process.stdout.write(
+    [
+      "",
+      `\u2713 Added View "${slug}"`,
+      `  entry  ${entry}`,
+      `  uri    ${uri}`,
+      `  config ${configPath}`,
+      "",
+      "Next:",
+      "  pnpm exec mountly-mcp build",
+      `  pnpm exec mountly-mcp dev --app ${slug}`,
+      "  Register a tool with resourceUri matching the uri above via registerMcpApps.",
+      ""
+    ].join("\n")
+  );
+}
+export {
+  addView,
+  parseAddArgs
+};
+//# sourceMappingURL=add-DAFMA4F3.js.map