@majkapp/plugin-kit 1.3.1 → 1.3.4

package/dist/mcp-dom-agent.js

@@ -0,0 +1,404 @@
+// mcp-dom-agent.js
+// Automatically injected into all MAJK plugin screens for remote control and screenshots
+
+(function () {
+  if (window.__mcpDomAgent) return;
+  window.__mcpDomAgent = true;
+
+  // ---- Configuration ----
+  const SCREENSHOT_ENDPOINT = '/api/mcp/screenshot';
+  let replyId = 0;
+
+  // ---- Helpers ----
+
+  function getById(id) {
+    return document.querySelector('[data-mcp-id="' + CSS.escape(id) + '"]');
+  }
+
+  function centerScroll(el) {
+    el.scrollIntoView({
+      behavior: 'instant',
+      block: 'center',
+      inline: 'center'
+    });
+  }
+
+  function elementCenter(el) {
+    const r = el.getBoundingClientRect();
+    return {
+      x: r.left + r.width / 2,
+      y: r.top + r.height / 2,
+      rect: { x: r.left, y: r.top, width: r.width, height: r.height }
+    };
+  }
+
+  function dispatchClick(el) {
+    const { x, y } = elementCenter(el);
+    ['mousedown', 'mouseup', 'click'].forEach((type) => {
+      el.dispatchEvent(new MouseEvent(type, {
+        bubbles: true,
+        cancelable: true,
+        composed: true,
+        clientX: x,
+        clientY: y,
+        button: 0
+      }));
+    });
+  }
+
+  function dispatchHover(el) {
+    const { x, y } = elementCenter(el);
+    el.dispatchEvent(new MouseEvent('mousemove', {
+      bubbles: true,
+      cancelable: true,
+      composed: true,
+      clientX: x,
+      clientY: y
+    }));
+  }
+
+  function reply(ev, id, result, error) {
+    if (ev.source) {
+      ev.source.postMessage(
+        {
+          __mcpReplyId: id,
+          result: result,
+          error: error ? String(error) : undefined
+        },
+        '*'
+      );
+    }
+  }
+
+  // ---- Screenshot Capture ----
+
+  async function captureScreenshot(options = {}) {
+    try {
+      // Use html2canvas if available, otherwise use basic canvas approach
+      if (typeof html2canvas !== 'undefined') {
+        const canvas = await html2canvas(document.body, {
+          allowTaint: true,
+          useCORS: true,
+          logging: false,
+          ...options
+        });
+        return canvas.toDataURL('image/png');
+      } else {
+        // Fallback: Use basic canvas API to capture visible viewport
+        return captureViewportScreenshot(options);
+      }
+    } catch (error) {
+      console.error('[MCP DOM Agent] Screenshot capture failed:', error);
+      throw error;
+    }
+  }
+
+  function captureViewportScreenshot(options = {}) {
+    return new Promise((resolve, reject) => {
+      try {
+        const canvas = document.createElement('canvas');
+        const ctx = canvas.getContext('2d');
+
+        canvas.width = window.innerWidth;
+        canvas.height = window.innerHeight;
+
+        // This is a basic fallback - it won't capture actual content
+        // but provides a placeholder implementation
+        ctx.fillStyle = '#ffffff';
+        ctx.fillRect(0, 0, canvas.width, canvas.height);
+
+        ctx.fillStyle = '#333333';
+        ctx.font = '20px Arial';
+        ctx.fillText('Screenshot captured at ' + new Date().toISOString(), 50, 50);
+        ctx.fillText('(Install html2canvas for full screenshot support)', 50, 80);
+
+        resolve(canvas.toDataURL('image/png'));
+      } catch (error) {
+        reject(error);
+      }
+    });
+  }
+
+  async function sendScreenshotToBackend(dataUrl, metadata = {}) {
+    try {
+      const baseUrl = window.__MAJK_BASE_URL__ || '';
+      const response = await fetch(baseUrl + SCREENSHOT_ENDPOINT, {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({
+          data: dataUrl,
+          metadata: {
+            url: window.location.href,
+            timestamp: new Date().toISOString(),
+            userAgent: navigator.userAgent,
+            viewport: {
+              width: window.innerWidth,
+              height: window.innerHeight
+            },
+            ...metadata
+          }
+        })
+      });
+
+      if (!response.ok) {
+        throw new Error(`Screenshot upload failed: ${response.status} ${response.statusText}`);
+      }
+
+      const result = await response.json();
+      return result;
+    } catch (error) {
+      console.error('[MCP DOM Agent] Failed to send screenshot to backend:', error);
+      throw error;
+    }
+  }
+
+  // ---- Main Listener ----
+
+  window.addEventListener('message', async function (ev) {
+    const msg = ev.data;
+    if (!msg || !msg.__mcpCmdId) return;
+
+    const cmdId = msg.__mcpCmdId;
+    const type = msg.type;
+    const id = msg.id;
+
+    let el = null;
+    if (typeof id === 'string') {
+      el = getById(id);
+    }
+
+    try {
+      switch (type) {
+
+        case 'find': {
+          reply(ev, cmdId, { exists: !!el });
+          break;
+        }
+
+        case 'scrollIntoView': {
+          if (!el) throw new Error('not found: ' + id);
+          centerScroll(el);
+          requestAnimationFrame(function () {
+            reply(ev, cmdId, { ok: true });
+          });
+          break;
+        }
+
+        case 'click': {
+          if (!el) throw new Error('not found: ' + id);
+          centerScroll(el);
+          requestAnimationFrame(function () {
+            dispatchClick(el);
+            reply(ev, cmdId, { ok: true });
+          });
+          break;
+        }
+
+        case 'hover': {
+          if (!el) throw new Error('not found: ' + id);
+          centerScroll(el);
+          requestAnimationFrame(function () {
+            dispatchHover(el);
+            reply(ev, cmdId, { ok: true });
+          });
+          break;
+        }
+
+        case 'getRect': {
+          if (!el) throw new Error('not found: ' + id);
+          const r = el.getBoundingClientRect();
+          reply(ev, cmdId, {
+            x: r.left,
+            y: r.top,
+            width: r.width,
+            height: r.height
+          });
+          break;
+        }
+
+        case 'captureScreenshot': {
+          const options = msg.options || {};
+          const metadata = msg.metadata || {};
+          const sendToBackend = msg.sendToBackend !== false; // Default true
+
+          // Capture screenshot
+          const dataUrl = await captureScreenshot(options);
+
+          // Send to backend if requested
+          let backendResult = null;
+          if (sendToBackend) {
+            backendResult = await sendScreenshotToBackend(dataUrl, metadata);
+          }
+
+          reply(ev, cmdId, {
+            success: true,
+            dataUrl: sendToBackend ? undefined : dataUrl, // Don't send back if already sent to backend
+            backend: backendResult
+          });
+          break;
+        }
+
+        default: {
+          reply(ev, cmdId, null, 'unknown type: ' + type);
+        }
+      }
+    } catch (err) {
+      reply(ev, cmdId, null, err && err.message ? err.message : String(err));
+    }
+  });
+
+  // ---- File Picker Bridge ----
+  // Since plugins run in cross-origin iframes, they can't directly use File System Access APIs
+  // This bridge sends requests to the parent window which executes the APIs and returns results
+
+  let filePickerRequestId = 0;
+  const pendingFilePickerRequests = new Map();
+
+  // Listen for file picker results from parent window
+  window.addEventListener('message', function (ev) {
+    const msg = ev.data;
+    if (!msg) return;
+
+    // Handle directory picker result
+    if (msg.type === 'majk:file-picker:directory-picker-result') {
+      const pending = pendingFilePickerRequests.get(msg.requestId);
+      if (pending) {
+        pendingFilePickerRequests.delete(msg.requestId);
+        if (msg.success) {
+          pending.resolve(msg.result);
+        } else {
+          pending.reject(new Error(msg.error?.message || 'Directory picker failed'));
+        }
+      }
+    }
+
+    // Handle open file picker result
+    if (msg.type === 'majk:file-picker:open-file-picker-result') {
+      const pending = pendingFilePickerRequests.get(msg.requestId);
+      if (pending) {
+        pendingFilePickerRequests.delete(msg.requestId);
+        if (msg.success) {
+          pending.resolve(msg.results);
+        } else {
+          pending.reject(new Error(msg.error?.message || 'File picker failed'));
+        }
+      }
+    }
+
+    // Handle save file picker result
+    if (msg.type === 'majk:file-picker:save-file-picker-result') {
+      const pending = pendingFilePickerRequests.get(msg.requestId);
+      if (pending) {
+        pendingFilePickerRequests.delete(msg.requestId);
+        if (msg.success) {
+          pending.resolve(msg.result);
+        } else {
+          pending.reject(new Error(msg.error?.message || 'Save file picker failed'));
+        }
+      }
+    }
+  });
+
+  // Polyfill File System Access APIs to use the bridge
+  async function showDirectoryPickerBridge(options) {
+    const requestId = 'file-picker-' + (filePickerRequestId++);
+
+    return new Promise((resolve, reject) => {
+      pendingFilePickerRequests.set(requestId, { resolve, reject });
+
+      // Send request to parent window
+      window.parent.postMessage({
+        type: 'majk:file-picker:show-directory-picker',
+        requestId,
+        options
+      }, '*');
+
+      // Timeout after 5 minutes
+      setTimeout(() => {
+        if (pendingFilePickerRequests.has(requestId)) {
+          pendingFilePickerRequests.delete(requestId);
+          reject(new Error('Directory picker request timed out'));
+        }
+      }, 300000);
+    });
+  }
+
+  async function showOpenFilePickerBridge(options) {
+    const requestId = 'file-picker-' + (filePickerRequestId++);
+
+    return new Promise((resolve, reject) => {
+      pendingFilePickerRequests.set(requestId, { resolve, reject });
+
+      // Send request to parent window
+      window.parent.postMessage({
+        type: 'majk:file-picker:show-open-file-picker',
+        requestId,
+        options
+      }, '*');
+
+      // Timeout after 5 minutes
+      setTimeout(() => {
+        if (pendingFilePickerRequests.has(requestId)) {
+          pendingFilePickerRequests.delete(requestId);
+          reject(new Error('File picker request timed out'));
+        }
+      }, 300000);
+    });
+  }
+
+  async function showSaveFilePickerBridge(options) {
+    const requestId = 'file-picker-' + (filePickerRequestId++);
+
+    return new Promise((resolve, reject) => {
+      pendingFilePickerRequests.set(requestId, { resolve, reject });
+
+      // Send request to parent window
+      window.parent.postMessage({
+        type: 'majk:file-picker:show-save-file-picker',
+        requestId,
+        options
+      }, '*');
+
+      // Timeout after 5 minutes
+      setTimeout(() => {
+        if (pendingFilePickerRequests.has(requestId)) {
+          pendingFilePickerRequests.delete(requestId);
+          reject(new Error('Save file picker request timed out'));
+        }
+      }, 300000);
+    });
+  }
+
+  // ---- Global API for direct access ----
+  window.mcpDomAgent = {
+    version: '1.1.0',
+    captureScreenshot: async (options) => {
+      const dataUrl = await captureScreenshot(options);
+      return dataUrl;
+    },
+    captureAndSend: async (metadata) => {
+      const dataUrl = await captureScreenshot();
+      const result = await sendScreenshotToBackend(dataUrl, metadata);
+      return result;
+    },
+    // File picker APIs - use these instead of native File System Access APIs in plugin iframes
+    showDirectoryPicker: showDirectoryPickerBridge,
+    showOpenFilePicker: showOpenFilePickerBridge,
+    showSaveFilePicker: showSaveFilePickerBridge
+  };
+
+  // Also expose file pickers as global functions for convenience (matching native API)
+  if (!window.showDirectoryPicker) {
+    window.showDirectoryPicker = showDirectoryPickerBridge;
+  }
+  if (!window.showOpenFilePicker) {
+    window.showOpenFilePicker = showOpenFilePickerBridge;
+  }
+  if (!window.showSaveFilePicker) {
+    window.showSaveFilePicker = showSaveFilePickerBridge;
+  }
+
+  console.log('[MCP DOM Agent] Initialized v1.1.0 with File Picker Bridge');
+})();

