@grizzlee/react 0.2.0 → 0.3.1

package/CHANGELOG.md

@@ -1,3 +1,11 @@
+## 0.3.1
+
+- Fix `GrizzleeNativeEmbed` crashing on its first URL with `Cannot read property 'decode' of undefined`. The package bundled `react-native-url-polyfill` with the ES module build of `punycode`, which has no `ucs2` export. The polyfill is now a dependency that the app's bundler resolves.
+
+## 0.3.0
+
+- Add `GrizzleeNativeEmbed` at `@grizzlee/react/native`. It loads a server-minted start URL directly in a WebView, renews sessions through `onExpired` and opens React Native's share sheet unless `onShare` handles sharing. React Native and React Native WebView are optional peers. Web entry points do not import them.
+
 ## 0.2.0
 
 - Add `onShare` to `GrizzleeEmbed` and `mountGrizzleeEmbed`, with the exported `GrizzleeShare` type. A callback opts in through a validated host message. It receives the program ID, referral URL and localized invitation when the partner taps Share. Hosts without a callback keep sharing inside the frame.

package/README.md

@@ -1,6 +1,6 @@
 # Grizzlee embed hosts
 
-`@grizzlee/react` exports `GrizzleeEmbed`, `mountGrizzleeEmbed`, `GrizzleeEmbedProps`, `GrizzleeEmbedOptions` and `GrizzleeShare`. React 18 or later is a peer dependency. Install React in a component host. The peer is optional so a host using only `@grizzlee/react/embed` does not need React. There are no other runtime dependencies.
+`@grizzlee/react` exports `GrizzleeEmbed`, `mountGrizzleeEmbed`, `GrizzleeEmbedProps`, `GrizzleeEmbedOptions` and `GrizzleeShare`. React 18 or later is an optional peer dependency, so a host using only `@grizzlee/react/embed` does not need React. `@grizzlee/react/native` exports `GrizzleeNativeEmbed`, `GrizzleeNativeEmbedProps` and `GrizzleeShare`. React Native and React Native WebView are optional peers used only by the native entry point.
 
 ```tsx
 import { GrizzleeEmbed } from "@grizzlee/react";
@@ -29,7 +29,7 @@ async function newSession() {
 />
 ```
 
-`openShareSheet` is your app's callback. `mountGrizzleeEmbed` accepts the same `onShare` option. For React Native or Expo, use an authenticated merchant wrapper page and forward `grizzlee:share` to the WebView bridge after origin and iframe checks. See [the WebView recipe](../../docs/embed.md#mobile-webviews).
+`openShareSheet` is your app's callback. `mountGrizzleeEmbed` accepts the same `onShare` option. For React Native or Expo, use `GrizzleeNativeEmbed` below.
 
 The component renders during server-side rendering without accessing `window` or `document`. It attaches its message listener after mounting. In Next.js App Router, render it from a client component when passing callbacks.
 
@@ -49,7 +49,31 @@ dashboard.destroy();
 
 The helper accepts the same options except `style`. It appends an iframe and returns `{ destroy() }`. Both hosts use `allow="clipboard-write"`, `referrerPolicy="no-referrer"` and `loading="lazy"`. They accept messages only from the current URL's origin and their own iframe window. Neither sets `sandbox`. If you add it to a plain iframe, include `allow-scripts allow-same-origin allow-downloads`. Without `allow-same-origin`, the exchange sends `Origin: null` and fails. Without `allow-downloads`, QR downloads fail.
 
