@lumiapassport/ui-kit 1.13.11 → 1.14.1

package/README.md

@@ -138,46 +138,13 @@ That's it! The `ConnectWalletButton` provides a complete authentication UI with
       title: 'Welcome to MyApp',
       subtitle: 'Sign in to continue',
 
-      // beta
-      dialogClassName: 'string',
+      dialogClassName: 'string', // beta
 
       authOrder: ['email', 'passkey', 'social'],
 
       branding: {
         tagline: 'Powered by MPC',
-        link: { text: 'Learn More', url: 'https://example.com/docs' },
-      },
-
-      // TO BE DEPRECATED, cssv is used
-      colors: {
-        dark: {
-          background: '#060117',
-          text: '#fefdff',
-          textSecondary: '#c4c2c7',
-          textMuted: '#8a8890',
-          border: '#2a1a3a',
-          buttonBackground: '#ff6b35',
-          buttonBackgroundEnd: '#f7931e',
-          buttonText: '#ffffff',
-          buttonBackgroundHover: '#e55a2b',
-          buttonBackgroundHoverEnd: '#d67d1a',
-          connectedButtonBackground: 'rgba(27, 90, 226, 0.6)',
-          connectedButtonBorder: '#4a5568'
-        },
-        light: {
-          background: '#fefdff',
-          text: '#060117',
-          textSecondary: '#4a4754',
-          textMuted: '#6b6a70',
-          border: '#e0dde6',
-          buttonBackground: '#9333ea',
-          buttonBackgroundEnd: '#2563eb',
-          buttonText: '#fefdff',
-          buttonBackgroundHover: '#7e22ce',
-          buttonBackgroundHoverEnd: '#1d4ed8',
-          connectedButtonBackground: '#f3f4f6',
-          connectedButtonBorder: '#d1d5db'
-        }
+        link: { text: 'Learn More', url: \'https\:\/\/example.com/docs\' },
       },
     },
 
@@ -234,8 +201,8 @@ That's it! The `ConnectWalletButton` provides a complete authentication UI with
       name: 'Lumia Beam',
       symbol: 'LUMIA',
       chainId: 2030232745,
-      rpcUrl: 'https://beam-rpc.lumia.org',
-      explorerUrl: 'https://beam-explorer.lumia.org',
+      rpcUrl: 'https\:\/\/beam-rpc.lumia.org',
+      explorerUrl: 'https\:\/\/beam-explorer.lumia.org',
       testnet: true,
     },
   }}

package/dist/iframe/index.html

@@ -15,7 +15,7 @@
     <meta http-equiv="X-Content-Type-Options" content="nosniff" />
     <meta http-equiv="Referrer-Policy" content="strict-origin-when-cross-origin" />
 
-    <title>Lumia Passport Secure Wallet - iframe version 1.13.11</title>
+    <title>Lumia Passport Secure Wallet - iframe version 1.14.1</title>
 
     <!-- Styles will be injected by build process -->
     <style>
@@ -120,7 +120,6 @@
         display: flex;
         align-items: center;
         justify-content: center;
-
         font-size: 20px;
         font-weight: 600;
         width: 64px;
@@ -248,11 +247,11 @@
         left: 0;
         right: 0;
         bottom: 0;
-        /* background: rgba(0, 0, 0, 0.8); */
         display: flex;
         align-items: center;
         justify-content: center;
         z-index: 10000;
