@bridgekitux/browser-bridge 0.1.0

package/README.md

@@ -0,0 +1,21 @@
+# @bridgekitux/browser-bridge
+
+Host-page and browser-extension bridge helpers for connecting restricted browser runtimes to a local BridgeKit agent.
+
+## Install
+
+```sh
+npm install @bridgekitux/browser-bridge
+```
+
+## Use
+
+```ts
+import { createHostPageBridge } from '@bridgekitux/browser-bridge';
+
+const bridge = createHostPageBridge({
+  allowedOriginPatterns: ['https://bolt.new', 'https://*.bolt.new']
+});
+```
+
+Use this package from trusted host pages or extension contexts. Keep origin allowlists strict in production.

package/dist/extension-unpacked/background.js

@@ -0,0 +1,93 @@
+import { bridgeError, getPolicy, isOriginAllowed } from './policy.js';
+
+let socket;
+let activeAgentUrl;
+const pending = new Map();
+const ports = new Set();
+const requestOwners = new Map();
+
+function validBridgeMessage(message) {
+  return message && message.protocolVersion === '0.1.0' && typeof message.type === 'string' && (message.id === undefined || typeof message.id === 'string');
+}
+
+async function ensureSocket() {
+  const policy = await getPolicy();
+  if (socket && activeAgentUrl === policy.agentUrl && (socket.readyState === WebSocket.OPEN || socket.readyState === WebSocket.CONNECTING)) return socket;
+  if (socket) socket.close();
+  activeAgentUrl = policy.agentUrl;
+  socket = new WebSocket(policy.agentUrl);
+  socket.addEventListener('message', (event) => {
+    let message;
+    try {
+      message = JSON.parse(event.data);
+    } catch {
+      return;
+    }
+    if (message.type === 'event') {
+      for (const port of ports) port.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.event', message });
+      return;
+    }
+    const owner = message.id ? requestOwners.get(message.id) : undefined;
+    const callback = message.id ? pending.get(message.id) : undefined;
+    if (message.id) {
+      pending.delete(message.id);
+      requestOwners.delete(message.id);
+    }
+    if (owner && ports.has(owner)) owner.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.response', message });
+    else if (callback) callback(message);
+  });
+  socket.addEventListener('close', () => {
+    for (const [id, owner] of requestOwners.entries()) {
+      if (ports.has(owner)) owner.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.response', message: bridgeError('bridge_closed', 'BridgeKit agent connection closed', id) });
+    }
+    requestOwners.clear();
+    pending.clear();
+  });
+  return socket;
+}
+
+async function isSenderAllowed(sender, pageOrigin) {
+  const policy = await getPolicy();
+  const senderOrigin = sender?.url ? new URL(sender.url).origin : pageOrigin;
+  return Boolean(pageOrigin && senderOrigin === pageOrigin && isOriginAllowed(pageOrigin, policy.allowedOrigins));
+}
+
+chrome.runtime.onConnect.addListener((port) => {
+  if (port.name !== 'bridgekit-page') return;
+  ports.add(port);
+  port.onDisconnect.addListener(() => {
+    ports.delete(port);
+    for (const [id, owner] of requestOwners.entries()) {
+      if (owner === port) requestOwners.delete(id);
+    }
+  });
+  port.onMessage.addListener((request) => {
+    void (async () => {
+      const pageOrigin = typeof request?.pageOrigin === 'string' ? request.pageOrigin : undefined;
+      if (!request || request.source !== 'bridgekit-client') return;
+      if (!(await isSenderAllowed(port.sender, pageOrigin))) {
+        port.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.response', message: bridgeError('origin_not_allowed', `BridgeKit origin is not allowed: ${pageOrigin ?? 'unknown'}`, request.message?.id) });
+        return;
+      }
+      if (request.type === 'bridgekit.detect') {
+        const policy = await getPolicy();
+        port.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.available', agentUrl: policy.agentUrl, allowed: true });
+        return;
+      }
+      if (request.type !== 'bridgekit.request' || !validBridgeMessage(request.message)) {
+        port.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.response', message: bridgeError('invalid_bridge_message', 'Invalid BridgeKit message', request.message?.id) });
+        return;
+      }
+      const ws = await ensureSocket();
+      const send = () => {
+        if (request.message.id) requestOwners.set(request.message.id, port);
+        ws.send(JSON.stringify(request.message));
+      };
+      if (ws.readyState === WebSocket.OPEN) send();
+      else ws.addEventListener('open', send, { once: true });
+      ws.addEventListener('error', () => {
+        port.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.response', message: bridgeError('agent_unavailable', 'BridgeKit local agent is not reachable', request.message.id) });
+      }, { once: true });
+    })();
+  });
+});

