@rehers/rehers-roleplay-sdk 2.5.6 → 3.0.0

package/README.md

@@ -17,21 +17,27 @@ Add this once, above all your routes. It initializes the SDK for the logged-in S
 Production flow:
 
 1. Your backend requests a short-lived `userToken` from `POST /api/seamless/auth/user-token`
-2. Your frontend receives that `userToken`
-3. You pass `publishableKey` + `userToken` into the SDK
+2. Your frontend provides a `getUserToken()` callback that calls your backend route
+3. The SDK calls `getUserToken()` on startup and before the iframe session expires
 
-The browser should not mint sessions from raw `userId`, `userEmail`, or `userRole` in production.
+The browser should not mint sessions from raw identity fields in production.
 
 ```tsx
 import { SeamlessRoleplayProvider } from "@rehers/rehers-roleplay-sdk/react";
 
 function App() {
-  const userToken = useRoleplayUserToken(); // fetched from your backend
+  async function getUserToken() {
+    const tokenRes = await fetch("/api/roleplay/user-token", {
+      method: "POST",
+      credentials: "include",
+    }).then((r) => r.json());
+
+    return tokenRes.userToken;
+  }
 
   return (
     <SeamlessRoleplayProvider
-      publishableKey="pk_live_..."
-      userToken={userToken}
+      getUserToken={getUserToken}
       onReady={() => console.log("Roleplay SDK ready")}
       onError={(err) => console.error("Roleplay SDK error", err)}
     >
@@ -56,7 +62,9 @@ const tokenRes = await fetch("/api/roleplay/user-token", {
 const userToken = tokenRes.userToken;
 ```
 
-That's the only setup. Everything below just works.
+The SDK owns session refresh timing and will call `getUserToken()` again before
+the embedded app session expires. That's the only setup. Everything below just
+works.
 
 ---
 
@@ -222,8 +230,14 @@ import "@rehers/rehers-roleplay-sdk";
 
 // Initialize once
 SeamlessRoleplay.init({
-  publishableKey: "pk_live_...",
-  userToken: "...",
+  getUserToken: async () => {
+    const res = await fetch("/api/roleplay/user-token", {
+      method: "POST",
+      credentials: "include",
+    });
+    const data = await res.json();
+    return data.userToken;
+  },
   onReady() { console.log("ready"); },
 });
 

package/index.d.ts

