@claude-canvas/vite-plugin 0.2.0 → 1.0.0

package/dist/index.js

@@ -4,37 +4,42 @@ import { ClaudeBridge } from "@claude-canvas/bridge";
 import { GitManager } from "@claude-canvas/bridge";
 import { QARunner } from "@claude-canvas/bridge";
 import { PromptBuilder } from "@claude-canvas/bridge";
+import { mkdir, writeFile } from "fs/promises";
 function createServerHook(options) {
   return (server) => {
     const bridge = new ClaudeBridge(options);
     const gitManager = new GitManager();
     const qaRunner = new QARunner(options.qa);
-    server.ws.on("canvas:message", (rawData) => {
+    server.ws.on("canvas:message", async (rawData) => {
       try {
         const msg = WSProtocol.parseClientMessage(rawData);
         switch (msg.type) {
           case "canvas:session-start":
-            handleSessionStart(server, gitManager, options);
+            await handleSessionStart(server, gitManager, options);
             break;
           case "canvas:session-end":
-            handleSessionEnd(server, gitManager, qaRunner, msg.payload.action);
+            await handleSessionEnd(server, gitManager, qaRunner, msg.payload.action);
             break;
           case "canvas:annotate":
-            handleAnnotate(server, bridge, msg.payload);
+            await handleAnnotate(server, bridge, msg.payload);
             break;
           case "canvas:chat":
-            handleChat(server, bridge, msg.payload.message);
+            await handleChat(server, bridge, msg.payload);
             break;
           case "canvas:qa-retry":
-            handleQARetry(server, qaRunner);
+            await handleQARetry(server, qaRunner);
             break;
         }
       } catch (err) {
-        const errMsg = WSProtocol.createErrorMessage(
-          err instanceof Error ? err.message : "Unknown error",
-          true
-        );
-        server.ws.send("canvas:message", WSProtocol.serializeServerMessage(errMsg));
+        console.warn("[claude-canvas] Error handling message:", err instanceof Error ? err.message : err);
+        try {
+          const errMsg = WSProtocol.createErrorMessage(
+            err instanceof Error ? err.message : "Unknown error",
+            true
+          );
+          server.ws.send("canvas:message", WSProtocol.serializeServerMessage(errMsg));
+        } catch {
+        }
       }
     });
     server.httpServer?.on("close", async () => {
@@ -92,16 +97,19 @@ async function handleAnnotate(server, bridge, payload) {
     payload: { delta: "", done: true }
   }));
 }
-async function handleChat(server, bridge, message) {
-  for await (const delta of bridge.sendPrompt(message)) {
-    server.ws.send("canvas:message", JSON.stringify({
-      type: "canvas:stream",
-      payload: { delta, done: false }
-    }));
-  }
+var RELAY_DIR = "/tmp/claude-canvas";
+async function handleChat(server, _bridge, payload) {
+  const request = {
+    element: payload.context?.source ?? null,
+    route: payload.context?.route ?? null,
+    instruction: payload.message,
+    timestamp: (/* @__PURE__ */ new Date()).toISOString()
+  };
+  await mkdir(RELAY_DIR, { recursive: true });
+  await writeFile(`${RELAY_DIR}/request.json`, JSON.stringify(request, null, 2));
   server.ws.send("canvas:message", JSON.stringify({
-    type: "canvas:stream",
-    payload: { delta: "", done: true }
+    type: "canvas:relay-saved",
+    payload: { path: `${RELAY_DIR}/request.json` }
   }));
 }
 async function handleQARetry(server, qa) {
@@ -120,30 +128,23 @@ async function handleQARetry(server, qa) {
   }));
 }
 
-// src/html-inject.ts
-function createHtmlInject(options) {
-  return () => {
-    return {
-      html: "",
-      tags: [
-        {
-          tag: "script",
-          attrs: { type: "module" },
-          children: generateClientScript(options),
-          injectTo: "body"
-        }
-      ]
-    };
-  };
-}
+// src/index.ts
+var VIRTUAL_MODULE_ID = "virtual:claude-canvas-init";
+var RESOLVED_VIRTUAL_MODULE_ID = "\0" + VIRTUAL_MODULE_ID;
 function generateClientScript(options) {
   const shortcut = options.shortcut || "ctrl+shift+a";
   return `
-    import { ShadowContainer, CanvasOverlayPanel, ToolbarPanel, InspectorPopupPanel, ChatPanel, SessionBarPanel, QAResultPanel, FabButtonPanel, KeyboardHandler } from '@claude-canvas/core';
+    import { ShadowContainer, CanvasOverlayPanel, ToolbarPanel, InspectorPopupPanel, ChatPanel, SessionBarPanel, QAResultPanel, FabButton, KeyboardHandler, FiberWalker } from '@claude-canvas/core';
 
     const container = new ShadowContainer();
     container.mount();
     const shadow = container.getShadowRoot();
+    const shadowHost = shadow.host;
+
+    // Check if an element belongs to the canvas UI (shadow DOM)
+    function isCanvasUI(el) {
+      return el === shadowHost || shadowHost.contains(el);
+    }
 
     const overlay = new CanvasOverlayPanel();
     overlay.mount();
@@ -153,34 +154,202 @@ function generateClientScript(options) {
     const chat = new ChatPanel(shadow);
     const sessionBar = new SessionBarPanel(shadow);
     const qaResult = new QAResultPanel(shadow);
-    const fab = new FabButtonPanel(shadow);
 
-    // Wire up WebSocket via Vite HMR
+    let canvasActive = false;
+    let selectedSource = null;
+    let selectedRect = null;
+
+    // Helper: extract source info from element (fiber or DOM fallback)
+    function getSourceFromElement(el) {
+      const fiber = FiberWalker.getFiberFromElement(el);
+      if (fiber) {
+        const source = FiberWalker.getSourceInfo(fiber);
+        if (source) return source;
+      }
+      // DOM fallback
+      return {
+        componentName: el.tagName.toLowerCase(),
+        file: '',
+        line: 0,
+        column: 0,
+        tagName: el.tagName.toLowerCase(),
+        className: el.className || undefined,
+      };
+    }
+
+    function activateCanvas() {
+      canvasActive = true;
+      overlay.setMode('select');
+      if (chat.isCollapsed()) chat.toggle();
+      fab.setVisible(false);
+      chat.addMessage({ role: 'system', content: '\uC5B4\uB178\uD14C\uC774\uC158 \uBAA8\uB4DC \uD65C\uC131\uD654. \uC694\uC18C\uB97C \uD074\uB9AD\uD558\uC5EC \uC120\uD0DD\uD558\uC138\uC694.' });
+    }
+
+    function deactivateCanvas() {
+      canvasActive = false;
+      overlay.setMode('off');
+      overlay.clearAnnotations();
+      selectedSource = null;
+      selectedRect = null;
+      inspector.forceHide();
+      if (!chat.isCollapsed()) chat.toggle();
+      fab.setVisible(true);
+    }
+
+    function toggleCanvas() {
+      if (canvasActive) deactivateCanvas();
+      else activateCanvas();
+    }
+
+    const fab = new FabButton(shadow, { onActivate: toggleCanvas });
+    fab.mount();
+
+    // ---- Select mode: hover + click ----
+    document.addEventListener('mousemove', (e) => {
+      if (!canvasActive || overlay.getMode() !== 'select') return;
+      const el = document.elementFromPoint(e.clientX, e.clientY);
+      if (el && el instanceof HTMLElement && !isCanvasUI(el)) {
+        overlay.handleElementHover(el);
+      }
+    }, true);
+
+    document.addEventListener('click', (e) => {
+      if (!canvasActive || overlay.getMode() !== 'select') return;
+      const el = document.elementFromPoint(e.clientX, e.clientY);
+      if (!el || !(el instanceof HTMLElement) || isCanvasUI(el)) return;
+
+      e.preventDefault();
+      e.stopPropagation();
+
+      const rect = el.getBoundingClientRect();
+      const source = getSourceFromElement(el);
+      selectedSource = source;
+      selectedRect = rect;
+
+      // Draw orange select highlight
+      overlay.handleElementSelect(el);
+
+      // Show inspector popup with source info
+      inspector.show(source, rect);
+      inspector.pin();
+
+      // Add selection info to chat
+      const label = source.file
+        ? source.componentName + ' \u2014 ' + source.file + ':' + source.line
+        : '<' + source.componentName + '>' + (source.className ? '.' + source.className.split(' ')[0] : '');
+      chat.addMessage({ role: 'system', content: '\uC120\uD0DD: ' + label });
+    }, true);
+
+    // ---- Box mode: drag red rectangle ----
+    let boxDragging = false;
+    document.addEventListener('mousedown', (e) => {
+      if (!canvasActive || overlay.getMode() !== 'box') return;
+      e.preventDefault();
+      boxDragging = true;
+      overlay.boxTool.startDraw(e.clientX, e.clientY);
+    }, true);
+
+    document.addEventListener('mousemove', (e) => {
+      if (!boxDragging) return;
+      const rect = overlay.boxTool.updateDraw(e.clientX, e.clientY);
+      overlay.clearAnnotations();
+      overlay.setMode('box');
+    }, true);
+
+    document.addEventListener('mouseup', (e) => {
+      if (!boxDragging) return;
+      boxDragging = false;
+      const rect = overlay.boxTool.endDraw(e.clientX, e.clientY);
+      if (rect.width > 5 && rect.height > 5) {
+        chat.addMessage({ role: 'system', content: '\uC601\uC5ED \uC120\uD0DD: ' + Math.round(rect.width) + 'x' + Math.round(rect.height) + 'px' });
+      }
+    }, true);
+
+    // ---- Chat send \u2192 WS ----
+    chat.onMessageSend((message) => {
+      // Add user message to chat
+      chat.addMessage({ role: 'user', content: message });
+
+      // Build context with selected element info + current route
+      const route = window.location.pathname;
+      const context = selectedSource
+        ? { source: selectedSource, rect: selectedRect, annotations: overlay.collectAnnotationSet(), route }
+        : { annotations: overlay.collectAnnotationSet(), route };
+
+      // Send via Vite HMR WebSocket
+      if (import.meta.hot) {
+        import.meta.hot.send('canvas:message', JSON.stringify({
+          type: 'canvas:chat',
+          payload: { message, context },
+        }));
+      }
+
+      // Show pending response
+      chat.addMessage({ role: 'assistant', content: '...' });
+    });
+
+    // ---- Receive WS messages ----
     if (import.meta.hot) {
       import.meta.hot.on('canvas:message', (data) => {
-        const msg = JSON.parse(data);
-        // Route messages to appropriate panels
+        try {
+          const msg = typeof data === 'string' ? JSON.parse(data) : data;
+          if (msg.type === 'canvas:stream') {
+            if (msg.payload.delta) chat.appendStream(msg.payload.delta);
+            if (msg.payload.done) chat.appendStream(' [\uC644\uB8CC]');
+          } else if (msg.type === 'canvas:relay-saved') {
+            chat.appendStream('\uC800\uC7A5\uB428 \u2014 \uD130\uBBF8\uB110\uC5D0\uC11C \uCC98\uB9AC\uD558\uC138\uC694');
+          } else if (msg.type === 'canvas:error') {
+            chat.appendStream('[\uC624\uB958] ' + (msg.payload.message || 'Unknown error'));
+          }
+        } catch (err) {
+          console.warn('[claude-canvas] WS parse error:', err);
+        }
       });
     }
 
-    // Keyboard handler (shortcut: ${shortcut})
+    // ---- Keyboard handler ----
     const keyboard = new KeyboardHandler({
-      onToggleMode: () => { /* toggle annotation mode */ },
-      onEscape: () => { overlay.setMode('off'); },
-      onToolSwitch: (mode) => { overlay.setMode(mode); toolbar.setActiveTool(mode); },
-      onSend: () => { /* send via chat */ },
-    });
+      onToggleMode: toggleCanvas,
+      onEscape: deactivateCanvas,
+      onToolSwitch: (mode) => {
+        if (!canvasActive) return;
+        overlay.setMode(mode);
+        toolbar.setActiveTool(mode);
+      },
+      onSend: () => {},
+    }, { shortcut: '${shortcut}' });
     keyboard.mount();
   `;
 }
-
-// src/index.ts
 function claudeCanvas(options = {}) {
   return {
     name: "vite-plugin-claude-canvas",
     apply: "serve",
-    configureServer: createServerHook(options),
-    transformIndexHtml: createHtmlInject(options)
+    resolveId(id) {
+      if (id === VIRTUAL_MODULE_ID) {
+        return RESOLVED_VIRTUAL_MODULE_ID;
+      }
+      return void 0;
+    },
+    load(id) {
+      if (id === RESOLVED_VIRTUAL_MODULE_ID) {
+        return generateClientScript(options);
+      }
+      return void 0;
+    },
+    transformIndexHtml() {
+      return {
+        html: "",
+        tags: [
+          {
+            tag: "script",
+            attrs: { type: "module", src: `/@id/${VIRTUAL_MODULE_ID}` },
+            injectTo: "body"
+          }
+        ]
+      };
+    },
+    configureServer: createServerHook(options)
   };
 }
 var index_default = claudeCanvas;

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/server-hook.ts","../src/html-inject.ts","../src/index.ts"],"sourcesContent":["import type { ViteDevServer } from 'vite'\nimport type { AnnotationSet } from '@claude-canvas/core'\nimport type { ClaudeCanvasOptions } from './types.js'\nimport { WSProtocol } from '@claude-canvas/bridge'\nimport { ClaudeBridge } from '@claude-canvas/bridge'\nimport { GitManager } from '@claude-canvas/bridge'\nimport { QARunner } from '@claude-canvas/bridge'\nimport { PromptBuilder } from '@claude-canvas/bridge'\n\nexport function createServerHook(options: ClaudeCanvasOptions) {\n  return (server: ViteDevServer) => {\n    const bridge = new ClaudeBridge(options)\n    const gitManager = new GitManager()\n    const qaRunner = new QARunner(options.qa)\n\n    server.ws.on('canvas:message', (rawData: string) => {\n      try {\n        const msg = WSProtocol.parseClientMessage(rawData)\n\n        switch (msg.type) {\n          case 'canvas:session-start':\n            handleSessionStart(server, gitManager, options)\n            break\n          case 'canvas:session-end':\n            handleSessionEnd(server, gitManager, qaRunner, msg.payload.action)\n            break\n          case 'canvas:annotate':\n            handleAnnotate(server, bridge, msg.payload)\n            break\n          case 'canvas:chat':\n            handleChat(server, bridge, msg.payload.message)\n            break\n          case 'canvas:qa-retry':\n            handleQARetry(server, qaRunner)\n            break\n        }\n      } catch (err) {\n        const errMsg = WSProtocol.createErrorMessage(\n          err instanceof Error ? err.message : 'Unknown error',\n          true\n        )\n        server.ws.send('canvas:message', WSProtocol.serializeServerMessage(errMsg))\n      }\n    })\n\n    // Cleanup on server close\n    server.httpServer?.on('close', async () => {\n      await bridge.shutdown()\n    })\n  }\n}\n\nasync function handleSessionStart(\n  server: ViteDevServer,\n  git: GitManager,\n  options: ClaudeCanvasOptions\n) {\n  const session = await git.startSession({ branchPrefix: options.git?.branchPrefix })\n  server.ws.send('canvas:message', JSON.stringify({\n    type: 'canvas:session-status',\n    payload: session,\n  }))\n}\n\nasync function handleSessionEnd(\n  server: ViteDevServer,\n  git: GitManager,\n  qa: QARunner,\n  action: 'merge' | 'discard'\n) {\n  if (action === 'merge') {\n    const steps = []\n    for await (const step of qa.run()) {\n      steps.push(step)\n      server.ws.send('canvas:message', JSON.stringify({\n        type: 'canvas:qa-progress',\n        payload: { step: step.name, status: step.pass ? 'pass' : 'fail' },\n      }))\n    }\n    const result = qa.getResult(steps)\n    server.ws.send('canvas:message', JSON.stringify({\n      type: 'canvas:qa-result',\n      payload: result,\n    }))\n\n    if (result.overallPass) {\n      const mergeResult = await git.endSession('merge')\n      server.ws.send('canvas:message', JSON.stringify({\n        type: 'canvas:merge-result',\n        payload: mergeResult,\n      }))\n    }\n  } else {\n    const mergeResult = await git.endSession('discard')\n    server.ws.send('canvas:message', JSON.stringify({\n      type: 'canvas:merge-result',\n      payload: mergeResult,\n    }))\n  }\n}\n\nasync function handleAnnotate(\n  server: ViteDevServer,\n  bridge: ClaudeBridge,\n  payload: { annotations: AnnotationSet; memo: string }\n) {\n  const prompt = PromptBuilder.buildPrompt(payload.annotations, payload.memo)\n  for await (const delta of bridge.sendPrompt(prompt)) {\n    server.ws.send('canvas:message', JSON.stringify({\n      type: 'canvas:stream',\n      payload: { delta, done: false },\n    }))\n  }\n  server.ws.send('canvas:message', JSON.stringify({\n    type: 'canvas:stream',\n    payload: { delta: '', done: true },\n  }))\n}\n\nasync function handleChat(\n  server: ViteDevServer,\n  bridge: ClaudeBridge,\n  message: string\n) {\n  for await (const delta of bridge.sendPrompt(message)) {\n    server.ws.send('canvas:message', JSON.stringify({\n      type: 'canvas:stream',\n      payload: { delta, done: false },\n    }))\n  }\n  server.ws.send('canvas:message', JSON.stringify({\n    type: 'canvas:stream',\n    payload: { delta: '', done: true },\n  }))\n}\n\nasync function handleQARetry(server: ViteDevServer, qa: QARunner) {\n  const steps = []\n  for await (const step of qa.run()) {\n    steps.push(step)\n    server.ws.send('canvas:message', JSON.stringify({\n      type: 'canvas:qa-progress',\n      payload: { step: step.name, status: step.pass ? 'pass' : 'fail' },\n    }))\n  }\n  const result = qa.getResult(steps)\n  server.ws.send('canvas:message', JSON.stringify({\n    type: 'canvas:qa-result',\n    payload: result,\n  }))\n}\n","import type { IndexHtmlTransformResult } from 'vite'\nimport type { ClaudeCanvasOptions } from './types.js'\n\nexport function createHtmlInject(options: ClaudeCanvasOptions) {\n  return (): IndexHtmlTransformResult => {\n    return {\n      html: '',\n      tags: [\n        {\n          tag: 'script',\n          attrs: { type: 'module' },\n          children: generateClientScript(options),\n          injectTo: 'body',\n        },\n      ],\n    }\n  }\n}\n\nfunction generateClientScript(options: ClaudeCanvasOptions): string {\n  const shortcut = options.shortcut || 'ctrl+shift+a'\n  return `\n    import { ShadowContainer, CanvasOverlayPanel, ToolbarPanel, InspectorPopupPanel, ChatPanel, SessionBarPanel, QAResultPanel, FabButtonPanel, KeyboardHandler } from '@claude-canvas/core';\n\n    const container = new ShadowContainer();\n    container.mount();\n    const shadow = container.getShadowRoot();\n\n    const overlay = new CanvasOverlayPanel();\n    overlay.mount();\n\n    const toolbar = new ToolbarPanel(shadow);\n    const inspector = new InspectorPopupPanel(shadow);\n    const chat = new ChatPanel(shadow);\n    const sessionBar = new SessionBarPanel(shadow);\n    const qaResult = new QAResultPanel(shadow);\n    const fab = new FabButtonPanel(shadow);\n\n    // Wire up WebSocket via Vite HMR\n    if (import.meta.hot) {\n      import.meta.hot.on('canvas:message', (data) => {\n        const msg = JSON.parse(data);\n        // Route messages to appropriate panels\n      });\n    }\n\n    // Keyboard handler (shortcut: ${shortcut})\n    const keyboard = new KeyboardHandler({\n      onToggleMode: () => { /* toggle annotation mode */ },\n      onEscape: () => { overlay.setMode('off'); },\n      onToolSwitch: (mode) => { overlay.setMode(mode); toolbar.setActiveTool(mode); },\n      onSend: () => { /* send via chat */ },\n    });\n    keyboard.mount();\n  `\n}\n","import type { Plugin } from 'vite'\r\nimport type { ClaudeCanvasOptions } from './types.js'\r\nimport { createServerHook } from './server-hook.js'\r\nimport { createHtmlInject } from './html-inject.js'\r\n\r\nexport function claudeCanvas(options: ClaudeCanvasOptions = {}): Plugin {\r\n  return {\r\n    name: 'vite-plugin-claude-canvas',\r\n    apply: 'serve',\r\n    configureServer: createServerHook(options),\r\n    transformIndexHtml: createHtmlInject(options),\r\n  }\r\n}\r\n\r\nexport default claudeCanvas\r\n\r\nexport type { ClaudeCanvasOptions }\r\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/server-hook.ts","../src/index.ts"],"sourcesContent":["import type { ViteDevServer } from 'vite'\nimport type { AnnotationSet } from '@claude-canvas/core'\nimport type { ClaudeCanvasOptions } from './types.js'\nimport { WSProtocol } from '@claude-canvas/bridge'\nimport { ClaudeBridge } from '@claude-canvas/bridge'\nimport { GitManager } from '@claude-canvas/bridge'\nimport { QARunner } from '@claude-canvas/bridge'\nimport { PromptBuilder } from '@claude-canvas/bridge'\nimport { mkdir, writeFile } from 'node:fs/promises'\n\nexport function createServerHook(options: ClaudeCanvasOptions) {\n  return (server: ViteDevServer) => {\n    const bridge = new ClaudeBridge(options)\n    const gitManager = new GitManager()\n    const qaRunner = new QARunner(options.qa)\n\n    server.ws.on('canvas:message', async (rawData: string) => {\n      try {\n        const msg = WSProtocol.parseClientMessage(rawData)\n\n        switch (msg.type) {\n          case 'canvas:session-start':\n            await handleSessionStart(server, gitManager, options)\n            break\n          case 'canvas:session-end':\n            await handleSessionEnd(server, gitManager, qaRunner, msg.payload.action)\n            break\n          case 'canvas:annotate':\n            await handleAnnotate(server, bridge, msg.payload)\n            break\n          case 'canvas:chat':\n            await handleChat(server, bridge, msg.payload)\n            break\n          case 'canvas:qa-retry':\n            await handleQARetry(server, qaRunner)\n            break\n        }\n      } catch (err) {\n        console.warn('[claude-canvas] Error handling message:', err instanceof Error ? err.message : err)\n        try {\n          const errMsg = WSProtocol.createErrorMessage(\n            err instanceof Error ? err.message : 'Unknown error',\n            true\n          )\n          server.ws.send('canvas:message', WSProtocol.serializeServerMessage(errMsg))\n        } catch {\n          // WS send failed — client may have disconnected\n        }\n      }\n    })\n\n    // Cleanup on server close\n    server.httpServer?.on('close', async () => {\n      await bridge.shutdown()\n    })\n  }\n}\n\nasync function handleSessionStart(\n  server: ViteDevServer,\n  git: GitManager,\n  options: ClaudeCanvasOptions\n) {\n  const session = await git.startSession({ branchPrefix: options.git?.branchPrefix })\n  server.ws.send('canvas:message', JSON.stringify({\n    type: 'canvas:session-status',\n    payload: session,\n  }))\n}\n\nasync function handleSessionEnd(\n  server: ViteDevServer,\n  git: GitManager,\n  qa: QARunner,\n  action: 'merge' | 'discard'\n) {\n  if (action === 'merge') {\n    const steps = []\n    for await (const step of qa.run()) {\n      steps.push(step)\n      server.ws.send('canvas:message', JSON.stringify({\n        type: 'canvas:qa-progress',\n        payload: { step: step.name, status: step.pass ? 'pass' : 'fail' },\n      }))\n    }\n    const result = qa.getResult(steps)\n    server.ws.send('canvas:message', JSON.stringify({\n      type: 'canvas:qa-result',\n      payload: result,\n    }))\n\n    if (result.overallPass) {\n      const mergeResult = await git.endSession('merge')\n      server.ws.send('canvas:message', JSON.stringify({\n        type: 'canvas:merge-result',\n        payload: mergeResult,\n      }))\n    }\n  } else {\n    const mergeResult = await git.endSession('discard')\n    server.ws.send('canvas:message', JSON.stringify({\n      type: 'canvas:merge-result',\n      payload: mergeResult,\n    }))\n  }\n}\n\nasync function handleAnnotate(\n  server: ViteDevServer,\n  bridge: ClaudeBridge,\n  payload: { annotations: AnnotationSet; memo: string }\n) {\n  const prompt = PromptBuilder.buildPrompt(payload.annotations, payload.memo)\n  for await (const delta of bridge.sendPrompt(prompt)) {\n    server.ws.send('canvas:message', JSON.stringify({\n      type: 'canvas:stream',\n      payload: { delta, done: false },\n    }))\n  }\n  server.ws.send('canvas:message', JSON.stringify({\n    type: 'canvas:stream',\n    payload: { delta: '', done: true },\n  }))\n}\n\nconst RELAY_DIR = '/tmp/claude-canvas'\n\nasync function handleChat(\n  server: ViteDevServer,\n  _bridge: ClaudeBridge,\n  payload: { message: string; context?: { source?: unknown; route?: string } }\n) {\n  const request = {\n    element: payload.context?.source ?? null,\n    route: payload.context?.route ?? null,\n    instruction: payload.message,\n    timestamp: new Date().toISOString(),\n  }\n\n  await mkdir(RELAY_DIR, { recursive: true })\n  await writeFile(`${RELAY_DIR}/request.json`, JSON.stringify(request, null, 2))\n\n  server.ws.send('canvas:message', JSON.stringify({\n    type: 'canvas:relay-saved',\n    payload: { path: `${RELAY_DIR}/request.json` },\n  }))\n}\n\nasync function handleQARetry(server: ViteDevServer, qa: QARunner) {\n  const steps = []\n  for await (const step of qa.run()) {\n    steps.push(step)\n    server.ws.send('canvas:message', JSON.stringify({\n      type: 'canvas:qa-progress',\n      payload: { step: step.name, status: step.pass ? 'pass' : 'fail' },\n    }))\n  }\n  const result = qa.getResult(steps)\n  server.ws.send('canvas:message', JSON.stringify({\n    type: 'canvas:qa-result',\n    payload: result,\n  }))\n}\n","import type { Plugin } from 'vite'\r\nimport type { ClaudeCanvasOptions } from './types.js'\r\nimport { createServerHook } from './server-hook.js'\r\n\r\nconst VIRTUAL_MODULE_ID = 'virtual:claude-canvas-init'\r\nconst RESOLVED_VIRTUAL_MODULE_ID = '\\0' + VIRTUAL_MODULE_ID\r\n\r\nfunction generateClientScript(options: ClaudeCanvasOptions): string {\r\n  const shortcut = options.shortcut || 'ctrl+shift+a'\r\n  return `\r\n    import { ShadowContainer, CanvasOverlayPanel, ToolbarPanel, InspectorPopupPanel, ChatPanel, SessionBarPanel, QAResultPanel, FabButton, KeyboardHandler, FiberWalker } from '@claude-canvas/core';\r\n\r\n    const container = new ShadowContainer();\r\n    container.mount();\r\n    const shadow = container.getShadowRoot();\r\n    const shadowHost = shadow.host;\r\n\r\n    // Check if an element belongs to the canvas UI (shadow DOM)\r\n    function isCanvasUI(el) {\r\n      return el === shadowHost || shadowHost.contains(el);\r\n    }\r\n\r\n    const overlay = new CanvasOverlayPanel();\r\n    overlay.mount();\r\n\r\n    const toolbar = new ToolbarPanel(shadow);\r\n    const inspector = new InspectorPopupPanel(shadow);\r\n    const chat = new ChatPanel(shadow);\r\n    const sessionBar = new SessionBarPanel(shadow);\r\n    const qaResult = new QAResultPanel(shadow);\r\n\r\n    let canvasActive = false;\r\n    let selectedSource = null;\r\n    let selectedRect = null;\r\n\r\n    // Helper: extract source info from element (fiber or DOM fallback)\r\n    function getSourceFromElement(el) {\r\n      const fiber = FiberWalker.getFiberFromElement(el);\r\n      if (fiber) {\r\n        const source = FiberWalker.getSourceInfo(fiber);\r\n        if (source) return source;\r\n      }\r\n      // DOM fallback\r\n      return {\r\n        componentName: el.tagName.toLowerCase(),\r\n        file: '',\r\n        line: 0,\r\n        column: 0,\r\n        tagName: el.tagName.toLowerCase(),\r\n        className: el.className || undefined,\r\n      };\r\n    }\r\n\r\n    function activateCanvas() {\r\n      canvasActive = true;\r\n      overlay.setMode('select');\r\n      if (chat.isCollapsed()) chat.toggle();\r\n      fab.setVisible(false);\r\n      chat.addMessage({ role: 'system', content: '어노테이션 모드 활성화. 요소를 클릭하여 선택하세요.' });\r\n    }\r\n\r\n    function deactivateCanvas() {\r\n      canvasActive = false;\r\n      overlay.setMode('off');\r\n      overlay.clearAnnotations();\r\n      selectedSource = null;\r\n      selectedRect = null;\r\n      inspector.forceHide();\r\n      if (!chat.isCollapsed()) chat.toggle();\r\n      fab.setVisible(true);\r\n    }\r\n\r\n    function toggleCanvas() {\r\n      if (canvasActive) deactivateCanvas();\r\n      else activateCanvas();\r\n    }\r\n\r\n    const fab = new FabButton(shadow, { onActivate: toggleCanvas });\r\n    fab.mount();\r\n\r\n    // ---- Select mode: hover + click ----\r\n    document.addEventListener('mousemove', (e) => {\r\n      if (!canvasActive || overlay.getMode() !== 'select') return;\r\n      const el = document.elementFromPoint(e.clientX, e.clientY);\r\n      if (el && el instanceof HTMLElement && !isCanvasUI(el)) {\r\n        overlay.handleElementHover(el);\r\n      }\r\n    }, true);\r\n\r\n    document.addEventListener('click', (e) => {\r\n      if (!canvasActive || overlay.getMode() !== 'select') return;\r\n      const el = document.elementFromPoint(e.clientX, e.clientY);\r\n      if (!el || !(el instanceof HTMLElement) || isCanvasUI(el)) return;\r\n\r\n      e.preventDefault();\r\n      e.stopPropagation();\r\n\r\n      const rect = el.getBoundingClientRect();\r\n      const source = getSourceFromElement(el);\r\n      selectedSource = source;\r\n      selectedRect = rect;\r\n\r\n      // Draw orange select highlight\r\n      overlay.handleElementSelect(el);\r\n\r\n      // Show inspector popup with source info\r\n      inspector.show(source, rect);\r\n      inspector.pin();\r\n\r\n      // Add selection info to chat\r\n      const label = source.file\r\n        ? source.componentName + ' — ' + source.file + ':' + source.line\r\n        : '<' + source.componentName + '>' + (source.className ? '.' + source.className.split(' ')[0] : '');\r\n      chat.addMessage({ role: 'system', content: '선택: ' + label });\r\n    }, true);\r\n\r\n    // ---- Box mode: drag red rectangle ----\r\n    let boxDragging = false;\r\n    document.addEventListener('mousedown', (e) => {\r\n      if (!canvasActive || overlay.getMode() !== 'box') return;\r\n      e.preventDefault();\r\n      boxDragging = true;\r\n      overlay.boxTool.startDraw(e.clientX, e.clientY);\r\n    }, true);\r\n\r\n    document.addEventListener('mousemove', (e) => {\r\n      if (!boxDragging) return;\r\n      const rect = overlay.boxTool.updateDraw(e.clientX, e.clientY);\r\n      overlay.clearAnnotations();\r\n      overlay.setMode('box');\r\n    }, true);\r\n\r\n    document.addEventListener('mouseup', (e) => {\r\n      if (!boxDragging) return;\r\n      boxDragging = false;\r\n      const rect = overlay.boxTool.endDraw(e.clientX, e.clientY);\r\n      if (rect.width > 5 && rect.height > 5) {\r\n        chat.addMessage({ role: 'system', content: '영역 선택: ' + Math.round(rect.width) + 'x' + Math.round(rect.height) + 'px' });\r\n      }\r\n    }, true);\r\n\r\n    // ---- Chat send → WS ----\r\n    chat.onMessageSend((message) => {\r\n      // Add user message to chat\r\n      chat.addMessage({ role: 'user', content: message });\r\n\r\n      // Build context with selected element info + current route\r\n      const route = window.location.pathname;\r\n      const context = selectedSource\r\n        ? { source: selectedSource, rect: selectedRect, annotations: overlay.collectAnnotationSet(), route }\r\n        : { annotations: overlay.collectAnnotationSet(), route };\r\n\r\n      // Send via Vite HMR WebSocket\r\n      if (import.meta.hot) {\r\n        import.meta.hot.send('canvas:message', JSON.stringify({\r\n          type: 'canvas:chat',\r\n          payload: { message, context },\r\n        }));\r\n      }\r\n\r\n      // Show pending response\r\n      chat.addMessage({ role: 'assistant', content: '...' });\r\n    });\r\n\r\n    // ---- Receive WS messages ----\r\n    if (import.meta.hot) {\r\n      import.meta.hot.on('canvas:message', (data) => {\r\n        try {\r\n          const msg = typeof data === 'string' ? JSON.parse(data) : data;\r\n          if (msg.type === 'canvas:stream') {\r\n            if (msg.payload.delta) chat.appendStream(msg.payload.delta);\r\n            if (msg.payload.done) chat.appendStream(' [완료]');\r\n          } else if (msg.type === 'canvas:relay-saved') {\r\n            chat.appendStream('저장됨 — 터미널에서 처리하세요');\r\n          } else if (msg.type === 'canvas:error') {\r\n            chat.appendStream('[오류] ' + (msg.payload.message || 'Unknown error'));\r\n          }\r\n        } catch (err) {\r\n          console.warn('[claude-canvas] WS parse error:', err);\r\n        }\r\n      });\r\n    }\r\n\r\n    // ---- Keyboard handler ----\r\n    const keyboard = new KeyboardHandler({\r\n      onToggleMode: toggleCanvas,\r\n      onEscape: deactivateCanvas,\r\n      onToolSwitch: (mode) => {\r\n        if (!canvasActive) return;\r\n        overlay.setMode(mode);\r\n        toolbar.setActiveTool(mode);\r\n      },\r\n      onSend: () => {},\r\n    }, { shortcut: '${shortcut}' });\r\n    keyboard.mount();\r\n  `\r\n}\r\n\r\nexport function claudeCanvas(options: ClaudeCanvasOptions = {}): Plugin {\r\n  return {\r\n    name: 'vite-plugin-claude-canvas',\r\n    apply: 'serve',\r\n\r\n    resolveId(id): string | undefined {\r\n      if (id === VIRTUAL_MODULE_ID) {\r\n        return RESOLVED_VIRTUAL_MODULE_ID\r\n      }\r\n      return undefined\r\n    },\r\n\r\n    load(id): string | undefined {\r\n      if (id === RESOLVED_VIRTUAL_MODULE_ID) {\r\n        return generateClientScript(options)\r\n      }\r\n      return undefined\r\n    },\r\n\r\n    transformIndexHtml() {\r\n      return {\r\n        html: '',\r\n        tags: [\r\n          {\r\n            tag: 'script',\r\n            attrs: { type: 'module', src: `/@id/${VIRTUAL_MODULE_ID}` },\r\n            injectTo: 'body',\r\n          },\r\n        ],\r\n      }\r\n    },\r\n\r\n    configureServer: createServerHook(options),\r\n  }\r\n}\r\n\r\nexport default claudeCanvas\r\n\r\nexport type { ClaudeCanvasOptions }\r\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,54 +1,52 @@
-{
-  "name": "@claude-canvas/vite-plugin",
-  "version": "0.2.0",
-  "description": "Vite plugin for visual annotation → Claude code modification → HMR verification",
-  "type": "module",
-  "main": "./dist/index.js",
-  "types": "./dist/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
-    }
-  },
-  "files": [
-    "dist"
-  ],
-  "publishConfig": {
-    "access": "public"
-  },
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/claude-canvas/claude-canvas.git",
-    "directory": "packages/vite-plugin"
-  },
-  "dependencies": {
-    "@claude-canvas/core": "0.2.0",
-    "@claude-canvas/bridge": "0.2.0"
-  },
-  "devDependencies": {
-    "tsup": "^8.4.0",
-    "vitest": "^3.0.0",
-    "typescript": "^5.7.0",
-    "vite": "^6.1.0",
-    "@types/node": "^22.0.0"
-  },
-  "peerDependencies": {
-    "vite": ">=5.0.0"
-  },
-  "keywords": [
-    "vite",
-    "vite-plugin",
-    "claude",
-    "annotation",
-    "devtools"
-  ],
-  "scripts": {
-    "build": "tsup",
-    "test": "vitest run",
-    "test:watch": "vitest",
-    "lint": "eslint src/",
-    "typecheck": "tsc --noEmit",
-    "clean": "rm -rf dist"
-  }
-}
+{
+  "name": "@claude-canvas/vite-plugin",
+  "version": "1.0.0",
+  "description": "Vite plugin for visual annotation → Claude code modification → HMR verification",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": ["dist"],
+  "scripts": {
+    "build": "tsup",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "lint": "eslint src/",
+    "typecheck": "tsc --noEmit",
+    "clean": "rm -rf dist"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/whdudguq/claude-canvas.git",
+    "directory": "packages/vite-plugin"
+  },
+  "dependencies": {
+    "@claude-canvas/core": "workspace:*",
+    "@claude-canvas/bridge": "workspace:*"
+  },
+  "devDependencies": {
+    "tsup": "^8.4.0",
+    "vitest": "^3.0.0",
+    "typescript": "^5.7.0",
+    "vite": "^6.1.0",
+    "@types/node": "^22.0.0"
+  },
+  "peerDependencies": {
+    "vite": ">=5.0.0"
+  },
+  "keywords": [
+    "vite",
+    "vite-plugin",
+    "claude",
+    "annotation",
+    "devtools"
+  ]
+}