package/dist/extension-unpacked/content-script.js

@@ -0,0 +1,24 @@
+const port = chrome.runtime.connect({ name: 'bridgekit-page' });
+const pageOrigin = window.location.origin;
+
+port.onMessage.addListener((message) => {
+  if (!message || message.source !== 'bridgekit-extension') return;
+  if (message.type === 'bridgekit.event') {
+    window.postMessage({ source: 'bridgekit-bridge', type: 'bridgekit.event', message: message.message }, pageOrigin);
+    return;
+  }
+  if (message.type === 'bridgekit.available') {
+    window.postMessage({ source: 'bridgekit-bridge', type: 'bridgekit.available', agentUrl: message.agentUrl, allowed: message.allowed }, pageOrigin);
+    return;
+  }
+  window.postMessage({ source: 'bridgekit-bridge', type: 'bridgekit.response', message: message.message }, pageOrigin);
+});
+
+window.addEventListener('message', (event) => {
+  if (event.source !== window || event.origin !== pageOrigin) return;
+  const data = event.data;
+  if (!data || data.source !== 'bridgekit-client') return;
+  port.postMessage({ ...data, pageOrigin });
+});
+
+port.postMessage({ source: 'bridgekit-client', type: 'bridgekit.detect', pageOrigin });

package/dist/extension-unpacked/manifest.json

@@ -0,0 +1,30 @@
+{
+  "manifest_version": 3,
+  "name": "BridgeKit Browser Bridge",
+  "version": "0.1.0",
+  "description": "Relays approved BridgeKit requests from WebContainers and browser sandboxes to the local BridgeKit agent.",
+  "permissions": ["storage"],
+  "host_permissions": ["http://127.0.0.1/*", "ws://127.0.0.1/*"],
+  "background": {
+    "service_worker": "background.js",
+    "type": "module"
+  },
+  "options_ui": {
+    "page": "options.html",
+    "open_in_tab": true
+  },
+  "content_scripts": [
+    {
+      "matches": [
+        "https://bolt.new/*",
+        "https://*.bolt.new/*",
+        "https://stackblitz.com/*",
+        "https://*.stackblitz.com/*",
+        "http://localhost/*",
+        "http://127.0.0.1/*"
+      ],
+      "js": ["content-script.js"],
+      "run_at": "document_start"
+    }
+  ]
+}

package/dist/extension-unpacked/options.html

