npm - surf-cli - Versions diffs - 2.1.0 → 2.3.0 - Mend

surf-cli 2.1.0 → 2.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (14) hide show

package/README.md +37 -2
package/dist/content/accessibility-tree.js +8 -8
package/dist/content/accessibility-tree.js.map +1 -1
package/dist/service-worker/index.js +11 -11
package/dist/service-worker/index.js.map +1 -1
package/native/chatgpt-client.cjs +29 -22
package/native/cli.cjs +67 -1
package/native/config.cjs +12 -0
package/native/grok-client.cjs +906 -0
package/native/host-helpers.cjs +108 -1
package/native/host.cjs +198 -0
package/native/perplexity-client.cjs +26 -22
package/package.json +1 -1
package/native/stream-viewer.html +0 -415

package/native/stream-viewer.html DELETED Viewed

@@ -1,415 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Surf Stream Viewer</title>
-  <style>
-    * {
-      margin: 0;
-      padding: 0;
-      box-sizing: border-box;
-    }
-    body {
-      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
-      background: #1a1a1a;
-      color: #e0e0e0;
-      display: flex;
-      flex-direction: column;
-      height: 100vh;
-      overflow: hidden;
-    }
-    #status {
-      background: #2d2d2d;
-      padding: 12px 20px;
-      border-bottom: 1px solid #404040;
-      display: flex;
-      align-items: center;
-      gap: 20px;
-      font-size: 14px;
-      flex-shrink: 0;
-    }
-    #status.connected {
-      border-bottom-color: #4caf50;
-    }
-    #status.disconnected {
-      border-bottom-color: #f44336;
-    }
-    .status-indicator {
-      width: 10px;
-      height: 10px;
-      border-radius: 50%;
-      background: #666;
-    }
-    .status-indicator.connected {
-      background: #4caf50;
-      box-shadow: 0 0 8px #4caf50;
-    }
-    .status-indicator.disconnected {
-      background: #f44336;
-    }
-    #viewport-container {
-      flex: 1;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      overflow: auto;
-      background: #0a0a0a;
-      position: relative;
-    }
-    #viewport {
-      display: block;
-      max-width: 100%;
-      max-height: 100%;
-      cursor: crosshair;
-      image-rendering: crisp-edges;
-      image-rendering: pixelated;
-    }
-    #viewport:not(.ready) {
-      opacity: 0.5;
-    }
-    #loading {
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      transform: translate(-50%, -50%);
-      text-align: center;
-      color: #888;
-    }
-    .spinner {
-      border: 3px solid #333;
-      border-top: 3px solid #4caf50;
-      border-radius: 50%;
-      width: 40px;
-      height: 40px;
-      animation: spin 1s linear infinite;
-      margin: 0 auto 10px;
-    }
-    @keyframes spin {
-      0% { transform: rotate(0deg); }
-      100% { transform: rotate(360deg); }
-    }
-  </style>
-</head>
-<body>
-  <div id="status" class="disconnected">
-    <div class="status-indicator disconnected"></div>
-    <span id="status-text">Connecting...</span>
-    <span id="viewport-info" style="margin-left: auto;"></span>
-  </div>
-  <div id="viewport-container">
-    <div id="loading">
-      <div class="spinner"></div>
-      <div>Waiting for stream...</div>
-    </div>
-    <canvas id="viewport"></canvas>
-  </div>
-  <script>
-    const canvas = document.getElementById('viewport');
-    const ctx = canvas.getContext('2d');
-    const statusEl = document.getElementById('status');
-    const statusText = document.getElementById('status-text');
-    const viewportInfo = document.getElementById('viewport-info');
-    const loadingEl = document.getElementById('loading');
-    let ws = null;
-    let frameCount = 0;
-    let lastFrameTime = Date.now();
-    let fps = 0;
-    let isMouseDown = false;
-    let activeButton = 'left';
-    let activeTouches = new Map();
-    function connect() {
-      const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
-      const wsUrl = `${protocol}//${window.location.host}`;
-      ws = new WebSocket(wsUrl);
-      ws.onopen = () => {
-        statusEl.className = 'connected';
-        statusEl.querySelector('.status-indicator').className = 'status-indicator connected';
-        statusText.textContent = 'Connected';
-        loadingEl.style.display = 'none';
-      };
-      ws.onmessage = (event) => {
-        try {
-          const message = JSON.parse(event.data);
-          if (message.type === 'frame') {
-            drawFrame(message);
-          } else if (message.type === 'status') {
-            updateStatus(message);
-          } else if (message.type === 'error') {
-            statusText.textContent = `Error: ${message.message}`;
-            statusEl.className = 'disconnected';
-            statusEl.querySelector('.status-indicator').className = 'status-indicator disconnected';
-          }
-        } catch (e) {
-          console.error('Error parsing message:', e);
-        }
-      };
-      ws.onerror = (error) => {
-        console.error('WebSocket error:', error);
-        statusText.textContent = 'Connection error';
-        statusEl.className = 'disconnected';
-        statusEl.querySelector('.status-indicator').className = 'status-indicator disconnected';
-      };
-      ws.onclose = () => {
-        statusText.textContent = 'Disconnected';
-        statusEl.className = 'disconnected';
-        statusEl.querySelector('.status-indicator').className = 'status-indicator disconnected';
-        loadingEl.style.display = 'block';
-        setTimeout(connect, 2000);
-      };
-    }
-    function drawFrame(message) {
-      const img = new Image();
-      img.onload = () => {
-        canvas.width = img.width;
-        canvas.height = img.height;
-        ctx.drawImage(img, 0, 0);
-        canvas.classList.add('ready');
-        frameCount++;
-        const now = Date.now();
-        if (now - lastFrameTime >= 1000) {
-          fps = frameCount;
-          frameCount = 0;
-          lastFrameTime = now;
-        }
-        updateViewportInfo(img.width, img.height, fps);
-      };
-      const mimeType = message.data.startsWith('iVBORw0K') ? 'image/png' : 'image/jpeg';
-      img.src = `data:${mimeType};base64,${message.data}`;
-    }
-    function updateStatus(message) {
-      if (message.viewportWidth && message.viewportHeight) {
-        updateViewportInfo(message.viewportWidth, message.viewportHeight, fps);
-      }
-    }
-    function updateViewportInfo(width, height, fps) {
-      viewportInfo.textContent = `${width}×${height} | ${fps} fps`;
-    }
-    function getCanvasCoordinates(e) {
-      const rect = canvas.getBoundingClientRect();
-      const scaleX = canvas.width / rect.width;
-      const scaleY = canvas.height / rect.height;
-      const x = Math.round((e.clientX - rect.left) * scaleX);
-      const y = Math.round((e.clientY - rect.top) * scaleY);
-      // Check if click is within canvas bounds
-      if (x < 0 || x > canvas.width || y < 0 || y > canvas.height) {
-        return null;
-      }
-      return { x, y };
-    }
-    function getModifiers(e) {
-      return (e.altKey ? 1 : 0) | (e.ctrlKey ? 2 : 0) | (e.metaKey ? 4 : 0) | (e.shiftKey ? 8 : 0);
-    }
-    function sendMouseEvent(eventType, e, button = 'left') {
-      if (!ws || ws.readyState !== WebSocket.OPEN) return;
-      const coords = getCanvasCoordinates(e);
-      if (!coords) return; // Click outside canvas bounds
-      ws.send(JSON.stringify({
-        type: 'input_mouse',
-        eventType,
-        x: coords.x,
-        y: coords.y,
-        button,
-        clickCount: 1,
-        modifiers: getModifiers(e),
-      }));
-    }
-    canvas.addEventListener('mousedown', (e) => {
-      e.preventDefault();
-      isMouseDown = true;
-      activeButton = e.button === 2 ? 'right' : e.button === 1 ? 'middle' : 'left';
-      // Send mouseMoved first to ensure element has hover state
-      sendMouseEvent('mouseMoved', e, 'none');
-      sendMouseEvent('mousePressed', e, activeButton);
-    });
-    canvas.addEventListener('mouseup', (e) => {
-      e.preventDefault();
-      const button = e.button === 2 ? 'right' : e.button === 1 ? 'middle' : 'left';
-      sendMouseEvent('mouseReleased', e, button);
-      isMouseDown = false;
-      activeButton = 'left';
-    });
-    canvas.addEventListener('mousemove', (e) => {
-      e.preventDefault();
-      if (isMouseDown) {
-        sendMouseEvent('mouseMoved', e, activeButton);
-      }
-    });
-    canvas.addEventListener('mouseleave', (e) => {
-      if (isMouseDown) {
-        sendMouseEvent('mouseReleased', e, activeButton);
-        isMouseDown = false;
-        activeButton = 'left';
-      }
-    });
-    canvas.addEventListener('contextmenu', (e) => {
-      e.preventDefault();
-    });
-    canvas.addEventListener('wheel', (e) => {
-      e.preventDefault();
-      if (!ws || ws.readyState !== WebSocket.OPEN) return;
-      const coords = getCanvasCoordinates(e);
-      let deltaX = e.deltaX;
-      let deltaY = e.deltaY;
-      if (e.deltaMode === 1) {
-        deltaX *= 40;
-        deltaY *= 40;
-      } else if (e.deltaMode === 2) {
-        deltaX *= window.innerHeight;
-        deltaY *= window.innerHeight;
-      }
-      ws.send(JSON.stringify({
-        type: 'input_mouse',
-        eventType: 'mouseWheel',
-        x: coords.x,
-        y: coords.y,
-        deltaX,
-        deltaY,
-        modifiers: getModifiers(e),
-      }));
-    });
-    function getTouchCoordinates(touch) {
-      const rect = canvas.getBoundingClientRect();
-      const scaleX = canvas.width / rect.width;
-      const scaleY = canvas.height / rect.height;
-      return {
-        x: Math.round((touch.clientX - rect.left) * scaleX),
-        y: Math.round((touch.clientY - rect.top) * scaleY),
-        id: touch.identifier,
-      };
-    }
-    function sendTouchEvent(eventType, touches) {
-      if (!ws || ws.readyState !== WebSocket.OPEN) return;
-      ws.send(JSON.stringify({
-        type: 'input_touch',
-        eventType,
-        touchPoints: touches,
-        modifiers: 0,
-      }));
-    }
-    canvas.addEventListener('touchstart', (e) => {
-      e.preventDefault();
-      for (const touch of e.changedTouches) {
-        const coords = getTouchCoordinates(touch);
-        activeTouches.set(touch.identifier, coords);
-      }
-      sendTouchEvent('touchStart', Array.from(activeTouches.values()));
-    });
-    canvas.addEventListener('touchend', (e) => {
-      e.preventDefault();
-      for (const touch of e.changedTouches) {
-        activeTouches.delete(touch.identifier);
-      }
-      sendTouchEvent('touchEnd', Array.from(activeTouches.values()));
-    });
-    canvas.addEventListener('touchmove', (e) => {
-      e.preventDefault();
-      for (const touch of e.changedTouches) {
-        const coords = getTouchCoordinates(touch);
-        activeTouches.set(touch.identifier, coords);
-      }
-      sendTouchEvent('touchMove', Array.from(activeTouches.values()));
-    });
-    canvas.addEventListener('touchcancel', (e) => {
-      e.preventDefault();
-      for (const touch of e.changedTouches) {
-        activeTouches.delete(touch.identifier);
-      }
-      sendTouchEvent('touchCancel', Array.from(activeTouches.values()));
-    });
-    document.addEventListener('keydown', (e) => {
-      if (!ws || ws.readyState !== WebSocket.OPEN) return;
-      if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') return;
-      e.preventDefault();
-      const modifiers = (e.altKey ? 1 : 0) | (e.ctrlKey ? 2 : 0) | (e.metaKey ? 4 : 0) | (e.shiftKey ? 8 : 0);
-      // Send keyDown event
-      ws.send(JSON.stringify({
-        type: 'input_keyboard',
-        eventType: 'keyDown',
-        key: e.key,
-        code: e.code,
-        modifiers,
-      }));
-      // For printable characters, also send a char event
-      if (e.key.length === 1 && !e.ctrlKey && !e.metaKey) {
-        ws.send(JSON.stringify({
-          type: 'input_keyboard',
-          eventType: 'char',
-          text: e.key,
-          modifiers,
-        }));
-      }
-    });
-    document.addEventListener('keyup', (e) => {
-      if (!ws || ws.readyState !== WebSocket.OPEN) return;
-      if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') return;
-      e.preventDefault();
-      ws.send(JSON.stringify({
-        type: 'input_keyboard',
-        eventType: 'keyUp',
-        key: e.key,
-        code: e.code,
-        modifiers: (e.altKey ? 1 : 0) | (e.ctrlKey ? 2 : 0) | (e.metaKey ? 4 : 0) | (e.shiftKey ? 8 : 0),
-      }));
-    });
-    connect();
-  </script>
-</body>
-</html>