@diagrammo/dgmo 0.34.0 → 0.36.0

package/.claude/commands/dgmo.md

@@ -18,37 +18,15 @@ If the MCP tools are **not** available, run the setup flow below — do not ask
 which dgmo || npm install -g @diagrammo/dgmo
 ```
 
-### Step 2 — Install the MCP server (if missing)
+### Step 2 — Run the one-step installer
 
 ```bash
-which dgmo-mcp || npm install -g @diagrammo/dgmo-mcp
+dgmo install claude-code
 ```
 
-### Step 3 — Configure the MCP server
+That single command writes this skill, configures the MCP server in `~/.claude/settings.json` (entry: `{ "command": "dgmo", "args": ["mcp"] }`), and ensures the server is available — no prompts, no separate `dgmo-mcp` package to install. (Use `--scope project` to write `.mcp.json` in the current directory instead of the global settings.)
 
-Ask the user:
-
-> "Where should I configure the MCP server?
-> 1) This project only — write `.mcp.json` here [default]
-> 2) Globally — add to `~/.claude/settings.json` (works in all projects)"
-
-**Option 1 (default):** Create or update `.mcp.json` in the current working directory:
-
-```json
-{
-  "mcpServers": {
-    "dgmo": {
-      "command": "dgmo-mcp"
-    }
-  }
-}
-```
-
-If `.mcp.json` already exists and has other servers, merge the `dgmo` entry in — do not overwrite the file.
-
-**Option 2 (global):** Add the `dgmo` entry to the `mcpServers` object in `~/.claude/settings.json`. Read the file first and merge — do not overwrite other keys.
-
-### Step 4 — Prompt restart
+### Step 3 — Prompt restart
 
 Tell the user:
 
@@ -56,7 +34,7 @@ Tell the user:
 
 Then proceed with the user's original request using CLI fallback (see "Other output options" below).
 
-> **Note for future users:** To set up in one step from the terminal before starting a Claude Code session, run `dgmo --install-claude-code-integration`. It handles everything: installs `@diagrammo/dgmo-mcp`, writes the skill, and configures the MCP server.
+> **One-step from a fresh machine:** `dgmo install` with no target auto-detects and sets up every AI assistant you have (Claude Code, Codex, Claude Desktop, Cursor, Windsurf, Copilot) at once.
 
 ## Project Awareness
 
@@ -85,22 +63,33 @@ For **examples** of real diagrams, call `mcp__dgmo__get_examples("<type>")` —
 
 ## Your Workflow
 
-**Primary goal: get the user seeing a visualization as fast as possible.**
+**Primary goal: get the user seeing a visualization as fast as possible — in the desktop app if they have it, otherwise on the web.**
+
+### Where the diagram goes — decide this once per session
+
+Before showing the first diagram, call `mcp__dgmo__check_app_installed()` **once** and remember the answer for the rest of the session. It decides your default visual output:
+
+- **App installed → open the saved file live in the app.** Save the `.dgmo` source first (see "Always save the source"), then `mcp__dgmo__open_in_app({ dgmo, filePath: "<absolute path to the saved file>" })`. The app opens *that file*, so the user edits it in the app and changes autosave back to the same file — one source of truth, live re-render. Do NOT open an online URL and do NOT render a PNG.
+- **App not installed → open the online editor.** `mcp__dgmo__share_diagram(dgmo)` then `open <url>` in the shell. This lands the user on online.diagrammo.app with the chart and the code side-by-side, tweakable and shareable. Don't just print the URL — always `open` it.
+
+**Always save the source.** Whether or not the app is installed, write the diagram to `<name>.dgmo` in the current project/working directory so the user always has one editable artifact. Use a short kebab-case name from the diagram's title (e.g. `checkout-flow.dgmo`). This file IS the deliverable; the app or URL just displays it.
+
+**Never render an image unless the user explicitly asks** (see "Image output"). A PNG/SVG is not a default output — don't create files the user didn't request.
+
+Don't ask the user how they want to view the diagram — the check above decides it. They can ask for a PNG, the desktop app, or a share URL explicitly if they want something else.
 
 ### Creating a new diagram
 
-1. **Pick the right chart type** — always call `mcp__dgmo__suggest_chart_type({ prompt: <user's request> })` first. It returns up to 3 ranked candidates with a confidence banner and matched trigger phrases. Use the top match unless you have a strong reason to override it. If the MCP tool is unavailable (Setup Check fallback path), run `dgmo --chart-types` in a terminal to list supported types and pick from that list.
+1. **Pick the right chart type** — always call `mcp__dgmo__suggest_chart_type({ prompt: <user's request> })` first. It returns up to 3 ranked candidates with a confidence banner and matched trigger phrases. Use the top match unless you have a strong reason to override it. If the MCP tool is unavailable (Setup Check fallback path), run `dgmo types` in a terminal and pick from that list — do not pick from memory or assume a requested type is unsupported (see "Supported Chart Types" below).
 2. **Get syntax + examples** — call `mcp__dgmo__get_language_reference("<type>")` and `mcp__dgmo__get_examples("<type>")`.
 3. **Write the `.dgmo` content** — compose the markup.
 4. **Validate first** — call `mcp__dgmo__validate_diagram(dgmo)` to catch syntax errors before rendering. If errors come back, fix them and validate again.
-5. **Open on online.diagrammo.app** — the **default** visual output. Call `mcp__dgmo__share_diagram(dgmo)` to get a URL, then immediately run `open <url>` in the shell. This lands the user on the web editor where they see the chart AND the code side-by-side, can tweak the markup interactively, and can share the link as-is. Do NOT just print the URL — always `open` it.
+5. **Save the source** — write the validated markup to `<name>.dgmo` in the working directory.
+6. **Show it** — per "Where the diagram goes": app installed → `mcp__dgmo__open_in_app({ dgmo, filePath })`; not installed → `mcp__dgmo__share_diagram(dgmo)` + `open <url>`.
 
-   **Exception — image-output intent detected:** if the user's prompt explicitly asks for an image or saved file (phrases like "save as PNG", "export to SVG", "make an image", "render to a file", "give me a png", "I need an SVG"), skip the share URL and go straight to `mcp__dgmo__render_diagram` (see "Image output" below). The detection is intent-based, not keyword-strict — if in doubt, default to share URL and offer "Want me to save as PNG/SVG instead?"
+**Exception — image-output intent detected:** if the user's prompt explicitly asks for an image or saved file (phrases like "save as PNG", "export to SVG", "make an image", "render to a file", "give me a png", "I need an SVG"), still save the `.dgmo` source, then go to `mcp__dgmo__render_diagram` (see "Image output") instead of step 6. Detection is intent-based — if in doubt, use the step-6 default and offer "Want me to save as PNG/SVG instead?"
 
-   **Side-by-side variants** still use `mcp__dgmo__preview_diagram` (multi-diagram preview is its killer feature). See "Side-by-side variants" below.
-6. **Save the source file** (if working in a project) — write it to `<name>.dgmo` so the user has an editable copy.
-
-Do not ask the user how they want to view the diagram. Just open the share URL. They can ask for other formats if they want.
+**Side-by-side variants** use `mcp__dgmo__preview_diagram` (multi-diagram preview is its killer feature). See "Side-by-side variants" below.
 
 ### Editing an existing diagram
 
@@ -110,7 +99,7 @@ When the user asks to modify a `.dgmo` file or says "update this diagram":
 2. **Understand it** — identify the chart type, key elements, and structure.
 3. **Make the change** — edit the file using the Edit tool. Preserve the user's style and organization.
 4. **Validate** — call `mcp__dgmo__validate_diagram(dgmo)` on the updated content.
-5. **Preview** — call `mcp__dgmo__share_diagram(dgmo)` and `open <url>` so the user sees the result on online.diagrammo.app. (Image-output intent exception applies — if the user asked for a PNG/SVG file explicitly, render to file instead.)
+5. **Show it** — per "Where the diagram goes": app installed → `mcp__dgmo__open_in_app({ dgmo, filePath: "<the file you just edited>" })` so it re-renders live in the app; not installed → `mcp__dgmo__share_diagram(dgmo)` + `open <url>`. (Image-output exception applies — if the user asked for a PNG/SVG file explicitly, render to file instead.)
 
 Keep the diff minimal — don't rewrite the whole file when adding one element.
 
@@ -172,11 +161,12 @@ Trigger phrases: "save as PNG", "export to SVG", "make an image", "render to a f
 
 | What the user wants | How to do it |
 |---|---|
-| **Quick look in the desktop app** | `mcp__dgmo__open_in_app(dgmo)` — opens directly in Diagrammo (macOS) |
+| **Open in the desktop app (no saved file)** | `mcp__dgmo__open_in_app({ dgmo })` — deep-links an ephemeral copy into Diagrammo. Prefer the `filePath` form (open the saved file) whenever you've saved the source. |
+| **Force the online editor even though the app is installed** | `mcp__dgmo__share_diagram(dgmo)` + `open <url>` |
 | **Local HTML preview (not online.diagrammo.app)** | `mcp__dgmo__preview_diagram([{dgmo, title}])` — useful when the user specifically wants a local file or is offline |
 | **Copy markup to clipboard** | Run `echo '<dgmo markup>' \| pbcopy` |
 
-(The share URL — `mcp__dgmo__share_diagram` + `open` — is the DEFAULT visual output, not an alternative. See "Creating a new diagram → step 5" above.)
+(The default visual output is decided by `check_app_installed` — open the saved file in the app when installed, otherwise the online share URL. See "Where the diagram goes" above. The options here are for when the user explicitly asks for something else.)
 
 ### Embedding diagrams in docs
 
@@ -209,26 +199,33 @@ If the user wants the link in clipboard rather than opened (e.g., they want to p
 echo '<url>' | pbcopy
 ```
 
-Then tell the user it's been copied. Otherwise, the default is always `open <url>` — that's what step 5 of the main workflow does.
+Then tell the user it's been copied. Otherwise, the default visual output is the app-aware behavior from "Where the diagram goes" (open the saved file in the app when installed, else `open <url>`).
 
 ## CLI Reference
 
 ```
 dgmo <input.dgmo> [options]
 cat input.dgmo | dgmo [options]
+dgmo share <input.dgmo>          # shareable diagrammo.app URL (copies to clipboard)
+dgmo types                       # list all supported chart types
 ```
 
 Key options:
 - `-o <file>` — output file; format inferred from extension (`.svg` → SVG, else PNG)
-- `-o url` — output a shareable diagrammo.app URL
 - `--theme <theme>` — `light` (default), `dark`, `transparent`
 - `--palette <name>` — `slate` (default), `atlas`, `blueprint`, `catppuccin`, `nord`, `tidewater`, `tokyo-night`
-- `--copy` — copy the URL to clipboard (use with `-o url`)
-- `--chart-types` — list all supported chart types
+- `--json` — output structured JSON
 
 ## Supported Chart Types
 
-Call `mcp__dgmo__list_chart_types` to see every supported type with descriptions, or `dgmo --chart-types` in a terminal as a CLI fallback. When picking for a new diagram, use `mcp__dgmo__suggest_chart_type` — it scores the full list against the user's prompt (see "Creating a new diagram → step 1").
+**There are ~45 chart types. The authoritative, complete list comes ONLY from the live tool — never from memory and never from any prose list in this skill.** Any chart types named elsewhere in this document (in examples, tips, or the "diagram this" table) are illustrative, NOT the full set. dgmo supports many specialized types people don't expect — including `journey-map`, `mindmap`, `pert`, `raci`, `pyramid`, `wireframe`, `ring`, `tech-radar`, `cycle`, and more.
+
+**Hard rule:** before telling the user a chart type "doesn't exist," isn't supported, or that you'll use "the closest fit instead" — you MUST first query the live list:
+
+- MCP active: `mcp__dgmo__list_chart_types` (full list + descriptions), and `mcp__dgmo__suggest_chart_type({ prompt })` to pick.
+- MCP unavailable: run `dgmo types` in a terminal.
+
+If the user asks for a named visualization (e.g. "user journey", "mind map", "RACI matrix"), assume dgmo supports it and verify against the live list — do not substitute a different type unless the list confirms the requested one is genuinely absent.
 
 ## Key Syntax Patterns
 
@@ -286,6 +283,7 @@ series A (red), B (blue), C (green)  ⚠  for ≥2 series, prefer the indented b
 
 ## Tips
 
+- Output target: call `mcp__dgmo__check_app_installed()` once per session. App installed → save the `.dgmo` and open that file live in the app (`open_in_app` with `filePath`); not installed → online share URL. Always save the source either way; never render a PNG unless asked.
 - Default palette: `slate` — use it unless the user requests otherwise.
 - Always validate before rendering — `validate_diagram` is much faster than a failed render.
 - Always call `get_examples` before generating an unfamiliar chart type — real examples beat guessing.

package/.github/copilot-instructions.md

@@ -573,7 +573,7 @@ The canonical, ordered list lives in `src/chart-types.ts`.
 
 ```bash
 dgmo file.dgmo -o output.svg       # SVG
-dgmo file.dgmo -o url              # shareable link
+dgmo share file.dgmo               # shareable link (copied to clipboard)
 dgmo file.dgmo --json              # structured JSON output
 ```
 

package/README.md

@@ -110,7 +110,13 @@ Using a docs framework? First-class plugins wrap all of this:
 
 ## Use it from your AI tool
 
-There's an MCP server ([`@diagrammo/dgmo-mcp`](https://www.npmjs.com/package/@diagrammo/dgmo-mcp)) so Claude, Cursor, and other agents can author and render DGMO directly. Setup: **[diagrammo.app/ai](https://diagrammo.app/ai)**.
+Claude, Cursor, Codex, and other agents can author and render DGMO directly. One command sets up every assistant you have — no second package, no prompts:
+
+```bash
+dgmo install
+```
+
+It auto-detects Claude Code, Codex, Claude Desktop, Cursor, Windsurf, and Copilot and wires each one to the bundled MCP server. More: **[diagrammo.app/ai](https://diagrammo.app/ai)**.
 
 ## Chart types
 

package/SKILL.md

@@ -429,14 +429,19 @@ era 1718-05-08 -> 1718-05-17 Blockade Active blue
 **Fetch more:** call `get_language_reference(type)` for a type's full syntax and `get_examples(type)` for starter templates. `suggest_chart_type` returns the chosen type's reference automatically.
 <!-- DGMO-AI-CORE:END -->
 
-## MCP Tools — preferred order
+## Output — where the diagram goes
 
-When the `dgmo` MCP server is configured, prefer tools in this order:
-1. `open_in_app` — opens the diagram in the Diagrammo desktop app (macOS). **Best UX** — chart + editor side-by-side, full editing.
-2. `share_diagram` — returns a `https://online.diagrammo.app/...` URL. Tell the user to open it; same chart + editor view in the browser. **Preferred fallback** when the desktop app is not available.
-3. `render_diagram` — renders to PNG or SVG and returns a file path. Use when the user wants an image artifact (export, embed, attach).
+**Always save the `.dgmo` source** to `<name>.dgmo` in the working directory — it's the editable deliverable; the app/URL just displays it. **Never render a PNG/SVG unless the user explicitly asks** for an image.
+
+Decide the visual output **once per session** with `check_app_installed`:
+
+1. **App installed →** save the source, then `open_in_app({ dgmo, filePath: "<abs path to the saved file>" })`. The app opens *that file*, so in-app edits autosave back to it — one source of truth, live re-render. **Best UX.** Don't open an online URL and don't render a PNG.
+2. **App not installed →** `share_diagram` returns a `https://online.diagrammo.app/...` URL; `open` it. Same chart + editor view in the browser. **Preferred fallback.**
+
+Other tools (use only when the user asks for them):
+3. `render_diagram` — PNG or SVG to a file path. Use when the user wants an image artifact (export, embed, attach).
 4. `generate_report` — renders multiple diagrams into an HTML report with table of contents.
-5. `preview_diagram` — local HTML preview in the browser. Last resort — only when none of the above fit.
+5. `preview_diagram` — local HTML preview in the browser; also the multi-diagram side-by-side tool.
 6. `list_chart_types` / `get_language_reference` — discovery; call `get_language_reference` before generating an unfamiliar chart type.
 
 ## When to use dgmo
@@ -548,7 +553,7 @@ API
 
 ```bash
 dgmo file.dgmo -o output.svg       # SVG
-dgmo file.dgmo -o url              # shareable link
+dgmo share file.dgmo               # shareable link (copied to clipboard)
 dgmo file.dgmo --json              # structured JSON output
 ```