+        backdrop-filter: blur(10px);
       }
 
       .modal-content {

package/dist/iframe/main.js

@@ -2787,33 +2787,24 @@ var DKGManager = class extends TokenRefreshApiClient {
 };
 
 // src/iframe/lib/onramp/utils.ts
-var LP_JWT_TOKENS_LS_KEY = "lumia-passport-jwt-tokens";
-function getBearer() {
-  try {
-    const sessionString = localStorage.getItem(LP_JWT_TOKENS_LS_KEY);
-    if (!sessionString) return null;
-    const session = JSON.parse(sessionString);
-    if (session && typeof session.accessToken === "string" && typeof session.userId === "string") {
-      return `Bearer ${session.accessToken}`;
-    }
-    return null;
-  } catch (error) {
-    console.error("Failed to parse Lumia Passport session:", error);
-    return null;
+function omit(object, ...keys) {
+  const result = { ...object };
+  for (const key of keys) {
+    delete result[key];
   }
+  return result;
 }
 
 // src/iframe/lib/onramp/binance.ts
 var API_DOMAIN = "https://api.lumiapassport.com/on-ramp";
 var BinanceOnrampAPI = class {
-  async checkIsLumaiAvailableQuery() {
-    const auth = getBearer();
+  constructor(sendResponseFn) {
+    this.sendResponseFn = sendResponseFn;
+  }
+  async checkIsLumaiAvailableQuery(accessToken) {
     const response = await fetch(`${API_DOMAIN}/api/binance/pairs`, {
       method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        ...auth && { Authorization: auth }
-      }
+      headers: { "Content-Type": "application/json", ...accessToken && { Authorization: `Bearer ${accessToken}` } }
     });
     const data = await response.json();
     if (!data.success) {
@@ -2825,14 +2816,10 @@ var BinanceOnrampAPI = class {
     }
     return !!data.data.cryptoCurrencies.includes("LUMIA");
   }
-  async getLumiaNetworkQuery() {
-    const auth = getBearer();
+  async getLumiaNetworkQuery(accessToken) {
     const response = await fetch(`${API_DOMAIN}/api/binance/networks`, {
       method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        ...auth && { Authorization: auth }
-      }
+      headers: { "Content-Type": "application/json", ...accessToken && { Authorization: `Bearer ${accessToken}` } }
     });
     const data = await response.json();
     if (!data?.success) {
@@ -2845,14 +2832,10 @@ var BinanceOnrampAPI = class {
     }
     return lumiaNetwork;
   }
-  async getPaymentMethodsQuery(payload) {
-    const auth = getBearer();
+  async getPaymentMethodsQuery(payload, accessToken) {
     const response = await fetch(`${API_DOMAIN}/api/binance/modes`, {
       method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        ...auth && { Authorization: auth }
-      },
+      headers: { "Content-Type": "application/json", ...accessToken && { Authorization: `Bearer ${accessToken}` } },
       body: JSON.stringify(payload)
     });
     const data = await response.json();
@@ -2864,14 +2847,10 @@ var BinanceOnrampAPI = class {
     }
     return data.data.paymentMethods;
   }
-  async getQuoteQuery(payload) {
-    const auth = getBearer();
+  async getQuoteQuery(payload, accessToken) {
     const response = await fetch(`${API_DOMAIN}/api/binance/quote`, {
       method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        ...auth && { Authorization: auth }
-      },
+      headers: { "Content-Type": "application/json", ...accessToken && { Authorization: `Bearer ${accessToken}` } },
       body: JSON.stringify(payload)
     });
     const data = await response.json();
@@ -2880,14 +2859,10 @@ var BinanceOnrampAPI = class {
     }
     return data.data;
   }
-  async createPreorderMutation(payload) {
-    const auth = getBearer();
+  async createPreorderMutation(payload, accessToken) {
     const response = await fetch(`${API_DOMAIN}/api/binance/pre-order`, {
       method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        ...auth && { Authorization: auth }
-      },
+      headers: { "Content-Type": "application/json", ...accessToken && { Authorization: `Bearer ${accessToken}` } },
       body: JSON.stringify(payload)
     });
     const data = await response.json();
@@ -2896,29 +2871,33 @@ var BinanceOnrampAPI = class {
     }
     return data.data;
   }
-  async handleMessage(message, origin, sendResponseFn) {
+  async handleMessage(message, origin) {
     const { type, messageId, data } = message;
+    const { accessToken } = message.data;
     console.log("[ BINANCE Received message ]", type, message);
     switch (type) {
       case "BINANCE_CHECK_IS_LUMIA_AVAILABLE_QUERY":
-        const isLumiaAvalableRes = await this.checkIsLumaiAvailableQuery();
-        sendResponseFn(messageId, isLumiaAvalableRes, origin);
+        const isLumiaAvalableRes = await this.checkIsLumaiAvailableQuery(accessToken);
+        this.sendResponseFn(messageId, isLumiaAvalableRes, origin);
         break;
       case "BINANCE_GET_LUMIA_NETWORK_QUERY":
-        const lumiaNetworkResponse = await this.getLumiaNetworkQuery();
-        sendResponseFn(messageId, lumiaNetworkResponse, origin);
+        const lumiaNetworkResponse = await this.getLumiaNetworkQuery(accessToken);
+        this.sendResponseFn(messageId, lumiaNetworkResponse, origin);
         break;
       case "BINANCE_GET_PAYMENT_METHODS_QUERY":
-        const paymentMethodsResponse = await this.getPaymentMethodsQuery(this.ensurePayload(data, "methods"));
-        sendResponseFn(messageId, paymentMethodsResponse, origin);
+        const paymentMethodsResponse = await this.getPaymentMethodsQuery(
+          this.ensurePayload(data, "methods"),
+          accessToken
+        );
+        this.sendResponseFn(messageId, paymentMethodsResponse, origin);
         break;
       case "BINANCE_GET_QUOTE_QUERY":
-        const quoteResponse = await this.getQuoteQuery(this.ensurePayload(data, "quote"));
-        sendResponseFn(messageId, quoteResponse, origin);
+        const quoteResponse = await this.getQuoteQuery(this.ensurePayload(data, "quote"), accessToken);
+        this.sendResponseFn(messageId, quoteResponse, origin);
         break;
       case "BINANCE_CREATE_PREORDER_MUTATION":
-        const preorderResponse = await this.createPreorderMutation(this.ensurePayload(data, "preorder"));
-        sendResponseFn(messageId, preorderResponse, origin);
+        const preorderResponse = await this.createPreorderMutation(this.ensurePayload(data, "preorder"), accessToken);
+        this.sendResponseFn(messageId, preorderResponse, origin);
         break;
       default:
         throw new Error(`[ BINANCE ]: Unknown message type: ${type}`);
@@ -2928,7 +2907,7 @@ var BinanceOnrampAPI = class {
     if (!data || typeof data !== "object") {
       throw new Error(`Invalid payload: expected object, got ${typeof data}`);
     }
-    const payload = data;
+    const payload = omit(data, "accessToken");
     switch (type) {
       case "methods":
         if (typeof payload.totalAmount !== "string") {
@@ -2980,23 +2959,21 @@ var BinanceOnrampAPI = class {
 // src/iframe/lib/onramp/rampnow.ts
 var API_DOMAIN2 = "https://api.lumiapassport.com/on-ramp";
 var RampnowOnrampAPI = class {
-  async getRampnowConfigQuery() {
-    const auth = getBearer();
+  constructor(sendResponseFn) {
+    this.sendResponseFn = sendResponseFn;
+  }
+  async getRampnowConfigQuery(accessToken) {
     const response = await fetch(`${API_DOMAIN2}/api/rampnow/cfg`, {
       method: "GET",
-      headers: { ...auth && { Authorization: auth } }
+      headers: { ...accessToken && { Authorization: `Bearer ${accessToken}` } }
     });
     const data = await response.json();
     return data;
   }
-  async getRampOrderQuoteQuery(payload) {
-    const auth = getBearer();
+  async getRampOrderQuoteQuery(payload, accessToken) {
     const response = await fetch(`${API_DOMAIN2}/api/rampnow/quote`, {
       method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-        ...auth && { Authorization: auth }
-      },
+      headers: { "Content-Type": "application/json", ...accessToken && { Authorization: `Bearer ${accessToken}` } },
       body: JSON.stringify(payload)
     });
     const data = await response.json();
@@ -3009,7 +2986,7 @@ var RampnowOnrampAPI = class {
     if (typeof payload !== "object" || payload === null || typeof payload?.paymentMode !== "string" || typeof payload?.srcAmount !== "number" || typeof payload?.walletAddress !== "string") {
       throw new Error("Invalid Ramp order quote payload");
     }
-    return payload;
+    return omit(payload, "accessToken");
   }
   // UNUSED due to Rampnow APP redirect order flow
   //   async ctreateChekoutOrderMutation(payload: CreateCheckoutOrderMutationPayload) {
@@ -3021,17 +2998,18 @@ var RampnowOnrampAPI = class {
   //       })
   //     return checkoutedOrderData
   //   }
-  async handleMessage(message, origin, sendResponseFn) {
+  async handleMessage(message, origin) {
     const { type, data, messageId } = message;
-    console.log("[ BINANCE Received message ]", type, message);
+    const { accessToken } = message.data;
+    console.log("[ RAMPNOW Received message ]", type, message);
     switch (type) {
       case "RAMPNOW_GET_CONFIG":
-        const ramnowCfg = await this.getRampnowConfigQuery();
-        sendResponseFn(messageId, ramnowCfg, origin);
+        const ramnowCfg = await this.getRampnowConfigQuery(accessToken);
+        this.sendResponseFn(messageId, ramnowCfg, origin);
         break;
       case "RAMPNOW_GET_ORDER_QUOTE":
-        const orderQuote = await this.getRampOrderQuoteQuery(this.ensureOrderQuotePayload(data));
-        sendResponseFn(messageId, orderQuote, origin);
+        const orderQuote = await this.getRampOrderQuoteQuery(this.ensureOrderQuotePayload(data), accessToken);
+        this.sendResponseFn(messageId, orderQuote, origin);
         break;
       default:
         throw new Error(`[ RAMPNOW ]: Unknown message type: ${type}`);
@@ -4258,13 +4236,12 @@ var SigningManager = class extends TokenRefreshApiClient {
 };
 
 // src/iframe/main.ts
-var IFRAME_VERSION = "1.13.11";
+var IFRAME_VERSION = "1.14.1";
 var IframeWallet = class {
   constructor() {
     console.log("=".repeat(60));
     console.log(`  Lumia Passport Secure Wallet - iframe version ${IFRAME_VERSION}`);
     console.log("=".repeat(60));
-    this.applyThemeColors();
     this.messenger = new SecureMessenger();
     this.sessionManager = new SessionManager();
     this.dkgManager = new DKGManager();
@@ -4273,36 +4250,8 @@ var IframeWallet = class {
     this.storage = new StorageManager();
     this.trustedApps = new TrustedAppsManager();
     this.backupManager = new BackupManager();
-    this.binance = new BinanceOnrampAPI();
-    this.rampnow = new RampnowOnrampAPI();
-  }
-  applyThemeColors() {
-    try {
-      const params = new URLSearchParams(window.location.search);
-      const bg = params.get("bg");
-      const text = params.get("text");
-      const textSec = params.get("textSec");
-      const border = params.get("border");
-      if (bg || text || textSec || border) {
-        const root = document.documentElement;
-        if (bg) {
-          root.style.setProperty("--iframe-bg", bg);
-          root.style.setProperty("--iframe-modal-bg", bg);
-        }
-        if (text) {
-          root.style.setProperty("--iframe-text", text);
-        }
-        if (textSec) {
-          root.style.setProperty("--iframe-text-secondary", textSec);
-        }
-        if (border) {
-          root.style.setProperty("--iframe-border", border);
-        }
-        console.log("[IframeWallet] Applied theme colors:", { bg, text, textSec, border });
-      }
-    } catch (error) {
-      console.warn("[IframeWallet] Failed to apply theme colors:", error);
-    }
+    this.binance = new BinanceOnrampAPI(this.messenger.sendResponse.bind(this.messenger));
+    this.rampnow = new RampnowOnrampAPI(this.messenger.sendResponse.bind(this.messenger));
   }
   async initialize() {
     if (window.location.hostname !== "localhost" && window.location.hostname !== "127.0.0.1" && !window.location.hostname.includes("lumiapassport.com")) {
@@ -4326,14 +4275,13 @@ var IframeWallet = class {
   }
   async handleMessage(message, origin) {
     const { type, messageId, projectId } = message;
-    console.log("[IFRAME INTERNAL] message", type, message);
     try {
       switch (true) {
         case type.startsWith("BINANCE_"):
-          await this.binance.handleMessage(message, origin, this.messenger.sendResponse.bind(this.messenger));
+          await this.binance.handleMessage(message, origin);
           break;
         case type.startsWith("RAMPNOW_"):
-          await this.rampnow.handleMessage(message, origin, this.messenger.sendResponse.bind(this.messenger));
+          await this.rampnow.handleMessage(message, origin);
           break;
         case type === "SDK_AUTH":
           await this.handleSDKAuth(message, origin);