drafted 1.0.0 → 1.1.1

package/install-mcp.sh

@@ -0,0 +1,192 @@
+#!/bin/bash
+set -e
+
+# Drafted — Design workspace for AI agents
+# This script installs the Drafted MCP server and CLI globally via npm,
+# then registers it with Claude Desktop, Claude Code, and Cursor.
+#
+# Run with:
+#   curl -fsSL https://drafted.live/install.sh | bash
+
+SERVER="https://drafted.live"
+
+BOLD="\033[1m"
+DIM="\033[2m"
+GREEN="\033[32m"
+YELLOW="\033[33m"
+RED="\033[31m"
+CYAN="\033[36m"
+RESET="\033[0m"
+
+step=0
+step() {
+  step=$((step + 1))
+  echo ""
+  echo -e "${CYAN}[$step]${RESET} ${BOLD}$1${RESET}"
+}
+
+ok() {
+  echo -e "    ${GREEN}✓${RESET} $1"
+}
+
+fail() {
+  echo -e "    ${RED}✗${RESET} $1"
+}
+
+# ── Welcome ───────────────────────────────────────────────────────
+
+echo ""
+echo -e "${BOLD}Welcome to Drafted${RESET}"
+echo -e "This will set up Drafted so Claude can create designs for you."
+echo -e "It only takes a minute."
+
+# ── Prerequisites ─────────────────────────────────────────────────
+
+step "Checking your system"
+
+# Node.js
+if command -v node &>/dev/null; then
+  NODE_VERSION=$(node -v | sed 's/v//' | cut -d. -f1)
+  if [ "$NODE_VERSION" -lt 22 ]; then
+    fail "Node.js is too old (found $(node -v), need 22+)."
+    echo ""
+    echo -e "    Update it by running:  ${BOLD}brew upgrade node${RESET}"
+    echo -e "    Then re-run this installer."
+    exit 1
+  fi
+  ok "Node.js $(node -v)"
+else
+  fail "Node.js is not installed."
+  echo ""
+  if command -v brew &>/dev/null; then
+    echo -e "    Install it by running:  ${BOLD}brew install node${RESET}"
+  else
+    echo -e "    Download it from:  ${BOLD}https://nodejs.org${RESET}"
+  fi
+  echo -e "    Then re-run this installer."
+  exit 1
+fi
+
+# ── Install ───────────────────────────────────────────────────────
+
+step "Installing Drafted"
+
+npm install -g drafted@latest --silent 2>/dev/null
+ok "Installed $(drafted --version 2>/dev/null || echo 'drafted') via npm"
+
+# ── Configure ─────────────────────────────────────────────────────
+
+step "Connecting to your tools"
+
+# Write server URL config
+mkdir -p "$HOME/.drafted"
+echo "{\"server\":\"$SERVER\"}" > "$HOME/.drafted/config.json"
+ok "Server: $SERVER"
+
+# Resolve the installed binary path for MCP configs
+DRAFTED_MCP_BIN="$(which drafted-mcp 2>/dev/null || echo "drafted-mcp")"
+
+configure_mcp() {
+  local config_path="$1"
+  local label="$2"
+  local config_dir
+  config_dir="$(dirname "$config_path")"
+  mkdir -p "$config_dir"
+
+  node -e "
+    const fs = require('fs');
+    const p = process.argv[1];
+    let c = {};
+    try { c = JSON.parse(fs.readFileSync(p, 'utf8')); } catch {}
+    if (!c.mcpServers) c.mcpServers = {};
+    c.mcpServers.drafted = {
+      command: 'drafted-mcp',
+      args: []
+    };
+    fs.writeFileSync(p, JSON.stringify(c, null, 2) + '\n');
+  " "$config_path"
+  ok "$label"
+}
+
+CLAUDE_DESKTOP_CONFIG="$HOME/Library/Application Support/Claude/claude_desktop_config.json"
+CLAUDE_CODE_CONFIG="$HOME/.claude.json"
+CURSOR_CONFIG="$HOME/.cursor/mcp.json"
+
+CONFIGURED=false
+
+# Claude Desktop
+if [ -d "/Applications/Claude.app" ] || [ -d "$HOME/Applications/Claude.app" ]; then
+  configure_mcp "$CLAUDE_DESKTOP_CONFIG" "Claude Desktop"
+  CONFIGURED=true
+fi
+
+# Claude Code
+if command -v claude &>/dev/null; then
+  configure_mcp "$CLAUDE_CODE_CONFIG" "Claude Code"
+  CONFIGURED=true
+fi
+
+# Cursor
+if [ -d "/Applications/Cursor.app" ] || [ -d "$HOME/Applications/Cursor.app" ] || command -v cursor &>/dev/null; then
+  configure_mcp "$CURSOR_CONFIG" "Cursor"
+  CONFIGURED=true
+fi
+
+# If nothing detected, pre-configure all
+if [ "$CONFIGURED" = false ]; then
+  echo -e "    ${YELLOW}No supported editors detected — pre-configuring all.${RESET}"
+  configure_mcp "$CLAUDE_DESKTOP_CONFIG" "Claude Desktop (pre-configured)"
+  configure_mcp "$CLAUDE_CODE_CONFIG" "Claude Code (pre-configured)"
+  configure_mcp "$CURSOR_CONFIG" "Cursor (pre-configured)"
+fi
+
+# ── Skills ───────────────────────────────────────────────────────
+
+step "Installing skills"
+
+# Find the installed package's skills directory
+DRAFTED_PKG_DIR="$(node -e "try { console.log(require.resolve('drafted/package.json').replace('/package.json','')) } catch { process.exit(1) }" 2>/dev/null)" || true
+
+if [ -n "$DRAFTED_PKG_DIR" ] && [ -d "$DRAFTED_PKG_DIR/skills" ]; then
+  SKILLS_DIR="$HOME/.claude/skills"
+  mkdir -p "$SKILLS_DIR"
+  INSTALLED=0
+  # Copy individual skill files
+  for f in "$DRAFTED_PKG_DIR/skills/"*.md; do
+    [ -f "$f" ] || continue
+    cp "$f" "$SKILLS_DIR/"
+    INSTALLED=$((INSTALLED + 1))
+  done
+  # Copy skill directories
+  for d in "$DRAFTED_PKG_DIR/skills/"*/; do
+    [ -d "$d" ] || continue
+    DIRNAME="$(basename "$d")"
+    rm -rf "$SKILLS_DIR/$DIRNAME"
+    cp -r "$d" "$SKILLS_DIR/$DIRNAME"
+    INSTALLED=$((INSTALLED + 1))
+  done
+  ok "Installed $INSTALLED skills to $SKILLS_DIR"
+else
+  echo -e "    ${YELLOW}Skills directory not found in package — skipping.${RESET}"
+fi
+
+# ── Done ─────────────────────────────────────────────────────────
+
+echo ""
+echo ""
+echo -e "${GREEN}${BOLD}You're all set!${RESET}"
+echo ""
+echo -e "  ${DIM}View your designs at:${RESET}  ${BOLD}https://drafted.live${RESET}"
+echo -e "  ${DIM}To update:${RESET}     npm install -g drafted@latest"
+echo -e "  ${DIM}To uninstall:${RESET}  npm uninstall -g drafted && rm -rf ~/.drafted"
+echo ""
+echo -e "${YELLOW}${BOLD}"
+echo "  ┌─────────────────────────────────────────────────────────┐"
+echo "  │                                                         │"
+echo "  │   >>>  RESTART YOUR EDITOR TO ACTIVATE DRAFTED  <<<     │"
+echo "  │                                                         │"
+echo "  │   Close and reopen Claude Desktop, Claude Code,         │"
+echo "  │   or Cursor so it picks up the new MCP server.          │"
+echo "  │                                                         │"
+echo "  └─────────────────────────────────────────────────────────┘"
+echo -e "${RESET}"