@@ -0,0 +1,28 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>BridgeKit Browser Bridge Options</title>
+    <style>
+      body { font-family: system-ui, sans-serif; max-width: 760px; margin: 40px auto; padding: 0 20px; color: #0f172a; }
+      label { display: block; font-weight: 700; margin: 18px 0 8px; }
+      input, textarea { width: 100%; box-sizing: border-box; padding: 10px; border: 1px solid #cbd5e1; border-radius: 10px; font: inherit; }
+      textarea { min-height: 180px; font-family: ui-monospace, monospace; }
+      button { margin-top: 16px; margin-right: 8px; border: 0; border-radius: 999px; padding: 10px 14px; background: #0284c7; color: white; font-weight: 700; cursor: pointer; }
+      button.secondary { background: #475569; }
+      #status { margin-top: 16px; color: #166534; }
+    </style>
+  </head>
+  <body>
+    <h1>BridgeKit Browser Bridge</h1>
+    <p>Only origins listed here can ask the extension to relay BridgeKit requests to the local agent.</p>
+    <label for="agentUrl">Local agent WebSocket URL</label>
+    <input id="agentUrl" />
+    <label for="allowedOrigins">Allowed origin patterns, one per line</label>
+    <textarea id="allowedOrigins"></textarea>
+    <button id="save">Save</button>
+    <button id="defaults" class="secondary">Restore defaults</button>
+    <p id="status"></p>
+    <script type="module" src="options.js"></script>
+  </body>
+</html>

package/dist/extension-unpacked/options.js

@@ -0,0 +1,27 @@
+import { DEFAULT_AGENT_URL, DEFAULT_ALLOWED_ORIGINS } from './policy.js';
+
+const agentUrl = document.querySelector('#agentUrl');
+const allowedOrigins = document.querySelector('#allowedOrigins');
+const status = document.querySelector('#status');
+
+async function load() {
+  const stored = await chrome.storage.local.get(['agentUrl', 'allowedOrigins']);
+  agentUrl.value = stored.agentUrl || DEFAULT_AGENT_URL;
+  allowedOrigins.value = (stored.allowedOrigins || DEFAULT_ALLOWED_ORIGINS).join('\n');
+}
+
+async function save() {
+  const origins = allowedOrigins.value.split('\n').map((line) => line.trim()).filter(Boolean);
+  await chrome.storage.local.set({ agentUrl: agentUrl.value.trim() || DEFAULT_AGENT_URL, allowedOrigins: origins.length ? origins : DEFAULT_ALLOWED_ORIGINS });
+  status.textContent = 'Saved BridgeKit browser bridge settings.';
+}
+
+async function restoreDefaults() {
+  agentUrl.value = DEFAULT_AGENT_URL;
+  allowedOrigins.value = DEFAULT_ALLOWED_ORIGINS.join('\n');
+  await save();
+}
+
+document.querySelector('#save').addEventListener('click', () => void save());
+document.querySelector('#defaults').addEventListener('click', () => void restoreDefaults());
+void load();

package/dist/extension-unpacked/policy.js

@@ -0,0 +1,53 @@
+export const DEFAULT_AGENT_URL = 'ws://127.0.0.1:7777/bridgekit';
+export const DEFAULT_ALLOWED_ORIGINS = [
+  'https://bolt.new',
+  'https://*.bolt.new',
+  'https://stackblitz.com',
+  'https://*.stackblitz.com',
+  'http://localhost:*',
+  'http://127.0.0.1:*'
+];
+
+export async function getPolicy() {
+  const stored = await chrome.storage.local.get(['agentUrl', 'allowedOrigins']);
+  return {
+    agentUrl: typeof stored.agentUrl === 'string' && stored.agentUrl.length > 0 ? stored.agentUrl : DEFAULT_AGENT_URL,
+    allowedOrigins: Array.isArray(stored.allowedOrigins) && stored.allowedOrigins.length > 0 ? stored.allowedOrigins : DEFAULT_ALLOWED_ORIGINS
+  };
+}
+
+export function isOriginAllowed(origin, patterns) {
+  let parsed;
+  try {
+    parsed = new URL(origin);
+  } catch {
+    return false;
+  }
+  return patterns.some((pattern) => originMatchesPattern(parsed, pattern));
+}
+
+function originMatchesPattern(origin, pattern) {
+  let parsedPattern;
+  try {
+    parsedPattern = new URL(pattern.replace(':*', ':0'));
+  } catch {
+    return false;
+  }
+  if (parsedPattern.protocol !== origin.protocol) return false;
+  const rawHost = pattern.replace(/^[a-z]+:\/\//, '').replace(/:\*$/, '').replace(/:\d+$/, '');
+  const portWildcard = pattern.endsWith(':*');
+  const explicitPort = pattern.match(/:(\d+)$/)?.[1];
+  if (!portWildcard && explicitPort && origin.port !== explicitPort) return false;
+  if (!portWildcard && !explicitPort && origin.port !== parsedPattern.port) return false;
+  if (rawHost.startsWith('*.')) {
+    const suffix = rawHost.slice(2);
+    return origin.hostname === suffix || origin.hostname.endsWith(`.${suffix}`);
+  }
+  return origin.hostname === rawHost;
+}
+
+export function bridgeError(code, message, id) {
+  return id
+    ? { protocolVersion: '0.1.0', type: 'error', id, error: { code, message } }
+    : { protocolVersion: '0.1.0', type: 'error', error: { code, message } };
+}

package/dist/src/index.d.ts

@@ -0,0 +1,13 @@
+export declare const DEFAULT_ALLOWED_ORIGIN_PATTERNS: readonly ["https://bolt.new", "https://*.bolt.new", "https://stackblitz.com", "https://*.stackblitz.com", "http://localhost:*", "http://127.0.0.1:*"];
+export interface HostPageBridgeOptions {
+    agentUrl?: string;
+    allowedOrigins?: string[];
+    allowedOriginPatterns?: string[];
+    targetOrigin?: string;
+}
+export interface HostPageBridgeController {
+    close(): void;
+}
+export declare function isOriginAllowed(origin: string, patterns?: readonly string[]): boolean;
+export declare function createHostPageBridge(options?: HostPageBridgeOptions): HostPageBridgeController;
+//# sourceMappingURL=index.d.ts.map

package/dist/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,+BAA+B,uJAOlC,CAAC;AAEX,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,qBAAqB,CAAC,EAAE,MAAM,EAAE,CAAC;IACjC,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,wBAAwB;IACvC,KAAK,IAAI,IAAI,CAAC;CACf;AAED,wBAAgB,eAAe,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,GAAE,SAAS,MAAM,EAAoC,GAAG,OAAO,CAQtH;AAsBD,wBAAgB,oBAAoB,CAAC,OAAO,GAAE,qBAA0B,GAAG,wBAAwB,CAkFlG"}

package/dist/src/index.js

@@ -0,0 +1,128 @@
+import { parseMessage } from '@bridgekitux/protocol';
+export const DEFAULT_ALLOWED_ORIGIN_PATTERNS = [
+    'https://bolt.new',
+    'https://*.bolt.new',
+    'https://stackblitz.com',
+    'https://*.stackblitz.com',
+    'http://localhost:*',
+    'http://127.0.0.1:*'
+];
+export function isOriginAllowed(origin, patterns = DEFAULT_ALLOWED_ORIGIN_PATTERNS) {
+    let parsed;
+    try {
+        parsed = new URL(origin);
+    }
+    catch {
+        return false;
+    }
+    return patterns.some((pattern) => originMatchesPattern(parsed, pattern));
+}
+function originMatchesPattern(origin, pattern) {
+    let parsedPattern;
+    try {
+        parsedPattern = new URL(pattern.replace(':*', ':0'));
+    }
+    catch {
+        return false;
+    }
+    if (parsedPattern.protocol !== origin.protocol)
+        return false;
+    const rawHost = pattern.replace(/^[a-z]+:\/\//, '').replace(/:\*$/, '').replace(/:\d+$/, '');
+    const portWildcard = pattern.endsWith(':*');
+    const explicitPort = pattern.match(/:(\d+)$/)?.[1];
+    if (!portWildcard && explicitPort && origin.port !== explicitPort)
+        return false;
+    if (!portWildcard && !explicitPort && origin.port !== parsedPattern.port)
+        return false;
+    if (rawHost.startsWith('*.')) {
+        const suffix = rawHost.slice(2);
+        return origin.hostname === suffix || origin.hostname.endsWith(`.${suffix}`);
+    }
+    return origin.hostname === rawHost;
+}
+export function createHostPageBridge(options = {}) {
+    const agentUrl = options.agentUrl ?? 'ws://127.0.0.1:7777/bridgekit';
+    const allowedPatterns = options.allowedOriginPatterns ?? options.allowedOrigins ?? [...DEFAULT_ALLOWED_ORIGIN_PATTERNS];
+    let socket;
+    const queue = [];
+    const requestTargets = new Map();
+    const activeTargets = new Map();
+    function postToSource(source, message, origin) {
+        if (source && 'postMessage' in source) {
+            source.postMessage(message, origin);
+            return;
+        }
+        window.postMessage(message, origin);
+    }
+    function ensureSocket() {
+        if (socket && (socket.readyState === WebSocket.OPEN || socket.readyState === WebSocket.CONNECTING))
+            return socket;
+        socket = new WebSocket(agentUrl);
+        socket.addEventListener('open', () => {
+            for (const queued of queue.splice(0))
+                socket.send(JSON.stringify(queued));
+        });
+        socket.addEventListener('message', (event) => {
+            const message = parseMessage(JSON.parse(String(event.data)));
+            if (message.type === 'event') {
+                for (const target of activeTargets.values()) {
+                    postToSource(target.source, { source: 'bridgekit-bridge', type: 'bridgekit.event', message }, target.origin);
+                }
+                return;
+            }
+            const responseTarget = message.id ? requestTargets.get(message.id) : undefined;
+            postToSource(responseTarget?.source, { source: 'bridgekit-bridge', type: 'bridgekit.response', message }, responseTarget?.origin ?? options.targetOrigin ?? window.location.origin);
+            if (message.id)
+                requestTargets.delete(message.id);
+        });
+        return socket;
+    }
+    function handler(event) {
+        if (!isOriginAllowed(event.origin, allowedPatterns))
+            return;
+        const data = event.data;
+        if (!data || data.source !== 'bridgekit-client')
+            return;
+        activeTargets.set(event.origin, { origin: event.origin, source: event.source });
+        if (data.type === 'bridgekit.detect') {
+            postToSource(event.source, { source: 'bridgekit-bridge', type: 'bridgekit.available', agentUrl }, event.origin);
+            return;
+        }
+        if (data.type !== 'bridgekit.request')
+            return;
+        let message;
+        try {
+            message = parseMessage(data.message);
+        }
+        catch (error) {
+            const bridgeError = error instanceof Error ? error.message : 'Invalid BridgeKit message';
+            postToSource(event.source, {
+                source: 'bridgekit-bridge',
+                type: 'bridgekit.response',
+                message: {
+                    protocolVersion: '0.1.0',
+                    type: 'error',
+                    error: { code: 'invalid_bridge_message', message: bridgeError }
+                }
+            }, event.origin);
+            return;
+        }
+        if (message.id)
+            requestTargets.set(message.id, { origin: event.origin, source: event.source });
+        const active = ensureSocket();
+        if (active.readyState === WebSocket.OPEN)
+            active.send(JSON.stringify(message));
+        else
+            queue.push(message);
+    }
+    window.addEventListener('message', handler);
+    return {
+        close() {
+            window.removeEventListener('message', handler);
+            socket?.close();
+            requestTargets.clear();
+            activeTargets.clear();
+        }
+    };
+}
+//# sourceMappingURL=index.js.map

package/dist/src/index.js.map

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

package/extension/background.js

@@ -0,0 +1,93 @@
+import { bridgeError, getPolicy, isOriginAllowed } from './policy.js';
+
+let socket;
+let activeAgentUrl;
+const pending = new Map();
+const ports = new Set();
+const requestOwners = new Map();
+
+function validBridgeMessage(message) {
+  return message && message.protocolVersion === '0.1.0' && typeof message.type === 'string' && (message.id === undefined || typeof message.id === 'string');
+}
+
+async function ensureSocket() {
+  const policy = await getPolicy();
+  if (socket && activeAgentUrl === policy.agentUrl && (socket.readyState === WebSocket.OPEN || socket.readyState === WebSocket.CONNECTING)) return socket;
+  if (socket) socket.close();
+  activeAgentUrl = policy.agentUrl;
+  socket = new WebSocket(policy.agentUrl);
+  socket.addEventListener('message', (event) => {
+    let message;
+    try {
+      message = JSON.parse(event.data);
+    } catch {
+      return;
+    }
+    if (message.type === 'event') {
+      for (const port of ports) port.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.event', message });
+      return;
+    }
+    const owner = message.id ? requestOwners.get(message.id) : undefined;
+    const callback = message.id ? pending.get(message.id) : undefined;
+    if (message.id) {
+      pending.delete(message.id);
+      requestOwners.delete(message.id);
+    }
+    if (owner && ports.has(owner)) owner.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.response', message });
+    else if (callback) callback(message);
+  });
+  socket.addEventListener('close', () => {
+    for (const [id, owner] of requestOwners.entries()) {
+      if (ports.has(owner)) owner.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.response', message: bridgeError('bridge_closed', 'BridgeKit agent connection closed', id) });
+    }
+    requestOwners.clear();
+    pending.clear();
+  });
+  return socket;
+}
+
+async function isSenderAllowed(sender, pageOrigin) {
+  const policy = await getPolicy();
+  const senderOrigin = sender?.url ? new URL(sender.url).origin : pageOrigin;
+  return Boolean(pageOrigin && senderOrigin === pageOrigin && isOriginAllowed(pageOrigin, policy.allowedOrigins));
+}
+
+chrome.runtime.onConnect.addListener((port) => {
+  if (port.name !== 'bridgekit-page') return;
+  ports.add(port);
+  port.onDisconnect.addListener(() => {
+    ports.delete(port);
+    for (const [id, owner] of requestOwners.entries()) {
+      if (owner === port) requestOwners.delete(id);
+    }
+  });
+  port.onMessage.addListener((request) => {
+    void (async () => {
+      const pageOrigin = typeof request?.pageOrigin === 'string' ? request.pageOrigin : undefined;
+      if (!request || request.source !== 'bridgekit-client') return;
+      if (!(await isSenderAllowed(port.sender, pageOrigin))) {
+        port.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.response', message: bridgeError('origin_not_allowed', `BridgeKit origin is not allowed: ${pageOrigin ?? 'unknown'}`, request.message?.id) });
+        return;
+      }
+      if (request.type === 'bridgekit.detect') {
+        const policy = await getPolicy();
+        port.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.available', agentUrl: policy.agentUrl, allowed: true });
+        return;
+      }
+      if (request.type !== 'bridgekit.request' || !validBridgeMessage(request.message)) {
+        port.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.response', message: bridgeError('invalid_bridge_message', 'Invalid BridgeKit message', request.message?.id) });
+        return;
+      }
+      const ws = await ensureSocket();
+      const send = () => {
+        if (request.message.id) requestOwners.set(request.message.id, port);
+        ws.send(JSON.stringify(request.message));
+      };
+      if (ws.readyState === WebSocket.OPEN) send();
+      else ws.addEventListener('open', send, { once: true });
+      ws.addEventListener('error', () => {
+        port.postMessage({ source: 'bridgekit-extension', type: 'bridgekit.response', message: bridgeError('agent_unavailable', 'BridgeKit local agent is not reachable', request.message.id) });
+      }, { once: true });
+    })();
+  });
+});

package/extension/content-script.js

@@ -0,0 +1,24 @@
+const port = chrome.runtime.connect({ name: 'bridgekit-page' });
+const pageOrigin = window.location.origin;
+
+port.onMessage.addListener((message) => {
+  if (!message || message.source !== 'bridgekit-extension') return;
+  if (message.type === 'bridgekit.event') {
+    window.postMessage({ source: 'bridgekit-bridge', type: 'bridgekit.event', message: message.message }, pageOrigin);
+    return;
+  }
+  if (message.type === 'bridgekit.available') {
+    window.postMessage({ source: 'bridgekit-bridge', type: 'bridgekit.available', agentUrl: message.agentUrl, allowed: message.allowed }, pageOrigin);
+    return;
+  }
+  window.postMessage({ source: 'bridgekit-bridge', type: 'bridgekit.response', message: message.message }, pageOrigin);
+});
+
+window.addEventListener('message', (event) => {
+  if (event.source !== window || event.origin !== pageOrigin) return;
+  const data = event.data;
+  if (!data || data.source !== 'bridgekit-client') return;
+  port.postMessage({ ...data, pageOrigin });
+});
+
+port.postMessage({ source: 'bridgekit-client', type: 'bridgekit.detect', pageOrigin });

package/extension/manifest.json

@@ -0,0 +1,30 @@
+{
+  "manifest_version": 3,
+  "name": "BridgeKit Browser Bridge",
+  "version": "0.1.0",
+  "description": "Relays approved BridgeKit requests from WebContainers and browser sandboxes to the local BridgeKit agent.",
+  "permissions": ["storage"],
+  "host_permissions": ["http://127.0.0.1/*", "ws://127.0.0.1/*"],
+  "background": {
+    "service_worker": "background.js",
+    "type": "module"
+  },
+  "options_ui": {
+    "page": "options.html",
+    "open_in_tab": true
+  },
+  "content_scripts": [
+    {
+      "matches": [
+        "https://bolt.new/*",
+        "https://*.bolt.new/*",
+        "https://stackblitz.com/*",
+        "https://*.stackblitz.com/*",
+        "http://localhost/*",
+        "http://127.0.0.1/*"
+      ],
+      "js": ["content-script.js"],
+      "run_at": "document_start"
+    }
+  ]
+}

package/extension/options.html

@@ -0,0 +1,28 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>BridgeKit Browser Bridge Options</title>
+    <style>
+      body { font-family: system-ui, sans-serif; max-width: 760px; margin: 40px auto; padding: 0 20px; color: #0f172a; }
+      label { display: block; font-weight: 700; margin: 18px 0 8px; }
+      input, textarea { width: 100%; box-sizing: border-box; padding: 10px; border: 1px solid #cbd5e1; border-radius: 10px; font: inherit; }
+      textarea { min-height: 180px; font-family: ui-monospace, monospace; }
+      button { margin-top: 16px; margin-right: 8px; border: 0; border-radius: 999px; padding: 10px 14px; background: #0284c7; color: white; font-weight: 700; cursor: pointer; }
+      button.secondary { background: #475569; }
+      #status { margin-top: 16px; color: #166534; }
+    </style>
+  </head>
+  <body>
+    <h1>BridgeKit Browser Bridge</h1>
+    <p>Only origins listed here can ask the extension to relay BridgeKit requests to the local agent.</p>
+    <label for="agentUrl">Local agent WebSocket URL</label>
+    <input id="agentUrl" />
+    <label for="allowedOrigins">Allowed origin patterns, one per line</label>
+    <textarea id="allowedOrigins"></textarea>
+    <button id="save">Save</button>
+    <button id="defaults" class="secondary">Restore defaults</button>
+    <p id="status"></p>
+    <script type="module" src="options.js"></script>
+  </body>
+</html>

package/extension/options.js

@@ -0,0 +1,27 @@
+import { DEFAULT_AGENT_URL, DEFAULT_ALLOWED_ORIGINS } from './policy.js';
+
+const agentUrl = document.querySelector('#agentUrl');
+const allowedOrigins = document.querySelector('#allowedOrigins');
+const status = document.querySelector('#status');
+
+async function load() {
+  const stored = await chrome.storage.local.get(['agentUrl', 'allowedOrigins']);
+  agentUrl.value = stored.agentUrl || DEFAULT_AGENT_URL;
+  allowedOrigins.value = (stored.allowedOrigins || DEFAULT_ALLOWED_ORIGINS).join('\n');
+}
+
+async function save() {
+  const origins = allowedOrigins.value.split('\n').map((line) => line.trim()).filter(Boolean);
+  await chrome.storage.local.set({ agentUrl: agentUrl.value.trim() || DEFAULT_AGENT_URL, allowedOrigins: origins.length ? origins : DEFAULT_ALLOWED_ORIGINS });
+  status.textContent = 'Saved BridgeKit browser bridge settings.';
+}
+
+async function restoreDefaults() {
+  agentUrl.value = DEFAULT_AGENT_URL;
+  allowedOrigins.value = DEFAULT_ALLOWED_ORIGINS.join('\n');
+  await save();
+}
+
+document.querySelector('#save').addEventListener('click', () => void save());
+document.querySelector('#defaults').addEventListener('click', () => void restoreDefaults());
+void load();

package/extension/policy.js

@@ -0,0 +1,53 @@
+export const DEFAULT_AGENT_URL = 'ws://127.0.0.1:7777/bridgekit';
+export const DEFAULT_ALLOWED_ORIGINS = [
+  'https://bolt.new',
+  'https://*.bolt.new',
+  'https://stackblitz.com',
+  'https://*.stackblitz.com',
+  'http://localhost:*',
+  'http://127.0.0.1:*'
+];
+
+export async function getPolicy() {
+  const stored = await chrome.storage.local.get(['agentUrl', 'allowedOrigins']);
+  return {
+    agentUrl: typeof stored.agentUrl === 'string' && stored.agentUrl.length > 0 ? stored.agentUrl : DEFAULT_AGENT_URL,
+    allowedOrigins: Array.isArray(stored.allowedOrigins) && stored.allowedOrigins.length > 0 ? stored.allowedOrigins : DEFAULT_ALLOWED_ORIGINS
+  };
+}
+
+export function isOriginAllowed(origin, patterns) {
+  let parsed;
+  try {
+    parsed = new URL(origin);
+  } catch {
+    return false;
+  }
+  return patterns.some((pattern) => originMatchesPattern(parsed, pattern));
+}
+
+function originMatchesPattern(origin, pattern) {
+  let parsedPattern;
+  try {
+    parsedPattern = new URL(pattern.replace(':*', ':0'));
+  } catch {
+    return false;
+  }
+  if (parsedPattern.protocol !== origin.protocol) return false;
+  const rawHost = pattern.replace(/^[a-z]+:\/\//, '').replace(/:\*$/, '').replace(/:\d+$/, '');
+  const portWildcard = pattern.endsWith(':*');
+  const explicitPort = pattern.match(/:(\d+)$/)?.[1];
+  if (!portWildcard && explicitPort && origin.port !== explicitPort) return false;
+  if (!portWildcard && !explicitPort && origin.port !== parsedPattern.port) return false;
+  if (rawHost.startsWith('*.')) {
+    const suffix = rawHost.slice(2);
+    return origin.hostname === suffix || origin.hostname.endsWith(`.${suffix}`);
+  }
+  return origin.hostname === rawHost;
+}
+
+export function bridgeError(code, message, id) {
+  return id
+    ? { protocolVersion: '0.1.0', type: 'error', id, error: { code, message } }
+    : { protocolVersion: '0.1.0', type: 'error', error: { code, message } };
+}

package/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "@bridgekitux/browser-bridge",
+  "version": "0.1.0",
+  "license": "Apache-2.0",
+  "description": "BridgeKit host-page and browser-extension bridge helpers.",
+  "type": "module",
+  "main": "./dist/src/index.js",
+  "types": "./dist/src/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/src/index.d.ts",
+      "import": "./dist/src/index.js"
+    }
+  },
+  "scripts": {
+    "build": "tsc -b",
+    "test": "node --test dist/test/*.test.js",
+    "package:extension": "node scripts/package-extension.mjs"
+  },
+  "dependencies": {
+    "@bridgekitux/protocol": "0.1.0"
+  },
+  "files": [
+    "dist/src",
+    "dist/bridgekit-browser-bridge-extension.zip",
+    "dist/extension-unpacked",
+    "extension",
+    "README.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "bridgekit",
+    "webcontainer",
+    "sandbox",
+    "capability",
+    "local-agent",
+    "browser-ide",
+    "browser-bridge"
+  ]
+}