-Create sessions on your backend with [@grizzlee/sdk](https://www.npmjs.com/package/@grizzlee/sdk) and pass the returned URL to the browser host. Browser hosts never need the server key or schema dependencies.
+## React Native
+
+Install `react-native-webview` in your React Native app, then import the native subpath. It includes a URL parser for React Native releases whose built-in `URL` cannot read origins. No global URL polyfill setup is needed.
+
+```tsx
+import { GrizzleeNativeEmbed } from "@grizzlee/react/native";
+
+// Fetch the initial startUrl from your authenticated merchant API before rendering.
+<GrizzleeNativeEmbed
+  startUrl={startUrl}
+  onExpired={fetchNewStartUrl}
+  onError={showError}
+  style={{ flex: 1 }}
+/>;
+```
+
+`fetchNewStartUrl` calls your merchant API and returns a fresh session URL. The merchant server authenticates the app user and creates the session with `createEmbedSession`. Keep an allowed merchant origin in workspace settings and use it as `embedOrigin`; no page needs to exist at that origin. A native endpoint should authenticate the app's access token instead of requiring a browser `Origin` header. Never put the Grizzlee server key in the app.
+
+`startUrl` must be an absolute HTTP or HTTPS `/embed/start` URL with a session ID and no credentials. Invalid initial URLs throw during rendering. The component loads the dashboard as the WebView's top document, with no iframe or merchant wrapper page. It accepts messages only from the current Grizzlee origin, path and session query, and blocks navigation to other documents. The native parent sets the WebView's size; dashboard resize messages do not change it. Put it in a parent with a height or `flex: 1`.
+
+`onExpired` can return a new URL or a promise, or return nothing if your app updates `startUrl` itself. Only one renewal runs at a time. Changing `startUrl` opens a new session; pending results from the old session or an unmounted component are ignored. A rejected renewal leaves the expired dashboard visible and calls `onError`. The component also requests a fresh session if the WebView's rendering process ends, since the bearer lived in that process's memory.
+
+`onReady` runs after each session's summary loads. **Share** opens React Native's share sheet by default, with the invitation and referral URL in the message. Optional `onShare` receives `{ programId, url, text }` and takes over sharing. It can return a promise. Both hosts use the same share field and URL validation. `onError` receives an `Error` for document loading, renewal or sharing failures. Display errors and any retry controls in your app.
+
+Create sessions on your backend with [@grizzlee/sdk](https://www.npmjs.com/package/@grizzlee/sdk) and pass the returned URL to the browser or native host. Hosts never need the server key or schema dependencies. See [the embed guide](../../docs/embed.md#mobile-webviews) for an authenticated app example and other native WebViews.
 
 ## Install
 
@@ -59,7 +83,7 @@ pnpm add @grizzlee/react
 yarn add @grizzlee/react
 ```
 
-Requires Node >= 22. Both entry points support ESM and CommonJS with source maps and matching TypeScript declarations.
+Requires Node >= 22. All three entry points support ESM and CommonJS with source maps and matching TypeScript declarations. The native entry point needs React Native >= 0.78 and React Native WebView >= 13, with the React version required by your React Native release. The web entry points do not import either native peer.
 
 ## Versioning
 

package/embed.cjs

@@ -24,19 +24,31 @@ __export(embed_exports, {
 });
 module.exports = __toCommonJS(embed_exports);
 
-// packages/react/src/host.ts
-var MAX_HEIGHT = 1e4;
-function minimumHeight(height = 320) {
-  return Number.isFinite(height) ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height))) : 320;
-}
-function embedUrl(url) {
-  const parsed = new URL(url);
+// packages/react/src/protocol.ts
+function embedUrl(url, Url = URL) {
+  const parsed = new Url(url);
   if (!["https:", "http:"].includes(parsed.protocol) || parsed.username || parsed.password)
     throw new Error(
       "Use an absolute HTTP or HTTPS embed URL without credentials"
     );
   return parsed;
 }
+function parseShare(message, validateUrl = embedUrl) {
+  if (!("programId" in message) || typeof message.programId !== "string" || !message.programId || !("url" in message) || typeof message.url !== "string" || !("text" in message) || typeof message.text !== "string")
+    return null;
+  try {
+    validateUrl(message.url);
+  } catch {
+    return null;
+  }
+  return { programId: message.programId, url: message.url, text: message.text };
+}
+
+// packages/react/src/host.ts
+var MAX_HEIGHT = 1e4;
+function minimumHeight(height = 320) {
+  return Number.isFinite(height) ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height))) : 320;
+}
 function listenToEmbed(frame, options) {
   const hostWindow = frame.ownerDocument.defaultView;
   if (!hostWindow)
@@ -58,20 +70,8 @@ function listenToEmbed(frame, options) {
         options().onReady?.();
         break;
       case "grizzlee:share": {
-        if (!("programId" in message) || typeof message.programId !== "string" || !message.programId || !("url" in message) || typeof message.url !== "string" || !("text" in message) || typeof message.text !== "string")
-          return;
-        try {
-          const url = new URL(message.url);
-          if (!["https:", "http:"].includes(url.protocol) || url.username || url.password)
-            return;
-        } catch {
-          return;
-        }
-        options().onShare?.({
-          programId: message.programId,
-          url: message.url,
-          text: message.text
-        });
+        const share = parseShare(message);
+        if (share) options().onShare?.(share);
         break;
       }
       case "grizzlee:resize": {

package/embed.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/embed.ts", "../src/host.ts"],
-  "sourcesContent": ["import {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\n/** Append a dashboard iframe. Destroy removes its listener and the iframe. */\nexport function mountGrizzleeEmbed(\n  container: HTMLElement,\n  options: GrizzleeEmbedOptions,\n): { destroy(): void } {\n  const url = embedUrl(options.url);\n  const frame = container.ownerDocument.createElement(\"iframe\");\n  frame.title = options.title ?? \"Partner dashboard\";\n  if (options.className) frame.className = options.className;\n  frame.allow = \"clipboard-write\";\n  frame.referrerPolicy = \"no-referrer\";\n  frame.loading = \"lazy\";\n  frame.style.width = \"100%\";\n  frame.style.border = \"0\";\n  frame.style.minHeight = `${minimumHeight(options.minHeight)}px`;\n  frame.style.height = frame.style.minHeight;\n  const stop = listenToEmbed(frame, () => options);\n  frame.src = url.href;\n  container.appendChild(frame);\n  return {\n    destroy() {\n      stop();\n      frame.remove();\n    },\n  };\n}\n", "export interface GrizzleeShare {\n  programId: string;\n  url: string;\n  text: string;\n}\n\nexport interface GrizzleeEmbedOptions {\n  /** An absolute HTTP or HTTPS start URL minted by the merchant's server. */\n  url: string;\n  /** Return a newly minted URL to reopen the dashboard. Handle errors here. */\n  onSessionExpired?: () => string | void | Promise<string | void>;\n  onReady?: () => void;\n  /** Supplying this callback asks the frame to send share actions to the host. */\n  onShare?: (share: GrizzleeShare) => void;\n  title?: string;\n  className?: string;\n  /** Minimum height in CSS pixels, clamped to 120 through 10,000. Defaults to 320. */\n  minHeight?: number;\n}\n\nconst MAX_HEIGHT = 10_000;\n\nexport function minimumHeight(height = 320): number {\n  return Number.isFinite(height)\n    ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height)))\n    : 320;\n}\n\nexport function embedUrl(url: string): URL {\n  const parsed = new URL(url);\n  if (\n    ![\"https:\", \"http:\"].includes(parsed.protocol) ||\n    parsed.username ||\n    parsed.password\n  )\n    throw new Error(\n      \"Use an absolute HTTP or HTTPS embed URL without credentials\",\n    );\n  return parsed;\n}\n\n/** Both hosts use this listener so origin checks and renewal behave the same way. */\nexport function listenToEmbed(\n  frame: HTMLIFrameElement,\n  options: () => GrizzleeEmbedOptions,\n): () => void {\n  const hostWindow = frame.ownerDocument.defaultView;\n  if (!hostWindow)\n    throw new Error(\"The iframe must belong to a browser document\");\n  let origin = embedUrl(options().url).origin;\n  let active = true;\n  let renewing = false;\n\n  const receive = (event: MessageEvent<unknown>) => {\n    if (\n      !active ||\n      event.origin !== origin ||\n      !frame.contentWindow ||\n      event.source !== frame.contentWindow\n    )\n      return;\n    const message = event.data;\n    if (!message || typeof message !== \"object\" || !(\"type\" in message)) return;\n\n    switch (message.type) {\n      case \"grizzlee:ready\":\n        frame.contentWindow.postMessage(\n          { type: \"grizzlee:configure\", share: !!options().onShare },\n          origin,\n        );\n        options().onReady?.();\n        break;\n      case \"grizzlee:share\": {\n        if (\n          !(\"programId\" in message) ||\n          typeof message.programId !== \"string\" ||\n          !message.programId ||\n          !(\"url\" in message) ||\n          typeof message.url !== \"string\" ||\n          !(\"text\" in message) ||\n          typeof message.text !== \"string\"\n        )\n          return;\n        try {\n          const url = new URL(message.url);\n          if (\n            ![\"https:\", \"http:\"].includes(url.protocol) ||\n            url.username ||\n            url.password\n          )\n            return;\n        } catch {\n          return;\n        }\n        options().onShare?.({\n          programId: message.programId,\n          url: message.url,\n          text: message.text,\n        });\n        break;\n      }\n      case \"grizzlee:resize\": {\n        if (\n          \"height\" in message &&\n          typeof message.height === \"number\" &&\n          Number.isSafeInteger(message.height) &&\n          message.height > 0\n        ) {\n          const height = Math.min(\n            MAX_HEIGHT,\n            Math.max(minimumHeight(options().minHeight), message.height),\n          );\n          frame.style.height = `${height}px`;\n        }\n        break;\n      }\n      case \"grizzlee:session_expired\": {\n        const renew = options().onSessionExpired;\n        if (!renew || renewing) return;\n        renewing = true;\n        void (async () => {\n          try {\n            const url = await renew();\n            if (!active || !url) return;\n            const next = embedUrl(url);\n            origin = next.origin;\n            frame.style.height = `${minimumHeight(options().minHeight)}px`;\n            frame.src = next.href;\n          } catch {\n            // Leave the expired dashboard in place. The merchant handles errors in its callback.\n          } finally {\n            renewing = false;\n          }\n        })();\n        break;\n      }\n    }\n  };\n\n  hostWindow.addEventListener(\"message\", receive);\n  return () => {\n    active = false;\n    hostWindow.removeEventListener(\"message\", receive);\n  };\n}\n"],
-  "mappings": "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",
+  "sources": ["../src/embed.ts", "../src/protocol.ts", "../src/host.ts"],
+  "sourcesContent": ["import {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\n/** Append a dashboard iframe. Destroy removes its listener and the iframe. */\nexport function mountGrizzleeEmbed(\n  container: HTMLElement,\n  options: GrizzleeEmbedOptions,\n): { destroy(): void } {\n  const url = embedUrl(options.url);\n  const frame = container.ownerDocument.createElement(\"iframe\");\n  frame.title = options.title ?? \"Partner dashboard\";\n  if (options.className) frame.className = options.className;\n  frame.allow = \"clipboard-write\";\n  frame.referrerPolicy = \"no-referrer\";\n  frame.loading = \"lazy\";\n  frame.style.width = \"100%\";\n  frame.style.border = \"0\";\n  frame.style.minHeight = `${minimumHeight(options.minHeight)}px`;\n  frame.style.height = frame.style.minHeight;\n  const stop = listenToEmbed(frame, () => options);\n  frame.src = url.href;\n  container.appendChild(frame);\n  return {\n    destroy() {\n      stop();\n      frame.remove();\n    },\n  };\n}\n", "export interface GrizzleeShare {\n  programId: string;\n  url: string;\n  text: string;\n}\n\nexport function embedUrl(\n  url: string,\n  Url: new (value: string) => URL = URL,\n): URL {\n  const parsed = new Url(url);\n  if (\n    ![\"https:\", \"http:\"].includes(parsed.protocol) ||\n    parsed.username ||\n    parsed.password\n  )\n    throw new Error(\n      \"Use an absolute HTTP or HTTPS embed URL without credentials\",\n    );\n  return parsed;\n}\n\nexport function parseShare(\n  message: object,\n  validateUrl: (value: string) => unknown = embedUrl,\n): GrizzleeShare | null {\n  if (\n    !(\"programId\" in message) ||\n    typeof message.programId !== \"string\" ||\n    !message.programId ||\n    !(\"url\" in message) ||\n    typeof message.url !== \"string\" ||\n    !(\"text\" in message) ||\n    typeof message.text !== \"string\"\n  )\n    return null;\n  try {\n    validateUrl(message.url);\n  } catch {\n    return null;\n  }\n  return { programId: message.programId, url: message.url, text: message.text };\n}\n", "import { embedUrl, parseShare, type GrizzleeShare } from \"./protocol\";\n\nexport { embedUrl } from \"./protocol\";\nexport type { GrizzleeShare } from \"./protocol\";\n\nexport interface GrizzleeEmbedOptions {\n  /** An absolute HTTP or HTTPS start URL minted by the merchant's server. */\n  url: string;\n  /** Return a newly minted URL to reopen the dashboard. Handle errors here. */\n  onSessionExpired?: () => string | void | Promise<string | void>;\n  onReady?: () => void;\n  /** Supplying this callback asks the frame to send share actions to the host. */\n  onShare?: (share: GrizzleeShare) => void;\n  title?: string;\n  className?: string;\n  /** Minimum height in CSS pixels, clamped to 120 through 10,000. Defaults to 320. */\n  minHeight?: number;\n}\n\nconst MAX_HEIGHT = 10_000;\n\nexport function minimumHeight(height = 320): number {\n  return Number.isFinite(height)\n    ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height)))\n    : 320;\n}\n\n/** Both hosts use this listener so origin checks and renewal behave the same way. */\nexport function listenToEmbed(\n  frame: HTMLIFrameElement,\n  options: () => GrizzleeEmbedOptions,\n): () => void {\n  const hostWindow = frame.ownerDocument.defaultView;\n  if (!hostWindow)\n    throw new Error(\"The iframe must belong to a browser document\");\n  let origin = embedUrl(options().url).origin;\n  let active = true;\n  let renewing = false;\n\n  const receive = (event: MessageEvent<unknown>) => {\n    if (\n      !active ||\n      event.origin !== origin ||\n      !frame.contentWindow ||\n      event.source !== frame.contentWindow\n    )\n      return;\n    const message = event.data;\n    if (!message || typeof message !== \"object\" || !(\"type\" in message)) return;\n\n    switch (message.type) {\n      case \"grizzlee:ready\":\n        frame.contentWindow.postMessage(\n          { type: \"grizzlee:configure\", share: !!options().onShare },\n          origin,\n        );\n        options().onReady?.();\n        break;\n      case \"grizzlee:share\": {\n        const share = parseShare(message);\n        if (share) options().onShare?.(share);\n        break;\n      }\n      case \"grizzlee:resize\": {\n        if (\n          \"height\" in message &&\n          typeof message.height === \"number\" &&\n          Number.isSafeInteger(message.height) &&\n          message.height > 0\n        ) {\n          const height = Math.min(\n            MAX_HEIGHT,\n            Math.max(minimumHeight(options().minHeight), message.height),\n          );\n          frame.style.height = `${height}px`;\n        }\n        break;\n      }\n      case \"grizzlee:session_expired\": {\n        const renew = options().onSessionExpired;\n        if (!renew || renewing) return;\n        renewing = true;\n        void (async () => {\n          try {\n            const url = await renew();\n            if (!active || !url) return;\n            const next = embedUrl(url);\n            origin = next.origin;\n            frame.style.height = `${minimumHeight(options().minHeight)}px`;\n            frame.src = next.href;\n          } catch {\n            // Leave the expired dashboard in place. The merchant handles errors in its callback.\n          } finally {\n            renewing = false;\n          }\n        })();\n        break;\n      }\n    }\n  };\n\n  hostWindow.addEventListener(\"message\", receive);\n  return () => {\n    active = false;\n    hostWindow.removeEventListener(\"message\", receive);\n  };\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/embed.js

@@ -1,16 +1,28 @@
-// packages/react/src/host.ts
-var MAX_HEIGHT = 1e4;
-function minimumHeight(height = 320) {
-  return Number.isFinite(height) ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height))) : 320;
-}
-function embedUrl(url) {
-  const parsed = new URL(url);
+// packages/react/src/protocol.ts
+function embedUrl(url, Url = URL) {
+  const parsed = new Url(url);
   if (!["https:", "http:"].includes(parsed.protocol) || parsed.username || parsed.password)
     throw new Error(
       "Use an absolute HTTP or HTTPS embed URL without credentials"
     );
   return parsed;
 }
+function parseShare(message, validateUrl = embedUrl) {
+  if (!("programId" in message) || typeof message.programId !== "string" || !message.programId || !("url" in message) || typeof message.url !== "string" || !("text" in message) || typeof message.text !== "string")
+    return null;
+  try {
+    validateUrl(message.url);
+  } catch {
+    return null;
+  }
+  return { programId: message.programId, url: message.url, text: message.text };
+}
+
+// packages/react/src/host.ts
+var MAX_HEIGHT = 1e4;
+function minimumHeight(height = 320) {
+  return Number.isFinite(height) ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height))) : 320;
+}
 function listenToEmbed(frame, options) {
   const hostWindow = frame.ownerDocument.defaultView;
   if (!hostWindow)
@@ -32,20 +44,8 @@ function listenToEmbed(frame, options) {
         options().onReady?.();
         break;
       case "grizzlee:share": {
-        if (!("programId" in message) || typeof message.programId !== "string" || !message.programId || !("url" in message) || typeof message.url !== "string" || !("text" in message) || typeof message.text !== "string")
-          return;
-        try {
-          const url = new URL(message.url);
-          if (!["https:", "http:"].includes(url.protocol) || url.username || url.password)
-            return;
-        } catch {
-          return;
-        }
-        options().onShare?.({
-          programId: message.programId,
-          url: message.url,
-          text: message.text
-        });
+        const share = parseShare(message);
+        if (share) options().onShare?.(share);
         break;
       }
       case "grizzlee:resize": {

package/embed.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/host.ts", "../src/embed.ts"],
-  "sourcesContent": ["export interface GrizzleeShare {\n  programId: string;\n  url: string;\n  text: string;\n}\n\nexport interface GrizzleeEmbedOptions {\n  /** An absolute HTTP or HTTPS start URL minted by the merchant's server. */\n  url: string;\n  /** Return a newly minted URL to reopen the dashboard. Handle errors here. */\n  onSessionExpired?: () => string | void | Promise<string | void>;\n  onReady?: () => void;\n  /** Supplying this callback asks the frame to send share actions to the host. */\n  onShare?: (share: GrizzleeShare) => void;\n  title?: string;\n  className?: string;\n  /** Minimum height in CSS pixels, clamped to 120 through 10,000. Defaults to 320. */\n  minHeight?: number;\n}\n\nconst MAX_HEIGHT = 10_000;\n\nexport function minimumHeight(height = 320): number {\n  return Number.isFinite(height)\n    ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height)))\n    : 320;\n}\n\nexport function embedUrl(url: string): URL {\n  const parsed = new URL(url);\n  if (\n    ![\"https:\", \"http:\"].includes(parsed.protocol) ||\n    parsed.username ||\n    parsed.password\n  )\n    throw new Error(\n      \"Use an absolute HTTP or HTTPS embed URL without credentials\",\n    );\n  return parsed;\n}\n\n/** Both hosts use this listener so origin checks and renewal behave the same way. */\nexport function listenToEmbed(\n  frame: HTMLIFrameElement,\n  options: () => GrizzleeEmbedOptions,\n): () => void {\n  const hostWindow = frame.ownerDocument.defaultView;\n  if (!hostWindow)\n    throw new Error(\"The iframe must belong to a browser document\");\n  let origin = embedUrl(options().url).origin;\n  let active = true;\n  let renewing = false;\n\n  const receive = (event: MessageEvent<unknown>) => {\n    if (\n      !active ||\n      event.origin !== origin ||\n      !frame.contentWindow ||\n      event.source !== frame.contentWindow\n    )\n      return;\n    const message = event.data;\n    if (!message || typeof message !== \"object\" || !(\"type\" in message)) return;\n\n    switch (message.type) {\n      case \"grizzlee:ready\":\n        frame.contentWindow.postMessage(\n          { type: \"grizzlee:configure\", share: !!options().onShare },\n          origin,\n        );\n        options().onReady?.();\n        break;\n      case \"grizzlee:share\": {\n        if (\n          !(\"programId\" in message) ||\n          typeof message.programId !== \"string\" ||\n          !message.programId ||\n          !(\"url\" in message) ||\n          typeof message.url !== \"string\" ||\n          !(\"text\" in message) ||\n          typeof message.text !== \"string\"\n        )\n          return;\n        try {\n          const url = new URL(message.url);\n          if (\n            ![\"https:\", \"http:\"].includes(url.protocol) ||\n            url.username ||\n            url.password\n          )\n            return;\n        } catch {\n          return;\n        }\n        options().onShare?.({\n          programId: message.programId,\n          url: message.url,\n          text: message.text,\n        });\n        break;\n      }\n      case \"grizzlee:resize\": {\n        if (\n          \"height\" in message &&\n          typeof message.height === \"number\" &&\n          Number.isSafeInteger(message.height) &&\n          message.height > 0\n        ) {\n          const height = Math.min(\n            MAX_HEIGHT,\n            Math.max(minimumHeight(options().minHeight), message.height),\n          );\n          frame.style.height = `${height}px`;\n        }\n        break;\n      }\n      case \"grizzlee:session_expired\": {\n        const renew = options().onSessionExpired;\n        if (!renew || renewing) return;\n        renewing = true;\n        void (async () => {\n          try {\n            const url = await renew();\n            if (!active || !url) return;\n            const next = embedUrl(url);\n            origin = next.origin;\n            frame.style.height = `${minimumHeight(options().minHeight)}px`;\n            frame.src = next.href;\n          } catch {\n            // Leave the expired dashboard in place. The merchant handles errors in its callback.\n          } finally {\n            renewing = false;\n          }\n        })();\n        break;\n      }\n    }\n  };\n\n  hostWindow.addEventListener(\"message\", receive);\n  return () => {\n    active = false;\n    hostWindow.removeEventListener(\"message\", receive);\n  };\n}\n", "import {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\n/** Append a dashboard iframe. Destroy removes its listener and the iframe. */\nexport function mountGrizzleeEmbed(\n  container: HTMLElement,\n  options: GrizzleeEmbedOptions,\n): { destroy(): void } {\n  const url = embedUrl(options.url);\n  const frame = container.ownerDocument.createElement(\"iframe\");\n  frame.title = options.title ?? \"Partner dashboard\";\n  if (options.className) frame.className = options.className;\n  frame.allow = \"clipboard-write\";\n  frame.referrerPolicy = \"no-referrer\";\n  frame.loading = \"lazy\";\n  frame.style.width = \"100%\";\n  frame.style.border = \"0\";\n  frame.style.minHeight = `${minimumHeight(options.minHeight)}px`;\n  frame.style.height = frame.style.minHeight;\n  const stop = listenToEmbed(frame, () => options);\n  frame.src = url.href;\n  container.appendChild(frame);\n  return {\n    destroy() {\n      stop();\n      frame.remove();\n    },\n  };\n}\n"],
-  "mappings": "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",
+  "sources": ["../src/protocol.ts", "../src/host.ts", "../src/embed.ts"],
+  "sourcesContent": ["export interface GrizzleeShare {\n  programId: string;\n  url: string;\n  text: string;\n}\n\nexport function embedUrl(\n  url: string,\n  Url: new (value: string) => URL = URL,\n): URL {\n  const parsed = new Url(url);\n  if (\n    ![\"https:\", \"http:\"].includes(parsed.protocol) ||\n    parsed.username ||\n    parsed.password\n  )\n    throw new Error(\n      \"Use an absolute HTTP or HTTPS embed URL without credentials\",\n    );\n  return parsed;\n}\n\nexport function parseShare(\n  message: object,\n  validateUrl: (value: string) => unknown = embedUrl,\n): GrizzleeShare | null {\n  if (\n    !(\"programId\" in message) ||\n    typeof message.programId !== \"string\" ||\n    !message.programId ||\n    !(\"url\" in message) ||\n    typeof message.url !== \"string\" ||\n    !(\"text\" in message) ||\n    typeof message.text !== \"string\"\n  )\n    return null;\n  try {\n    validateUrl(message.url);\n  } catch {\n    return null;\n  }\n  return { programId: message.programId, url: message.url, text: message.text };\n}\n", "import { embedUrl, parseShare, type GrizzleeShare } from \"./protocol\";\n\nexport { embedUrl } from \"./protocol\";\nexport type { GrizzleeShare } from \"./protocol\";\n\nexport interface GrizzleeEmbedOptions {\n  /** An absolute HTTP or HTTPS start URL minted by the merchant's server. */\n  url: string;\n  /** Return a newly minted URL to reopen the dashboard. Handle errors here. */\n  onSessionExpired?: () => string | void | Promise<string | void>;\n  onReady?: () => void;\n  /** Supplying this callback asks the frame to send share actions to the host. */\n  onShare?: (share: GrizzleeShare) => void;\n  title?: string;\n  className?: string;\n  /** Minimum height in CSS pixels, clamped to 120 through 10,000. Defaults to 320. */\n  minHeight?: number;\n}\n\nconst MAX_HEIGHT = 10_000;\n\nexport function minimumHeight(height = 320): number {\n  return Number.isFinite(height)\n    ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height)))\n    : 320;\n}\n\n/** Both hosts use this listener so origin checks and renewal behave the same way. */\nexport function listenToEmbed(\n  frame: HTMLIFrameElement,\n  options: () => GrizzleeEmbedOptions,\n): () => void {\n  const hostWindow = frame.ownerDocument.defaultView;\n  if (!hostWindow)\n    throw new Error(\"The iframe must belong to a browser document\");\n  let origin = embedUrl(options().url).origin;\n  let active = true;\n  let renewing = false;\n\n  const receive = (event: MessageEvent<unknown>) => {\n    if (\n      !active ||\n      event.origin !== origin ||\n      !frame.contentWindow ||\n      event.source !== frame.contentWindow\n    )\n      return;\n    const message = event.data;\n    if (!message || typeof message !== \"object\" || !(\"type\" in message)) return;\n\n    switch (message.type) {\n      case \"grizzlee:ready\":\n        frame.contentWindow.postMessage(\n          { type: \"grizzlee:configure\", share: !!options().onShare },\n          origin,\n        );\n        options().onReady?.();\n        break;\n      case \"grizzlee:share\": {\n        const share = parseShare(message);\n        if (share) options().onShare?.(share);\n        break;\n      }\n      case \"grizzlee:resize\": {\n        if (\n          \"height\" in message &&\n          typeof message.height === \"number\" &&\n          Number.isSafeInteger(message.height) &&\n          message.height > 0\n        ) {\n          const height = Math.min(\n            MAX_HEIGHT,\n            Math.max(minimumHeight(options().minHeight), message.height),\n          );\n          frame.style.height = `${height}px`;\n        }\n        break;\n      }\n      case \"grizzlee:session_expired\": {\n        const renew = options().onSessionExpired;\n        if (!renew || renewing) return;\n        renewing = true;\n        void (async () => {\n          try {\n            const url = await renew();\n            if (!active || !url) return;\n            const next = embedUrl(url);\n            origin = next.origin;\n            frame.style.height = `${minimumHeight(options().minHeight)}px`;\n            frame.src = next.href;\n          } catch {\n            // Leave the expired dashboard in place. The merchant handles errors in its callback.\n          } finally {\n            renewing = false;\n          }\n        })();\n        break;\n      }\n    }\n  };\n\n  hostWindow.addEventListener(\"message\", receive);\n  return () => {\n    active = false;\n    hostWindow.removeEventListener(\"message\", receive);\n  };\n}\n", "import {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\n/** Append a dashboard iframe. Destroy removes its listener and the iframe. */\nexport function mountGrizzleeEmbed(\n  container: HTMLElement,\n  options: GrizzleeEmbedOptions,\n): { destroy(): void } {\n  const url = embedUrl(options.url);\n  const frame = container.ownerDocument.createElement(\"iframe\");\n  frame.title = options.title ?? \"Partner dashboard\";\n  if (options.className) frame.className = options.className;\n  frame.allow = \"clipboard-write\";\n  frame.referrerPolicy = \"no-referrer\";\n  frame.loading = \"lazy\";\n  frame.style.width = \"100%\";\n  frame.style.border = \"0\";\n  frame.style.minHeight = `${minimumHeight(options.minHeight)}px`;\n  frame.style.height = frame.style.minHeight;\n  const stop = listenToEmbed(frame, () => options);\n  frame.src = url.href;\n  container.appendChild(frame);\n  return {\n    destroy() {\n      stop();\n      frame.remove();\n    },\n  };\n}\n"],
+  "mappings": ";AAMO,SAAS,SACd,KACA,MAAkC,KAC7B;AACL,QAAM,SAAS,IAAI,IAAI,GAAG;AAC1B,MACE,CAAC,CAAC,UAAU,OAAO,EAAE,SAAS,OAAO,QAAQ,KAC7C,OAAO,YACP,OAAO;AAEP,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AACF,SAAO;AACT;AAEO,SAAS,WACd,SACA,cAA0C,UACpB;AACtB,MACE,EAAE,eAAe,YACjB,OAAO,QAAQ,cAAc,YAC7B,CAAC,QAAQ,aACT,EAAE,SAAS,YACX,OAAO,QAAQ,QAAQ,YACvB,EAAE,UAAU,YACZ,OAAO,QAAQ,SAAS;AAExB,WAAO;AACT,MAAI;AACF,gBAAY,QAAQ,GAAG;AAAA,EACzB,QAAQ;AACN,WAAO;AAAA,EACT;AACA,SAAO,EAAE,WAAW,QAAQ,WAAW,KAAK,QAAQ,KAAK,MAAM,QAAQ,KAAK;AAC9E;;;ACvBA,IAAM,aAAa;AAEZ,SAAS,cAAc,SAAS,KAAa;AAClD,SAAO,OAAO,SAAS,MAAM,IACzB,KAAK,IAAI,YAAY,KAAK,IAAI,KAAK,KAAK,KAAK,MAAM,CAAC,CAAC,IACrD;AACN;AAGO,SAAS,cACd,OACA,SACY;AACZ,QAAM,aAAa,MAAM,cAAc;AACvC,MAAI,CAAC;AACH,UAAM,IAAI,MAAM,8CAA8C;AAChE,MAAI,SAAS,SAAS,QAAQ,EAAE,GAAG,EAAE;AACrC,MAAI,SAAS;AACb,MAAI,WAAW;AAEf,QAAM,UAAU,CAAC,UAAiC;AAChD,QACE,CAAC,UACD,MAAM,WAAW,UACjB,CAAC,MAAM,iBACP,MAAM,WAAW,MAAM;AAEvB;AACF,UAAM,UAAU,MAAM;AACtB,QAAI,CAAC,WAAW,OAAO,YAAY,YAAY,EAAE,UAAU,SAAU;AAErE,YAAQ,QAAQ,MAAM;AAAA,MACpB,KAAK;AACH,cAAM,cAAc;AAAA,UAClB,EAAE,MAAM,sBAAsB,OAAO,CAAC,CAAC,QAAQ,EAAE,QAAQ;AAAA,UACzD;AAAA,QACF;AACA,gBAAQ,EAAE,UAAU;AACpB;AAAA,MACF,KAAK,kBAAkB;AACrB,cAAM,QAAQ,WAAW,OAAO;AAChC,YAAI,MAAO,SAAQ,EAAE,UAAU,KAAK;AACpC;AAAA,MACF;AAAA,MACA,KAAK,mBAAmB;AACtB,YACE,YAAY,WACZ,OAAO,QAAQ,WAAW,YAC1B,OAAO,cAAc,QAAQ,MAAM,KACnC,QAAQ,SAAS,GACjB;AACA,gBAAM,SAAS,KAAK;AAAA,YAClB;AAAA,YACA,KAAK,IAAI,cAAc,QAAQ,EAAE,SAAS,GAAG,QAAQ,MAAM;AAAA,UAC7D;AACA,gBAAM,MAAM,SAAS,GAAG,MAAM;AAAA,QAChC;AACA;AAAA,MACF;AAAA,MACA,KAAK,4BAA4B;AAC/B,cAAM,QAAQ,QAAQ,EAAE;AACxB,YAAI,CAAC,SAAS,SAAU;AACxB,mBAAW;AACX,cAAM,YAAY;AAChB,cAAI;AACF,kBAAM,MAAM,MAAM,MAAM;AACxB,gBAAI,CAAC,UAAU,CAAC,IAAK;AACrB,kBAAM,OAAO,SAAS,GAAG;AACzB,qBAAS,KAAK;AACd,kBAAM,MAAM,SAAS,GAAG,cAAc,QAAQ,EAAE,SAAS,CAAC;AAC1D,kBAAM,MAAM,KAAK;AAAA,UACnB,QAAQ;AAAA,UAER,UAAE;AACA,uBAAW;AAAA,UACb;AAAA,QACF,GAAG;AACH;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAEA,aAAW,iBAAiB,WAAW,OAAO;AAC9C,SAAO,MAAM;AACX,aAAS;AACT,eAAW,oBAAoB,WAAW,OAAO;AAAA,EACnD;AACF;;;AChGO,SAAS,mBACd,WACA,SACqB;AACrB,QAAM,MAAM,SAAS,QAAQ,GAAG;AAChC,QAAM,QAAQ,UAAU,cAAc,cAAc,QAAQ;AAC5D,QAAM,QAAQ,QAAQ,SAAS;AAC/B,MAAI,QAAQ,UAAW,OAAM,YAAY,QAAQ;AACjD,QAAM,QAAQ;AACd,QAAM,iBAAiB;AACvB,QAAM,UAAU;AAChB,QAAM,MAAM,QAAQ;AACpB,QAAM,MAAM,SAAS;AACrB,QAAM,MAAM,YAAY,GAAG,cAAc,QAAQ,SAAS,CAAC;AAC3D,QAAM,MAAM,SAAS,MAAM,MAAM;AACjC,QAAM,OAAO,cAAc,OAAO,MAAM,OAAO;AAC/C,QAAM,MAAM,IAAI;AAChB,YAAU,YAAY,KAAK;AAC3B,SAAO;AAAA,IACL,UAAU;AACR,WAAK;AACL,YAAM,OAAO;AAAA,IACf;AAAA,EACF;AACF;",
   "names": []
 }

package/index.cjs

@@ -27,19 +27,31 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 var import_react = require("react");
 
-// packages/react/src/host.ts
-var MAX_HEIGHT = 1e4;
-function minimumHeight(height = 320) {
-  return Number.isFinite(height) ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height))) : 320;
-}
-function embedUrl(url) {
-  const parsed = new URL(url);
+// packages/react/src/protocol.ts
+function embedUrl(url, Url = URL) {
+  const parsed = new Url(url);
   if (!["https:", "http:"].includes(parsed.protocol) || parsed.username || parsed.password)
     throw new Error(
       "Use an absolute HTTP or HTTPS embed URL without credentials"
     );
   return parsed;
 }
+function parseShare(message, validateUrl = embedUrl) {
+  if (!("programId" in message) || typeof message.programId !== "string" || !message.programId || !("url" in message) || typeof message.url !== "string" || !("text" in message) || typeof message.text !== "string")
+    return null;
+  try {
+    validateUrl(message.url);
+  } catch {
+    return null;
+  }
+  return { programId: message.programId, url: message.url, text: message.text };
+}
+
+// packages/react/src/host.ts
+var MAX_HEIGHT = 1e4;
+function minimumHeight(height = 320) {
+  return Number.isFinite(height) ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height))) : 320;
+}
 function listenToEmbed(frame, options) {
   const hostWindow = frame.ownerDocument.defaultView;
   if (!hostWindow)
@@ -61,20 +73,8 @@ function listenToEmbed(frame, options) {
         options().onReady?.();
         break;
       case "grizzlee:share": {
-        if (!("programId" in message) || typeof message.programId !== "string" || !message.programId || !("url" in message) || typeof message.url !== "string" || !("text" in message) || typeof message.text !== "string")
-          return;
-        try {
-          const url = new URL(message.url);
-          if (!["https:", "http:"].includes(url.protocol) || url.username || url.password)
-            return;
-        } catch {
-          return;
-        }
-        options().onShare?.({
-          programId: message.programId,
-          url: message.url,
-          text: message.text
-        });
+        const share = parseShare(message);
+        if (share) options().onShare?.(share);
         break;
       }
       case "grizzlee:resize": {

package/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/index.ts", "../src/host.ts", "../src/embed.ts"],
-  "sourcesContent": ["\"use client\";\n\nimport {\n  createElement,\n  useEffect,\n  useRef,\n  type CSSProperties,\n  type ReactElement,\n} from \"react\";\nimport {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport { mountGrizzleeEmbed } from \"./embed\";\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\nexport interface GrizzleeEmbedProps extends GrizzleeEmbedOptions {\n  style?: CSSProperties;\n}\n\n/** Render a dashboard without putting a server key in the browser. */\nexport function GrizzleeEmbed(props: GrizzleeEmbedProps): ReactElement {\n  const frame = useRef<HTMLIFrameElement>(null);\n  const current = useRef(props);\n  const url = embedUrl(props.url).href;\n  const height = minimumHeight(props.minHeight);\n\n  useEffect(() => {\n    current.current = props;\n  });\n  useEffect(() => {\n    frame.current?.contentWindow?.postMessage(\n      { type: \"grizzlee:configure\", share: !!props.onShare },\n      embedUrl(url).origin,\n    );\n  }, [url, props.onShare]);\n  useEffect(() => {\n    if (frame.current)\n      return listenToEmbed(frame.current, () => current.current);\n  }, [url]);\n\n  return createElement(\"iframe\", {\n    ref: frame,\n    src: url,\n    title: props.title ?? \"Partner dashboard\",\n    className: props.className,\n    style: {\n      width: \"100%\",\n      border: 0,\n      ...props.style,\n      height,\n      minHeight: height,\n    },\n    allow: \"clipboard-write\",\n    referrerPolicy: \"no-referrer\",\n    loading: \"lazy\",\n  });\n}\n", "export interface GrizzleeShare {\n  programId: string;\n  url: string;\n  text: string;\n}\n\nexport interface GrizzleeEmbedOptions {\n  /** An absolute HTTP or HTTPS start URL minted by the merchant's server. */\n  url: string;\n  /** Return a newly minted URL to reopen the dashboard. Handle errors here. */\n  onSessionExpired?: () => string | void | Promise<string | void>;\n  onReady?: () => void;\n  /** Supplying this callback asks the frame to send share actions to the host. */\n  onShare?: (share: GrizzleeShare) => void;\n  title?: string;\n  className?: string;\n  /** Minimum height in CSS pixels, clamped to 120 through 10,000. Defaults to 320. */\n  minHeight?: number;\n}\n\nconst MAX_HEIGHT = 10_000;\n\nexport function minimumHeight(height = 320): number {\n  return Number.isFinite(height)\n    ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height)))\n    : 320;\n}\n\nexport function embedUrl(url: string): URL {\n  const parsed = new URL(url);\n  if (\n    ![\"https:\", \"http:\"].includes(parsed.protocol) ||\n    parsed.username ||\n    parsed.password\n  )\n    throw new Error(\n      \"Use an absolute HTTP or HTTPS embed URL without credentials\",\n    );\n  return parsed;\n}\n\n/** Both hosts use this listener so origin checks and renewal behave the same way. */\nexport function listenToEmbed(\n  frame: HTMLIFrameElement,\n  options: () => GrizzleeEmbedOptions,\n): () => void {\n  const hostWindow = frame.ownerDocument.defaultView;\n  if (!hostWindow)\n    throw new Error(\"The iframe must belong to a browser document\");\n  let origin = embedUrl(options().url).origin;\n  let active = true;\n  let renewing = false;\n\n  const receive = (event: MessageEvent<unknown>) => {\n    if (\n      !active ||\n      event.origin !== origin ||\n      !frame.contentWindow ||\n      event.source !== frame.contentWindow\n    )\n      return;\n    const message = event.data;\n    if (!message || typeof message !== \"object\" || !(\"type\" in message)) return;\n\n    switch (message.type) {\n      case \"grizzlee:ready\":\n        frame.contentWindow.postMessage(\n          { type: \"grizzlee:configure\", share: !!options().onShare },\n          origin,\n        );\n        options().onReady?.();\n        break;\n      case \"grizzlee:share\": {\n        if (\n          !(\"programId\" in message) ||\n          typeof message.programId !== \"string\" ||\n          !message.programId ||\n          !(\"url\" in message) ||\n          typeof message.url !== \"string\" ||\n          !(\"text\" in message) ||\n          typeof message.text !== \"string\"\n        )\n          return;\n        try {\n          const url = new URL(message.url);\n          if (\n            ![\"https:\", \"http:\"].includes(url.protocol) ||\n            url.username ||\n            url.password\n          )\n            return;\n        } catch {\n          return;\n        }\n        options().onShare?.({\n          programId: message.programId,\n          url: message.url,\n          text: message.text,\n        });\n        break;\n      }\n      case \"grizzlee:resize\": {\n        if (\n          \"height\" in message &&\n          typeof message.height === \"number\" &&\n          Number.isSafeInteger(message.height) &&\n          message.height > 0\n        ) {\n          const height = Math.min(\n            MAX_HEIGHT,\n            Math.max(minimumHeight(options().minHeight), message.height),\n          );\n          frame.style.height = `${height}px`;\n        }\n        break;\n      }\n      case \"grizzlee:session_expired\": {\n        const renew = options().onSessionExpired;\n        if (!renew || renewing) return;\n        renewing = true;\n        void (async () => {\n          try {\n            const url = await renew();\n            if (!active || !url) return;\n            const next = embedUrl(url);\n            origin = next.origin;\n            frame.style.height = `${minimumHeight(options().minHeight)}px`;\n            frame.src = next.href;\n          } catch {\n            // Leave the expired dashboard in place. The merchant handles errors in its callback.\n          } finally {\n            renewing = false;\n          }\n        })();\n        break;\n      }\n    }\n  };\n\n  hostWindow.addEventListener(\"message\", receive);\n  return () => {\n    active = false;\n    hostWindow.removeEventListener(\"message\", receive);\n  };\n}\n", "import {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\n/** Append a dashboard iframe. Destroy removes its listener and the iframe. */\nexport function mountGrizzleeEmbed(\n  container: HTMLElement,\n  options: GrizzleeEmbedOptions,\n): { destroy(): void } {\n  const url = embedUrl(options.url);\n  const frame = container.ownerDocument.createElement(\"iframe\");\n  frame.title = options.title ?? \"Partner dashboard\";\n  if (options.className) frame.className = options.className;\n  frame.allow = \"clipboard-write\";\n  frame.referrerPolicy = \"no-referrer\";\n  frame.loading = \"lazy\";\n  frame.style.width = \"100%\";\n  frame.style.border = \"0\";\n  frame.style.minHeight = `${minimumHeight(options.minHeight)}px`;\n  frame.style.height = frame.style.minHeight;\n  const stop = listenToEmbed(frame, () => options);\n  frame.src = url.href;\n  container.appendChild(frame);\n  return {\n    destroy() {\n      stop();\n      frame.remove();\n    },\n  };\n}\n"],
-  "mappings": "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",
+  "sources": ["../src/index.ts", "../src/protocol.ts", "../src/host.ts", "../src/embed.ts"],
+  "sourcesContent": ["\"use client\";\n\nimport {\n  createElement,\n  useEffect,\n  useRef,\n  type CSSProperties,\n  type ReactElement,\n} from \"react\";\nimport {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport { mountGrizzleeEmbed } from \"./embed\";\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\nexport interface GrizzleeEmbedProps extends GrizzleeEmbedOptions {\n  style?: CSSProperties;\n}\n\n/** Render a dashboard without putting a server key in the browser. */\nexport function GrizzleeEmbed(props: GrizzleeEmbedProps): ReactElement {\n  const frame = useRef<HTMLIFrameElement>(null);\n  const current = useRef(props);\n  const url = embedUrl(props.url).href;\n  const height = minimumHeight(props.minHeight);\n\n  useEffect(() => {\n    current.current = props;\n  });\n  useEffect(() => {\n    frame.current?.contentWindow?.postMessage(\n      { type: \"grizzlee:configure\", share: !!props.onShare },\n      embedUrl(url).origin,\n    );\n  }, [url, props.onShare]);\n  useEffect(() => {\n    if (frame.current)\n      return listenToEmbed(frame.current, () => current.current);\n  }, [url]);\n\n  return createElement(\"iframe\", {\n    ref: frame,\n    src: url,\n    title: props.title ?? \"Partner dashboard\",\n    className: props.className,\n    style: {\n      width: \"100%\",\n      border: 0,\n      ...props.style,\n      height,\n      minHeight: height,\n    },\n    allow: \"clipboard-write\",\n    referrerPolicy: \"no-referrer\",\n    loading: \"lazy\",\n  });\n}\n", "export interface GrizzleeShare {\n  programId: string;\n  url: string;\n  text: string;\n}\n\nexport function embedUrl(\n  url: string,\n  Url: new (value: string) => URL = URL,\n): URL {\n  const parsed = new Url(url);\n  if (\n    ![\"https:\", \"http:\"].includes(parsed.protocol) ||\n    parsed.username ||\n    parsed.password\n  )\n    throw new Error(\n      \"Use an absolute HTTP or HTTPS embed URL without credentials\",\n    );\n  return parsed;\n}\n\nexport function parseShare(\n  message: object,\n  validateUrl: (value: string) => unknown = embedUrl,\n): GrizzleeShare | null {\n  if (\n    !(\"programId\" in message) ||\n    typeof message.programId !== \"string\" ||\n    !message.programId ||\n    !(\"url\" in message) ||\n    typeof message.url !== \"string\" ||\n    !(\"text\" in message) ||\n    typeof message.text !== \"string\"\n  )\n    return null;\n  try {\n    validateUrl(message.url);\n  } catch {\n    return null;\n  }\n  return { programId: message.programId, url: message.url, text: message.text };\n}\n", "import { embedUrl, parseShare, type GrizzleeShare } from \"./protocol\";\n\nexport { embedUrl } from \"./protocol\";\nexport type { GrizzleeShare } from \"./protocol\";\n\nexport interface GrizzleeEmbedOptions {\n  /** An absolute HTTP or HTTPS start URL minted by the merchant's server. */\n  url: string;\n  /** Return a newly minted URL to reopen the dashboard. Handle errors here. */\n  onSessionExpired?: () => string | void | Promise<string | void>;\n  onReady?: () => void;\n  /** Supplying this callback asks the frame to send share actions to the host. */\n  onShare?: (share: GrizzleeShare) => void;\n  title?: string;\n  className?: string;\n  /** Minimum height in CSS pixels, clamped to 120 through 10,000. Defaults to 320. */\n  minHeight?: number;\n}\n\nconst MAX_HEIGHT = 10_000;\n\nexport function minimumHeight(height = 320): number {\n  return Number.isFinite(height)\n    ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height)))\n    : 320;\n}\n\n/** Both hosts use this listener so origin checks and renewal behave the same way. */\nexport function listenToEmbed(\n  frame: HTMLIFrameElement,\n  options: () => GrizzleeEmbedOptions,\n): () => void {\n  const hostWindow = frame.ownerDocument.defaultView;\n  if (!hostWindow)\n    throw new Error(\"The iframe must belong to a browser document\");\n  let origin = embedUrl(options().url).origin;\n  let active = true;\n  let renewing = false;\n\n  const receive = (event: MessageEvent<unknown>) => {\n    if (\n      !active ||\n      event.origin !== origin ||\n      !frame.contentWindow ||\n      event.source !== frame.contentWindow\n    )\n      return;\n    const message = event.data;\n    if (!message || typeof message !== \"object\" || !(\"type\" in message)) return;\n\n    switch (message.type) {\n      case \"grizzlee:ready\":\n        frame.contentWindow.postMessage(\n          { type: \"grizzlee:configure\", share: !!options().onShare },\n          origin,\n        );\n        options().onReady?.();\n        break;\n      case \"grizzlee:share\": {\n        const share = parseShare(message);\n        if (share) options().onShare?.(share);\n        break;\n      }\n      case \"grizzlee:resize\": {\n        if (\n          \"height\" in message &&\n          typeof message.height === \"number\" &&\n          Number.isSafeInteger(message.height) &&\n          message.height > 0\n        ) {\n          const height = Math.min(\n            MAX_HEIGHT,\n            Math.max(minimumHeight(options().minHeight), message.height),\n          );\n          frame.style.height = `${height}px`;\n        }\n        break;\n      }\n      case \"grizzlee:session_expired\": {\n        const renew = options().onSessionExpired;\n        if (!renew || renewing) return;\n        renewing = true;\n        void (async () => {\n          try {\n            const url = await renew();\n            if (!active || !url) return;\n            const next = embedUrl(url);\n            origin = next.origin;\n            frame.style.height = `${minimumHeight(options().minHeight)}px`;\n            frame.src = next.href;\n          } catch {\n            // Leave the expired dashboard in place. The merchant handles errors in its callback.\n          } finally {\n            renewing = false;\n          }\n        })();\n        break;\n      }\n    }\n  };\n\n  hostWindow.addEventListener(\"message\", receive);\n  return () => {\n    active = false;\n    hostWindow.removeEventListener(\"message\", receive);\n  };\n}\n", "import {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\n/** Append a dashboard iframe. Destroy removes its listener and the iframe. */\nexport function mountGrizzleeEmbed(\n  container: HTMLElement,\n  options: GrizzleeEmbedOptions,\n): { destroy(): void } {\n  const url = embedUrl(options.url);\n  const frame = container.ownerDocument.createElement(\"iframe\");\n  frame.title = options.title ?? \"Partner dashboard\";\n  if (options.className) frame.className = options.className;\n  frame.allow = \"clipboard-write\";\n  frame.referrerPolicy = \"no-referrer\";\n  frame.loading = \"lazy\";\n  frame.style.width = \"100%\";\n  frame.style.border = \"0\";\n  frame.style.minHeight = `${minimumHeight(options.minHeight)}px`;\n  frame.style.height = frame.style.minHeight;\n  const stop = listenToEmbed(frame, () => options);\n  frame.src = url.href;\n  container.appendChild(frame);\n  return {\n    destroy() {\n      stop();\n      frame.remove();\n    },\n  };\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/index.js

@@ -7,19 +7,31 @@ import {
   useRef
 } from "react";
 
-// packages/react/src/host.ts
-var MAX_HEIGHT = 1e4;
-function minimumHeight(height = 320) {
-  return Number.isFinite(height) ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height))) : 320;
-}
-function embedUrl(url) {
-  const parsed = new URL(url);
+// packages/react/src/protocol.ts
+function embedUrl(url, Url = URL) {
+  const parsed = new Url(url);
   if (!["https:", "http:"].includes(parsed.protocol) || parsed.username || parsed.password)
     throw new Error(
       "Use an absolute HTTP or HTTPS embed URL without credentials"
     );
   return parsed;
 }
+function parseShare(message, validateUrl = embedUrl) {
+  if (!("programId" in message) || typeof message.programId !== "string" || !message.programId || !("url" in message) || typeof message.url !== "string" || !("text" in message) || typeof message.text !== "string")
+    return null;
+  try {
+    validateUrl(message.url);
+  } catch {
+    return null;
+  }
+  return { programId: message.programId, url: message.url, text: message.text };
+}
+
+// packages/react/src/host.ts
+var MAX_HEIGHT = 1e4;
+function minimumHeight(height = 320) {
+  return Number.isFinite(height) ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height))) : 320;
+}
 function listenToEmbed(frame, options) {
   const hostWindow = frame.ownerDocument.defaultView;
   if (!hostWindow)
@@ -41,20 +53,8 @@ function listenToEmbed(frame, options) {
         options().onReady?.();
         break;
       case "grizzlee:share": {
-        if (!("programId" in message) || typeof message.programId !== "string" || !message.programId || !("url" in message) || typeof message.url !== "string" || !("text" in message) || typeof message.text !== "string")
-          return;
-        try {
-          const url = new URL(message.url);
-          if (!["https:", "http:"].includes(url.protocol) || url.username || url.password)
-            return;
-        } catch {
-          return;
-        }
-        options().onShare?.({
-          programId: message.programId,
-          url: message.url,
-          text: message.text
-        });
+        const share = parseShare(message);
+        if (share) options().onShare?.(share);
         break;
       }
       case "grizzlee:resize": {

package/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../src/index.ts", "../src/host.ts", "../src/embed.ts"],
-  "sourcesContent": ["\"use client\";\n\nimport {\n  createElement,\n  useEffect,\n  useRef,\n  type CSSProperties,\n  type ReactElement,\n} from \"react\";\nimport {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport { mountGrizzleeEmbed } from \"./embed\";\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\nexport interface GrizzleeEmbedProps extends GrizzleeEmbedOptions {\n  style?: CSSProperties;\n}\n\n/** Render a dashboard without putting a server key in the browser. */\nexport function GrizzleeEmbed(props: GrizzleeEmbedProps): ReactElement {\n  const frame = useRef<HTMLIFrameElement>(null);\n  const current = useRef(props);\n  const url = embedUrl(props.url).href;\n  const height = minimumHeight(props.minHeight);\n\n  useEffect(() => {\n    current.current = props;\n  });\n  useEffect(() => {\n    frame.current?.contentWindow?.postMessage(\n      { type: \"grizzlee:configure\", share: !!props.onShare },\n      embedUrl(url).origin,\n    );\n  }, [url, props.onShare]);\n  useEffect(() => {\n    if (frame.current)\n      return listenToEmbed(frame.current, () => current.current);\n  }, [url]);\n\n  return createElement(\"iframe\", {\n    ref: frame,\n    src: url,\n    title: props.title ?? \"Partner dashboard\",\n    className: props.className,\n    style: {\n      width: \"100%\",\n      border: 0,\n      ...props.style,\n      height,\n      minHeight: height,\n    },\n    allow: \"clipboard-write\",\n    referrerPolicy: \"no-referrer\",\n    loading: \"lazy\",\n  });\n}\n", "export interface GrizzleeShare {\n  programId: string;\n  url: string;\n  text: string;\n}\n\nexport interface GrizzleeEmbedOptions {\n  /** An absolute HTTP or HTTPS start URL minted by the merchant's server. */\n  url: string;\n  /** Return a newly minted URL to reopen the dashboard. Handle errors here. */\n  onSessionExpired?: () => string | void | Promise<string | void>;\n  onReady?: () => void;\n  /** Supplying this callback asks the frame to send share actions to the host. */\n  onShare?: (share: GrizzleeShare) => void;\n  title?: string;\n  className?: string;\n  /** Minimum height in CSS pixels, clamped to 120 through 10,000. Defaults to 320. */\n  minHeight?: number;\n}\n\nconst MAX_HEIGHT = 10_000;\n\nexport function minimumHeight(height = 320): number {\n  return Number.isFinite(height)\n    ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height)))\n    : 320;\n}\n\nexport function embedUrl(url: string): URL {\n  const parsed = new URL(url);\n  if (\n    ![\"https:\", \"http:\"].includes(parsed.protocol) ||\n    parsed.username ||\n    parsed.password\n  )\n    throw new Error(\n      \"Use an absolute HTTP or HTTPS embed URL without credentials\",\n    );\n  return parsed;\n}\n\n/** Both hosts use this listener so origin checks and renewal behave the same way. */\nexport function listenToEmbed(\n  frame: HTMLIFrameElement,\n  options: () => GrizzleeEmbedOptions,\n): () => void {\n  const hostWindow = frame.ownerDocument.defaultView;\n  if (!hostWindow)\n    throw new Error(\"The iframe must belong to a browser document\");\n  let origin = embedUrl(options().url).origin;\n  let active = true;\n  let renewing = false;\n\n  const receive = (event: MessageEvent<unknown>) => {\n    if (\n      !active ||\n      event.origin !== origin ||\n      !frame.contentWindow ||\n      event.source !== frame.contentWindow\n    )\n      return;\n    const message = event.data;\n    if (!message || typeof message !== \"object\" || !(\"type\" in message)) return;\n\n    switch (message.type) {\n      case \"grizzlee:ready\":\n        frame.contentWindow.postMessage(\n          { type: \"grizzlee:configure\", share: !!options().onShare },\n          origin,\n        );\n        options().onReady?.();\n        break;\n      case \"grizzlee:share\": {\n        if (\n          !(\"programId\" in message) ||\n          typeof message.programId !== \"string\" ||\n          !message.programId ||\n          !(\"url\" in message) ||\n          typeof message.url !== \"string\" ||\n          !(\"text\" in message) ||\n          typeof message.text !== \"string\"\n        )\n          return;\n        try {\n          const url = new URL(message.url);\n          if (\n            ![\"https:\", \"http:\"].includes(url.protocol) ||\n            url.username ||\n            url.password\n          )\n            return;\n        } catch {\n          return;\n        }\n        options().onShare?.({\n          programId: message.programId,\n          url: message.url,\n          text: message.text,\n        });\n        break;\n      }\n      case \"grizzlee:resize\": {\n        if (\n          \"height\" in message &&\n          typeof message.height === \"number\" &&\n          Number.isSafeInteger(message.height) &&\n          message.height > 0\n        ) {\n          const height = Math.min(\n            MAX_HEIGHT,\n            Math.max(minimumHeight(options().minHeight), message.height),\n          );\n          frame.style.height = `${height}px`;\n        }\n        break;\n      }\n      case \"grizzlee:session_expired\": {\n        const renew = options().onSessionExpired;\n        if (!renew || renewing) return;\n        renewing = true;\n        void (async () => {\n          try {\n            const url = await renew();\n            if (!active || !url) return;\n            const next = embedUrl(url);\n            origin = next.origin;\n            frame.style.height = `${minimumHeight(options().minHeight)}px`;\n            frame.src = next.href;\n          } catch {\n            // Leave the expired dashboard in place. The merchant handles errors in its callback.\n          } finally {\n            renewing = false;\n          }\n        })();\n        break;\n      }\n    }\n  };\n\n  hostWindow.addEventListener(\"message\", receive);\n  return () => {\n    active = false;\n    hostWindow.removeEventListener(\"message\", receive);\n  };\n}\n", "import {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\n/** Append a dashboard iframe. Destroy removes its listener and the iframe. */\nexport function mountGrizzleeEmbed(\n  container: HTMLElement,\n  options: GrizzleeEmbedOptions,\n): { destroy(): void } {\n  const url = embedUrl(options.url);\n  const frame = container.ownerDocument.createElement(\"iframe\");\n  frame.title = options.title ?? \"Partner dashboard\";\n  if (options.className) frame.className = options.className;\n  frame.allow = \"clipboard-write\";\n  frame.referrerPolicy = \"no-referrer\";\n  frame.loading = \"lazy\";\n  frame.style.width = \"100%\";\n  frame.style.border = \"0\";\n  frame.style.minHeight = `${minimumHeight(options.minHeight)}px`;\n  frame.style.height = frame.style.minHeight;\n  const stop = listenToEmbed(frame, () => options);\n  frame.src = url.href;\n  container.appendChild(frame);\n  return {\n    destroy() {\n      stop();\n      frame.remove();\n    },\n  };\n}\n"],
-  "mappings": "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",
+  "sources": ["../src/index.ts", "../src/protocol.ts", "../src/host.ts", "../src/embed.ts"],
+  "sourcesContent": ["\"use client\";\n\nimport {\n  createElement,\n  useEffect,\n  useRef,\n  type CSSProperties,\n  type ReactElement,\n} from \"react\";\nimport {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport { mountGrizzleeEmbed } from \"./embed\";\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\nexport interface GrizzleeEmbedProps extends GrizzleeEmbedOptions {\n  style?: CSSProperties;\n}\n\n/** Render a dashboard without putting a server key in the browser. */\nexport function GrizzleeEmbed(props: GrizzleeEmbedProps): ReactElement {\n  const frame = useRef<HTMLIFrameElement>(null);\n  const current = useRef(props);\n  const url = embedUrl(props.url).href;\n  const height = minimumHeight(props.minHeight);\n\n  useEffect(() => {\n    current.current = props;\n  });\n  useEffect(() => {\n    frame.current?.contentWindow?.postMessage(\n      { type: \"grizzlee:configure\", share: !!props.onShare },\n      embedUrl(url).origin,\n    );\n  }, [url, props.onShare]);\n  useEffect(() => {\n    if (frame.current)\n      return listenToEmbed(frame.current, () => current.current);\n  }, [url]);\n\n  return createElement(\"iframe\", {\n    ref: frame,\n    src: url,\n    title: props.title ?? \"Partner dashboard\",\n    className: props.className,\n    style: {\n      width: \"100%\",\n      border: 0,\n      ...props.style,\n      height,\n      minHeight: height,\n    },\n    allow: \"clipboard-write\",\n    referrerPolicy: \"no-referrer\",\n    loading: \"lazy\",\n  });\n}\n", "export interface GrizzleeShare {\n  programId: string;\n  url: string;\n  text: string;\n}\n\nexport function embedUrl(\n  url: string,\n  Url: new (value: string) => URL = URL,\n): URL {\n  const parsed = new Url(url);\n  if (\n    ![\"https:\", \"http:\"].includes(parsed.protocol) ||\n    parsed.username ||\n    parsed.password\n  )\n    throw new Error(\n      \"Use an absolute HTTP or HTTPS embed URL without credentials\",\n    );\n  return parsed;\n}\n\nexport function parseShare(\n  message: object,\n  validateUrl: (value: string) => unknown = embedUrl,\n): GrizzleeShare | null {\n  if (\n    !(\"programId\" in message) ||\n    typeof message.programId !== \"string\" ||\n    !message.programId ||\n    !(\"url\" in message) ||\n    typeof message.url !== \"string\" ||\n    !(\"text\" in message) ||\n    typeof message.text !== \"string\"\n  )\n    return null;\n  try {\n    validateUrl(message.url);\n  } catch {\n    return null;\n  }\n  return { programId: message.programId, url: message.url, text: message.text };\n}\n", "import { embedUrl, parseShare, type GrizzleeShare } from \"./protocol\";\n\nexport { embedUrl } from \"./protocol\";\nexport type { GrizzleeShare } from \"./protocol\";\n\nexport interface GrizzleeEmbedOptions {\n  /** An absolute HTTP or HTTPS start URL minted by the merchant's server. */\n  url: string;\n  /** Return a newly minted URL to reopen the dashboard. Handle errors here. */\n  onSessionExpired?: () => string | void | Promise<string | void>;\n  onReady?: () => void;\n  /** Supplying this callback asks the frame to send share actions to the host. */\n  onShare?: (share: GrizzleeShare) => void;\n  title?: string;\n  className?: string;\n  /** Minimum height in CSS pixels, clamped to 120 through 10,000. Defaults to 320. */\n  minHeight?: number;\n}\n\nconst MAX_HEIGHT = 10_000;\n\nexport function minimumHeight(height = 320): number {\n  return Number.isFinite(height)\n    ? Math.min(MAX_HEIGHT, Math.max(120, Math.ceil(height)))\n    : 320;\n}\n\n/** Both hosts use this listener so origin checks and renewal behave the same way. */\nexport function listenToEmbed(\n  frame: HTMLIFrameElement,\n  options: () => GrizzleeEmbedOptions,\n): () => void {\n  const hostWindow = frame.ownerDocument.defaultView;\n  if (!hostWindow)\n    throw new Error(\"The iframe must belong to a browser document\");\n  let origin = embedUrl(options().url).origin;\n  let active = true;\n  let renewing = false;\n\n  const receive = (event: MessageEvent<unknown>) => {\n    if (\n      !active ||\n      event.origin !== origin ||\n      !frame.contentWindow ||\n      event.source !== frame.contentWindow\n    )\n      return;\n    const message = event.data;\n    if (!message || typeof message !== \"object\" || !(\"type\" in message)) return;\n\n    switch (message.type) {\n      case \"grizzlee:ready\":\n        frame.contentWindow.postMessage(\n          { type: \"grizzlee:configure\", share: !!options().onShare },\n          origin,\n        );\n        options().onReady?.();\n        break;\n      case \"grizzlee:share\": {\n        const share = parseShare(message);\n        if (share) options().onShare?.(share);\n        break;\n      }\n      case \"grizzlee:resize\": {\n        if (\n          \"height\" in message &&\n          typeof message.height === \"number\" &&\n          Number.isSafeInteger(message.height) &&\n          message.height > 0\n        ) {\n          const height = Math.min(\n            MAX_HEIGHT,\n            Math.max(minimumHeight(options().minHeight), message.height),\n          );\n          frame.style.height = `${height}px`;\n        }\n        break;\n      }\n      case \"grizzlee:session_expired\": {\n        const renew = options().onSessionExpired;\n        if (!renew || renewing) return;\n        renewing = true;\n        void (async () => {\n          try {\n            const url = await renew();\n            if (!active || !url) return;\n            const next = embedUrl(url);\n            origin = next.origin;\n            frame.style.height = `${minimumHeight(options().minHeight)}px`;\n            frame.src = next.href;\n          } catch {\n            // Leave the expired dashboard in place. The merchant handles errors in its callback.\n          } finally {\n            renewing = false;\n          }\n        })();\n        break;\n      }\n    }\n  };\n\n  hostWindow.addEventListener(\"message\", receive);\n  return () => {\n    active = false;\n    hostWindow.removeEventListener(\"message\", receive);\n  };\n}\n", "import {\n  embedUrl,\n  listenToEmbed,\n  minimumHeight,\n  type GrizzleeEmbedOptions,\n} from \"./host\";\n\nexport type { GrizzleeEmbedOptions, GrizzleeShare } from \"./host\";\n\n/** Append a dashboard iframe. Destroy removes its listener and the iframe. */\nexport function mountGrizzleeEmbed(\n  container: HTMLElement,\n  options: GrizzleeEmbedOptions,\n): { destroy(): void } {\n  const url = embedUrl(options.url);\n  const frame = container.ownerDocument.createElement(\"iframe\");\n  frame.title = options.title ?? \"Partner dashboard\";\n  if (options.className) frame.className = options.className;\n  frame.allow = \"clipboard-write\";\n  frame.referrerPolicy = \"no-referrer\";\n  frame.loading = \"lazy\";\n  frame.style.width = \"100%\";\n  frame.style.border = \"0\";\n  frame.style.minHeight = `${minimumHeight(options.minHeight)}px`;\n  frame.style.height = frame.style.minHeight;\n  const stop = listenToEmbed(frame, () => options);\n  frame.src = url.href;\n  container.appendChild(frame);\n  return {\n    destroy() {\n      stop();\n      frame.remove();\n    },\n  };\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/native.cjs

@@ -0,0 +1,193 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/react/src/native.ts
+var native_exports = {};
+__export(native_exports, {
+  GrizzleeNativeEmbed: () => GrizzleeNativeEmbed
+});
+module.exports = __toCommonJS(native_exports);
+var import_react = require("react");
+var import_react_native = require("react-native");
+var import_react_native_webview = require("react-native-webview");
+var import_react_native_url_polyfill = require("react-native-url-polyfill");
+
+// packages/react/src/protocol.ts
+function embedUrl(url, Url = URL) {
+  const parsed = new Url(url);
+  if (!["https:", "http:"].includes(parsed.protocol) || parsed.username || parsed.password)
+    throw new Error(
+      "Use an absolute HTTP or HTTPS embed URL without credentials"
+    );
+  return parsed;
+}
+function parseShare(message, validateUrl = embedUrl) {
+  if (!("programId" in message) || typeof message.programId !== "string" || !message.programId || !("url" in message) || typeof message.url !== "string" || !("text" in message) || typeof message.text !== "string")
+    return null;
+  try {
+    validateUrl(message.url);
+  } catch {
+    return null;
+  }
+  return { programId: message.programId, url: message.url, text: message.text };
+}
+
+// packages/react/src/native.ts
+var nativeUrl = (value) => embedUrl(value, import_react_native_url_polyfill.URL);
+function startUrl(value) {
+  const url = nativeUrl(value);
+  if (url.pathname !== "/embed/start" || !url.searchParams.get("session"))
+    throw new Error("Use the /embed/start URL returned by createEmbedSession");
+  return url;
+}
+function GrizzleeNativeEmbed(props) {
+  const url = startUrl(props.startUrl).href;
+  return (0, import_react.createElement)(NativeSession, { ...props, startUrl: url, key: url });
+}
+function NativeSession(props) {
+  const frame = (0, import_react.useRef)(null);
+  const current = (0, import_react.useRef)(props);
+  const active = (0, import_react.useRef)(true);
+  const renewing = (0, import_react.useRef)(false);
+  const [url, setUrl] = (0, import_react.useState)(props.startUrl);
+  const currentUrl = (0, import_react.useRef)(url);
+  const source = startUrl(url);
+  (0, import_react.useEffect)(() => {
+    current.current = props;
+  });
+  (0, import_react.useEffect)(() => {
+    active.current = true;
+    return () => {
+      active.current = false;
+    };
+  }, []);
+  function isCurrentOrigin(value) {
+    if (!active.current || url !== currentUrl.current) return false;
+    try {
+      return nativeUrl(value).origin === source.origin;
+    } catch {
+      return false;
+    }
+  }
+  function isCurrentDocument(value) {
+    if (!isCurrentOrigin(value)) return false;
+    const sender = nativeUrl(value);
+    return sender.pathname === source.pathname && sender.search === source.search;
+  }
+  function reportError(error) {
+    if (active.current && url === currentUrl.current)
+      current.current.onError?.(
+        error instanceof Error ? error : new Error("Partner dashboard failed")
+      );
+  }
+  async function renew() {
+    if (!active.current || url !== currentUrl.current || renewing.current)
+      return;
+    const callback = current.current.onExpired;
+    if (!callback) return;
+    renewing.current = true;
+    try {
+      const value = await callback();
+      if (!active.current || url !== currentUrl.current || !value) return;
+      const next = startUrl(value);
+      if (next.href === url)
+        throw new Error("Session renewal must return a fresh start URL");
+      currentUrl.current = next.href;
+      setUrl(next.href);
+    } catch (error) {
+      reportError(error);
+    } finally {
+      renewing.current = false;
+    }
+  }
+  async function share(value) {
+    try {
+      if (current.current.onShare) await current.current.onShare(value);
+      else await import_react_native.Share.share({ message: `${value.text} ${value.url}` });
+    } catch (error) {
+      reportError(error);
+    }
+  }
+  function receive(event) {
+    if (!isCurrentOrigin(event.nativeEvent.url)) return;
+    let message;
+    try {
+      message = JSON.parse(event.nativeEvent.data);
+    } catch {
+      return;
+    }
+    if (!message || typeof message !== "object" || !("type" in message)) return;
+    switch (message.type) {
+      case "grizzlee:ready":
+        frame.current?.injectJavaScript(
+          `window.postMessage({ type: "grizzlee:configure", share: true }, ${JSON.stringify(source.origin)}); true;`
+        );
+        current.current.onReady?.();
+        break;
+      case "grizzlee:share": {
+        const value = parseShare(message, nativeUrl);
+        if (value) void share(value);
+        break;
+      }
+      case "grizzlee:session_expired":
+        void renew();
+        break;
+      // The WebView scrolls the document and keeps the size set by its native parent.
+      case "grizzlee:resize":
+        break;
+    }
+  }
+  return (0, import_react.createElement)(import_react_native_webview.WebView, {
+    ref: frame,
+    key: url,
+    source: { uri: url },
+    style: [{ flex: 1 }, props.style],
+    // Route every navigation through our check instead of WebView's automatic OS handoff.
+    originWhitelist: ["*"],
+    onShouldStartLoadWithRequest: (request) => isCurrentDocument(request.url),
+    onOpenWindow: () => {
+    },
+    javaScriptEnabled: true,
+    javaScriptCanOpenWindowsAutomatically: false,
+    incognito: true,
+    cacheEnabled: false,
+    sharedCookiesEnabled: false,
+    thirdPartyCookiesEnabled: false,
+    onMessage: receive,
+    onError: (event) => {
+      if (isCurrentDocument(event.nativeEvent.url))
+        reportError(new Error("Partner dashboard could not load"));
+    },
+    onHttpError: (event) => {
+      if (isCurrentDocument(event.nativeEvent.url))
+        reportError(
+          new Error(
+            `Partner dashboard returned HTTP ${event.nativeEvent.statusCode}`
+          )
+        );
+    },
+    onContentProcessDidTerminate: () => {
+      void renew();
+    },
+    onRenderProcessGone: () => {
+      void renew();
+    }
+  });
+}
+//# sourceMappingURL=native.cjs.map

package/native.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/native.ts", "../src/protocol.ts"],
+  "sourcesContent": ["import {\n  createElement,\n  useEffect,\n  useRef,\n  useState,\n  type ReactElement,\n} from \"react\";\nimport { Share, type StyleProp, type ViewStyle } from \"react-native\";\nimport { WebView, type WebViewMessageEvent } from \"react-native-webview\";\nimport { URL as NativeURL } from \"react-native-url-polyfill\";\nimport { embedUrl, parseShare, type GrizzleeShare } from \"./protocol\";\n\nexport type { GrizzleeShare } from \"./protocol\";\n\nexport interface GrizzleeNativeEmbedProps {\n  /** A one-use /embed/start URL minted by the merchant's server. */\n  startUrl: string;\n  /** Return a fresh start URL, or update startUrl in your app. */\n  onExpired?: () => string | void | Promise<string | void>;\n  onReady?: () => void;\n  /** Without this callback, the component opens React Native's share sheet. */\n  onShare?: (share: GrizzleeShare) => void | Promise<void>;\n  /** Loading, renewal and sharing errors. */\n  onError?: (error: Error) => void;\n  style?: StyleProp<ViewStyle>;\n}\n\n// Older React Native releases do not implement URL.origin or URL.protocol.\nconst nativeUrl = (value: string) => embedUrl(value, NativeURL);\n\nfunction startUrl(value: string): URL {\n  const url = nativeUrl(value);\n  if (url.pathname !== \"/embed/start\" || !url.searchParams.get(\"session\"))\n    throw new Error(\"Use the /embed/start URL returned by createEmbedSession\");\n  return url;\n}\n\n/** Render the dashboard directly in a WebView. No merchant wrapper page is needed. */\nexport function GrizzleeNativeEmbed(\n  props: GrizzleeNativeEmbedProps,\n): ReactElement {\n  const url = startUrl(props.startUrl).href;\n  return createElement(NativeSession, { ...props, startUrl: url, key: url });\n}\n\nfunction NativeSession(props: GrizzleeNativeEmbedProps): ReactElement {\n  const frame = useRef<WebView>(null);\n  const current = useRef(props);\n  const active = useRef(true);\n  const renewing = useRef(false);\n  const [url, setUrl] = useState(props.startUrl);\n  const currentUrl = useRef(url);\n  const source = startUrl(url);\n\n  useEffect(() => {\n    current.current = props;\n  });\n  useEffect(() => {\n    active.current = true;\n    return () => {\n      active.current = false;\n    };\n  }, []);\n\n  function isCurrentOrigin(value: string): boolean {\n    if (!active.current || url !== currentUrl.current) return false;\n    try {\n      return nativeUrl(value).origin === source.origin;\n    } catch {\n      return false;\n    }\n  }\n\n  function isCurrentDocument(value: string): boolean {\n    if (!isCurrentOrigin(value)) return false;\n    const sender = nativeUrl(value);\n    return (\n      sender.pathname === source.pathname && sender.search === source.search\n    );\n  }\n\n  function reportError(error: unknown) {\n    if (active.current && url === currentUrl.current)\n      current.current.onError?.(\n        error instanceof Error ? error : new Error(\"Partner dashboard failed\"),\n      );\n  }\n\n  async function renew() {\n    if (!active.current || url !== currentUrl.current || renewing.current)\n      return;\n    const callback = current.current.onExpired;\n    if (!callback) return;\n    renewing.current = true;\n    try {\n      const value = await callback();\n      if (!active.current || url !== currentUrl.current || !value) return;\n      const next = startUrl(value);\n      if (next.href === url)\n        throw new Error(\"Session renewal must return a fresh start URL\");\n      currentUrl.current = next.href;\n      setUrl(next.href);\n    } catch (error) {\n      reportError(error);\n    } finally {\n      renewing.current = false;\n    }\n  }\n\n  async function share(value: GrizzleeShare) {\n    try {\n      if (current.current.onShare) await current.current.onShare(value);\n      else await Share.share({ message: `${value.text} ${value.url}` });\n    } catch (error) {\n      reportError(error);\n    }\n  }\n\n  function receive(event: WebViewMessageEvent) {\n    if (!isCurrentOrigin(event.nativeEvent.url)) return;\n    let message: unknown;\n    try {\n      message = JSON.parse(event.nativeEvent.data);\n    } catch {\n      return;\n    }\n    if (!message || typeof message !== \"object\" || !(\"type\" in message)) return;\n    switch (message.type) {\n      case \"grizzlee:ready\":\n        frame.current?.injectJavaScript(\n          `window.postMessage({ type: \"grizzlee:configure\", share: true }, ${JSON.stringify(source.origin)}); true;`,\n        );\n        current.current.onReady?.();\n        break;\n      case \"grizzlee:share\": {\n        const value = parseShare(message, nativeUrl);\n        if (value) void share(value);\n        break;\n      }\n      case \"grizzlee:session_expired\":\n        void renew();\n        break;\n      // The WebView scrolls the document and keeps the size set by its native parent.\n      case \"grizzlee:resize\":\n        break;\n    }\n  }\n\n  return createElement(WebView, {\n    ref: frame,\n    key: url,\n    source: { uri: url },\n    style: [{ flex: 1 }, props.style],\n    // Route every navigation through our check instead of WebView's automatic OS handoff.\n    originWhitelist: [\"*\"],\n    onShouldStartLoadWithRequest: (request) => isCurrentDocument(request.url),\n    onOpenWindow: () => {},\n    javaScriptEnabled: true,\n    javaScriptCanOpenWindowsAutomatically: false,\n    incognito: true,\n    cacheEnabled: false,\n    sharedCookiesEnabled: false,\n    thirdPartyCookiesEnabled: false,\n    onMessage: receive,\n    onError: (event) => {\n      if (isCurrentDocument(event.nativeEvent.url))\n        reportError(new Error(\"Partner dashboard could not load\"));\n    },\n    onHttpError: (event) => {\n      if (isCurrentDocument(event.nativeEvent.url))\n        reportError(\n          new Error(\n            `Partner dashboard returned HTTP ${event.nativeEvent.statusCode}`,\n          ),\n        );\n    },\n    onContentProcessDidTerminate: () => {\n      void renew();\n    },\n    onRenderProcessGone: () => {\n      void renew();\n    },\n  });\n}\n", "export interface GrizzleeShare {\n  programId: string;\n  url: string;\n  text: string;\n}\n\nexport function embedUrl(\n  url: string,\n  Url: new (value: string) => URL = URL,\n): URL {\n  const parsed = new Url(url);\n  if (\n    ![\"https:\", \"http:\"].includes(parsed.protocol) ||\n    parsed.username ||\n    parsed.password\n  )\n    throw new Error(\n      \"Use an absolute HTTP or HTTPS embed URL without credentials\",\n    );\n  return parsed;\n}\n\nexport function parseShare(\n  message: object,\n  validateUrl: (value: string) => unknown = embedUrl,\n): GrizzleeShare | null {\n  if (\n    !(\"programId\" in message) ||\n    typeof message.programId !== \"string\" ||\n    !message.programId ||\n    !(\"url\" in message) ||\n    typeof message.url !== \"string\" ||\n    !(\"text\" in message) ||\n    typeof message.text !== \"string\"\n  )\n    return null;\n  try {\n    validateUrl(message.url);\n  } catch {\n    return null;\n  }\n  return { programId: message.programId, url: message.url, text: message.text };\n}\n"],
+  "mappings": "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",
+  "names": ["NativeURL"]
+}

package/native.js

@@ -0,0 +1,177 @@
+// packages/react/src/native.ts
+import {
+  createElement,
+  useEffect,
+  useRef,
+  useState
+} from "react";
+import { Share } from "react-native";
+import { WebView } from "react-native-webview";
+import { URL as NativeURL } from "react-native-url-polyfill";
+
+// packages/react/src/protocol.ts
+function embedUrl(url, Url = URL) {
+  const parsed = new Url(url);
+  if (!["https:", "http:"].includes(parsed.protocol) || parsed.username || parsed.password)
+    throw new Error(
+      "Use an absolute HTTP or HTTPS embed URL without credentials"
+    );
+  return parsed;
+}
+function parseShare(message, validateUrl = embedUrl) {
+  if (!("programId" in message) || typeof message.programId !== "string" || !message.programId || !("url" in message) || typeof message.url !== "string" || !("text" in message) || typeof message.text !== "string")
+    return null;
+  try {
+    validateUrl(message.url);
+  } catch {
+    return null;
+  }
+  return { programId: message.programId, url: message.url, text: message.text };
+}
+
+// packages/react/src/native.ts
+var nativeUrl = (value) => embedUrl(value, NativeURL);
+function startUrl(value) {
+  const url = nativeUrl(value);
+  if (url.pathname !== "/embed/start" || !url.searchParams.get("session"))
+    throw new Error("Use the /embed/start URL returned by createEmbedSession");
+  return url;
+}
+function GrizzleeNativeEmbed(props) {
+  const url = startUrl(props.startUrl).href;
+  return createElement(NativeSession, { ...props, startUrl: url, key: url });
+}
+function NativeSession(props) {
+  const frame = useRef(null);
+  const current = useRef(props);
+  const active = useRef(true);
+  const renewing = useRef(false);
+  const [url, setUrl] = useState(props.startUrl);
+  const currentUrl = useRef(url);
+  const source = startUrl(url);
+  useEffect(() => {
+    current.current = props;
+  });
+  useEffect(() => {
+    active.current = true;
+    return () => {
+      active.current = false;
+    };
+  }, []);
+  function isCurrentOrigin(value) {
+    if (!active.current || url !== currentUrl.current) return false;
+    try {
+      return nativeUrl(value).origin === source.origin;
+    } catch {
+      return false;
+    }
+  }
+  function isCurrentDocument(value) {
+    if (!isCurrentOrigin(value)) return false;
+    const sender = nativeUrl(value);
+    return sender.pathname === source.pathname && sender.search === source.search;
+  }
+  function reportError(error) {
+    if (active.current && url === currentUrl.current)
+      current.current.onError?.(
+        error instanceof Error ? error : new Error("Partner dashboard failed")
+      );
+  }
+  async function renew() {
+    if (!active.current || url !== currentUrl.current || renewing.current)
+      return;
+    const callback = current.current.onExpired;
+    if (!callback) return;
+    renewing.current = true;
+    try {
+      const value = await callback();
+      if (!active.current || url !== currentUrl.current || !value) return;
+      const next = startUrl(value);
+      if (next.href === url)
+        throw new Error("Session renewal must return a fresh start URL");
+      currentUrl.current = next.href;
+      setUrl(next.href);
+    } catch (error) {
+      reportError(error);
+    } finally {
+      renewing.current = false;
+    }
+  }
+  async function share(value) {
+    try {
+      if (current.current.onShare) await current.current.onShare(value);
+      else await Share.share({ message: `${value.text} ${value.url}` });
+    } catch (error) {
+      reportError(error);
+    }
+  }
+  function receive(event) {
+    if (!isCurrentOrigin(event.nativeEvent.url)) return;
+    let message;
+    try {
+      message = JSON.parse(event.nativeEvent.data);
+    } catch {
+      return;
+    }
+    if (!message || typeof message !== "object" || !("type" in message)) return;
+    switch (message.type) {
+      case "grizzlee:ready":
+        frame.current?.injectJavaScript(
+          `window.postMessage({ type: "grizzlee:configure", share: true }, ${JSON.stringify(source.origin)}); true;`
+        );
+        current.current.onReady?.();
+        break;
+      case "grizzlee:share": {
+        const value = parseShare(message, nativeUrl);
+        if (value) void share(value);
+        break;
+      }
+      case "grizzlee:session_expired":
+        void renew();
+        break;
+      // The WebView scrolls the document and keeps the size set by its native parent.
+      case "grizzlee:resize":
+        break;
+    }
+  }
+  return createElement(WebView, {
+    ref: frame,
+    key: url,
+    source: { uri: url },
+    style: [{ flex: 1 }, props.style],
+    // Route every navigation through our check instead of WebView's automatic OS handoff.
+    originWhitelist: ["*"],
+    onShouldStartLoadWithRequest: (request) => isCurrentDocument(request.url),
+    onOpenWindow: () => {
+    },
+    javaScriptEnabled: true,
+    javaScriptCanOpenWindowsAutomatically: false,
+    incognito: true,
+    cacheEnabled: false,
+    sharedCookiesEnabled: false,
+    thirdPartyCookiesEnabled: false,
+    onMessage: receive,
+    onError: (event) => {
+      if (isCurrentDocument(event.nativeEvent.url))
+        reportError(new Error("Partner dashboard could not load"));
+    },
+    onHttpError: (event) => {
+      if (isCurrentDocument(event.nativeEvent.url))
+        reportError(
+          new Error(
+            `Partner dashboard returned HTTP ${event.nativeEvent.statusCode}`
+          )
+        );
+    },
+    onContentProcessDidTerminate: () => {
+      void renew();
+    },
+    onRenderProcessGone: () => {
+      void renew();
+    }
+  });
+}
+export {
+  GrizzleeNativeEmbed
+};
+//# sourceMappingURL=native.js.map

package/native.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/native.ts", "../src/protocol.ts"],
+  "sourcesContent": ["import {\n  createElement,\n  useEffect,\n  useRef,\n  useState,\n  type ReactElement,\n} from \"react\";\nimport { Share, type StyleProp, type ViewStyle } from \"react-native\";\nimport { WebView, type WebViewMessageEvent } from \"react-native-webview\";\nimport { URL as NativeURL } from \"react-native-url-polyfill\";\nimport { embedUrl, parseShare, type GrizzleeShare } from \"./protocol\";\n\nexport type { GrizzleeShare } from \"./protocol\";\n\nexport interface GrizzleeNativeEmbedProps {\n  /** A one-use /embed/start URL minted by the merchant's server. */\n  startUrl: string;\n  /** Return a fresh start URL, or update startUrl in your app. */\n  onExpired?: () => string | void | Promise<string | void>;\n  onReady?: () => void;\n  /** Without this callback, the component opens React Native's share sheet. */\n  onShare?: (share: GrizzleeShare) => void | Promise<void>;\n  /** Loading, renewal and sharing errors. */\n  onError?: (error: Error) => void;\n  style?: StyleProp<ViewStyle>;\n}\n\n// Older React Native releases do not implement URL.origin or URL.protocol.\nconst nativeUrl = (value: string) => embedUrl(value, NativeURL);\n\nfunction startUrl(value: string): URL {\n  const url = nativeUrl(value);\n  if (url.pathname !== \"/embed/start\" || !url.searchParams.get(\"session\"))\n    throw new Error(\"Use the /embed/start URL returned by createEmbedSession\");\n  return url;\n}\n\n/** Render the dashboard directly in a WebView. No merchant wrapper page is needed. */\nexport function GrizzleeNativeEmbed(\n  props: GrizzleeNativeEmbedProps,\n): ReactElement {\n  const url = startUrl(props.startUrl).href;\n  return createElement(NativeSession, { ...props, startUrl: url, key: url });\n}\n\nfunction NativeSession(props: GrizzleeNativeEmbedProps): ReactElement {\n  const frame = useRef<WebView>(null);\n  const current = useRef(props);\n  const active = useRef(true);\n  const renewing = useRef(false);\n  const [url, setUrl] = useState(props.startUrl);\n  const currentUrl = useRef(url);\n  const source = startUrl(url);\n\n  useEffect(() => {\n    current.current = props;\n  });\n  useEffect(() => {\n    active.current = true;\n    return () => {\n      active.current = false;\n    };\n  }, []);\n\n  function isCurrentOrigin(value: string): boolean {\n    if (!active.current || url !== currentUrl.current) return false;\n    try {\n      return nativeUrl(value).origin === source.origin;\n    } catch {\n      return false;\n    }\n  }\n\n  function isCurrentDocument(value: string): boolean {\n    if (!isCurrentOrigin(value)) return false;\n    const sender = nativeUrl(value);\n    return (\n      sender.pathname === source.pathname && sender.search === source.search\n    );\n  }\n\n  function reportError(error: unknown) {\n    if (active.current && url === currentUrl.current)\n      current.current.onError?.(\n        error instanceof Error ? error : new Error(\"Partner dashboard failed\"),\n      );\n  }\n\n  async function renew() {\n    if (!active.current || url !== currentUrl.current || renewing.current)\n      return;\n    const callback = current.current.onExpired;\n    if (!callback) return;\n    renewing.current = true;\n    try {\n      const value = await callback();\n      if (!active.current || url !== currentUrl.current || !value) return;\n      const next = startUrl(value);\n      if (next.href === url)\n        throw new Error(\"Session renewal must return a fresh start URL\");\n      currentUrl.current = next.href;\n      setUrl(next.href);\n    } catch (error) {\n      reportError(error);\n    } finally {\n      renewing.current = false;\n    }\n  }\n\n  async function share(value: GrizzleeShare) {\n    try {\n      if (current.current.onShare) await current.current.onShare(value);\n      else await Share.share({ message: `${value.text} ${value.url}` });\n    } catch (error) {\n      reportError(error);\n    }\n  }\n\n  function receive(event: WebViewMessageEvent) {\n    if (!isCurrentOrigin(event.nativeEvent.url)) return;\n    let message: unknown;\n    try {\n      message = JSON.parse(event.nativeEvent.data);\n    } catch {\n      return;\n    }\n    if (!message || typeof message !== \"object\" || !(\"type\" in message)) return;\n    switch (message.type) {\n      case \"grizzlee:ready\":\n        frame.current?.injectJavaScript(\n          `window.postMessage({ type: \"grizzlee:configure\", share: true }, ${JSON.stringify(source.origin)}); true;`,\n        );\n        current.current.onReady?.();\n        break;\n      case \"grizzlee:share\": {\n        const value = parseShare(message, nativeUrl);\n        if (value) void share(value);\n        break;\n      }\n      case \"grizzlee:session_expired\":\n        void renew();\n        break;\n      // The WebView scrolls the document and keeps the size set by its native parent.\n      case \"grizzlee:resize\":\n        break;\n    }\n  }\n\n  return createElement(WebView, {\n    ref: frame,\n    key: url,\n    source: { uri: url },\n    style: [{ flex: 1 }, props.style],\n    // Route every navigation through our check instead of WebView's automatic OS handoff.\n    originWhitelist: [\"*\"],\n    onShouldStartLoadWithRequest: (request) => isCurrentDocument(request.url),\n    onOpenWindow: () => {},\n    javaScriptEnabled: true,\n    javaScriptCanOpenWindowsAutomatically: false,\n    incognito: true,\n    cacheEnabled: false,\n    sharedCookiesEnabled: false,\n    thirdPartyCookiesEnabled: false,\n    onMessage: receive,\n    onError: (event) => {\n      if (isCurrentDocument(event.nativeEvent.url))\n        reportError(new Error(\"Partner dashboard could not load\"));\n    },\n    onHttpError: (event) => {\n      if (isCurrentDocument(event.nativeEvent.url))\n        reportError(\n          new Error(\n            `Partner dashboard returned HTTP ${event.nativeEvent.statusCode}`,\n          ),\n        );\n    },\n    onContentProcessDidTerminate: () => {\n      void renew();\n    },\n    onRenderProcessGone: () => {\n      void renew();\n    },\n  });\n}\n", "export interface GrizzleeShare {\n  programId: string;\n  url: string;\n  text: string;\n}\n\nexport function embedUrl(\n  url: string,\n  Url: new (value: string) => URL = URL,\n): URL {\n  const parsed = new Url(url);\n  if (\n    ![\"https:\", \"http:\"].includes(parsed.protocol) ||\n    parsed.username ||\n    parsed.password\n  )\n    throw new Error(\n      \"Use an absolute HTTP or HTTPS embed URL without credentials\",\n    );\n  return parsed;\n}\n\nexport function parseShare(\n  message: object,\n  validateUrl: (value: string) => unknown = embedUrl,\n): GrizzleeShare | null {\n  if (\n    !(\"programId\" in message) ||\n    typeof message.programId !== \"string\" ||\n    !message.programId ||\n    !(\"url\" in message) ||\n    typeof message.url !== \"string\" ||\n    !(\"text\" in message) ||\n    typeof message.text !== \"string\"\n  )\n    return null;\n  try {\n    validateUrl(message.url);\n  } catch {\n    return null;\n  }\n  return { programId: message.programId, url: message.url, text: message.text };\n}\n"],
+  "mappings": ";AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AACP,SAAS,aAA6C;AACtD,SAAS,eAAyC;AAClD,SAAS,OAAO,iBAAiB;;;ACH1B,SAAS,SACd,KACA,MAAkC,KAC7B;AACL,QAAM,SAAS,IAAI,IAAI,GAAG;AAC1B,MACE,CAAC,CAAC,UAAU,OAAO,EAAE,SAAS,OAAO,QAAQ,KAC7C,OAAO,YACP,OAAO;AAEP,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AACF,SAAO;AACT;AAEO,SAAS,WACd,SACA,cAA0C,UACpB;AACtB,MACE,EAAE,eAAe,YACjB,OAAO,QAAQ,cAAc,YAC7B,CAAC,QAAQ,aACT,EAAE,SAAS,YACX,OAAO,QAAQ,QAAQ,YACvB,EAAE,UAAU,YACZ,OAAO,QAAQ,SAAS;AAExB,WAAO;AACT,MAAI;AACF,gBAAY,QAAQ,GAAG;AAAA,EACzB,QAAQ;AACN,WAAO;AAAA,EACT;AACA,SAAO,EAAE,WAAW,QAAQ,WAAW,KAAK,QAAQ,KAAK,MAAM,QAAQ,KAAK;AAC9E;;;ADdA,IAAM,YAAY,CAAC,UAAkB,SAAS,OAAO,SAAS;AAE9D,SAAS,SAAS,OAAoB;AACpC,QAAM,MAAM,UAAU,KAAK;AAC3B,MAAI,IAAI,aAAa,kBAAkB,CAAC,IAAI,aAAa,IAAI,SAAS;AACpE,UAAM,IAAI,MAAM,yDAAyD;AAC3E,SAAO;AACT;AAGO,SAAS,oBACd,OACc;AACd,QAAM,MAAM,SAAS,MAAM,QAAQ,EAAE;AACrC,SAAO,cAAc,eAAe,EAAE,GAAG,OAAO,UAAU,KAAK,KAAK,IAAI,CAAC;AAC3E;AAEA,SAAS,cAAc,OAA+C;AACpE,QAAM,QAAQ,OAAgB,IAAI;AAClC,QAAM,UAAU,OAAO,KAAK;AAC5B,QAAM,SAAS,OAAO,IAAI;AAC1B,QAAM,WAAW,OAAO,KAAK;AAC7B,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,MAAM,QAAQ;AAC7C,QAAM,aAAa,OAAO,GAAG;AAC7B,QAAM,SAAS,SAAS,GAAG;AAE3B,YAAU,MAAM;AACd,YAAQ,UAAU;AAAA,EACpB,CAAC;AACD,YAAU,MAAM;AACd,WAAO,UAAU;AACjB,WAAO,MAAM;AACX,aAAO,UAAU;AAAA,IACnB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,WAAS,gBAAgB,OAAwB;AAC/C,QAAI,CAAC,OAAO,WAAW,QAAQ,WAAW,QAAS,QAAO;AAC1D,QAAI;AACF,aAAO,UAAU,KAAK,EAAE,WAAW,OAAO;AAAA,IAC5C,QAAQ;AACN,aAAO;AAAA,IACT;AAAA,EACF;AAEA,WAAS,kBAAkB,OAAwB;AACjD,QAAI,CAAC,gBAAgB,KAAK,EAAG,QAAO;AACpC,UAAM,SAAS,UAAU,KAAK;AAC9B,WACE,OAAO,aAAa,OAAO,YAAY,OAAO,WAAW,OAAO;AAAA,EAEpE;AAEA,WAAS,YAAY,OAAgB;AACnC,QAAI,OAAO,WAAW,QAAQ,WAAW;AACvC,cAAQ,QAAQ;AAAA,QACd,iBAAiB,QAAQ,QAAQ,IAAI,MAAM,0BAA0B;AAAA,MACvE;AAAA,EACJ;AAEA,iBAAe,QAAQ;AACrB,QAAI,CAAC,OAAO,WAAW,QAAQ,WAAW,WAAW,SAAS;AAC5D;AACF,UAAM,WAAW,QAAQ,QAAQ;AACjC,QAAI,CAAC,SAAU;AACf,aAAS,UAAU;AACnB,QAAI;AACF,YAAM,QAAQ,MAAM,SAAS;AAC7B,UAAI,CAAC,OAAO,WAAW,QAAQ,WAAW,WAAW,CAAC,MAAO;AAC7D,YAAM,OAAO,SAAS,KAAK;AAC3B,UAAI,KAAK,SAAS;AAChB,cAAM,IAAI,MAAM,+CAA+C;AACjE,iBAAW,UAAU,KAAK;AAC1B,aAAO,KAAK,IAAI;AAAA,IAClB,SAAS,OAAO;AACd,kBAAY,KAAK;AAAA,IACnB,UAAE;AACA,eAAS,UAAU;AAAA,IACrB;AAAA,EACF;AAEA,iBAAe,MAAM,OAAsB;AACzC,QAAI;AACF,UAAI,QAAQ,QAAQ,QAAS,OAAM,QAAQ,QAAQ,QAAQ,KAAK;AAAA,UAC3D,OAAM,MAAM,MAAM,EAAE,SAAS,GAAG,MAAM,IAAI,IAAI,MAAM,GAAG,GAAG,CAAC;AAAA,IAClE,SAAS,OAAO;AACd,kBAAY,KAAK;AAAA,IACnB;AAAA,EACF;AAEA,WAAS,QAAQ,OAA4B;AAC3C,QAAI,CAAC,gBAAgB,MAAM,YAAY,GAAG,EAAG;AAC7C,QAAI;AACJ,QAAI;AACF,gBAAU,KAAK,MAAM,MAAM,YAAY,IAAI;AAAA,IAC7C,QAAQ;AACN;AAAA,IACF;AACA,QAAI,CAAC,WAAW,OAAO,YAAY,YAAY,EAAE,UAAU,SAAU;AACrE,YAAQ,QAAQ,MAAM;AAAA,MACpB,KAAK;AACH,cAAM,SAAS;AAAA,UACb,mEAAmE,KAAK,UAAU,OAAO,MAAM,CAAC;AAAA,QAClG;AACA,gBAAQ,QAAQ,UAAU;AAC1B;AAAA,MACF,KAAK,kBAAkB;AACrB,cAAM,QAAQ,WAAW,SAAS,SAAS;AAC3C,YAAI,MAAO,MAAK,MAAM,KAAK;AAC3B;AAAA,MACF;AAAA,MACA,KAAK;AACH,aAAK,MAAM;AACX;AAAA;AAAA,MAEF,KAAK;AACH;AAAA,IACJ;AAAA,EACF;AAEA,SAAO,cAAc,SAAS;AAAA,IAC5B,KAAK;AAAA,IACL,KAAK;AAAA,IACL,QAAQ,EAAE,KAAK,IAAI;AAAA,IACnB,OAAO,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,KAAK;AAAA;AAAA,IAEhC,iBAAiB,CAAC,GAAG;AAAA,IACrB,8BAA8B,CAAC,YAAY,kBAAkB,QAAQ,GAAG;AAAA,IACxE,cAAc,MAAM;AAAA,IAAC;AAAA,IACrB,mBAAmB;AAAA,IACnB,uCAAuC;AAAA,IACvC,WAAW;AAAA,IACX,cAAc;AAAA,IACd,sBAAsB;AAAA,IACtB,0BAA0B;AAAA,IAC1B,WAAW;AAAA,IACX,SAAS,CAAC,UAAU;AAClB,UAAI,kBAAkB,MAAM,YAAY,GAAG;AACzC,oBAAY,IAAI,MAAM,kCAAkC,CAAC;AAAA,IAC7D;AAAA,IACA,aAAa,CAAC,UAAU;AACtB,UAAI,kBAAkB,MAAM,YAAY,GAAG;AACzC;AAAA,UACE,IAAI;AAAA,YACF,mCAAmC,MAAM,YAAY,UAAU;AAAA,UACjE;AAAA,QACF;AAAA,IACJ;AAAA,IACA,8BAA8B,MAAM;AAClC,WAAK,MAAM;AAAA,IACb;AAAA,IACA,qBAAqB,MAAM;AACzB,WAAK,MAAM;AAAA,IACb;AAAA,EACF,CAAC;AACH;",
+  "names": []
+}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@grizzlee/react",
-  "version": "0.2.0",
+  "version": "0.3.1",
   "license": "MIT",
   "publishConfig": {
     "access": "public"
   },
   "homepage": "https://grizzlee.ca",
-  "description": "Embed Grizzlee partner dashboards in React or plain JavaScript apps.",
+  "description": "Embed Grizzlee partner dashboards in React, React Native or plain JavaScript apps.",
   "type": "module",
   "sideEffects": false,
   "engines": {
@@ -19,6 +19,9 @@
     "*": {
       "embed": [
         "./types/embed.d.cts"
+      ],
+      "native": [
+        "./types/native.d.cts"
       ]
     }
   },
@@ -44,6 +47,17 @@
         "default": "./embed.cjs"
       },
       "default": "./embed.js"