package/dist/plugin-kit.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"plugin-kit.d.ts","sourceRoot":"","sources":["../src/plugin-kit.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"plugin-kit.d.ts","sourceRoot":"","sources":["../src/plugin-kit.ts"],"names":[],"mappings":"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"}

package/dist/plugin-kit.js

@@ -389,20 +389,44 @@ function serveSpa(ui, req, res, ctx) {
         return;
     }
     let content = fs_1.default.readFileSync(targetFile);
-    // Inject base URL for React apps
+    // Inject base URL for React apps and MCP DOM Agent
     if (path_1.default.basename(targetFile) === 'index.html') {
         const html = content.toString('utf-8');
-        const inject = `<script>` +
+        // Inject configuration
+        const configInject = `<script>` +
             `window.__MAJK_BASE_URL__=${JSON.stringify(ctx.http.baseUrl)};` +
             `window.__MAJK_IFRAME_BASE__=${JSON.stringify(ui.base)};` +
             `window.__MAJK_PLUGIN_ID__=${JSON.stringify(ctx.pluginId)};` +
             `</script>`;
-        const injected = html.replace('</head>', `${inject}</head>`);
+        // Inject MCP DOM Agent script
+        const mcpScript = BuiltPlugin.mcpDomAgentScript
+            ? `<script>${BuiltPlugin.mcpDomAgentScript}</script>`
+            : '';
+        const allInjections = configInject + mcpScript;
+        const injected = html.replace('</head>', `${allInjections}</head>`);
         content = Buffer.from(injected, 'utf-8');
     }
     res.writeHead(200, corsHeaders({ 'Content-Type': getContentType(targetFile) }));
     res.end(content);
 }
