@nominalso/vibe-host 0.2.0 → 0.3.0

package/README.md

@@ -18,7 +18,8 @@ Externalizes only `@hey-api/client-fetch`; TypeScript types are self-contained.
 import { VibeAppHost } from '@nominalso/vibe-host'
 
 const host = new VibeAppHost({
-  // Iframe origin(s) allowed to talk to this host — must match exactly.
+  // Iframe origin(s) allowed to talk to this host. Exact origins, or glob
+  // patterns (e.g. 'https://*.vercel.app') — add patterns only in non-prod.
   trustedOrigins: ['https://my-vibe-app.lovable.app'],
   // This Vibe App's base path in nom-ui (used to sync the browser URL).
   appBasePath: `/${tenant}/${subsidiary}/apps/${slug}`,
@@ -37,15 +38,28 @@ const unmount = host.mount()
 
 ### `new VibeAppHost(options)`
 
-| Option           | Type                    | Description                                                                                               |
-| ---------------- | ----------------------- | --------------------------------------------------------------------------------------------------------- |
-| `trustedOrigins` | `string[]`              | Iframe origins allowed to talk to this host. Messages from other origins are ignored.                     |
-| `getContext`     | `() => HostContext`     | Returns the current context to send to the iframe (`hostVersion` is injected automatically).              |
-| `appBasePath`    | `string`                | Base URL path of this Vibe App in nom-ui, e.g. `/acme/1/apps/fixed-assets`.                               |
-| `clientConfig`   | `VibeApiClientOptions?` | Points the built-in handler map at the Nominal API. Defaults to `{ baseUrl: '', stripApiPrefix: false }`. |
+| Option           | Type                    | Description                                                                                                                                                                                        |
+| ---------------- | ----------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `trustedOrigins` | `string[]`              | Iframe origins allowed to talk to this host — exact origins or glob patterns (`https://*.vercel.app`, honoured unconditionally, so add only in non-prod). Messages from other origins are ignored. |
+| `getContext`     | `() => HostContext`     | Returns the current context to send to the iframe (`hostVersion` is injected automatically).                                                                                                       |
+| `appBasePath`    | `string`                | Base URL path of this Vibe App in nom-ui, e.g. `/acme/1/apps/fixed-assets`.                                                                                                                        |
+| `clientConfig`   | `VibeApiClientOptions?` | Points the built-in handler map at the Nominal API. Defaults to `{ baseUrl: '', stripApiPrefix: false }`.                                                                                          |
 
 `VibeApiClientOptions` is `{ baseUrl: string; stripApiPrefix?: boolean }`. Set `stripApiPrefix: true` when routing through a proxy whose convention expects paths without the `/api` prefix.
 
+#### Testing preview deployments with `trustedOrigins` patterns
+
+A pattern entry's `*` matches exactly one DNS label or port — anchored, scheme literal — so `https://*.vercel.app` matches `https://pr-7.vercel.app` but not `https://a.b.vercel.app` or `https://pr-7.vercel.app.evil.com`. Patterns are honoured unconditionally, so **gate the list on your own deploy environment** — keep production exact-only:
+
+```ts
+const trustedOrigins =
+  process.env.NOM_ENV === 'production'
+    ? ['https://app.nominal.so']
+    : ['https://app.nominal.so', 'https://*.vercel.app', 'https://*.lovable.app']
+```
+
+Because you cannot `postMessage` to a pattern, proactive context/subroute pushes target the exact entries plus any origin seen on a validated inbound message; a pattern-matched iframe still receives context via its `connect()` poll response.
+
 ### `mount(iframeWindow?): () => void`
 
 Starts listening for bridge messages and sets up browser back/forward sync. Returns a cleanup function. Pass `iframeWindow` to immediately push context; if omitted, the host answers `GET_CONTEXT` polls but won't proactively push until you call `pushContextTo`.

package/dist/index.cjs

@@ -27,7 +27,7 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // package.json
-var version = "0.2.0";
+var version = "0.3.0";
 
 // ../protocol-types/dist/index.js
 function normalizeSubroute(subroute) {
@@ -72,6 +72,33 @@ var HttpBridgeError = class extends BridgeError {
     this.name = "HttpBridgeError";
   }
 };
+function isOriginPattern(entry) {
+  return entry.includes("*");
+}
+var patternCache = /* @__PURE__ */ new Map();
+function patternToRegExp(pattern) {
+  const cached = patternCache.get(pattern);
+  if (cached) return cached;
+  const escaped = pattern.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+  const body = escaped.replace(/\\\*/g, "[^./:@?#\\s]+");
+  const compiled = new RegExp(`^${body}$`);
+  patternCache.set(pattern, compiled);
+  return compiled;
+}
+function matchesOrigin(origin, entry) {
+  if (!isOriginPattern(entry)) return origin === entry;
+  return patternToRegExp(entry).test(origin);
+}
+function isOriginAllowed(origin, allowlist, { allowPatterns }) {
+  for (const entry of allowlist) {
+    if (isOriginPattern(entry)) {
+      if (allowPatterns && matchesOrigin(origin, entry)) return true;
+    } else if (origin === entry) {
+      return true;
+    }
+  }
+  return false;
+}
 
 // ../api-client/dist/index.js
 var import_client_fetch = require("@hey-api/client-fetch");
@@ -629,6 +656,12 @@ function rejectUnwired(op) {
 // src/VibeAppHost.ts
 var VibeAppHost = class {
   constructor(opts) {
+    /**
+     * Concrete iframe origins observed on validated inbound messages. Because you
+     * cannot `postMessage` to a glob pattern, proactive pushes target these
+     * learned origins (plus the exact allowlist entries) rather than the patterns.
+     */
+    this.connectedOrigins = /* @__PURE__ */ new Set();
     this.iframeWindow = null;
     /**
      * Source windows we've already logged a successful handshake for. The bridge
@@ -642,6 +675,7 @@ var VibeAppHost = class {
     };
     const { trustedOrigins, getContext, appBasePath, clientConfig } = opts;
     this.trustedOrigins = new Set(trustedOrigins);
+    this.exactOrigins = trustedOrigins.filter((entry) => !isOriginPattern(entry));
     this.getContext = getContext;
     this.appBasePath = appBasePath;
     this.onRequestComplete = opts.onRequestComplete;
@@ -715,6 +749,7 @@ var VibeAppHost = class {
       window.removeEventListener("message", this.boundHandleMessage);
       window.removeEventListener("popstate", this.boundHandlePopState);
       this.iframeWindow = null;
+      this.connectedOrigins.clear();
     };
   }
   /**
@@ -734,7 +769,7 @@ var VibeAppHost = class {
       type: "CONTEXT_PUSH",
       payload: { ...this.getContext(), hostVersion: version }
     };
-    for (const origin of this.trustedOrigins) {
+    for (const origin of this.concreteTargets()) {
       target.postMessage(message, origin);
     }
   }
@@ -754,15 +789,25 @@ var VibeAppHost = class {
       type,
       payload
     };
-    for (const origin of this.trustedOrigins) {
+    for (const origin of this.concreteTargets()) {
       this.iframeWindow.postMessage(message, origin);
     }
   }
   async handleMessage(event) {
-    if (!this.trustedOrigins.has(event.origin)) return;
+    if (!isOriginAllowed(event.origin, this.trustedOrigins, { allowPatterns: true })) return;
     if (!isBridgeMessage(event.data)) return;
+    this.connectedOrigins.add(event.origin);
     await this.kindHandlers[event.data.kind]?.(event.data, event.source, event.origin);
   }
+  /**
+   * Concrete origins a proactive push may target: the exact allowlist entries
+   * plus any origins seen on validated inbound messages. Never includes glob
+   * patterns (you cannot `postMessage` to one). When only exact origins are
+   * configured this equals the configured set, so behaviour is unchanged.
+   */
+  concreteTargets() {
+    return /* @__PURE__ */ new Set([...this.exactOrigins, ...this.connectedOrigins]);
+  }
   async handleRequest(msg, source, origin) {
     const { requestId, type } = msg;
     if (type === "GET_CONTEXT") {

package/dist/index.d.cts

@@ -3549,8 +3549,21 @@ interface RequestCompleteInfo {
 interface VibeAppHostOptions {
     /**
      * Iframe origins allowed to talk to this host. Messages from any other origin
-     * are ignored, and context/pushes are only sent to these origins. Must match
-     * the Vibe App's origin exactly (e.g. `'https://my-vibe-app.lovable.app'`).
+     * are ignored, and context/pushes are only sent to allowed origins.
+     *
+     * Each entry is either an exact origin (`'https://my-vibe-app.lovable.app'`)
+     * or a **glob pattern** containing `*` (`'https://*.vercel.app'`), where `*`
+     * matches exactly one DNS label or port — anchored, scheme literal — so
+     * `https://*.vercel.app` matches `https://pr-7.vercel.app` but not
+     * `https://a.b.vercel.app` or `https://pr-7.vercel.app.evil.com`.
+     *
+     * Patterns are honoured unconditionally, so **only add them for non-production
+     * environments** — gate this list on your own deploy env (e.g. pass exact
+     * origins only in production, exact + `*.vercel.app`/`*.lovable.app` in
+     * staging/dev) to test against dynamic preview deployments. Because you cannot
+     * `postMessage` to a pattern, proactive context/subroute pushes target the
+     * exact entries plus any origin seen on a validated inbound message; pattern-
+     * matched iframes still receive context via their `connect()` poll response.
      */
     trustedOrigins: string[];
     /** Returns the current context to send to the iframe on connect. */
@@ -3621,7 +3634,21 @@ interface VibeAppHostOptions {
  * ```
  */
 declare class VibeAppHost {
+    /**
+     * Configured allowlist. Entries may be exact origins or glob patterns
+     * (`https://*.vercel.app`); inbound messages are validated against it with
+     * {@link isOriginAllowed}. Pattern entries are honoured — nom-ui is expected
+     * to supply patterns only in non-production environments.
+     */
     private readonly trustedOrigins;
+    /** The exact (non-pattern) subset of {@link trustedOrigins} — see {@link concreteTargets}. */
+    private readonly exactOrigins;
+    /**
+     * Concrete iframe origins observed on validated inbound messages. Because you
+     * cannot `postMessage` to a glob pattern, proactive pushes target these
+     * learned origins (plus the exact allowlist entries) rather than the patterns.
+     */
+    private readonly connectedOrigins;
     private readonly handlers;
     private readonly commandHandlers;
     private readonly getContext;
@@ -3672,6 +3699,13 @@ declare class VibeAppHost {
     private handlePopState;
     private pushToIframe;
     private handleMessage;
+    /**
+     * Concrete origins a proactive push may target: the exact allowlist entries
+     * plus any origins seen on validated inbound messages. Never includes glob
+     * patterns (you cannot `postMessage` to one). When only exact origins are
+     * configured this equals the configured set, so behaviour is unchanged.
+     */
+    private concreteTargets;
     private handleRequest;
     private respond;
 }

package/dist/index.d.ts

@@ -3549,8 +3549,21 @@ interface RequestCompleteInfo {
 interface VibeAppHostOptions {
     /**
      * Iframe origins allowed to talk to this host. Messages from any other origin
-     * are ignored, and context/pushes are only sent to these origins. Must match
-     * the Vibe App's origin exactly (e.g. `'https://my-vibe-app.lovable.app'`).
+     * are ignored, and context/pushes are only sent to allowed origins.
+     *
+     * Each entry is either an exact origin (`'https://my-vibe-app.lovable.app'`)
+     * or a **glob pattern** containing `*` (`'https://*.vercel.app'`), where `*`
+     * matches exactly one DNS label or port — anchored, scheme literal — so
+     * `https://*.vercel.app` matches `https://pr-7.vercel.app` but not
+     * `https://a.b.vercel.app` or `https://pr-7.vercel.app.evil.com`.
+     *
+     * Patterns are honoured unconditionally, so **only add them for non-production
+     * environments** — gate this list on your own deploy env (e.g. pass exact
+     * origins only in production, exact + `*.vercel.app`/`*.lovable.app` in
+     * staging/dev) to test against dynamic preview deployments. Because you cannot
+     * `postMessage` to a pattern, proactive context/subroute pushes target the
+     * exact entries plus any origin seen on a validated inbound message; pattern-
+     * matched iframes still receive context via their `connect()` poll response.
      */
     trustedOrigins: string[];
     /** Returns the current context to send to the iframe on connect. */
@@ -3621,7 +3634,21 @@ interface VibeAppHostOptions {
  * ```
  */
 declare class VibeAppHost {
+    /**
+     * Configured allowlist. Entries may be exact origins or glob patterns
+     * (`https://*.vercel.app`); inbound messages are validated against it with
+     * {@link isOriginAllowed}. Pattern entries are honoured — nom-ui is expected
+     * to supply patterns only in non-production environments.
+     */
     private readonly trustedOrigins;
+    /** The exact (non-pattern) subset of {@link trustedOrigins} — see {@link concreteTargets}. */
+    private readonly exactOrigins;
+    /**
+     * Concrete iframe origins observed on validated inbound messages. Because you
+     * cannot `postMessage` to a glob pattern, proactive pushes target these
+     * learned origins (plus the exact allowlist entries) rather than the patterns.
+     */
+    private readonly connectedOrigins;
     private readonly handlers;
     private readonly commandHandlers;
     private readonly getContext;
@@ -3672,6 +3699,13 @@ declare class VibeAppHost {
     private handlePopState;
     private pushToIframe;
     private handleMessage;
+    /**
+     * Concrete origins a proactive push may target: the exact allowlist entries
+     * plus any origins seen on validated inbound messages. Never includes glob
+     * patterns (you cannot `postMessage` to one). When only exact origins are
+     * configured this equals the configured set, so behaviour is unchanged.
+     */
+    private concreteTargets;
     private handleRequest;
     private respond;
 }

package/dist/index.js

@@ -1,5 +1,5 @@
 // package.json
-var version = "0.2.0";
+var version = "0.3.0";
 
 // ../protocol-types/dist/index.js
 function normalizeSubroute(subroute) {
@@ -44,6 +44,33 @@ var HttpBridgeError = class extends BridgeError {
     this.name = "HttpBridgeError";
   }
 };
+function isOriginPattern(entry) {
+  return entry.includes("*");
+}
+var patternCache = /* @__PURE__ */ new Map();
+function patternToRegExp(pattern) {
+  const cached = patternCache.get(pattern);
+  if (cached) return cached;
+  const escaped = pattern.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+  const body = escaped.replace(/\\\*/g, "[^./:@?#\\s]+");
+  const compiled = new RegExp(`^${body}$`);
+  patternCache.set(pattern, compiled);
+  return compiled;
+}
+function matchesOrigin(origin, entry) {
+  if (!isOriginPattern(entry)) return origin === entry;
+  return patternToRegExp(entry).test(origin);
+}
+function isOriginAllowed(origin, allowlist, { allowPatterns }) {
+  for (const entry of allowlist) {
+    if (isOriginPattern(entry)) {
+      if (allowPatterns && matchesOrigin(origin, entry)) return true;
+    } else if (origin === entry) {
+      return true;
+    }
+  }
+  return false;
+}
 
 // ../api-client/dist/index.js
 import {
@@ -604,6 +631,12 @@ function rejectUnwired(op) {
 // src/VibeAppHost.ts
 var VibeAppHost = class {
   constructor(opts) {
+    /**
+     * Concrete iframe origins observed on validated inbound messages. Because you
+     * cannot `postMessage` to a glob pattern, proactive pushes target these
+     * learned origins (plus the exact allowlist entries) rather than the patterns.
+     */
+    this.connectedOrigins = /* @__PURE__ */ new Set();
     this.iframeWindow = null;
     /**
      * Source windows we've already logged a successful handshake for. The bridge
@@ -617,6 +650,7 @@ var VibeAppHost = class {
     };
     const { trustedOrigins, getContext, appBasePath, clientConfig } = opts;
     this.trustedOrigins = new Set(trustedOrigins);
+    this.exactOrigins = trustedOrigins.filter((entry) => !isOriginPattern(entry));
     this.getContext = getContext;
     this.appBasePath = appBasePath;
     this.onRequestComplete = opts.onRequestComplete;
@@ -690,6 +724,7 @@ var VibeAppHost = class {
       window.removeEventListener("message", this.boundHandleMessage);
       window.removeEventListener("popstate", this.boundHandlePopState);
       this.iframeWindow = null;
+      this.connectedOrigins.clear();
     };
   }
   /**
@@ -709,7 +744,7 @@ var VibeAppHost = class {
       type: "CONTEXT_PUSH",
       payload: { ...this.getContext(), hostVersion: version }
     };
-    for (const origin of this.trustedOrigins) {
+    for (const origin of this.concreteTargets()) {
       target.postMessage(message, origin);
     }
   }
@@ -729,15 +764,25 @@ var VibeAppHost = class {
       type,
       payload
     };
-    for (const origin of this.trustedOrigins) {
+    for (const origin of this.concreteTargets()) {
       this.iframeWindow.postMessage(message, origin);
     }
   }
   async handleMessage(event) {
-    if (!this.trustedOrigins.has(event.origin)) return;
+    if (!isOriginAllowed(event.origin, this.trustedOrigins, { allowPatterns: true })) return;
     if (!isBridgeMessage(event.data)) return;
+    this.connectedOrigins.add(event.origin);
     await this.kindHandlers[event.data.kind]?.(event.data, event.source, event.origin);
   }
+  /**
+   * Concrete origins a proactive push may target: the exact allowlist entries
+   * plus any origins seen on validated inbound messages. Never includes glob
+   * patterns (you cannot `postMessage` to one). When only exact origins are
+   * configured this equals the configured set, so behaviour is unchanged.
+   */
+  concreteTargets() {
+    return /* @__PURE__ */ new Set([...this.exactOrigins, ...this.connectedOrigins]);
+  }
   async handleRequest(msg, source, origin) {
     const { requestId, type } = msg;
     if (type === "GET_CONTEXT") {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nominalso/vibe-host",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Host-side SDK for embedding Nominal Vibe Apps — receives bridge requests over a typed postMessage protocol and dispatches them to Nominal APIs (used by nom-ui).",
   "license": "UNLICENSED",
   "homepage": "https://github.com/nominalso/vibe-apps-sdk#readme",