+    },
+    "./native": {
+      "import": {
+        "types": "./types/native.d.ts",
+        "default": "./native.js"
+      },
+      "require": {
+        "types": "./types/native.d.cts",
+        "default": "./native.cjs"
+      },
+      "default": "./native.js"
     }
   },
   "files": [
@@ -55,12 +69,23 @@
     "README.md",
     "CHANGELOG.md"
   ],
+  "dependencies": {
+    "react-native-url-polyfill": "2.0.0"
+  },
   "peerDependencies": {
-    "react": ">=18"
+    "react": ">=18",
+    "react-native": ">=0.78",
+    "react-native-webview": ">=13"
   },
   "peerDependenciesMeta": {
     "react": {
       "optional": true
+    },
+    "react-native": {
+      "optional": true
+    },
+    "react-native-webview": {
+      "optional": true
     }
   }
 }

package/types/host.d.cts

@@ -1,8 +1,6 @@
-export interface GrizzleeShare {
-    programId: string;
-    url: string;
-    text: string;
-}
+import { type GrizzleeShare } from "./protocol.cjs";
+export { embedUrl } from "./protocol.cjs";
+export type { GrizzleeShare } from "./protocol.cjs";
 export interface GrizzleeEmbedOptions {
     /** An absolute HTTP or HTTPS start URL minted by the merchant's server. */
     url: string;
@@ -17,6 +15,5 @@ export interface GrizzleeEmbedOptions {
     minHeight?: number;
 }
 export declare function minimumHeight(height?: number): number;
-export declare function embedUrl(url: string): URL;
 /** Both hosts use this listener so origin checks and renewal behave the same way. */
 export declare function listenToEmbed(frame: HTMLIFrameElement, options: () => GrizzleeEmbedOptions): () => void;

package/types/host.d.ts

@@ -1,8 +1,6 @@
-export interface GrizzleeShare {
-    programId: string;
-    url: string;
-    text: string;
-}
+import { type GrizzleeShare } from "./protocol.js";
+export { embedUrl } from "./protocol.js";
+export type { GrizzleeShare } from "./protocol.js";
 export interface GrizzleeEmbedOptions {
     /** An absolute HTTP or HTTPS start URL minted by the merchant's server. */
     url: string;
@@ -17,6 +15,5 @@ export interface GrizzleeEmbedOptions {
     minHeight?: number;
 }
 export declare function minimumHeight(height?: number): number;
-export declare function embedUrl(url: string): URL;
 /** Both hosts use this listener so origin checks and renewal behave the same way. */
 export declare function listenToEmbed(frame: HTMLIFrameElement, options: () => GrizzleeEmbedOptions): () => void;

package/types/native.d.cts

@@ -0,0 +1,18 @@
+import { type ReactElement } from "react";
+import { type StyleProp, type ViewStyle } from "react-native";
+import { type GrizzleeShare } from "./protocol.cjs";
+export type { GrizzleeShare } from "./protocol.cjs";
+export interface GrizzleeNativeEmbedProps {
+    /** A one-use /embed/start URL minted by the merchant's server. */
+    startUrl: string;
+    /** Return a fresh start URL, or update startUrl in your app. */
+    onExpired?: () => string | void | Promise<string | void>;
+    onReady?: () => void;
+    /** Without this callback, the component opens React Native's share sheet. */
+    onShare?: (share: GrizzleeShare) => void | Promise<void>;
+    /** Loading, renewal and sharing errors. */
+    onError?: (error: Error) => void;
+    style?: StyleProp<ViewStyle>;
+}
+/** Render the dashboard directly in a WebView. No merchant wrapper page is needed. */
+export declare function GrizzleeNativeEmbed(props: GrizzleeNativeEmbedProps): ReactElement;

package/types/native.d.ts

@@ -0,0 +1,18 @@
+import { type ReactElement } from "react";
+import { type StyleProp, type ViewStyle } from "react-native";
+import { type GrizzleeShare } from "./protocol.js";
+export type { GrizzleeShare } from "./protocol.js";
+export interface GrizzleeNativeEmbedProps {
+    /** A one-use /embed/start URL minted by the merchant's server. */
+    startUrl: string;
+    /** Return a fresh start URL, or update startUrl in your app. */
+    onExpired?: () => string | void | Promise<string | void>;
+    onReady?: () => void;
+    /** Without this callback, the component opens React Native's share sheet. */
+    onShare?: (share: GrizzleeShare) => void | Promise<void>;
+    /** Loading, renewal and sharing errors. */
+    onError?: (error: Error) => void;
+    style?: StyleProp<ViewStyle>;
+}
+/** Render the dashboard directly in a WebView. No merchant wrapper page is needed. */
+export declare function GrizzleeNativeEmbed(props: GrizzleeNativeEmbedProps): ReactElement;

package/types/protocol.d.cts

@@ -0,0 +1,7 @@
+export interface GrizzleeShare {
+    programId: string;
+    url: string;
+    text: string;
+}
+export declare function embedUrl(url: string, Url?: new (value: string) => URL): URL;
+export declare function parseShare(message: object, validateUrl?: (value: string) => unknown): GrizzleeShare | null;

package/types/protocol.d.ts

@@ -0,0 +1,7 @@
+export interface GrizzleeShare {
+    programId: string;
+    url: string;
+    text: string;
+}
+export declare function embedUrl(url: string, Url?: new (value: string) => URL): URL;
+export declare function parseShare(message: object, validateUrl?: (value: string) => unknown): GrizzleeShare | null;