+/**
+ * Load MCP DOM Agent script
+ */
+function loadMcpDomAgentScript() {
+    try {
+        const scriptPath = path_1.default.join(__dirname, 'mcp-dom-agent.js');
+        if (fs_1.default.existsSync(scriptPath)) {
+            return fs_1.default.readFileSync(scriptPath, 'utf-8');
+        }
+        // Fallback: return minimal inline version if file not found
+        log('[MCP DOM Agent] Script file not found, using minimal fallback');
+        return `(function(){if(window.__mcpDomAgent)return;window.__mcpDomAgent=true;console.log('[MCP DOM Agent] Minimal fallback loaded');})();`;
+    }
+    catch (error) {
+        log(`[MCP DOM Agent] Failed to load script: ${error.message}`);
+        return '';
+    }
+}
 /**
  * Main plugin class built by the fluent API
  */
@@ -560,6 +584,13 @@ class BuiltPlugin {
         context.logger.info(`🌐 HTTP Port: ${context.http.port}`);
         context.logger.info(`🔗 Base URL: ${context.http.baseUrl}`);
         context.logger.info('═══════════════════════════════════════════════════════');
+        // Load MCP DOM Agent script once for all plugins
+        if (!BuiltPlugin.mcpDomAgentScript) {
+            BuiltPlugin.mcpDomAgentScript = loadMcpDomAgentScript();
+            if (BuiltPlugin.mcpDomAgentScript) {
+                context.logger.info('✅ MCP DOM Agent script loaded - will be injected into all screens');
+            }
+        }
         // Validate file paths now that we have pluginRoot context
         if (this.reactScreens.length > 0 && this.uiConfig) {
             const indexPath = path_1.default.join(this.context.pluginRoot, this.uiConfig.appDir || '', 'index.html');
@@ -814,6 +845,63 @@ class BuiltPlugin {
                     this.context.logger.debug(`← ${method} ${url} 200 (${duration}ms)`);
                     return;
                 }
+                // MCP Screenshot endpoint
+                if (req.method === 'POST' && req.url === '/api/mcp/screenshot') {
+                    try {
+                        const body = await readBody(req);
+                        if (!body || !body.data) {
+                            res.writeHead(400, corsHeaders({ 'Content-Type': 'application/json' }));
+                            res.end(JSON.stringify({ error: 'Missing screenshot data' }));
+                            return;
+                        }
+                        // Create screenshots directory if it doesn't exist
+                        const screenshotsDir = path_1.default.join(this.context.pluginRoot, 'screenshots');
+                        if (!fs_1.default.existsSync(screenshotsDir)) {
+                            fs_1.default.mkdirSync(screenshotsDir, { recursive: true });
+                        }
+                        // Generate filename
+                        const timestamp = new Date().toISOString().replace(/[:.]/g, '-');
+                        const metadata = body.metadata || {};
+                        const customName = metadata.filename || `screenshot-${timestamp}`;
+                        const filename = `${customName}.png`;
+                        const filepath = path_1.default.join(screenshotsDir, filename);
+                        // Extract base64 data (remove data:image/png;base64, prefix if present)
+                        const base64Data = body.data.replace(/^data:image\/\w+;base64,/, '');
+                        const buffer = Buffer.from(base64Data, 'base64');
+                        // Write file
+                        fs_1.default.writeFileSync(filepath, buffer);
+                        // Also save metadata
+                        const metadataPath = path_1.default.join(screenshotsDir, `${customName}.json`);
+                        fs_1.default.writeFileSync(metadataPath, JSON.stringify({
+                            ...metadata,
+                            filename,
+                            filepath,
+                            timestamp: new Date().toISOString(),
+                            size: buffer.length
+                        }, null, 2));
+                        this.context.logger.info(`📸 Screenshot saved: ${filepath}`);
+                        res.writeHead(200, corsHeaders({ 'Content-Type': 'application/json' }));
+                        res.end(JSON.stringify({
+                            success: true,
+                            filename,
+                            filepath,
+                            size: buffer.length,
+                            message: 'Screenshot saved successfully'
+                        }));
+                        const duration = Date.now() - startTime;
+                        this.context.logger.debug(`← ${method} ${url} 200 (${duration}ms)`);
+                        return;
+                    }
+                    catch (error) {
+                        this.context.logger.error(`Failed to save screenshot: ${error.message}`);
+                        res.writeHead(500, corsHeaders({ 'Content-Type': 'application/json' }));
+                        res.end(JSON.stringify({
+                            success: false,
+                            error: error.message || 'Failed to save screenshot'
+                        }));
+                        return;
+                    }
+                }
                 // HTML screens virtual route
                 if (req.method === 'GET' && req.url?.startsWith('/__html/')) {
                     const id = decodeURIComponent(req.url.substring('/__html/'.length)).split('?')[0];
@@ -826,8 +914,9 @@ class BuiltPlugin {
                         return;
                     }
                     res.writeHead(200, corsHeaders({ 'Content-Type': 'text/html; charset=utf-8' }));
+                    let htmlContent;
                     if ('html' in screen) {
-                        res.end(screen.html);
+                        htmlContent = screen.html;
                     }
                     else {
                         const filePath = path_1.default.join(this.context.pluginRoot, screen.htmlFile);
@@ -843,7 +932,7 @@ class BuiltPlugin {
                             return;
                         }
                         try {
-                            res.end(fs_1.default.readFileSync(filePath));
+                            htmlContent = fs_1.default.readFileSync(filePath, 'utf-8');
                         }
                         catch (error) {
                             this.context.logger.error(`Failed to read HTML file: ${error.message}`);
@@ -854,6 +943,21 @@ class BuiltPlugin {
                             return;
                         }
                     }
+                    // Inject MCP DOM Agent script into HTML screens
+                    if (BuiltPlugin.mcpDomAgentScript) {
+                        const mcpScript = `<script>${BuiltPlugin.mcpDomAgentScript}</script>`;
+                        // Try to inject before </body>, fallback to </head>, fallback to end of HTML
+                        if (htmlContent.includes('</body>')) {
+                            htmlContent = htmlContent.replace('</body>', `${mcpScript}</body>`);
+                        }
+                        else if (htmlContent.includes('</head>')) {
+                            htmlContent = htmlContent.replace('</head>', `${mcpScript}</head>`);
+                        }
+                        else {
+                            htmlContent += mcpScript;
+                        }
+                    }
+                    res.end(htmlContent);
                     const duration = Date.now() - startTime;
                     this.context.logger.debug(`← ${method} ${url} 200 (${duration}ms)`);
                     return;
@@ -1002,6 +1106,8 @@ class BuiltPlugin {
         });
     }
 }
+// MCP DOM Agent script (loaded once at startup, accessible to serveSpa function)
+BuiltPlugin.mcpDomAgentScript = null;
 /**
  * Group tools by scope
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@majkapp/plugin-kit",
-  "version": "1.3.1",
+  "version": "1.3.4",
   "description": "Fluent builder framework for creating robust MAJK plugins",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -21,7 +21,7 @@
     "README.md"
   ],
   "scripts": {
-    "build": "tsc",
+    "build": "tsc && cp src/mcp-dom-agent.js dist/mcp-dom-agent.js",
     "watch": "tsc --watch",
     "clean": "rm -rf dist"
   },