@veolab/discoverylab 1.4.4 → 1.6.5

package/dist/{chunk-HB3YPWF3.js → chunk-Q7Q3A2ZI.js}

@@ -1,3 +1,9 @@
+import {
+  checkNotionAuth,
+  createNotionPage,
+  loginToNotion,
+  quickExportToNotion
+} from "./chunk-34GGYFXX.js";
 import {
   detectKeyFrames,
   extractFrames,
@@ -8,14 +14,9 @@ import {
 import {
   createErrorResult,
   createJsonResult,
-  createTextResult
-} from "./chunk-XKX6NBHF.js";
-import {
-  checkNotionAuth,
-  createNotionPage,
-  loginToNotion,
-  quickExportToNotion
-} from "./chunk-34GGYFXX.js";
+  createTextResult,
+  mcpServer
+} from "./chunk-TWRWARU4.js";
 import {
   getAvailableTemplates,
   isTemplatesInstalled
@@ -3776,6 +3777,93 @@ var exportSequenceTool = {
     }, null, 2));
   }
 };
+var exportInfographicTool = {
+  name: "dlab.export.infographic",
+  description: "Export a DiscoveryLab project as an interactive HTML infographic. Generates a self-contained offline HTML file with animated frame player, hotspots, annotations, and baseline status.",
+  inputSchema: z6.object({
+    projectId: z6.string().describe("Project ID"),
+    open: z6.boolean().optional().describe("Open in browser after export"),
+    outputPath: z6.string().optional().describe("Custom output directory")
+  }),
+  handler: async (params) => {
+    try {
+      const { projects: projectsTable, frames: framesTable, FRAMES_DIR, PROJECTS_DIR: PROJECTS_DIR3 } = await import("./db-5ECN3O7F.js");
+      const { eq: eq4 } = await import("drizzle-orm");
+      const { collectFrameImages, buildInfographicData, generateInfographicHtml } = await import("./infographic-GQAHEOAA.js");
+      const db = getDatabase();
+      const [project] = await db.select().from(projectsTable).where(eq4(projectsTable.id, params.projectId)).limit(1);
+      if (!project) return createErrorResult(`Project not found: ${params.projectId}`);
+      const dbFrames = await db.select().from(framesTable).where(eq4(framesTable.projectId, project.id)).orderBy(framesTable.frameNumber).limit(20);
+      let frameFiles;
+      let frameOcr;
+      if (dbFrames.length > 0) {
+        frameFiles = dbFrames.map((f) => f.imagePath);
+        frameOcr = dbFrames;
+      } else {
+        frameFiles = collectFrameImages(
+          path5.join(FRAMES_DIR, project.id),
+          project.videoPath,
+          PROJECTS_DIR3,
+          project.id
+        );
+        frameOcr = frameFiles.map(() => ({ ocrText: null }));
+      }
+      if (frameFiles.length === 0) {
+        return createErrorResult("No frames found. Run analyzer first.");
+      }
+      const data = buildInfographicData(project, frameFiles, frameOcr);
+      const slug = (project.marketingTitle || project.name || project.id).toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "").slice(0, 40);
+      const outputFilePath = params.outputPath ? path5.join(params.outputPath, `${slug}-infographic.html`) : path5.join(EXPORTS_DIR, `${slug}-infographic.html`);
+      const result = generateInfographicHtml(data, outputFilePath);
+      if (!result.success) {
+        return createErrorResult(`Export failed: ${result.error}`);
+      }
+      if (params.open) {
+        const { exec: exec5 } = await import("child_process");
+        exec5(`open "${result.outputPath}"`);
+      }
+      const sizeKb = ((result.size || 0) / 1024).toFixed(1);
+      return createTextResult(`Infographic exported!
+
+Path: ${result.outputPath}
+Size: ${sizeKb}KB
+Frames: ${result.frameCount}
+
+Open in any browser to view.`);
+    } catch (error) {
+      return createErrorResult(`Export failed: ${error instanceof Error ? error.message : String(error)}`);
+    }
+  }
+};
+var importProjectTool = {
+  name: "dlab.project.import",
+  description: "Import a shared .applab project bundle file. Use this when someone shares a .applab file with you.",
+  inputSchema: z6.object({
+    filePath: z6.string().describe("Path to the .applab file")
+  }),
+  handler: async (params) => {
+    try {
+      const { projects: projectsTable, frames: framesTable, DATA_DIR: DATA_DIR2, FRAMES_DIR, PROJECTS_DIR: PROJECTS_DIR3 } = await import("./db-5ECN3O7F.js");
+      const { importApplabBundle } = await import("./import-W2JEW254.js");
+      const db = getDatabase();
+      const result = await importApplabBundle(params.filePath, db, { projects: projectsTable, frames: framesTable }, {
+        dataDir: DATA_DIR2,
+        framesDir: FRAMES_DIR,
+        projectsDir: PROJECTS_DIR3
+      });
+      if (!result.success) return createErrorResult(`Import failed: ${result.error}`);
+      return createTextResult(`Project imported!
+
+Name: ${result.projectName}
+ID: ${result.projectId}
+Frames: ${result.frameCount}
+
+Use dlab.knowledge.search to query this project.`);
+    } catch (error) {
+      return createErrorResult(`Import failed: ${error instanceof Error ? error.message : String(error)}`);
+    }
+  }
+};
 var exportTools = [
   exportVideoTool,
   exportGifTool,
@@ -3788,7 +3876,9 @@ var exportTools = [
   exportInfoTool,
   exportClipboardTool,
   exportRevealTool,
-  exportSequenceTool
+  exportSequenceTool,
+  exportInfographicTool,
+  importProjectTool
 ];
 
 // src/mcp/tools/testing.ts
@@ -6830,6 +6920,102 @@ var templateTools = [
 // src/mcp/tools/knowledge.ts
 import { z as z12 } from "zod";
 import { desc as desc2 } from "drizzle-orm";
+var KNOWLEDGE_VIEWER_RESOURCE_URI = "ui://discoverylab/knowledge-viewer.html";
+var KNOWLEDGE_VIEWER_MIME_TYPE = "text/html;profile=mcp-app";
+function buildViewerPlaceholderHtml(message) {
+  const safeMessage = JSON.stringify(message);
+  return `<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>DiscoveryLab Flow Viewer</title>
+    <style>
+      :root {
+        color-scheme: dark;
+        --bg: #0b1117;
+        --panel: rgba(255, 255, 255, 0.04);
+        --border: rgba(255, 255, 255, 0.1);
+        --text: #eff5fb;
+        --muted: #9fb0c2;
+        --accent: #2dd4bf;
+      }
+
+      * { box-sizing: border-box; }
+
+      body {
+        margin: 0;
+        min-height: 100vh;
+        display: grid;
+        place-items: center;
+        padding: 24px;
+        background:
+          radial-gradient(circle at top left, rgba(45, 212, 191, 0.18), transparent 28%),
+          linear-gradient(180deg, #101826, var(--bg));
+        color: var(--text);
+        font: 14px/1.5 "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
+      }
+
+      .card {
+        width: min(720px, 100%);
+        border: 1px solid var(--border);
+        border-radius: 24px;
+        padding: 24px;
+        background: var(--panel);
+        box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
+      }
+
+      .eyebrow {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        border: 1px solid var(--border);
+        border-radius: 999px;
+        padding: 6px 12px;
+        color: var(--muted);
+        font-size: 12px;
+        text-transform: uppercase;
+        letter-spacing: 0.03em;
+      }
+
+      h1 {
+        margin: 16px 0 8px;
+        font: 700 32px/1.02 "Space Grotesk", "Avenir Next", system-ui, sans-serif;
+        letter-spacing: -0.03em;
+      }
+
+      p {
+        margin: 0;
+        color: var(--muted);
+      }
+    </style>
+  </head>
+  <body>
+    <main class="card">
+      <div class="eyebrow">DiscoveryLab Local Viewer</div>
+      <h1>Open a flow in Claude Desktop</h1>
+      <p id="message"></p>
+    </main>
+    <script>
+      document.getElementById('message').textContent = ${safeMessage};
+    </script>
+  </body>
+</html>`;
+}
+mcpServer.registerResource({
+  uri: KNOWLEDGE_VIEWER_RESOURCE_URI,
+  name: "discoverylab-knowledge-viewer",
+  title: "DiscoveryLab Flow Viewer",
+  description: "Interactive local flow viewer for DiscoveryLab projects.",
+  mimeType: KNOWLEDGE_VIEWER_MIME_TYPE,
+  contents: [
+    {
+      uri: KNOWLEDGE_VIEWER_RESOURCE_URI,
+      mimeType: KNOWLEDGE_VIEWER_MIME_TYPE,
+      text: buildViewerPlaceholderHtml("Use dlab.knowledge.open to load a local project into the canvas.")
+    }
+  ]
+});
 var knowledgeSearchTool = {
   name: "dlab.knowledge.search",
   description: `Search across all DiscoveryLab projects for app flows, UI elements, screens, and behaviors. Use this when the user asks about how an app works, what a specific screen looks like, or any question about captured app flows. Returns relevant projects with their analysis, OCR text, and context.`,
@@ -6997,9 +7183,114 @@ Use \`dlab.knowledge.search\` with a query to find specific flows or screens.`;
     }
   }
 };