@@ -1,10 +1,12 @@
+export type SeamlessRoleplayUserTokenProvider = () => string | Promise<string>;
+
 interface SeamlessRoleplayInitBase {
-  /** Publishable API key (starts with pk_live_ or pk_test_) */
-  publishableKey: string;
-  /** Optional user role for syncing permissions ("owner" | "admin" | "member") */
-  userRole?: "owner" | "admin" | "member";
-  /** Optional short-lived signed JWT for identity verification */
-  userToken?: string;
+  /**
+   * Returns a fresh short-lived signed user JWT minted by your backend for the
+   * currently signed-in Seamless user. The SDK calls this on startup and before
+   * its iframe session expires.
+   */
+  getUserToken: SeamlessRoleplayUserTokenProvider;
   /** Override the app origin — where the iframe loads from (for dev/testing only) */
   origin?: string;
   /** Called when the SDK session is ready */
@@ -13,22 +15,7 @@ interface SeamlessRoleplayInitBase {
   onError?: (error: { code: string; message: string }) => void;
 }
 
-export type SeamlessRoleplayInitOptions =
-  | (SeamlessRoleplayInitBase & {
-      /** Preferred production auth path: signed Seamless bootstrap token */
-      userToken: string;
-      /** Optional fallback fields kept for local demos/internal tools */
-      userId?: string;
-      userEmail?: string;
-    })
-  | (SeamlessRoleplayInitBase & {
-      /** Legacy/demo fallback path when no signed token is available */
-      userToken?: string;
-      /** Logged-in Seamless user ID. Pass String(me.id) from GET /api/users/me */
-      userId: string;
-      /** Logged-in Seamless user email. Pass me.username from GET /api/users/me */
-      userEmail: string;
-    });
+export type SeamlessRoleplayInitOptions = SeamlessRoleplayInitBase;
 
 export interface SeamlessRoleplayOpenData {
   /** Full name of the contact */
@@ -83,7 +70,7 @@ export interface AddToScenarioOptions {
 }
 
 export interface SeamlessRoleplaySDK {
-  /** Initialize the SDK with a publishable key. */
+  /** Initialize the SDK with a host-provided user token callback. */
   init(options: SeamlessRoleplayInitOptions): void;
   /** Open the roleplay modal for a contact (dialog mode). */
   open(data: SeamlessRoleplayOpenData): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rehers/rehers-roleplay-sdk",
-  "version": "2.5.6",
+  "version": "3.0.0",
   "sideEffects": true,
   "description": "Seamless Roleplay SDK — embed roleplay call sessions via a modal + iframe",
   "main": "roleplay-sdk.js",

package/react.d.ts

@@ -13,7 +13,7 @@ interface SeamlessRoleplayContextValue {
 export type SeamlessRoleplayProviderProps = SeamlessRoleplayInitOptions & {
     children: ReactNode;
 };
-export declare function SeamlessRoleplayProvider({ publishableKey, userId, userEmail, userRole, userToken, origin, onReady, onError, children, }: SeamlessRoleplayProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function SeamlessRoleplayProvider({ getUserToken, origin, onReady, onError, children, }: SeamlessRoleplayProviderProps): import("react/jsx-runtime").JSX.Element;
 export declare function useSeamlessRoleplay(): SeamlessRoleplayContextValue;
 export interface RoleplayDialogProps {
     open: boolean;

package/react.js

@@ -22,7 +22,7 @@ function getSDK() {
 }
 const SeamlessRoleplayContext = createContext(null);
 let providerMountCount = 0;
-export function SeamlessRoleplayProvider({ publishableKey, userId, userEmail, userRole, userToken, origin, onReady, onError, children, }) {
+export function SeamlessRoleplayProvider({ getUserToken, origin, onReady, onError, children, }) {
     const [state, setState] = useState({ isReady: false, error: null });
     const mountedRef = useRef(false);
     const onReadyRef = useCallbackRef(onReady);
@@ -36,57 +36,31 @@ export function SeamlessRoleplayProvider({ publishableKey, userId, userEmail, us
         }
         mountedRef.current = true;
         setState({ isReady: false, error: null });
-        const initOptions = userToken
-            ? {
-                publishableKey,
-                userToken,
-                userId,
-                userEmail,
-                userRole,
-                origin,
-                onReady: () => {
-                    var _a;
-                    if (!mountedRef.current)
-                        return;
-                    setState({ isReady: true, error: null });
-                    (_a = onReadyRef.current) === null || _a === void 0 ? void 0 : _a.call(onReadyRef);
-                },
-                onError: (err) => {
-                    var _a;
-                    if (!mountedRef.current)
-                        return;
-                    setState({ isReady: false, error: err });
-                    (_a = onErrorRef.current) === null || _a === void 0 ? void 0 : _a.call(onErrorRef, err);
-                },
-            }
-            : {
-                publishableKey,
-                userId: userId || "",
-                userEmail: userEmail || "",
-                userRole,
-                origin,
-                onReady: () => {
-                    var _a;
-                    if (!mountedRef.current)
-                        return;
-                    setState({ isReady: true, error: null });
-                    (_a = onReadyRef.current) === null || _a === void 0 ? void 0 : _a.call(onReadyRef);
-                },
-                onError: (err) => {
-                    var _a;
-                    if (!mountedRef.current)
-                        return;
-                    setState({ isReady: false, error: err });
-                    (_a = onErrorRef.current) === null || _a === void 0 ? void 0 : _a.call(onErrorRef, err);
-                },
-            };
+        const initOptions = {
+            getUserToken,
+            origin,
+            onReady: () => {
+                var _a;
+                if (!mountedRef.current)
+                    return;
+                setState({ isReady: true, error: null });
+                (_a = onReadyRef.current) === null || _a === void 0 ? void 0 : _a.call(onReadyRef);
+            },
+            onError: (err) => {
+                var _a;
+                if (!mountedRef.current)
+                    return;
+                setState({ isReady: false, error: err });
+                (_a = onErrorRef.current) === null || _a === void 0 ? void 0 : _a.call(onErrorRef, err);
+            },
+        };
         sdk.init(initOptions);
         return () => {
             mountedRef.current = false;
             providerMountCount--;
             sdk.destroy();
         };
-    }, [sdk, publishableKey, userId, userEmail, userRole, userToken, origin]);
+    }, [sdk, getUserToken, origin]);
     const contextValue = useMemo(() => ({ ...state, sdk }), [state, sdk]);
     return (_jsx(SeamlessRoleplayContext.Provider, { value: contextValue, children: children }));
 }

package/roleplay-sdk.js

@@ -1,10 +1,10 @@
 /**
- * SeamlessRoleplay SDK v2
+ * SeamlessRoleplay SDK v3
  *
- * Publishable-key auth model. No build step required.
+ * User-token auth model. No build step required.
  *
  * Usage:
- *   SeamlessRoleplay.init({ publishableKey: 'pk_live_...', userToken: 'jwt...' });
+ *   SeamlessRoleplay.init({ getUserToken: async () => 'jwt...' });
  *   SeamlessRoleplay.open({ name: '...', domain: '...', company: '...', title: '...' });
  */
 (function () {
@@ -16,17 +16,17 @@
   var SDK_LOG_PREFIX = "[SeamlessRoleplay]";
 
   // ── Auth state ────────────────────────────────────────────────────
-  var publishableKey = null;
-  var userId = null;
-  var userEmail = null;
-  var userRole = null;
-  var userToken = null;
+  var getUserToken = null;
+  var latestUserToken = null;
+  var userTokenRequest = null;
   var paymentLink = null;
   var appOrigin = null;
 
   var sessionToken = null;
   var sessionExpiresAt = 0; // epoch ms
+  var sessionRefreshBufferMs = 30000;
   var refreshTimer = null;
+  var refreshRetryDelayMs = 5000;
   var fetchingSession = null; // single-flight Promise
   var activeSessionXhr = null;
   var activeInitVersion = 0;
@@ -93,6 +93,16 @@
     }
   }
 
+  function normalizeToken(value) {
+    if (typeof value !== "string") return null;
+    var trimmed = value.trim();
+    return trimmed ? trimmed : null;
+  }
+
+  function makeError(code, message) {
+    return { code: code, message: message };
+  }
+
   // ── Session management ────────────────────────────────────────────
 
   function clearSessionRequest() {
@@ -105,91 +115,236 @@
     fetchingSession = null;
   }
 
-  function fetchSession() {
+  function resolveUserToken() {
+    if (typeof getUserToken !== "function") {
+      return Promise.reject(
+        makeError("INVALID_INIT", "requires { getUserToken }")
+      );
+    }
+
+    if (userTokenRequest) return userTokenRequest;
+
+    userTokenRequest = Promise.resolve()
+      .then(function () {
+        return getUserToken();
+      })
+      .then(
+        function (value) {
+          userTokenRequest = null;
+          var token = normalizeToken(value);
+          if (!token) {
+            throw makeError(
+              "USER_TOKEN_ERROR",
+              "getUserToken() did not return a valid userToken"
+            );
+          }
+          latestUserToken = token;
+          return token;
+        },
+        function (err) {
+          userTokenRequest = null;
+          throw makeError(
+            (err && err.code) || "USER_TOKEN_ERROR",
+            (err && err.message) || "Failed to get a fresh userToken"
+          );
+        }
+      );
+
+    return userTokenRequest;
+  }
+
+  function dispatchRefreshToTarget(targetIframe) {
+    if (!sessionToken) return;
+    sendMsg(targetIframe, {
+      type: "seamless-session-refresh",
+      sessionToken: sessionToken,
+    });
+  }
+
+  function broadcastSessionRefresh() {
+    if (mountIframe) dispatchRefreshToTarget(mountIframe);
+    if (dialogIframe) dispatchRefreshToTarget(dialogIframe);
+  }
+
+  function notifySessionRefreshFailed(err) {
+    var error = {
+      code: "SESSION_REFRESH_FAILED",
+      message:
+        (err && err.message) ||
+        "Failed to refresh the SDK session before it expired",
+    };
+
+    try {
+      if (initCallbacks.onError) initCallbacks.onError(error);
+    } catch (_) {}
+    try {
+      if (mountCallbacks.onError) mountCallbacks.onError(error);
+    } catch (_) {}
+    try {
+      if (dialogCallbacks.onError) dialogCallbacks.onError(error);
+    } catch (_) {}
+    try {
+      if (dialogAddToScenarioCallbacks.onError) {
+        dialogAddToScenarioCallbacks.onError(error);
+      }
+    } catch (_) {}
+  }
+
+  function computeRefreshBuffer(ttlMs) {
+    if (!Number.isFinite(ttlMs) || ttlMs <= 0) return 30000;
+    return Math.min(30000, Math.max(1000, Math.floor(ttlMs * 0.1)));
+  }
+
+  function computeRefreshDelay(ttlMs) {
+    if (!Number.isFinite(ttlMs) || ttlMs <= 0) return 5000;
+
+    var eightyPercent = Math.floor(ttlMs * 0.8);
+    var oneMinuteBeforeExpiry = ttlMs - 60000;
+    var target =
+      oneMinuteBeforeExpiry > 0
+        ? Math.min(eightyPercent, oneMinuteBeforeExpiry)
+        : Math.floor(ttlMs * 0.5);
+
+    return Math.max(target, 1000);
+  }
+
+  function scheduleRefreshRetry(err) {
+    if (!initCalled || !sessionExpiresAt) return;
+    if (refreshTimer) clearTimeout(refreshTimer);
+
+    var remainingMs = sessionExpiresAt - Date.now();
+    if (remainingMs <= sessionRefreshBufferMs) {
+      notifySessionRefreshFailed(err);
+      return;
+    }
+
+    var delay = Math.min(
+      refreshRetryDelayMs,
+      Math.max(1000, remainingMs - sessionRefreshBufferMs)
+    );
+    refreshRetryDelayMs = Math.min(refreshRetryDelayMs * 2, 60000);
+
+    refreshTimer = setTimeout(function () {
+      fetchSession({ broadcastRefresh: true }).catch(scheduleRefreshRetry);
+    }, delay);
+  }
+
+  function fetchSession(options) {
+    options = options || {};
     var requestInitVersion = activeInitVersion;
 
     if (fetchingSession && fetchingSession.initVersion === requestInitVersion) {
+      if (options.broadcastRefresh) {
+        return fetchingSession.promise.then(function (result) {
+          if (
+            requestInitVersion === activeInitVersion &&
+            result &&
+            result.sessionToken
+          ) {
+            broadcastSessionRefresh();
+          }
+          return result;
+        });
+      }
       return fetchingSession.promise;
     }
 
-    var requestPromise = new Promise(function (resolve, reject) {
-      var url = getApiOrigin() + "/api/sdk/session";
-      var body = userToken
-        ? { userToken: userToken }
-        : { userId: userId, userEmail: userEmail, userRole: userRole };
-
-      var xhr = new XMLHttpRequest();
-      activeSessionXhr = xhr;
-      xhr.open("POST", url, true);
-      xhr.setRequestHeader("Content-Type", "application/json");
-      xhr.setRequestHeader("X-Publishable-Key", publishableKey);
-      xhr.withCredentials = false;
-      xhr.timeout = SESSION_TIMEOUT_MS;
-
-      function cleanupRequest() {
-        if (activeSessionXhr === xhr) {
-          activeSessionXhr = null;
-        }
-        if (fetchingSession && fetchingSession.promise === requestPromise) {
-          fetchingSession = null;
-        }
+    var requestPromise = resolveUserToken().then(function (freshUserToken) {
+      if (requestInitVersion !== activeInitVersion) {
+        throw makeError("ABORTED", "Stale session request ignored");
       }
 
-      xhr.onload = function () {
-        cleanupRequest();
+      return new Promise(function (resolve, reject) {
+        var url = getApiOrigin() + "/api/sdk/session";
+        var body = { userToken: freshUserToken };
 
-        if (requestInitVersion !== activeInitVersion) {
-          reject({ code: "ABORTED", message: "Stale session response ignored" });
-          return;
-        }
+        var xhr = new XMLHttpRequest();
+        activeSessionXhr = xhr;
+        xhr.open("POST", url, true);
+        xhr.setRequestHeader("Content-Type", "application/json");
+        xhr.withCredentials = false;
+        xhr.timeout = SESSION_TIMEOUT_MS;
 
-        var data;
-        try {
-          data = JSON.parse(xhr.responseText);
-        } catch (e) {
-          reject({ code: "PARSE_ERROR", message: "Invalid response from session endpoint" });
-          return;
+        function cleanupRequest() {
+          if (activeSessionXhr === xhr) {
+            activeSessionXhr = null;
+          }
+          if (fetchingSession && fetchingSession.promise === requestPromise) {
+            fetchingSession = null;
+          }
         }
 
-        if (xhr.status === 200 && data.sessionToken) {
-          sessionToken = data.sessionToken;
-          var ttl = (data.expiresIn || 3600) * 1000;
-          sessionExpiresAt = Date.now() + ttl;
-          scheduleRefresh(ttl);
-          resolve({ sessionToken: sessionToken });
-          return;
-        }
+        xhr.onload = function () {
+          cleanupRequest();
 
-        if (data.error === "USER_NOT_FOUND") {
-          // Trial mode — not a fatal error
-          sessionToken = null;
-          if (data.paymentLink) paymentLink = data.paymentLink;
-          resolve({ trialMode: true });
-          return;
-        }
+          if (requestInitVersion !== activeInitVersion) {
+            reject({ code: "ABORTED", message: "Stale session response ignored" });
+            return;
+          }
 
-        reject({
-          code: data.error || "SESSION_ERROR",
-          message: data.message || "Failed to create session (HTTP " + xhr.status + ")",
-        });
-      };
+          var data;
+          try {
+            data = JSON.parse(xhr.responseText);
+          } catch (e) {
+            reject({ code: "PARSE_ERROR", message: "Invalid response from session endpoint" });
+            return;
+          }
 
-      xhr.onerror = function () {
-        cleanupRequest();
-        reject({ code: "NETWORK_ERROR", message: "Network error contacting session endpoint" });
-      };
+          if (xhr.status === 200 && data.sessionToken) {
+            sessionToken = data.sessionToken;
+            var ttl = (data.expiresIn || 3600) * 1000;
+            sessionRefreshBufferMs = computeRefreshBuffer(ttl);
+            sessionExpiresAt = Date.now() + ttl;
+            refreshRetryDelayMs = 5000;
+            scheduleRefresh(ttl);
+            if (options.broadcastRefresh) broadcastSessionRefresh();
+            resolve({ sessionToken: sessionToken });
+            return;
+          }
 
-      xhr.ontimeout = function () {
-        cleanupRequest();
-        reject({ code: "TIMEOUT", message: "Session request timed out after " + SESSION_TIMEOUT_MS + "ms" });
-      };
+          if (data.error === "USER_NOT_FOUND") {
+            // Trial mode — not a fatal error
+            sessionToken = null;
+            sessionExpiresAt = 0;
+            if (refreshTimer) {
+              clearTimeout(refreshTimer);
+              refreshTimer = null;
+            }
+            if (data.paymentLink) paymentLink = data.paymentLink;
+            resolve({ trialMode: true });
+            return;
+          }
 
-      xhr.onabort = function () {
-        cleanupRequest();
-        reject({ code: "ABORTED", message: "Session request was aborted" });
-      };
+          reject({
+            code: data.error || "SESSION_ERROR",
+            message: data.message || "Failed to create session (HTTP " + xhr.status + ")",
+          });
+        };
+
+        xhr.onerror = function () {
+          cleanupRequest();
+          reject({ code: "NETWORK_ERROR", message: "Network error contacting session endpoint" });
+        };
+
+        xhr.ontimeout = function () {
+          cleanupRequest();
+          reject({ code: "TIMEOUT", message: "Session request timed out after " + SESSION_TIMEOUT_MS + "ms" });
+        };
 
-      xhr.send(JSON.stringify(body));
+        xhr.onabort = function () {
+          cleanupRequest();
+          reject({ code: "ABORTED", message: "Session request was aborted" });
+        };
+
+        xhr.send(JSON.stringify(body));
+      });
+    });
+
+    requestPromise = requestPromise.catch(function (err) {
+      if (fetchingSession && fetchingSession.promise === requestPromise) {
+        fetchingSession = null;
+      }
+      throw err;
     });
 
     fetchingSession = {
@@ -201,7 +356,7 @@
   }
 
   function getSessionToken() {
-    if (sessionToken && Date.now() < sessionExpiresAt - 30000) {
+    if (sessionToken && Date.now() < sessionExpiresAt - sessionRefreshBufferMs) {
       return Promise.resolve(sessionToken);
     }
     return fetchSession().then(function (result) {
@@ -211,11 +366,9 @@
 
   function scheduleRefresh(ttlMs) {
     if (refreshTimer) clearTimeout(refreshTimer);
-    var delay = Math.max(ttlMs * 0.8, 5000);
+    var delay = computeRefreshDelay(ttlMs);
     refreshTimer = setTimeout(function () {
-      fetchSession().catch(function () {
-        // Silent — next open() will retry
-      });
+      fetchSession({ broadcastRefresh: true }).catch(scheduleRefreshRetry);
     }, delay);
   }
 
@@ -274,8 +427,6 @@
       var msg = {
         type: "seamless-add-to-scenario-init",
         sessionToken: sessionToken,
-        publishableKey: publishableKey,
-        userId: userId,
         contacts: atsContacts,
       };
       if (paymentLink) msg.paymentLink = paymentLink;
@@ -460,18 +611,17 @@
 
   var SeamlessRoleplay = {
     /**
-     * Initialize the SDK with a publishable key.
+     * Initialize the SDK with a host-provided user token callback.
      */
     init: function (opts) {
       try {
         var initVersion = activeInitVersion + 1;
-        var hasUserToken = !!(opts && opts.userToken && String(opts.userToken).trim());
-        var hasLegacyIdentity = !!(opts && opts.userId && opts.userEmail);
+        var hasUserTokenProvider = !!(opts && typeof opts.getUserToken === "function");
 
-        if (!opts || !opts.publishableKey || (!hasUserToken && !hasLegacyIdentity)) {
+        if (!opts || !hasUserTokenProvider) {
           var error = {
             code: "INVALID_INIT",
-            message: "requires { publishableKey, userToken } or legacy { publishableKey, userId, userEmail }",
+            message: "requires { getUserToken }",
           };
           logError("init", error.message);
           if (opts && typeof opts.onError === "function") {
@@ -489,13 +639,13 @@
         clearSessionRequest();
         sessionToken = null;
         sessionExpiresAt = 0;
+        sessionRefreshBufferMs = 30000;
+        refreshRetryDelayMs = 5000;
         paymentLink = null;
+        latestUserToken = null;
+        userTokenRequest = null;
 
-        publishableKey = opts.publishableKey;
-        userId = opts.userId || null;
-        userEmail = opts.userEmail || null;
-        userRole = opts.userRole || null;
-        userToken = opts.userToken || null;
+        getUserToken = opts.getUserToken;
         appOrigin = opts.origin || null;
         initCallbacks.onReady = opts.onReady || null;
         initCallbacks.onError = opts.onError || null;
@@ -823,14 +973,14 @@
         clearSessionRequest();
         teardownDialog();
         teardownMount();
-        publishableKey = null;
-        userId = null;
-        userEmail = null;
-        userRole = null;
-        userToken = null;
+        getUserToken = null;
+        latestUserToken = null;
+        userTokenRequest = null;
         paymentLink = null;
         sessionToken = null;
         sessionExpiresAt = 0;
+        sessionRefreshBufferMs = 30000;
+        refreshRetryDelayMs = 5000;
         initCallbacks = { onReady: null, onError: null };
         initCalled = false;
       } catch (e) {