package/mcp/server.mjs

@@ -14,18 +14,18 @@ import { join, dirname, basename, extname, resolve } from 'path';
 import { homedir } from 'os';
 import { fileURLToPath } from 'url';
 import { z } from 'zod';
-import { LAYERS } from '../shared/constants.mjs';
+import { LAYERS } from '../src/shared/constants.mjs';
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
 
 const server = new McpServer({
   name: 'drafted',
-  version: '2.3.0',
+  version: '2.4.0',
   description: `Multi-tenant design workspace. Structure: Organization → Projects → Layers → Lanes → Frames.
 
 An org contains projects. Each project has a zoomable canvas with frames (HTML files) organized as /{layer}/{lane}/{filename}. Layers are predefined categories (wireframes, designs, brand-assets, etc.), lanes are groups within a layer, and frames are the individual design files.
 
-WORKFLOW: list_projects → open_project → ls / → read/write/edit. Every response includes a "project" field showing which project you're operating on — always verify it matches your intent before writing.
+WORKFLOW: list_projects → open_project → ls / → read/write/edit. Projects span all orgs -- open_project auto-switches org context. Every response includes a "project" field showing which project you're operating on -- always verify it matches your intent before writing.
 
 IMPORTANT: Any URL containing /f/{uuid} is a Drafted frame link — ALWAYS use read(path=URL) to get frame content, focus(target=URL) to pan the canvas to it. Never curl or WebFetch Drafted URLs.`,
 });