+var knowledgeOpenTool = {
+  name: "dlab.knowledge.open",
+  description: `Open an interactive visual infographic of an app flow. Returns self-contained HTML that Claude Desktop renders as a canvas/artifact. Use this when the user wants to SEE a flow visually, not just read about it. The HTML includes animated frame player, annotations, and navigation.`,
+  inputSchema: z12.object({
+    query: z12.string().optional().describe('Search query to find the project (e.g. "login flow", "onboarding")'),
+    projectId: z12.string().optional().describe("Direct project ID if known")
+  }),
+  _meta: {
+    ui: {
+      resourceUri: KNOWLEDGE_VIEWER_RESOURCE_URI
+    }
+  },
+  handler: async (params) => {
+    try {
+      const db = getDatabase();
+      let project = null;
+      if (params.projectId) {
+        const { eq: eq5 } = await import("drizzle-orm");
+        const [p] = await db.select().from(projects).where(eq5(projects.id, params.projectId)).limit(1);
+        project = p;
+      } else if (params.query) {
+        const allProjects = await db.select().from(projects).orderBy(desc2(projects.updatedAt));
+        const query = params.query.toLowerCase();
+        const queryTerms = query.split(/\s+/).filter((t) => t.length > 1);
+        let bestScore = 0;
+        for (const p of allProjects) {
+          let score = 0;
+          const fields = [p.name, p.marketingTitle, p.aiSummary, p.ocrText, p.tags, p.linkedTicket].filter(Boolean);
+          for (const field of fields) {
+            const text = field.toLowerCase();
+            for (const term of queryTerms) {
+              if (text.includes(term)) score += 1;
+            }
+            if (text.includes(query)) score += 3;
+          }
+          if (score > bestScore) {
+            bestScore = score;
+            project = p;
+          }
+        }
+      }
+      if (!project) {
+        return createErrorResult(`No project found${params.query ? ` for "${params.query}"` : ""}. Use dlab.knowledge.summary to see available projects.`);
+      }
+      const { eq: eq4 } = await import("drizzle-orm");
+      const { FRAMES_DIR, PROJECTS_DIR: PROJECTS_DIR3 } = await import("./db-5ECN3O7F.js");
+      const { join: join12 } = await import("path");
+      const dbFrames = await db.select().from(frames).where(eq4(frames.projectId, project.id)).orderBy(frames.frameNumber).limit(15);
+      let frameFiles;
+      let frameOcr;
+      if (dbFrames.length > 0) {
+        frameFiles = dbFrames.map((f) => f.imagePath);
+        frameOcr = dbFrames;
+      } else {
+        const { collectFrameImages } = await import("./infographic-GQAHEOAA.js");
+        frameFiles = collectFrameImages(join12(FRAMES_DIR, project.id), project.videoPath, PROJECTS_DIR3, project.id);
+        frameOcr = frameFiles.map(() => ({ ocrText: null }));
+      }
+      if (frameFiles.length === 0) {
+        return createTextResult(`Project "${project.marketingTitle || project.name}" has no frames. Run the analyzer first, then try again.`);
+      }
+      const { buildInfographicData, generateInfographicHtmlString } = await import("./infographic-GQAHEOAA.js");
+      const data = buildInfographicData(project, frameFiles, frameOcr);
+      const html = generateInfographicHtmlString(data);
+      if (!html) {
+        return createErrorResult("Failed to generate infographic HTML (template not found)");
+      }
+      mcpServer.upsertResourceContents(KNOWLEDGE_VIEWER_RESOURCE_URI, {
+        name: "discoverylab-knowledge-viewer",
+        title: `DiscoveryLab Flow Viewer \xB7 ${project.marketingTitle || project.name}`,
+        description: "Interactive local flow viewer for DiscoveryLab projects.",
+        mimeType: KNOWLEDGE_VIEWER_MIME_TYPE,
+        contents: [
+          {
+            uri: KNOWLEDGE_VIEWER_RESOURCE_URI,
+            mimeType: KNOWLEDGE_VIEWER_MIME_TYPE,
+            text: html
+          }
+        ]
+      });
+      return {
+        content: [
+          {
+            type: "text",
+            text: `Opened the local DiscoveryLab flow viewer for ${project.marketingTitle || project.name}.`
+          }
+        ],
+        structuredContent: {
+          projectId: project.id,
+          name: project.marketingTitle || project.name,
+          frameCount: frameFiles.length,
+          platform: project.platform || "unknown"
+        },
+        _meta: {
+          ui: {
+            resourceUri: KNOWLEDGE_VIEWER_RESOURCE_URI
+          }
+        }
+      };
+    } catch (error) {
+      return createErrorResult(`Failed to open flow: ${error instanceof Error ? error.message : String(error)}`);
+    }
+  }
+};
 var knowledgeTools = [
   knowledgeSearchTool,
-  knowledgeSummaryTool
+  knowledgeSummaryTool,
+  knowledgeOpenTool
 ];
 
 export {

package/dist/{chunk-XKX6NBHF.js → chunk-TWRWARU4.js}

@@ -6,6 +6,7 @@ import {
 import { z } from "zod";
 var MCPServer = class {
   tools = /* @__PURE__ */ new Map();
+  resources = /* @__PURE__ */ new Map();
   serverInfo = {
     name: "discoverylab",
     version: APP_VERSION
@@ -18,6 +19,15 @@ var MCPServer = class {
       this.registerTool(tool);
     }
   }
+  registerResource(resource) {
+    this.resources.set(resource.uri, resource);
+  }
+  upsertResourceContents(uri, resource) {
+    this.resources.set(uri, {
+      uri,
+      ...resource
+    });
+  }
   async handleRequest(request) {
     const { id, method, params } = request;
     try {
@@ -28,6 +38,10 @@ var MCPServer = class {
           return this.handleToolsList(id);
         case "tools/call":
           return this.handleToolCall(id, params);
+        case "resources/list":
+          return this.handleResourcesList(id);
+        case "resources/read":
+          return this.handleResourcesRead(id, params);
         case "ping":
           return { jsonrpc: "2.0", id, result: { pong: true } };
         default:
@@ -54,7 +68,8 @@ var MCPServer = class {
         protocolVersion: "2024-11-05",
         serverInfo: this.serverInfo,
         capabilities: {
-          tools: {}
+          tools: {},
+          resources: {}
         }
       }
     };
@@ -63,7 +78,8 @@ var MCPServer = class {
     const tools = Array.from(this.tools.values()).map((tool) => ({
       name: tool.name,
       description: tool.description,
-      inputSchema: this.zodToJsonSchema(tool.inputSchema)
+      inputSchema: this.zodToJsonSchema(tool.inputSchema),
+      ...tool._meta ? { _meta: tool._meta } : {}
     }));
     return {
       jsonrpc: "2.0",
@@ -71,6 +87,40 @@ var MCPServer = class {
       result: { tools }
     };
   }
+  handleResourcesList(id) {
+    const resources = Array.from(this.resources.values()).map((resource) => ({
+      uri: resource.uri,
+      name: resource.name,
+      ...resource.title ? { title: resource.title } : {},
+      ...resource.description ? { description: resource.description } : {},
+      mimeType: resource.mimeType
+    }));
+    return {
+      jsonrpc: "2.0",
+      id,
+      result: { resources }
+    };
+  }
+  handleResourcesRead(id, params) {
+    const uri = typeof params?.uri === "string" ? params.uri : "";
+    const resource = this.resources.get(uri);
+    if (!resource) {
+      return {
+        jsonrpc: "2.0",
+        id,
+        error: { code: -32602, message: `Resource not found: ${uri}` }
+      };
+    }
+    const contents = Array.isArray(resource.contents) && resource.contents.length > 0 ? resource.contents : [{
+      uri: resource.uri,
+      mimeType: resource.mimeType
+    }];
+    return {
+      jsonrpc: "2.0",
+      id,
+      result: { contents }
+    };
+  }
   async handleToolCall(id, params) {
     const { name, arguments: args } = params;
     const tool = this.tools.get(name);