@@ -95,6 +95,16 @@ async function ensureSession() {
   await cloneSession();
 }
 
+const MIME_MAP = {
+  '.css': 'text/css', '.js': 'application/javascript', '.mjs': 'application/javascript',
+  '.json': 'application/json', '.html': 'text/html', '.htm': 'text/html',
+  '.svg': 'image/svg+xml', '.png': 'image/png', '.jpg': 'image/jpeg', '.jpeg': 'image/jpeg',
+  '.gif': 'image/gif', '.webp': 'image/webp', '.ico': 'image/x-icon',
+  '.woff': 'font/woff', '.woff2': 'font/woff2', '.ttf': 'font/ttf', '.otf': 'font/otf', '.eot': 'application/vnd.ms-fontobject',
+  '.pdf': 'application/pdf', '.mp4': 'video/mp4', '.webm': 'video/webm',
+};
+function mimeFromExt(ext) { return MIME_MAP[ext?.toLowerCase()] || 'application/octet-stream'; }
+
 async function api(method, path, body, _retried) {
   await ensureSession();
   const pid = agentActiveProjectId;
@@ -370,7 +380,7 @@ server.tool('login', 'Authenticate with Drafted. Opens a browser for the user to
 
 // ── Project management tools (direct HTTP) ────────────────────────
 
-server.tool('list_projects', 'START HERE. Lists all projects in the org. Use this first to find the project you need, then open_project to switch to it.', {}, async () => {
+server.tool('list_projects', 'START HERE. Lists all projects across all orgs. Use this first to find the project you need, then open_project to switch to it (org switches automatically).', {}, async () => {
   try {
     const data = await api('GET', '/api/projects');
     data.agentProject = agentActiveProjectId || null;
@@ -460,10 +470,19 @@ server.tool('open_project', 'Switch active project. REQUIRED before reading or w
       if (proj?.slug) projectSlug = proj.slug;
     } catch { /* fall back to projectId */ }
     const url = `${base}/project/${projectSlug}`;
-    const { exec } = await import('child_process');
-    const cmd = process.platform === 'darwin' ? 'open' : process.platform === 'win32' ? 'start' : 'xdg-open';
-    exec(`${cmd} ${JSON.stringify(url)}`);
-    return ok({ ...result, url, opened: true });
+    // Navigate existing browser tabs instead of opening new ones
+    let navigated = 0;
+    try {
+      const nav = await api('POST', '/api/project/navigate', { projectId });
+      navigated = nav.navigated || 0;
+    } catch { /* server may not support navigate yet */ }
+    // Only open a new tab if no browser tabs were reached
+    if (navigated === 0) {
+      const { exec } = await import('child_process');
+      const cmd = process.platform === 'darwin' ? 'open' : process.platform === 'win32' ? 'start' : 'xdg-open';
+      exec(`${cmd} ${JSON.stringify(url)}`);
+    }
+    return ok({ ...result, url, opened: true, navigated });
   } catch (error) { return err(error); }
 });
 
@@ -733,13 +752,20 @@ server.tool('write', 'Write a frame to the ACTIVE PROJECT. Check the "project" f
 
     let body;
     if (file_path) {
-      // Binary upload: read file from disk, send as base64
       const resolved = resolve(file_path);
       if (!existsSync(resolved)) throw new Error(`File not found: ${resolved}`);
-      const buffer = readFileSync(resolved);
       const ext = extname(resolved).toLowerCase();
-      const MIME = { '.png': 'image/png', '.jpg': 'image/jpeg', '.jpeg': 'image/jpeg', '.gif': 'image/gif', '.webp': 'image/webp', '.svg': 'image/svg+xml', '.pdf': 'application/pdf' };
-      body = { base64: buffer.toString('base64'), contentType: MIME[ext] || 'application/octet-stream' };
+      const TEXT_EXTS = ['.html', '.htm', '.svg', '.md', '.markdown', '.txt', '.css', '.js', '.mjs', '.json', '.xml'];
+      if (TEXT_EXTS.includes(ext)) {
+        // Text file: read as content so it's stored inline (enables base tag injection for HTML)
+        body = { content: readFileSync(resolved, 'utf8') };
+        if (autoSize) body.autoSize = true;
+      } else {
+        // Binary upload: read file from disk, send as base64
+        const buffer = readFileSync(resolved);
+        const MIME = { '.png': 'image/png', '.jpg': 'image/jpeg', '.jpeg': 'image/jpeg', '.gif': 'image/gif', '.webp': 'image/webp', '.pdf': 'application/pdf' };
+        body = { base64: buffer.toString('base64'), contentType: MIME[ext] || 'application/octet-stream' };
+      }
     } else {
       body = { content };
       if (autoSize) body.autoSize = true;
@@ -853,10 +879,10 @@ server.tool('mv', 'Move/rename a frame within the ACTIVE PROJECT. Response inclu
 
 server.tool('batch', 'Batch operations on the ACTIVE PROJECT. Response includes "project" field. Use open_project first if needed.', {
   operations: z.array(z.object({
-    tool: z.enum(['write', 'rm', 'mv', 'edit']).describe('Tool to execute'),
+    tool: z.enum(['write', 'rm', 'mv', 'edit', 'upload_asset']).describe('Tool to execute'),
     path: z.string().optional().describe('Path (for write, rm, edit)'),
     content: z.string().optional().describe('Content (for write). Mutually exclusive with file_path.'),
-    file_path: z.string().optional().describe('Absolute path to a local file to upload (for write). Mutually exclusive with content.'),
+    file_path: z.string().optional().describe('Absolute path to a local file to upload (for write, upload_asset). Mutually exclusive with content.'),
     color: z.string().optional().describe('CSS color for frame border (for write)'),
     from: z.string().optional().describe('Source path (for mv)'),
     to: z.string().optional().describe('Destination path (for mv)'),
@@ -865,6 +891,9 @@ server.tool('batch', 'Batch operations on the ACTIVE PROJECT. Response includes
       lineHash: z.string(),
       newContent: z.string().optional(),
     })).optional().describe('Edit operations (for edit). Always include lineNum.'),
+    asset_path: z.string().optional().describe('Relative asset path (for upload_asset, e.g., "css/styles.css")'),
+    content_type: z.string().optional().describe('MIME type (for upload_asset, auto-detected if omitted)'),
+    frame_id: z.string().optional().describe('Frame ID to associate asset with (for upload_asset)'),
   })).describe('ALWAYS use batch instead of multiple individual tool calls. Applies the same change to many files, writes multiple frames, or combines writes+edits+deletes. One canvas refresh instead of many. Example: editing 5 wireframes to remove a section = one batch with 5 edit operations.'),
 }, async ({ operations }) => {
   try {
@@ -881,20 +910,121 @@ server.tool('batch', 'Batch operations on the ACTIVE PROJECT. Response includes
     }
 
     // Resolve file_path → base64 for write operations before sending to server
-    const resolvedOps = operations.map(op => {
-      if (op.tool === 'write' && op.file_path) {
-        const resolved = resolve(op.file_path);
-        if (!existsSync(resolved)) throw new Error(`File not found: ${resolved}`);
-        const buffer = readFileSync(resolved);
-        const ext = extname(resolved).toLowerCase();
-        const MIME = { '.png': 'image/png', '.jpg': 'image/jpeg', '.jpeg': 'image/jpeg', '.gif': 'image/gif', '.webp': 'image/webp', '.svg': 'image/svg+xml', '.pdf': 'application/pdf' };
-        const { file_path: _, ...rest } = op;
-        return { ...rest, base64: buffer.toString('base64'), contentType: MIME[ext] || 'application/octet-stream' };
+    // Separate asset uploads from frame operations
+    const assetOps = operations.filter(op => op.tool === 'upload_asset');
+    const frameOps = operations.filter(op => op.tool !== 'upload_asset');
+
+    const results = [];
+
+    // Handle asset uploads via the asset API
+    for (const op of assetOps) {
+      try {
+        if (!op.asset_path) throw new Error('asset_path is required for upload_asset');
+        if (op.asset_path.includes('..')) throw new Error('asset_path must not contain ".."');
+
+        let b64, ct;
+        if (op.file_path) {
+          const resolved = resolve(op.file_path);
+          if (!existsSync(resolved)) throw new Error(`File not found: ${resolved}`);
+          const buffer = readFileSync(resolved);
+          b64 = buffer.toString('base64');
+          ct = op.content_type || mimeFromExt(extname(resolved));
+        } else if (op.content != null) {
+          b64 = Buffer.from(op.content).toString('base64');
+          ct = op.content_type || mimeFromExt(extname(op.asset_path));
+        } else {
+          throw new Error('upload_asset requires file_path or content');
+        }
+
+        const body = { base64: b64, contentType: ct };
+        if (op.frame_id) body.frameId = op.frame_id;
+
+        const projectId = agentActiveProjectId;
+        if (!projectId) throw new Error('No active project. Call open_project first.');
+        const r = await api('PUT', `/api/projects/${projectId}/assets/${op.asset_path}`, body);
+        results.push({ ok: true, tool: 'upload_asset', asset_path: op.asset_path, ...r });
+      } catch (e) {
+        results.push({ ok: false, tool: 'upload_asset', asset_path: op.asset_path, error: e.message });
       }
-      return op;
-    });
+    }
 
-    const result = await api('POST', '/api/fs/batch', { operations: resolvedOps });
+    // Handle frame operations via the batch API
+    if (frameOps.length > 0) {
+      const TEXT_EXTS = ['.html', '.htm', '.svg', '.md', '.markdown', '.txt', '.css', '.js', '.mjs', '.json', '.xml'];
+      const resolvedOps = frameOps.map(op => {
+        if (op.tool === 'write' && op.file_path) {
+          const resolved = resolve(op.file_path);
+          if (!existsSync(resolved)) throw new Error(`File not found: ${resolved}`);
+          const ext = extname(resolved).toLowerCase();
+          const { file_path: _, ...rest } = op;
+          if (TEXT_EXTS.includes(ext)) {
+            return { ...rest, content: readFileSync(resolved, 'utf8') };
+          }
+          const buffer = readFileSync(resolved);
+          const MIME = { '.png': 'image/png', '.jpg': 'image/jpeg', '.jpeg': 'image/jpeg', '.gif': 'image/gif', '.webp': 'image/webp', '.svg': 'image/svg+xml', '.pdf': 'application/pdf' };
+          return { ...rest, base64: buffer.toString('base64'), contentType: MIME[ext] || 'application/octet-stream' };
+        }
+        return op;
+      });
+
+      const batchResult = await api('POST', '/api/fs/batch', { operations: resolvedOps });
+      if (batchResult.results) results.push(...batchResult.results);
+    }
+
+    return ok({ ok: true, results });
+  } catch (error) { return err(error); }
+});
+
+// ── Asset tools ──────────────────────────────────────────────────
+
+server.tool('upload_asset', 'Upload a supporting file (CSS, JS, image, font) to the ACTIVE PROJECT. Assets are referenced by frames via relative paths — e.g., if your HTML has <link href="css/styles.css">, upload the asset with asset_path="css/styles.css". Assets are NOT frames — they don\'t appear on the canvas. Use batch with upload_asset operations for bulk uploads.', {
+  asset_path: z.string().describe('Relative path for the asset (e.g., "css/styles.css", "js/app.js", "img/logo.png"). This must match the path used in HTML references.'),
+  file_path: z.string().optional().describe('Absolute path to a local file to upload. Mutually exclusive with content/base64.'),
+  content: z.string().optional().describe('Text content (for CSS/JS files). Mutually exclusive with file_path.'),
+  base64: z.string().optional().describe('Base64-encoded binary content. Mutually exclusive with file_path and content.'),
+  content_type: z.string().optional().describe('MIME type (auto-detected from extension if omitted)'),
+  frame_id: z.string().optional().describe('Frame ID to associate this asset with (for cleanup when the frame is deleted). Get this from the write tool response.'),
+}, async ({ asset_path, file_path, content, base64: rawBase64, content_type, frame_id }) => {
+  try {
+    if (!asset_path) throw new Error('asset_path is required');
+    if (asset_path.includes('..')) throw new Error('asset_path must not contain ".."');
+
+    let b64, ct;
+    if (file_path) {
+      const resolved = resolve(file_path);
+      if (!existsSync(resolved)) throw new Error(`File not found: ${resolved}`);
+      const buffer = readFileSync(resolved);
+      b64 = buffer.toString('base64');
+      ct = content_type || mimeFromExt(extname(resolved));
+    } else if (content != null) {
+      b64 = Buffer.from(content).toString('base64');
+      ct = content_type || mimeFromExt(extname(asset_path));
+    } else if (rawBase64) {
+      b64 = rawBase64;
+      ct = content_type || mimeFromExt(extname(asset_path));
+    } else {
+      throw new Error('Provide file_path, content, or base64');
+    }
+
+    const body = { base64: b64, contentType: ct };
+    if (frame_id) body.frameId = frame_id;
+
+    const projectId = agentActiveProjectId;
+    if (!projectId) throw new Error('No active project. Call open_project first.');
+
+    const result = await api('PUT', `/api/projects/${projectId}/assets/${asset_path}`, body);
+    return ok(result);
+  } catch (error) { return err(error); }
+});
+
+server.tool('list_assets', 'List all assets in the ACTIVE PROJECT, optionally filtered by frame.', {
+  frame_id: z.string().optional().describe('Filter assets by frame ID'),
+}, async ({ frame_id }) => {
+  try {
+    const projectId = agentActiveProjectId;
+    if (!projectId) throw new Error('No active project. Call open_project first.');
+    const query = frame_id ? `?frameId=${frame_id}` : '';
+    const result = await api('GET', `/api/projects/${projectId}/assets${query}`);
     return ok(result);
   } catch (error) { return err(error); }
 });

package/package.json

@@ -1,37 +1,72 @@
 {
   "name": "drafted",
-  "version": "1.0.0",
-  "description": "Design workspace for AI agents — MCP server and CLI",
+  "version": "1.1.1",
+  "description": "Drafted CLI - Design preview server for Claude agents",
   "type": "module",
+  "files": [
+    "cli/",
+    "mcp/",
+    "src/shared/",
+    "install-mcp.sh"
+  ],
   "bin": {
     "drafted": "./cli/drafted.mjs",
     "drafted-mcp": "./mcp/server.mjs"
   },
-  "files": [
-    "mcp/",
-    "cli/",
-    "shared/",
-    "README.md"
-  ],
+  "scripts": {
+    "dev": "./dev.sh",
+    "dev:server": "tsx watch server/server.mjs",
+    "dev:local": "node server/server-local.mjs",
+    "install-global": "npm install -g .",
+    "db:migrate": "psql $DATABASE_URL -f drizzle/migrate.sql",
+    "db:push": "drizzle-kit push",
+    "db:studio": "drizzle-kit studio",
+    "migrate-fs": "tsx server/migrate-fs.ts",
+    "db:clean-sessions": "tsx src/auth/cleanup.ts",
+    "import:legacy": "tsx scripts/import-legacy.mts",
+    "test": "vitest run",
+    "test:watch": "vitest"
+  },
   "dependencies": {
+    "@aws-sdk/client-s3": "^3.1007.0",
+    "@aws-sdk/s3-request-presigner": "^3.1008.0",
     "@modelcontextprotocol/sdk": "^1.27.1",
     "commander": "^11.1.0",
+    "dagre": "^0.8.5",
+    "dotenv": "^17.3.1",
+    "drizzle-orm": "^0.45.1",
+    "express": "^4.18.2",
+    "multer": "^2.1.1",
+    "nodemailer": "^8.0.2",
+    "pg": "^8.20.0",
+    "playwright": "^1.58.2",
+    "puppeteer": "^24.37.5",
     "qrcode-terminal": "^0.12.0",
+    "sharp": "^0.34.5",
     "ws": "^8.16.0",
     "zod": "^4.3.6"
   },
   "keywords": [
-    "drafted",
     "design",
-    "mcp",
-    "claude",
-    "ai",
-    "canvas"
+    "canvas",
+    "preview",
+    "html",
+    "claude"
   ],
   "author": "ddfourtwo",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/ddfourtwo/drafted.git"
   },
-  "license": "MIT"
+  "license": "MIT",
+  "devDependencies": {
+    "@types/express": "^5.0.6",
+    "@types/nodemailer": "^7.0.11",
+    "@types/pg": "^8.18.0",
+    "drizzle-kit": "^0.31.9",
+    "tsx": "^4.19.0",
+    "typescript": "^5.9.3",
+    "vitest": "^3.2.4",
+    "yaml": "^2.8.3"
+  }
 }

package/README.md

@@ -1,32 +0,0 @@
-# Drafted
-
-Design workspace for AI agents. MCP server and CLI for creating and managing designs on a collaborative surface.
-
-## Install
-
-```bash
-npm install -g drafted
-```
-
-## Usage
-
-### As an MCP server (for Claude Desktop, Claude Code, Cursor)
-
-The MCP server is automatically available after install:
-
-```bash
-drafted-mcp
-```
-
-### As a CLI
-
-```bash
-drafted login
-drafted ls
-drafted write designs/default/hero.html < design.html
-```
-
-## Links
-
-- **App**: https://drafted.live
-- **Docs**: https://drafted.live