@embarkai/ui-kit 0.1.1 → 0.1.3

package/dist/iframe/main.js

@@ -373,6 +373,77 @@ var init_crypto_utils = __esm({
   }
 });
 
+// src/iframe/lib/backup/local-backup.ts
+var local_backup_exports = {};
+__export(local_backup_exports, {
+  backupToLocalFile: () => backupToLocalFile,
+  restoreFromLocalFile: () => restoreFromLocalFile
+});
+async function backupToLocalFile(data, password) {
+  let encryptionPassword = password;
+  let credentialId;
+  if (!encryptionPassword) {
+    const result = await deriveBackupPasswordFromPasskey(data.userId);
+    encryptionPassword = result.password;
+    credentialId = result.credentialId;
+  }
+  const encrypted = await encryptKeyshare(
+    data,
+    encryptionPassword,
+    password ? "password" : "passkey",
+    credentialId
+  );
+  const backupData = {
+    ...encrypted,
+    userId: data.userId,
+    createdAt: data.createdAt
+  };
+  const blob = new Blob([JSON.stringify(backupData, null, 2)], {
+    type: "application/json"
+  });
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = `lumia-passport-backup-${data.userId}-${Date.now()}.json`;
+  document.body.appendChild(a);
+  a.click();
+  document.body.removeChild(a);
+  URL.revokeObjectURL(url);
+}
+async function restoreFromLocalFile(fileContent, userId, password) {
+  console.log("[iframe][restoreFromLocalFile] Starting restore from local file");
+  const encryptedBackup = JSON.parse(fileContent);
+  let decryptionPassword;
+  let credentialId;
+  if (password) {
+    decryptionPassword = password;
+  } else {
+    const credentialIdFromBackup = encryptedBackup.encryptionMethod === "passkey" ? encryptedBackup.credentialId : void 0;
+    const result = await deriveBackupPasswordFromPasskey(
+      userId,
+      credentialIdFromBackup
+    ).catch(() => {
+      throw new Error(
+        "Restore requires either password or passkey authentication"
+      );
+    });
+    decryptionPassword = result.password;
+    credentialId = result.credentialId;
+  }
+  const { decryptKeyshare: decryptKeyshare2 } = await Promise.resolve().then(() => (init_crypto_utils(), crypto_utils_exports));
+  const backupData = await decryptKeyshare2(encryptedBackup, decryptionPassword);
+  if (backupData.userId !== userId) {
+    throw new Error("Backup file does not match current user");
+  }
+  console.log("[iframe][restoreFromLocalFile] Restore successful");
+  return backupData;
+}
+var init_local_backup = __esm({
+  "src/iframe/lib/backup/local-backup.ts"() {
+    init_crypto_utils();
+  }
+});
+
 // src/iframe/lib/backup/server-backup.ts
 var server_backup_exports = {};
 __export(server_backup_exports, {
@@ -477,77 +548,6 @@ var init_server_backup = __esm({
   }
 });
 
-// src/iframe/lib/backup/local-backup.ts
-var local_backup_exports = {};
-__export(local_backup_exports, {
-  backupToLocalFile: () => backupToLocalFile,
-  restoreFromLocalFile: () => restoreFromLocalFile
-});
-async function backupToLocalFile(data, password) {
-  let encryptionPassword = password;
-  let credentialId;
-  if (!encryptionPassword) {
-    const result = await deriveBackupPasswordFromPasskey(data.userId);
-    encryptionPassword = result.password;
-    credentialId = result.credentialId;
-  }
-  const encrypted = await encryptKeyshare(
-    data,
-    encryptionPassword,
-    password ? "password" : "passkey",
-    credentialId
-  );
-  const backupData = {
-    ...encrypted,
-    userId: data.userId,
-    createdAt: data.createdAt
-  };
-  const blob = new Blob([JSON.stringify(backupData, null, 2)], {
-    type: "application/json"
-  });
-  const url = URL.createObjectURL(blob);
-  const a = document.createElement("a");
-  a.href = url;
-  a.download = `lumia-passport-backup-${data.userId}-${Date.now()}.json`;
-  document.body.appendChild(a);
-  a.click();
-  document.body.removeChild(a);
-  URL.revokeObjectURL(url);
-}
-async function restoreFromLocalFile(fileContent, userId, password) {
-  console.log("[iframe][restoreFromLocalFile] Starting restore from local file");
-  const encryptedBackup = JSON.parse(fileContent);
-  let decryptionPassword;
-  let credentialId;
-  if (password) {
-    decryptionPassword = password;
-  } else {
-    const credentialIdFromBackup = encryptedBackup.encryptionMethod === "passkey" ? encryptedBackup.credentialId : void 0;
-    const result = await deriveBackupPasswordFromPasskey(
-      userId,
-      credentialIdFromBackup
-    ).catch(() => {
-      throw new Error(
-        "Restore requires either password or passkey authentication"
-      );
-    });
-    decryptionPassword = result.password;
-    credentialId = result.credentialId;
-  }
-  const { decryptKeyshare: decryptKeyshare2 } = await Promise.resolve().then(() => (init_crypto_utils(), crypto_utils_exports));
-  const backupData = await decryptKeyshare2(encryptedBackup, decryptionPassword);
-  if (backupData.userId !== userId) {
-    throw new Error("Backup file does not match current user");
-  }
-  console.log("[iframe][restoreFromLocalFile] Restore successful");
-  return backupData;
-}
-var init_local_backup = __esm({
-  "src/iframe/lib/backup/local-backup.ts"() {
-    init_crypto_utils();
-  }
-});
-
 // ../../node_modules/.pnpm/viem@2.38.0_bufferutil@4.0.9_typescript@5.9.3_utf-8-validate@5.0.10_zod@3.25.76/node_modules/viem/_esm/utils/data/isHex.js
 function isHex(value, { strict = true } = {}) {
   if (!value)
@@ -1267,13 +1267,13 @@ var TemplateEngine = class {
 };
 
 // src/iframe/templates/html/authorization.html
-var authorization_default = '<div\n  style="\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10000;\n    background: #000000;\n  "\n>\n  <div\n    style="\n      display: flex;\n      flex-direction: column;\n      gap: var(--iframe-gap);\n      align-items: center;\n      background: var(--iframe-modal-bg);\n      border-radius: 20px;\n      padding: 20px;\n      max-width: 320px;\n      width: calc(100% - 40px);\n      max-height: 90vh;\n      overflow-y: auto;\n    "\n  >\n    <div style="display: flex; align-items: center; gap: 0; justify-content: center">\n      <!-- 10px overlap -->\n      <div style="width: 38px; height: 48px; z-index: 10; overflow: visible">\n        {{#if userAvatar}}\n        <img\n          src="{{userAvatar}}"\n          alt="{{userName}}"\n          style="width: 48px; height: 48px; border-radius: 24px; object-fit: cover"\n        />\n        {{else}}\n        <span\n          style="\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            width: 48px;\n            height: 48px;\n            border-radius: 24px;\n            background-color: var(--iframe-button-bg);\n            color: var(--iframe-button-text);\n            font-size: 14px;\n            font-weight: 600;\n          "\n          >U</span\n        >\n        {{/if}}\n      </div>\n\n      <!-- ------------------------------------------------------------ -->\n\n      <div style="width: 38px; height: 48px; z-index: 5; overflow: visible">\n        {{#if displayLogo}}\n        <img\n          src="{{displayLogo}}"\n          alt="{{displayName}}"\n          style="width: 48px; height: 48px; border-radius: 24px; object-fit: cover"\n        />\n        {{else}}\n        <span\n          style="\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            width: 48px;\n            height: 48px;\n            border-radius: 24px;\n            background-color: var(--iframe-button-bg);\n            color: var(--iframe-button-text);\n            font-size: 14px;\n            font-weight: 600;\n          "\n          >A</span\n        >\n        {{/if}}\n      </div>\n    </div>\n\n    <div style="display: flex; align-items: center; gap: var(--iframe-gap); justify-content: center">\n      <span\n        style="\n          width: fit-content;\n          font-size: var(--iframe-h2-fz);\n          font-weight: var(--iframe-heading-fw);\n          line-height: 150%;\n          text-align: center;\n        "\n        >{{displayName}}</span\n      >\n    </div>\n\n    <div class="domain-info {{domainStatusClass}}">\n      <span style="display: block; width: 100%; font-size: 12px; text-align: center; font-family: monospace"\n        >{{domainStatusIcon}} {{origin}}</span\n      >\n    </div>\n\n    <!-- Permissions box -->\n    <div\n      id="data-auth-permissions-block"\n      aria-expanded="false"\n      style="display: flex; flex-direction: column; width: 100%"\n    >\n      <div\n        id="data-auth-permissions-toggler"\n        style="\n          cursor: pointer;\n          text-align: center;\n          list-style: none;\n          padding: 0 var(--iframe-pd);\n          user-select: none;\n          font-size: 12px;\n          line-height: 20px;\n        "\n      >\n        Show Permissions \u25BC\n      </div>\n\n      <div\n        id="data-auth-permissions-content"\n        style="width: 100%; height: var(--iframe-permissions-h, 0); overflow: hidden; transition: height 300ms ease"\n      >\n        <div\n          style="\n            width: 100%;\n            padding: var(--iframe-gap);\n            border-radius: var(--iframe-el-bdrs);\n            background: var(--iframe-info);\n            font-size: 10px;\n          "\n        >\n          <div style="margin-bottom: var(--iframe-gap)">\n            <strong>{{displayName}}</strong> by <span class="project-owner">{{displayName}}</span> wants to access your\n            <strong>Lumia Passport</strong> account\n          </div>\n\n          <div style="margin-bottom: var(--iframe-gap)">\n            <strong style="margin-bottom: var(--iframe-gap)">Personal user data</strong>\n            <ul style="list-style: none">\n              <li style="padding-left: var(--iframe-pd)">Wallet address (read-only)</li>\n              <li style="padding-left: var(--iframe-pd)">Public transaction history (read-only)</li>\n            </ul>\n          </div>\n\n          <div style="width: 100%">\n            <strong style="margin-bottom: var(--iframe-gap)">Permissions</strong>\n            <ul style="list-style: none">\n              <li style="padding-left: var(--iframe-pd)">Request transaction signatures</li>\n              <li style="padding-left: var(--iframe-pd)">Initiate blockchain operations</li>\n            </ul>\n          </div>\n        </div>\n      </div>\n    </div>\n\n    {{#if showSecurityWarning}}\n    <div class="security-warning">\n      <strong>\u26A0\uFE0F Warning:</strong> This domain is not verified for {{displayName}}\n      <div>Expected: {{expectedDomains}}</div>\n      <div>Actual: {{origin}}</div>\n    </div>\n    {{else}}\n    <span style="display: block; text-align: center; font-size: 10px; color: var(--iframe-text-secondary)"\n      >By continuing you allow the app to use these permissions, you can revoke access at any time.</span\n    >\n    {{/if}}\n\n    <!-- Action buttons -->\n    <div style="display: flex; gap: var(--iframe-gap); width: 100%; align-items: center">\n      <button class="cancel-btn">Cancel</button>\n      <button class="authorize-btn" {{authorizeButtonState}}>Continue</button>\n    </div>\n  </div>\n</div>\n';
+var authorization_default = '<div\n  style="\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10000;\n    background: #000000;\n  "\n>\n  <div\n    style="\n      display: flex;\n      flex-direction: column;\n      gap: var(--iframe-gap);\n      align-items: center;\n      background: var(--iframe-modal-bg);\n      border-radius: 20px;\n      padding: 20px;\n      max-width: 320px;\n      width: calc(100% - 40px);\n      max-height: 90vh;\n      overflow-y: auto;\n    "\n  >\n    <div style="display: flex; align-items: center; gap: 0; justify-content: center">\n      <!-- 10px overlap -->\n      <div style="width: 38px; height: 48px; z-index: 10; overflow: visible">\n        {{#if userAvatar}}\n        <img\n          src="{{userAvatar}}"\n          alt="{{userName}}"\n          style="width: 48px; height: 48px; border-radius: 24px; object-fit: cover"\n        />\n        {{else}}\n        <span\n          style="\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            width: 48px;\n            height: 48px;\n            border-radius: 24px;\n            background-color: var(--iframe-button-bg);\n            color: var(--iframe-button-text);\n            font-size: 14px;\n            font-weight: 600;\n          "\n          >U</span\n        >\n        {{/if}}\n      </div>\n\n      <!-- ------------------------------------------------------------ -->\n\n      <div style="width: 38px; height: 48px; z-index: 5; overflow: visible">\n        {{#if displayLogo}}\n        <img\n          src="{{displayLogo}}"\n          alt="{{displayName}}"\n          style="width: 48px; height: 48px; border-radius: 24px; object-fit: cover"\n        />\n        {{else}}\n        <span\n          style="\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            width: 48px;\n            height: 48px;\n            border-radius: 24px;\n            background-color: var(--iframe-button-bg);\n            color: var(--iframe-button-text);\n            font-size: 14px;\n            font-weight: 600;\n          "\n          >A</span\n        >\n        {{/if}}\n      </div>\n    </div>\n\n    <div style="display: flex; align-items: center; gap: var(--iframe-gap); justify-content: center">\n      <span\n        style="\n          width: fit-content;\n          font-size: var(--iframe-h2-fz);\n          font-weight: var(--iframe-heading-fw);\n          line-height: 150%;\n          text-align: center;\n        "\n        >{{displayName}}</span\n      >\n    </div>\n\n    <div class="domain-info {{domainStatusClass}}">\n      <span style="display: block; width: 100%; font-size: 12px; text-align: center; font-family: monospace"\n        >{{domainStatusIcon}} {{origin}}</span\n      >\n    </div>\n\n    <!-- Permissions box -->\n    <div\n      id="data-auth-permissions-block"\n      aria-expanded="false"\n      style="display: flex; flex-direction: column; width: 100%"\n    >\n      <div\n        id="data-auth-permissions-toggler"\n        style="\n          cursor: pointer;\n          text-align: center;\n          list-style: none;\n          padding: 0 var(--iframe-pd);\n          user-select: none;\n          font-size: 12px;\n          line-height: 20px;\n        "\n      >\n        Show Permissions \u25BC\n      </div>\n\n      <div\n        id="data-auth-permissions-content"\n        style="width: 100%; height: var(--iframe-permissions-h, 0); overflow: hidden; transition: height 300ms ease"\n      >\n        <div\n          style="\n            width: 100%;\n            padding: var(--iframe-gap);\n            border-radius: var(--iframe-el-bdrs);\n            background: var(--iframe-info);\n            font-size: 10px;\n          "\n        >\n          <div style="margin-bottom: var(--iframe-gap)">\n            <strong>{{displayName}}</strong> by <span class="project-owner">{{displayName}}</span> wants to access your\n            <strong>EmbarkAI</strong> account\n          </div>\n\n          <div style="margin-bottom: var(--iframe-gap)">\n            <strong style="margin-bottom: var(--iframe-gap)">Personal user data</strong>\n            <ul style="list-style: none">\n              <li style="padding-left: var(--iframe-pd)">Wallet address (read-only)</li>\n              <li style="padding-left: var(--iframe-pd)">Public transaction history (read-only)</li>\n            </ul>\n          </div>\n\n          <div style="width: 100%">\n            <strong style="margin-bottom: var(--iframe-gap)">Permissions</strong>\n            <ul style="list-style: none">\n              <li style="padding-left: var(--iframe-pd)">Request transaction signatures</li>\n              <li style="padding-left: var(--iframe-pd)">Initiate blockchain operations</li>\n            </ul>\n          </div>\n        </div>\n      </div>\n    </div>\n\n    {{#if showSecurityWarning}}\n    <div class="security-warning">\n      <strong>\u26A0\uFE0F Warning:</strong> This domain is not verified for {{displayName}}\n      <div>Expected: {{expectedDomains}}</div>\n      <div>Actual: {{origin}}</div>\n    </div>\n    {{else}}\n    <span style="display: block; text-align: center; font-size: 10px; color: var(--iframe-text-secondary)"\n      >By continuing you allow the app to use these permissions, you can revoke access at any time.</span\n    >\n    {{/if}}\n\n    <!-- Action buttons -->\n    <div style="display: flex; gap: var(--iframe-gap); width: 100%; align-items: center">\n      <button class="cancel-btn">Cancel</button>\n      <button class="authorize-btn" {{authorizeButtonState}}>Continue</button>\n    </div>\n  </div>\n</div>\n';
 
 // src/iframe/templates/html/confirm-tx.html
-var confirm_tx_default = '<div\n  style="\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10000;\n    background: #000000;\n  "\n>\n  <div\n    style="\n      display: flex;\n      flex-direction: column;\n      gap: var(--iframe-gap);\n      align-items: center;\n      background: var(--iframe-modal-bg);\n      border-radius: 20px;\n      padding: 20px;\n      max-width: 320px;\n      width: calc(100% - 40px);\n      max-height: 90vh;\n      overflow-y: auto;\n    "\n  >\n    <!-- Header with logos -->\n    <div style="display: flex; align-items: center; gap: 0; justify-content: center">\n      <div style="width: 38px; height: 48px; z-index: 10; overflow: visible">\n        {{#if displayLogo}}\n        <img\n          src="{{displayLogo}}"\n          alt="{{displayName}}"\n          style="width: 48px; height: 48px; border-radius: 24px; object-fit: cover"\n        />\n        {{else}}\n        <span\n          style="\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            width: 48px;\n            height: 48px;\n            border-radius: 24px;\n            background-color: var(--iframe-button-bg);\n            color: var(--iframe-button-text);\n            font-size: 14px;\n            font-weight: 600;\n          "\n          >A</span\n        >\n        {{/if}}\n      </div>\n\n      <!-- ------------------------------------------------------------ -->\n\n      <div style="width: 38px; height: 48px; z-index: 5; overflow: visible">\n        {{#if userAvatar}}\n        <img\n          src="{{userAvatar}}"\n          alt="{{userName}}"\n          style="width: 48px; height: 48px; border-radius: 24px; object-fit: cover"\n        />\n        {{else}}\n        <span\n          style="\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            width: 48px;\n            height: 48px;\n            border-radius: 24px;\n            background-color: var(--iframe-button-bg);\n            color: var(--iframe-button-text);\n            font-size: 14px;\n            font-weight: 600;\n          "\n          >U</span\n        >\n        {{/if}}\n      </div>\n    </div>\n\n    <!-- Transaction title -->\n\n    <div style="display: flex; align-items: center; gap: var(--iframe-gap); justify-content: center">\n      <span\n        style="\n          width: fit-content;\n          font-size: var(--iframe-h1-fz);\n          font-weight: var(--iframe-heading-fw);\n          line-height: 150%;\n          text-align: center;\n        "\n        >Confirm Transaction</span\n      >\n    </div>\n\n    <!-- Application info -->\n    <div class="domain-info {{domainStatusClass}}">\n      <span style="display: block; width: 100%; font-size: 12px; text-align: center; font-family: monospace"\n        >{{domainStatusText}} {{origin}}</span\n      >\n    </div>\n\n    <!-- Transaction details box -->\n    <div\n      id="confirm-transaction-details-block"\n      aria-expanded="false"\n      style="display: flex; flex-direction: column; width: 100%"\n    >\n      <div\n        id="confirm-transaction-details-toggler"\n        style="\n          cursor: pointer;\n          text-align: center;\n          list-style: none;\n          padding: 0 var(--iframe-pd);\n          user-select: none;\n          font-size: 12px;\n          line-height: 20px;\n        "\n      >\n        Show Transaction Details \u25BC\n      </div>\n\n      <div\n        id="confirm-transaction-details-content"\n        style="\n          display: flex;\n          flex-direction: column;\n          gap: var(--iframe-gap);\n          width: 100%;\n          max-height: var(--confirm-transaction-details-h, 0px);\n          overflow: hidden;\n          transition: max-height 300ms ease;\n        "\n      >\n        <div\n          style="\n            display: flex;\n            flex-direction: column;\n            gap: var(--iframe-gap);\n            width: 100%;\n            padding: var(--iframe-gap);\n            border-radius: var(--iframe-el-bdrs);\n            background: var(--iframe-info);\n            font-size: 10px;\n          "\n        >\n          {{#if fromAddress}}\n          <div style="display: flex; justify-content: space-between">\n            <strong style="color: var(--iframe-text-secondary); display: block">From:</strong>\n            <a\n              href="{{fromAddressExplorerUrl}}"\n              target="_blank"\n              rel="noopener noreferrer"\n              style="word-break: break-all; display: block; color: #3b82f6; text-decoration: none"\n              title="{{fromAddressFull}}"\n            >\n              <code>{{fromAddress}}</code>\n            </a>\n          </div>\n          {{/if}}\n\n          <!-- ------------------------------------------------------------ -->\n\n          {{#if toAddress}}\n          <div style="display: flex; justify-content: space-between">\n            <strong style="color: var(--iframe-text-secondary); display: block">To:</strong>\n            <a\n              href="{{toAddressExplorerUrl}}"\n              target="_blank"\n              rel="noopener noreferrer"\n              style="word-break: break-all; display: block; color: #3b82f6; text-decoration: none"\n              title="{{toAddressFull}}"\n            >\n              <code>{{toAddress}}</code>\n            </a>\n          </div>\n          {{/if}}\n\n          <!-- ------------------------------------------------------------ -->\n\n          {{#if hasValue}}\n          <div style="display: flex; justify-content: space-between">\n            <strong style="color: var(--iframe-text-secondary); display: block">Amount:</strong>\n            <code style="word-break: break-all; display: block">{{formattedValue}} LUMIA</code>\n          </div>\n          {{/if}}\n\n          <!-- ------------------------------------------------------------ -->\n\n          {{#if showContractInteraction}}\n          <div style="display: flex; justify-content: space-between">\n            <strong style="color: var(--iframe-text-secondary); display: block">Action:</strong>\n            <code style="word-break: break-all; display: block">{{actionDescription}}</code>\n          </div>\n          {{/if}}\n\n          <!-- ------------------------------------------------------------ -->\n\n          <div style="display: flex; justify-content: space-between">\n            <strong style="color: var(--iframe-text-secondary); display: block">Estimated Cost:</strong>\n            <code style="word-break: break-all; display: block; color: #10b981">{{estimatedCost}}</code>\n          </div>\n\n          <!-- ------------------------------------------------------------ -->\n\n          {{#if isSponsored}}\n          <div\n            style="\n              display: flex;\n              justify-content: space-between;\n              background: var(--iframe-success);\n              border-radius: var(--iframe-el-bdrs);\n              padding: var(--iframe-gap);\n            "\n          >\n            <span>Gas fees will be paid by the application (no cost to you)</span>\n          </div>\n          {{/if}}\n        </div>\n      </div>\n    </div>\n\n    <!-- ------------------------------------------------------------ -->\n\n    {{#if showHighRisk}}\n    <div class="security-warning">\n      <strong>\u26A0\uFE0F {{riskLevel}} RISK</strong>\n      {{riskReasons}}\n    </div>\n    {{else}}\n    <div class="security-warning">Please verify this transaction carefully before confirming.</div>\n    {{/if}}\n\n    <!-- ------------------------------------------------------------ -->\n\n    <div class="trust-app-section">\n      <label class="trust-app-label">\n        <input type="checkbox" class="trust-app-checkbox" />\n        <span>Add this application to trusted list and skip confirmation for future transactions</span>\n      </label>\n    </div>\n\n    <!-- Action buttons -->\n    <div style="display: flex; gap: var(--iframe-gap); width: 100%; align-items: center">\n      <button class="cancel-btn">Reject</button>\n      <button class="confirm-btn">Confirm</button>\n    </div>\n\n    <!-- Footer notice -->\n    <span\n      style="\n        display: block;\n        padding: var(--iframe-gap);\n        text-align: center;\n        font-size: 10px;\n        color: var(--iframe-text-secondary);\n      "\n    >\n      You can manage trusted applications in your Lumia Passport settings.\n    </span>\n  </div>\n</div>\n';
+var confirm_tx_default = '<div\n  style="\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10000;\n    background: #000000;\n  "\n>\n  <div\n    style="\n      display: flex;\n      flex-direction: column;\n      gap: var(--iframe-gap);\n      align-items: center;\n      background: var(--iframe-modal-bg);\n      border-radius: 20px;\n      padding: 20px;\n      max-width: 320px;\n      width: calc(100% - 40px);\n      max-height: 90vh;\n      overflow-y: auto;\n    "\n  >\n    <!-- Header with logos -->\n    <div style="display: flex; align-items: center; gap: 0; justify-content: center">\n      <div style="width: 38px; height: 48px; z-index: 10; overflow: visible">\n        {{#if displayLogo}}\n        <img\n          src="{{displayLogo}}"\n          alt="{{displayName}}"\n          style="width: 48px; height: 48px; border-radius: 24px; object-fit: cover"\n        />\n        {{else}}\n        <span\n          style="\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            width: 48px;\n            height: 48px;\n            border-radius: 24px;\n            background-color: var(--iframe-button-bg);\n            color: var(--iframe-button-text);\n            font-size: 14px;\n            font-weight: 600;\n          "\n          >A</span\n        >\n        {{/if}}\n      </div>\n\n      <!-- ------------------------------------------------------------ -->\n\n      <div style="width: 38px; height: 48px; z-index: 5; overflow: visible">\n        {{#if userAvatar}}\n        <img\n          src="{{userAvatar}}"\n          alt="{{userName}}"\n          style="width: 48px; height: 48px; border-radius: 24px; object-fit: cover"\n        />\n        {{else}}\n        <span\n          style="\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            width: 48px;\n            height: 48px;\n            border-radius: 24px;\n            background-color: var(--iframe-button-bg);\n            color: var(--iframe-button-text);\n            font-size: 14px;\n            font-weight: 600;\n          "\n          >U</span\n        >\n        {{/if}}\n      </div>\n    </div>\n\n    <!-- Transaction title -->\n\n    <div style="display: flex; align-items: center; gap: var(--iframe-gap); justify-content: center">\n      <span\n        style="\n          width: fit-content;\n          font-size: var(--iframe-h1-fz);\n          font-weight: var(--iframe-heading-fw);\n          line-height: 150%;\n          text-align: center;\n        "\n        >Confirm Transaction</span\n      >\n    </div>\n\n    <!-- Application info -->\n    <div class="domain-info {{domainStatusClass}}">\n      <span style="display: block; width: 100%; font-size: 12px; text-align: center; font-family: monospace"\n        >{{domainStatusText}} {{origin}}</span\n      >\n    </div>\n\n    <!-- Transaction details box -->\n    <div\n      id="confirm-transaction-details-block"\n      aria-expanded="false"\n      style="display: flex; flex-direction: column; width: 100%"\n    >\n      <div\n        id="confirm-transaction-details-toggler"\n        style="\n          cursor: pointer;\n          text-align: center;\n          list-style: none;\n          padding: 0 var(--iframe-pd);\n          user-select: none;\n          font-size: 12px;\n          line-height: 20px;\n        "\n      >\n        Show Transaction Details \u25BC\n      </div>\n\n      <div\n        id="confirm-transaction-details-content"\n        style="\n          display: flex;\n          flex-direction: column;\n          gap: var(--iframe-gap);\n          width: 100%;\n          max-height: var(--confirm-transaction-details-h, 0px);\n          overflow: hidden;\n          transition: max-height 300ms ease;\n        "\n      >\n        <div\n          style="\n            display: flex;\n            flex-direction: column;\n            gap: var(--iframe-gap);\n            width: 100%;\n            padding: var(--iframe-gap);\n            border-radius: var(--iframe-el-bdrs);\n            background: var(--iframe-info);\n            font-size: 10px;\n          "\n        >\n          {{#if fromAddress}}\n          <div style="display: flex; justify-content: space-between">\n            <strong style="color: var(--iframe-text-secondary); display: block">From:</strong>\n            <a\n              href="{{fromAddressExplorerUrl}}"\n              target="_blank"\n              rel="noopener noreferrer"\n              style="word-break: break-all; display: block; color: #3b82f6; text-decoration: none"\n              title="{{fromAddressFull}}"\n            >\n              <code>{{fromAddress}}</code>\n            </a>\n          </div>\n          {{/if}}\n\n          <!-- ------------------------------------------------------------ -->\n\n          {{#if toAddress}}\n          <div style="display: flex; justify-content: space-between">\n            <strong style="color: var(--iframe-text-secondary); display: block">To:</strong>\n            <a\n              href="{{toAddressExplorerUrl}}"\n              target="_blank"\n              rel="noopener noreferrer"\n              style="word-break: break-all; display: block; color: #3b82f6; text-decoration: none"\n              title="{{toAddressFull}}"\n            >\n              <code>{{toAddress}}</code>\n            </a>\n          </div>\n          {{/if}}\n\n          <!-- ------------------------------------------------------------ -->\n\n          {{#if hasValue}}\n          <div style="display: flex; justify-content: space-between">\n            <strong style="color: var(--iframe-text-secondary); display: block">Amount:</strong>\n            <code style="word-break: break-all; display: block">{{formattedValue}} LUMIA</code>\n          </div>\n          {{/if}}\n\n          <!-- ------------------------------------------------------------ -->\n\n          {{#if showContractInteraction}}\n          <div style="display: flex; justify-content: space-between">\n            <strong style="color: var(--iframe-text-secondary); display: block">Action:</strong>\n            <code style="word-break: break-all; display: block">{{actionDescription}}</code>\n          </div>\n          {{/if}}\n\n          <!-- ------------------------------------------------------------ -->\n\n          <div style="display: flex; justify-content: space-between">\n            <strong style="color: var(--iframe-text-secondary); display: block">Estimated Cost:</strong>\n            <code style="word-break: break-all; display: block; color: #10b981">{{estimatedCost}}</code>\n          </div>\n\n          <!-- ------------------------------------------------------------ -->\n\n          {{#if isSponsored}}\n          <div\n            style="\n              display: flex;\n              justify-content: space-between;\n              background: var(--iframe-success);\n              border-radius: var(--iframe-el-bdrs);\n              padding: var(--iframe-gap);\n            "\n          >\n            <span>Gas fees will be paid by the application (no cost to you)</span>\n          </div>\n          {{/if}}\n        </div>\n      </div>\n    </div>\n\n    <!-- ------------------------------------------------------------ -->\n\n    {{#if showHighRisk}}\n    <div class="security-warning">\n      <strong>\u26A0\uFE0F {{riskLevel}} RISK</strong>\n      {{riskReasons}}\n    </div>\n    {{else}}\n    <div class="security-warning">Please verify this transaction carefully before confirming.</div>\n    {{/if}}\n\n    <!-- ------------------------------------------------------------ -->\n\n    <div class="trust-app-section">\n      <label class="trust-app-label">\n        <input type="checkbox" class="trust-app-checkbox" />\n        <span>Add this application to trusted list and skip confirmation for future transactions</span>\n      </label>\n    </div>\n\n    <!-- Action buttons -->\n    <div style="display: flex; gap: var(--iframe-gap); width: 100%; align-items: center">\n      <button class="cancel-btn">Reject</button>\n      <button class="confirm-btn">Confirm</button>\n    </div>\n\n    <!-- Footer notice -->\n    <span\n      style="\n        display: block;\n        padding: var(--iframe-gap);\n        text-align: center;\n        font-size: 10px;\n        color: var(--iframe-text-secondary);\n      "\n    >\n      You can manage trusted applications in your EmbarkAI settings.\n    </span>\n  </div>\n</div>\n';
 
 // src/iframe/templates/html/ready-indicator.html
-var ready_indicator_default = '<div class="ready-indicator">\n  <div class="status-icon">\u2713</div>\n  <h2>Secure Wallet Ready</h2>\n  <p>Lumia Passport is ready for secure operations</p>\n  <div class="info">\n    <div class="info-row">\n      <strong>Origin:</strong>\n      <span>{{origin}}</span>\n    </div>\n    <div class="info-row">\n      <strong>Status:</strong>\n      <span class="status-active">Active</span>\n    </div>\n    <div class="info-row">\n      <strong>Version:</strong>\n      <span>{{iframeVersion}}</span>\n    </div>\n    <div class="info-row">\n      <strong>Documentation:</strong>\n      <a\n        href="https://docs.lumiapassport.com/"\n        target="_blank"\n        rel="noopener noreferrer"\n        style="color: #667eea; text-decoration: none"\n        >docs.lumiapassport.com</a\n      >\n    </div>\n  </div>\n</div>\n';
+var ready_indicator_default = '<div class="ready-indicator">\n  <div class="status-icon">\u2713</div>\n  <h2>Secure Wallet Ready</h2>\n  <p>EmbarkAI is ready for secure operations</p>\n  <div class="info">\n    <div class="info-row">\n      <strong>Origin:</strong>\n      <span>{{origin}}</span>\n    </div>\n    <div class="info-row">\n      <strong>Status:</strong>\n      <span class="status-active">Active</span>\n    </div>\n    <div class="info-row">\n      <strong>Version:</strong>\n      <span>{{iframeVersion}}</span>\n    </div>\n    <div class="info-row">\n      <strong>Documentation:</strong>\n      <a\n        href="https://docs.lumiapassport.com/"\n        target="_blank"\n        rel="noopener noreferrer"\n        style="color: #667eea; text-decoration: none"\n        >docs.lumiapassport.com</a\n      >\n    </div>\n  </div>\n</div>\n';
 
 // src/iframe/templates/html/sign-eip712-tx.html
 var sign_eip712_tx_default = '<div\n  style="\n    position: fixed;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    z-index: 10000;\n    background: #000000;\n  "\n>\n  <div\n    style="\n      display: flex;\n      flex-direction: column;\n      gap: var(--iframe-gap);\n      align-items: center;\n      background: var(--iframe-modal-bg);\n      border-radius: 20px;\n      padding: 20px;\n      max-width: 320px;\n      width: calc(100% - 40px);\n      max-height: 90vh;\n      overflow-y: auto;\n    "\n  >\n    <!-- Header -->\n    <div style="display: flex; align-items: center; gap: var(--iframe-gap); justify-content: center">\n      {{#if metadataLogo}}\n      <img\n        src="{{metadataLogo}}"\n        alt="{{metadataName}}"\n        style="width: 48px; height: 48px; border-radius: 24px; object-fit: cover"\n      />\n      {{else}}\n      <span\n        style="\n          display: flex;\n          align-items: center;\n          justify-content: center;\n          width: 48px;\n          height: 48px;\n          border-radius: 24px;\n          background-color: var(--iframe-button-bg);\n          color: var(--iframe-button-text);\n          font-size: 14px;\n          font-weight: 600;\n        "\n        >\u{1F510}</span\n      >\n      {{/if}}\n\n      <!-- ------------------------------------------------------------ -->\n      <svg\n        xmlns="http://www.w3.org/2000/svg"\n        width="24"\n        height="24"\n        viewBox="0 0 24 24"\n        fill="none"\n        stroke="var(--iframe-text-secondary)"\n        stroke-width="2"\n        stroke-linecap="round"\n        stroke-linejoin="round"\n      >\n        <path d="M5 12h14" />\n        <path d="m12 5 7 7-7 7" />\n      </svg>\n      <!-- ------------------------------------------------------------ -->\n\n      {{#if userAvatar}}\n      <img\n        src="{{userAvatar}}"\n        alt="{{userName}}"\n        style="width: 48px; height: 48px; border-radius: 24px; object-fit: cover"\n      />\n      {{else}}\n      <span\n        style="\n          display: flex;\n          align-items: center;\n          justify-content: center;\n          width: 48px;\n          height: 48px;\n          border-radius: 24px;\n          background-color: var(--iframe-button-bg);\n          color: var(--iframe-button-text);\n          font-size: 14px;\n          font-weight: 600;\n        "\n        >U</span\n      >\n      {{/if}}\n    </div>\n\n    <div style="display: flex; align-items: center; gap: var(--iframe-gap); justify-content: center">\n      <span\n        style="\n          width: fit-content;\n          font-size: var(--iframe-h2-fz);\n          font-weight: var(--iframe-heading-fw);\n          line-height: 150%;\n          text-align: center;\n        "\n        >Signature Request</span\n      >\n    </div>\n\n    <div class="domain-info verified">\n      <span style="display: block; width: 100%; font-size: 12px; text-align: center; font-family: monospace">\n        {{#if isVerifiedOrigin}}\n        <span>\u2713</span>\n        {{/if}} {{origin}}</span\n      >\n    </div>\n\n    <!-- EIP712 Message Content -->\n    <div class="eip712-content">\n      <details class="eip712-details">\n        <summary>Advanced details</summary>\n\n        <div class="section-title">\u{1F4DD} Message</div>\n        <div class="eip712-section">\n          <div class="section-subtitle">{{primaryType}}</div>\n          {{messageFields}}\n        </div>\n\n        <div class="section-title" style="margin-top: 16px">\u{1F50D} Domain</div>\n        <div class="eip712-section">{{domainFields}}</div>\n\n        <div class="section-title" style="margin-top: 16px">\u{1F4CB} Full Message</div>\n        <pre class="eip712-raw"><code>{{fullMessageJson}}</code></pre>\n      </details>\n    </div>\n\n    <!-- Trust App Option -->\n    <div class="trust-app-section">\n      <label class="trust-app-label">\n        <input type="checkbox" class="trust-app-checkbox" />\n        <span>Trust this application and skip confirmation for future signatures</span>\n      </label>\n    </div>\n\n    <!-- Action Buttons -->\n    <div class="actions">\n      <button class="cancel-btn">Reject</button>\n      <button class="confirm-btn">Sign</button>\n    </div>\n\n    <!-- Footer Notice -->\n    <div class="footer-notice">\n      <p class="footer-note">Only sign messages from applications you trust.</p>\n    </div>\n  </div>\n</div>\n';
@@ -1773,178 +1773,50 @@ var AuthorizationManager = class {
   }
 };
 
-// src/iframe/lib/token-refresh-client.ts
-var TokenRefreshApiClient = class {
+// src/internal/constants.ts
+import { Key, Mail, Wallet2 } from "lucide-react";
+var LOOCAL_BACKUP_STATUS_KEY = "passport-backup-status";
+var BLOCKSCOUT_QUERY_STALE_TIME = 30 * 1e3;
+var BLOCKSCOUT_QUERY_GC_TIME = 5 * 60 * 1e3;
+
+// src/iframe/lib/backup/cloud-backup.ts
+init_crypto_utils();
+
+// src/iframe/lib/backup/cloudStorage.ts
+var GoogleDriveProvider = class {
   constructor() {
-    this.pendingTokenRefresh = null;
-    this.tssUrl = "https://api.lumiapassport.com/tss";
+    this.name = "Google Drive";
+    this.id = "google-drive";
+    this.icon = "\u{1F4C1}";
+    // Can be replaced with proper icon
+    this.accessToken = null;
+    this.CLIENT_ID = typeof window.__GOOGLE_DRIVE_CLIENT_ID__ !== "undefined" && window.__GOOGLE_DRIVE_CLIENT_ID__ || "";
+    this.DISCOVERY_DOC = "https://www.googleapis.com/discovery/v1/apis/drive/v3/rest";
+    this.SCOPES = "https://www.googleapis.com/auth/drive.file https://www.googleapis.com/auth/drive.appdata";
+    this.gapiInitialized = false;
+    this.gisInitialized = false;
+    this.initializeAPIs();
   }
-  /**
-   * Make API call with automatic token refresh on 401
-   */
-  async apiCall(method, path, body, projectId, accessToken) {
-    let url = `${this.tssUrl}${path}`;
-    if (projectId) {
-      const separator = url.includes("?") ? "&" : "?";
-      url = `${url}${separator}projectId=${encodeURIComponent(projectId)}`;
+  async initializeAPIs() {
+    if (!window.gapi) {
+      await this.loadScript("https://apis.google.com/js/api.js");
     }
-    const headers = {
-      "Content-Type": "application/json"
-    };
-    if (accessToken) {
-      headers["Authorization"] = `Bearer ${accessToken}`;
+    if (!window.google?.accounts) {
+      await this.loadScript("https://accounts.google.com/gsi/client");
     }
-    try {
-      const response = await fetch(url, {
-        method,
-        headers,
-        body: body ? JSON.stringify(body) : void 0,
-        credentials: "include"
-        // Send cookies
+    if (!this.gapiInitialized) {
+      await new Promise((resolve) => {
+        window.gapi.load("client", resolve);
       });
-      if (response.status === 401 && accessToken) {
-        console.log("[iframe][TokenRefresh] Got 401, checking if TOKEN_EXPIRED...");
-        try {
-          const errorData = await response.json();
-          if (errorData.error_code === "TOKEN_EXPIRED" || errorData.action === "REFRESH_TOKEN") {
-            console.log("[iframe][TokenRefresh] TOKEN_EXPIRED detected, requesting new token from parent...");
-            const newToken = await this.requestNewTokenFromParent();
-            if (newToken) {
-              console.log("[iframe][TokenRefresh] \u2705 Got new token, retrying request...");
-              headers["Authorization"] = `Bearer ${newToken}`;
-              const retryResponse = await fetch(url, {
-                method,
-                headers,
-                body: body ? JSON.stringify(body) : void 0,
-                credentials: "include"
-              });
-              if (!retryResponse.ok) {
-                const retryErrorText = await retryResponse.text();
-                throw new Error(`API call failed after token refresh (${retryResponse.status}): ${retryErrorText}`);
-              }
-              return await retryResponse.json();
-            } else {
-              throw new Error("Failed to refresh access token");
-            }
-          }
-        } catch (parseError) {
-          console.error("[iframe][TokenRefresh] Failed to parse 401 response:", parseError);
-        }
-        throw new Error(`API call failed (401): Authentication required`);
-      }
-      if (!response.ok) {
-        const errorText = await response.text();
-        throw new Error(`API call failed (${response.status}): ${errorText}`);
-      }
-      return await response.json();
-    } catch (error) {
-      console.error(`[iframe][TokenRefresh] API call failed: ${method} ${path}`, error);
-      throw error instanceof Error ? error : new Error("Unknown API error");
+      await window.gapi.client.init({
+        discoveryDocs: [this.DISCOVERY_DOC]
+      });
+      this.gapiInitialized = true;
+      console.log("[GoogleDrive] Google API client initialized");
     }
-  }
-  /**
-   * Request new access token from parent window
-   */
-  async requestNewTokenFromParent() {
-    if (this.pendingTokenRefresh) {
-      console.log("[iframe][TokenRefresh] Token refresh already in progress, waiting...");
-      return this.pendingTokenRefresh;
-    }
-    this.pendingTokenRefresh = new Promise((resolve, reject) => {
-      const messageId = `token_refresh_${Date.now()}_${Math.random().toString(36).substring(2, 15)}`;
-      const timeout = setTimeout(() => {
-        cleanup();
-        reject(new Error("Token refresh timeout"));
-      }, 3e4);
-      const messageHandler = (event) => {
-        const message = event.data;
-        if (message && message.type === "LUMIA_PASSPORT_TOKEN_REFRESHED" && message.messageId === messageId) {
-          cleanup();
-          if (message.accessToken) {
-            console.log("[iframe][TokenRefresh] \u2705 Received new token from parent");
-            resolve(message.accessToken);
-          } else if (message.error) {
-            console.error("[iframe][TokenRefresh] \u274C Token refresh failed:", message.error);
-            reject(new Error(message.error));
-          } else {
-            reject(new Error("Invalid token refresh response"));
-          }
-        }
-      };
-      const cleanup = () => {
-        clearTimeout(timeout);
-        window.removeEventListener("message", messageHandler);
-        this.pendingTokenRefresh = null;
-      };
-      window.addEventListener("message", messageHandler);
-      if (window.parent && window.parent !== window) {
-        window.parent.postMessage(
-          {
-            type: "LUMIA_PASSPORT_REQUEST_NEW_TOKEN",
-            messageId,
-            timestamp: Date.now()
-          },
-          "*"
-          // Parent will validate origin
-        );
-        console.log("[iframe][TokenRefresh] \u{1F4E4} Sent LUMIA_PASSPORT_REQUEST_NEW_TOKEN to parent");
-      } else {
-        cleanup();
-        reject(new Error("No parent window available"));
-      }
-    });
-    try {
-      return await this.pendingTokenRefresh;
-    } catch (error) {
-      this.pendingTokenRefresh = null;
-      console.error("[iframe][TokenRefresh] Token refresh failed:", error);
-      return null;
-    }
-  }
-};
-
-// src/iframe/lib/backup-manager.ts
-init_server_backup();
-init_local_backup();
-
-// src/iframe/lib/backup/cloud-backup.ts
-init_crypto_utils();
-
-// src/iframe/lib/backup/cloudStorage.ts
-var GoogleDriveProvider = class {
-  constructor() {
-    this.name = "Google Drive";
-    this.id = "google-drive";
-    this.icon = "\u{1F4C1}";
-    // Can be replaced with proper icon
-    this.accessToken = null;
-    this.CLIENT_ID = typeof window.__GOOGLE_DRIVE_CLIENT_ID__ !== "undefined" && window.__GOOGLE_DRIVE_CLIENT_ID__ || "";
-    this.DISCOVERY_DOC = "https://www.googleapis.com/discovery/v1/apis/drive/v3/rest";
-    this.SCOPES = "https://www.googleapis.com/auth/drive.file https://www.googleapis.com/auth/drive.appdata";
-    this.gapiInitialized = false;
-    this.gisInitialized = false;
-    this.initializeAPIs();
-  }
-  async initializeAPIs() {
-    if (!window.gapi) {
-      await this.loadScript("https://apis.google.com/js/api.js");
-    }
-    if (!window.google?.accounts) {
-      await this.loadScript("https://accounts.google.com/gsi/client");
-    }
-    if (!this.gapiInitialized) {
-      await new Promise((resolve) => {
-        window.gapi.load("client", resolve);
-      });
-      await window.gapi.client.init({
-        discoveryDocs: [this.DISCOVERY_DOC]
-      });
-      this.gapiInitialized = true;
-      console.log("[GoogleDrive] Google API client initialized");
-    }
-    if (!this.gisInitialized) {
-      this.gisInitialized = true;
-      console.log("[GoogleDrive] Google Identity Services initialized");
+    if (!this.gisInitialized) {
+      this.gisInitialized = true;
+      console.log("[GoogleDrive] Google Identity Services initialized");
     }
   }
   loadScript(src) {
@@ -2171,6 +2043,140 @@ function getCloudProviders() {
   }));
 }
 
+// src/iframe/lib/backup-manager.ts
+init_local_backup();
+init_server_backup();
+
+// src/iframe/lib/token-refresh-client.ts
+var TokenRefreshApiClient = class {
+  constructor() {
+    this.pendingTokenRefresh = null;
+    this.tssUrl = "https://api.lumiapassport.com/tss";
+  }
+  /**
+   * Make API call with automatic token refresh on 401
+   */
+  async apiCall(method, path, body, projectId, accessToken) {
+    let url = `${this.tssUrl}${path}`;
+    if (projectId) {
+      const separator = url.includes("?") ? "&" : "?";
+      url = `${url}${separator}projectId=${encodeURIComponent(projectId)}`;
+    }
+    const headers = {
+      "Content-Type": "application/json"
+    };
+    if (accessToken) {
+      headers["Authorization"] = `Bearer ${accessToken}`;
+    }
+    try {
+      const response = await fetch(url, {
+        method,
+        headers,
+        body: body ? JSON.stringify(body) : void 0,
+        credentials: "include"
+        // Send cookies
+      });
+      if (response.status === 401 && accessToken) {
+        console.log("[iframe][TokenRefresh] Got 401, checking if TOKEN_EXPIRED...");
+        try {
+          const errorData = await response.json();
+          if (errorData.error_code === "TOKEN_EXPIRED" || errorData.action === "REFRESH_TOKEN") {
+            console.log("[iframe][TokenRefresh] TOKEN_EXPIRED detected, requesting new token from parent...");
+            const newToken = await this.requestNewTokenFromParent();
+            if (newToken) {
+              console.log("[iframe][TokenRefresh] \u2705 Got new token, retrying request...");
+              headers["Authorization"] = `Bearer ${newToken}`;
+              const retryResponse = await fetch(url, {
+                method,
+                headers,
+                body: body ? JSON.stringify(body) : void 0,
+                credentials: "include"
+              });
+              if (!retryResponse.ok) {
+                const retryErrorText = await retryResponse.text();
+                throw new Error(`API call failed after token refresh (${retryResponse.status}): ${retryErrorText}`);
+              }
+              return await retryResponse.json();
+            } else {
+              throw new Error("Failed to refresh access token");
+            }
+          }
+        } catch (parseError) {
+          console.error("[iframe][TokenRefresh] Failed to parse 401 response:", parseError);
+        }
+        throw new Error(`API call failed (401): Authentication required`);
+      }
+      if (!response.ok) {
+        const errorText = await response.text();
+        throw new Error(`API call failed (${response.status}): ${errorText}`);
+      }
+      return await response.json();
+    } catch (error) {
+      console.error(`[iframe][TokenRefresh] API call failed: ${method} ${path}`, error);
+      throw error instanceof Error ? error : new Error("Unknown API error");
+    }
+  }
+  /**
+   * Request new access token from parent window
+   */
+  async requestNewTokenFromParent() {
+    if (this.pendingTokenRefresh) {
+      console.log("[iframe][TokenRefresh] Token refresh already in progress, waiting...");
+      return this.pendingTokenRefresh;
+    }
+    this.pendingTokenRefresh = new Promise((resolve, reject) => {
+      const messageId = `token_refresh_${Date.now()}_${Math.random().toString(36).substring(2, 15)}`;
+      const timeout = setTimeout(() => {
+        cleanup();
+        reject(new Error("Token refresh timeout"));
+      }, 3e4);
+      const messageHandler = (event) => {
+        const message = event.data;
+        if (message && message.type === "LUMIA_PASSPORT_TOKEN_REFRESHED" && message.messageId === messageId) {
+          cleanup();
+          if (message.accessToken) {
+            console.log("[iframe][TokenRefresh] \u2705 Received new token from parent");
+            resolve(message.accessToken);
+          } else if (message.error) {
+            console.error("[iframe][TokenRefresh] \u274C Token refresh failed:", message.error);
+            reject(new Error(message.error));
+          } else {
+            reject(new Error("Invalid token refresh response"));
+          }
+        }
+      };
+      const cleanup = () => {
+        clearTimeout(timeout);
+        window.removeEventListener("message", messageHandler);
+        this.pendingTokenRefresh = null;
+      };
+      window.addEventListener("message", messageHandler);
+      if (window.parent && window.parent !== window) {
+        window.parent.postMessage(
+          {
+            type: "LUMIA_PASSPORT_REQUEST_NEW_TOKEN",
+            messageId,
+            timestamp: Date.now()
+          },
+          "*"
+          // Parent will validate origin
+        );
+        console.log("[iframe][TokenRefresh] \u{1F4E4} Sent LUMIA_PASSPORT_REQUEST_NEW_TOKEN to parent");
+      } else {
+        cleanup();
+        reject(new Error("No parent window available"));
+      }
+    });
+    try {
+      return await this.pendingTokenRefresh;
+    } catch (error) {
+      this.pendingTokenRefresh = null;
+      console.error("[iframe][TokenRefresh] Token refresh failed:", error);
+      return null;
+    }
+  }
+};
+
 // src/iframe/lib/backup-manager.ts
 var BACKUP_VERSION = "1.0";
 var BackupManager = class {
@@ -2215,7 +2221,7 @@ var BackupManager = class {
    * Get backup status for all methods
    */
   getBackupStatus(userId) {
-    const statusData = localStorage.getItem(`lumia-passport.backup.status.${userId}`);
+    const statusData = localStorage.getItem(`${LOOCAL_BACKUP_STATUS_KEY}.${userId}`);
     if (statusData) {
       try {
         return JSON.parse(statusData);
@@ -2235,10 +2241,7 @@ var BackupManager = class {
   updateBackupStatus(userId, method, status) {
     const currentStatus = this.getBackupStatus(userId);
     currentStatus[method] = { ...currentStatus[method], ...status };
-    localStorage.setItem(
-      `lumia-passport.backup.status.${userId}`,
-      JSON.stringify(currentStatus)
-    );
+    localStorage.setItem(`${LOOCAL_BACKUP_STATUS_KEY}.${userId}`, JSON.stringify(currentStatus));
     console.log(`[iframe][BackupManager] Updated ${method} backup status for ${userId}`);
   }
   /**
@@ -2334,12 +2337,7 @@ var BackupManager = class {
       encryptionPassword = result.password;
       credentialId = result.credentialId;
     }
-    const encrypted = await encryptKeyshare2(
-      data,
-      encryptionPassword,
-      password ? "password" : "passkey",
-      credentialId
-    );
+    const encrypted = await encryptKeyshare2(data, encryptionPassword, password ? "password" : "passkey", credentialId);
     console.log("[iframe][BackupManager] \u2705 Backup data encrypted");
     return encrypted;
   }
@@ -3230,18 +3228,221 @@ var RampnowOnrampAPI = class {
   }
 };
 
-// src/lib/errors.ts
-var LumiaPassportError = class _LumiaPassportError extends Error {
-  constructor(message, code) {
-    super(message);
-    this.code = code;
-    this.name = "LumiaPassportError";
-    if (Error.captureStackTrace) {
-      Error.captureStackTrace(this, _LumiaPassportError);
+// src/iframe/lib/opted-out-apps-manager.ts
+var STORAGE_KEY = "lumia_passport_opted_out_apps";
+var OptedOutAppsManager = class {
+  /**
+   * Check if user has opted out of auto-trust for this app
+   */
+  isOptedOut(userId, projectId, origin) {
+    const optedOutApps = this.getOptedOutApps();
+    const result = optedOutApps.some(
+      (app) => app.userId === userId && app.projectId === projectId && app.origin === origin
+    );
+    return result;
+  }
+  /**
+   * Add app to opted-out list (when user removes ecosystem app from trusted list)
+   */
+  addOptedOut(userId, projectId, origin) {
+    const optedOutApps = this.getOptedOutApps();
+    const exists = optedOutApps.some(
+      (app) => app.userId === userId && app.projectId === projectId && app.origin === origin
+    );
+    if (exists) {
+      return;
     }
+    optedOutApps.push({
+      userId,
+      projectId,
+      origin,
+      optedOutAt: Date.now()
+    });
+    this.saveOptedOutApps(optedOutApps);
+  }
+  /**
+   * Remove app from opted-out list (when user manually re-trusts via checkbox)
+   */
+  removeOptedOut(userId, projectId, origin) {
+    const optedOutApps = this.getOptedOutApps();
+    const filtered = optedOutApps.filter(
+      (app) => !(app.userId === userId && app.projectId === projectId && app.origin === origin)
+    );
+    this.saveOptedOutApps(filtered);
+  }
+  /**
+   * Clear all opted-out apps for a user (when clearing all trusted apps)
+   */
+  clearOptedOutForUser(userId) {
+    const optedOutApps = this.getOptedOutApps();
+    const filtered = optedOutApps.filter((app) => app.userId !== userId);
+    this.saveOptedOutApps(filtered);
+  }
+  /**
+   * Get all opted-out apps from storage
+   */
+  getOptedOutApps() {
+    try {
+      const data = localStorage.getItem(STORAGE_KEY);
+      if (!data) {
+        return [];
+      }
+      const apps = JSON.parse(data);
+      return Array.isArray(apps) ? apps : [];
+    } catch (error) {
+      console.error("[OptedOutApps] Error reading opted-out apps:", error);
+      return [];
+    }
+  }
+  /**
+   * Save opted-out apps to storage
+   */
+  saveOptedOutApps(apps) {
+    try {
+      localStorage.setItem(STORAGE_KEY, JSON.stringify(apps));
+    } catch (error) {
+      console.error("[OptedOutApps] Error saving opted-out apps:", error);
+    }
+  }
+};
+
+// src/iframe/lib/sdk-channel-manager.ts
+var SdkChannelManager = class {
+  // 30 minutes
+  constructor() {
+    this.channels = /* @__PURE__ */ new Map();
+    this.CHANNEL_TIMEOUT = 30 * 60 * 1e3;
+    setInterval(() => this.cleanupExpiredChannels(), 5 * 60 * 1e3);
+  }
+  /**
+   * Create a new SDK channel
+   */
+  createChannel(projectId, origin) {
+    const channelToken = this.generateSecureToken();
+    const channel = {
+      token: channelToken,
+      projectId,
+      origin,
+      createdAt: Date.now(),
+      lastActivity: Date.now()
+    };
+    this.channels.set(channelToken, channel);
+    console.log(`[iframe][SdkChannel] \u2713 Created: ${channelToken.slice(0, 16)}... origin=${origin}, total=${this.channels.size}`);
+    return channelToken;
+  }
+  /**
+   * Validate channel token and origin
+   */
+  validateChannel(channelToken, origin) {
+    const channel = this.channels.get(channelToken);
+    if (!channel) {
+      console.warn(`[iframe][SdkChannel] \u2717 NOT FOUND: ${channelToken.slice(0, 16)}... (active channels: ${this.channels.size})`);
+      return false;
+    }
+    if (channel.origin !== origin) {
+      console.error(`[iframe][SdkChannel] \u2717 ORIGIN MISMATCH: expected ${channel.origin}, got ${origin}`);
+      return false;
+    }
+    const age = Date.now() - channel.lastActivity;
+    if (age > this.CHANNEL_TIMEOUT) {
+      console.warn(`[iframe][SdkChannel] \u2717 EXPIRED: age=${Math.round(age / 1e3)}s > timeout=${this.CHANNEL_TIMEOUT / 1e3}s`);
+      this.channels.delete(channelToken);
+      return false;
+    }
+    channel.lastActivity = Date.now();
+    return true;
+  }
+  /**
+   * Get channel by token
+   */
+  getChannel(channelToken) {
+    return this.channels.get(channelToken) || null;
+  }
+  /**
+   * Invalidate channel
+   */
+  invalidateChannel(channelToken) {
+    const channel = this.channels.get(channelToken);
+    if (channel) {
+      console.log(`[iframe][SdkChannel] Invalidated channel for origin: ${channel.origin}`);
+      this.channels.delete(channelToken);
+    }
+  }
+  /**
+   * Get all channels for a project
+   */
+  getProjectChannels(projectId) {
+    return Array.from(this.channels.values()).filter(
+      (channel) => channel.projectId === projectId
+    );
+  }
+  /**
+   * Generate cryptographically secure channel token
+   */
+  generateSecureToken() {
+    const buffer = new Uint8Array(32);
+    crypto.getRandomValues(buffer);
+    return Array.from(buffer, (byte) => byte.toString(16).padStart(2, "0")).join("");
+  }
+  /**
+   * Cleanup expired channels
+   */
+  cleanupExpiredChannels() {
+    const now = Date.now();
+    let cleanedCount = 0;
+    for (const [token, channel] of this.channels.entries()) {
+      const age = now - channel.lastActivity;
+      if (age > this.CHANNEL_TIMEOUT) {
+        this.channels.delete(token);
+        cleanedCount++;
+      }
+    }
+    if (cleanedCount > 0) {
+      console.log(`[iframe][SdkChannel] Cleaned up ${cleanedCount} expired channels`);
+    }
+  }
+  /**
+   * Check if there is an active channel for a given origin
+   */
+  hasChannel(origin) {
+    const now = Date.now();
+    for (const channel of this.channels.values()) {
+      if (channel.origin === origin) {
+        const age = now - channel.lastActivity;
+        if (age <= this.CHANNEL_TIMEOUT) {
+          return true;
+        }
+      }
+    }
+    return false;
+  }
+  /**
+   * Get channel statistics
+   */
+  getStats() {
+    const stats = {
+      total: this.channels.size,
+      byProject: {}
+    };
+    for (const channel of this.channels.values()) {
+      stats.byProject[channel.projectId] = (stats.byProject[channel.projectId] || 0) + 1;
+    }
+    return stats;
   }
 };
-var _UserRejectedError = class _UserRejectedError extends LumiaPassportError {
+
+// src/lib/errors.ts
+var AccountAbstractionError = class _AccountAbstractionError extends Error {
+  constructor(message, code) {
+    super(message);
+    this.code = code;
+    this.name = "LumiaPassportError";
+    if (Error.captureStackTrace) {
+      Error.captureStackTrace(this, _AccountAbstractionError);
+    }
+  }
+};
+var _UserRejectedError = class _UserRejectedError extends AccountAbstractionError {
   constructor(message = "User rejected transaction") {
     super(message, _UserRejectedError.CODE);
     this.name = "UserRejectedError";
@@ -3307,7 +3508,7 @@ var SecureMessenger = class {
       return;
     }
     if (!this.validateMessageStructure(message)) {
-      console.error("[iframe][Messenger] Invalid Lumia Passport message structure:", {
+      console.error("[iframe][Messenger] Invalid EmbarkAI message structure:", {
         type: message.type,
         hasMessageId: !!message.messageId,
         hasTimestamp: !!message.timestamp,
@@ -3377,7 +3578,7 @@ var SecureMessenger = class {
       return;
     }
     const errorMessage = error instanceof Error ? error.message : error;
-    const errorCode = error instanceof LumiaPassportError ? error.code : void 0;
+    const errorCode = error instanceof AccountAbstractionError ? error.code : void 0;
     const response = {
       type: "LUMIA_PASSPORT_ERROR",
       messageId,
@@ -3419,7 +3620,7 @@ var SecureMessenger = class {
     console.log("[iframe][Messenger] SDK channel token set");
   }
   /**
-   * Quick check if message looks like Lumia Passport protocol
+   * Quick check if message looks like EmbarkAI protocol
    * This filters out browser extension messages, dev tools, etc.
    */
   isLumiaMessage(message) {
@@ -3527,131 +3728,6 @@ var SecureMessenger = class {
   }
 };
 
-// src/iframe/lib/sdk-channel-manager.ts
-var SdkChannelManager = class {
-  // 30 minutes
-  constructor() {
-    this.channels = /* @__PURE__ */ new Map();
-    this.CHANNEL_TIMEOUT = 30 * 60 * 1e3;
-    setInterval(() => this.cleanupExpiredChannels(), 5 * 60 * 1e3);
-  }
-  /**
-   * Create a new SDK channel
-   */
-  createChannel(projectId, origin) {
-    const channelToken = this.generateSecureToken();
-    const channel = {
-      token: channelToken,
-      projectId,
-      origin,
-      createdAt: Date.now(),
-      lastActivity: Date.now()
-    };
-    this.channels.set(channelToken, channel);
-    console.log(`[iframe][SdkChannel] \u2713 Created: ${channelToken.slice(0, 16)}... origin=${origin}, total=${this.channels.size}`);
-    return channelToken;
-  }
-  /**
-   * Validate channel token and origin
-   */
-  validateChannel(channelToken, origin) {
-    const channel = this.channels.get(channelToken);
-    if (!channel) {
-      console.warn(`[iframe][SdkChannel] \u2717 NOT FOUND: ${channelToken.slice(0, 16)}... (active channels: ${this.channels.size})`);
-      return false;
-    }
-    if (channel.origin !== origin) {
-      console.error(`[iframe][SdkChannel] \u2717 ORIGIN MISMATCH: expected ${channel.origin}, got ${origin}`);
-      return false;
-    }
-    const age = Date.now() - channel.lastActivity;
-    if (age > this.CHANNEL_TIMEOUT) {
-      console.warn(`[iframe][SdkChannel] \u2717 EXPIRED: age=${Math.round(age / 1e3)}s > timeout=${this.CHANNEL_TIMEOUT / 1e3}s`);
-      this.channels.delete(channelToken);
-      return false;
-    }
-    channel.lastActivity = Date.now();
-    return true;
-  }
-  /**
-   * Get channel by token
-   */
-  getChannel(channelToken) {
-    return this.channels.get(channelToken) || null;
-  }
-  /**
-   * Invalidate channel
-   */
-  invalidateChannel(channelToken) {
-    const channel = this.channels.get(channelToken);
-    if (channel) {
-      console.log(`[iframe][SdkChannel] Invalidated channel for origin: ${channel.origin}`);
-      this.channels.delete(channelToken);
-    }
-  }
-  /**
-   * Get all channels for a project
-   */
-  getProjectChannels(projectId) {
-    return Array.from(this.channels.values()).filter(
-      (channel) => channel.projectId === projectId
-    );
-  }
-  /**
-   * Generate cryptographically secure channel token
-   */
-  generateSecureToken() {
-    const buffer = new Uint8Array(32);
-    crypto.getRandomValues(buffer);
-    return Array.from(buffer, (byte) => byte.toString(16).padStart(2, "0")).join("");
-  }
-  /**
-   * Cleanup expired channels
-   */
-  cleanupExpiredChannels() {
-    const now = Date.now();
-    let cleanedCount = 0;
-    for (const [token, channel] of this.channels.entries()) {
-      const age = now - channel.lastActivity;
-      if (age > this.CHANNEL_TIMEOUT) {
-        this.channels.delete(token);
-        cleanedCount++;
-      }
-    }
-    if (cleanedCount > 0) {
-      console.log(`[iframe][SdkChannel] Cleaned up ${cleanedCount} expired channels`);
-    }
-  }
-  /**
-   * Check if there is an active channel for a given origin
-   */
-  hasChannel(origin) {
-    const now = Date.now();
-    for (const channel of this.channels.values()) {
-      if (channel.origin === origin) {
-        const age = now - channel.lastActivity;
-        if (age <= this.CHANNEL_TIMEOUT) {
-          return true;
-        }
-      }
-    }
-    return false;
-  }
-  /**
-   * Get channel statistics
-   */
-  getStats() {
-    const stats = {
-      total: this.channels.size,
-      byProject: {}
-    };
-    for (const channel of this.channels.values()) {
-      stats.byProject[channel.projectId] = (stats.byProject[channel.projectId] || 0) + 1;
-    }
-    return stats;
-  }
-};
-
 // src/iframe/lib/storage-manager.ts
 var StorageManager = class {
   constructor() {
@@ -3782,7 +3858,7 @@ var StorageManager = class {
 };
 
 // src/iframe/lib/trusted-apps-manager.ts
-var STORAGE_KEY = "lumia_passport_trusted_apps";
+var STORAGE_KEY2 = "passport-trusted-apps";
 var TrustedAppsManager = class {
   /**
    * Check if app is trusted by user
@@ -3857,7 +3933,7 @@ var TrustedAppsManager = class {
    */
   getTrustedApps() {
     try {
-      const data = localStorage.getItem(STORAGE_KEY);
+      const data = localStorage.getItem(STORAGE_KEY2);
       console.log("[TrustedApps] Raw storage data:", data);
       if (!data) {
         console.log("[TrustedApps] No data in storage");
@@ -3876,7 +3952,7 @@ var TrustedAppsManager = class {
    */
   saveTrustedApps(apps) {
     try {
-      localStorage.setItem(STORAGE_KEY, JSON.stringify(apps));
+      localStorage.setItem(STORAGE_KEY2, JSON.stringify(apps));
     } catch (error) {
       console.error("[TrustedApps] Error saving trusted apps:", error);
       throw new Error("Failed to save trusted apps");
@@ -3884,84 +3960,6 @@ var TrustedAppsManager = class {
   }
 };
 
-// src/iframe/lib/opted-out-apps-manager.ts
-var STORAGE_KEY2 = "lumia_passport_opted_out_apps";
-var OptedOutAppsManager = class {
-  /**
-   * Check if user has opted out of auto-trust for this app
-   */
-  isOptedOut(userId, projectId, origin) {
-    const optedOutApps = this.getOptedOutApps();
-    const result = optedOutApps.some(
-      (app) => app.userId === userId && app.projectId === projectId && app.origin === origin
-    );
-    return result;
-  }
-  /**
-   * Add app to opted-out list (when user removes ecosystem app from trusted list)
-   */
-  addOptedOut(userId, projectId, origin) {
-    const optedOutApps = this.getOptedOutApps();
-    const exists = optedOutApps.some(
-      (app) => app.userId === userId && app.projectId === projectId && app.origin === origin
-    );
-    if (exists) {
-      return;
-    }
-    optedOutApps.push({
-      userId,
-      projectId,
-      origin,
-      optedOutAt: Date.now()
-    });
-    this.saveOptedOutApps(optedOutApps);
-  }
-  /**
-   * Remove app from opted-out list (when user manually re-trusts via checkbox)
-   */
-  removeOptedOut(userId, projectId, origin) {
-    const optedOutApps = this.getOptedOutApps();
-    const filtered = optedOutApps.filter(
-      (app) => !(app.userId === userId && app.projectId === projectId && app.origin === origin)
-    );
-    this.saveOptedOutApps(filtered);
-  }
-  /**
-   * Clear all opted-out apps for a user (when clearing all trusted apps)
-   */
-  clearOptedOutForUser(userId) {
-    const optedOutApps = this.getOptedOutApps();
-    const filtered = optedOutApps.filter((app) => app.userId !== userId);
-    this.saveOptedOutApps(filtered);
-  }
-  /**
-   * Get all opted-out apps from storage
-   */
-  getOptedOutApps() {
-    try {
-      const data = localStorage.getItem(STORAGE_KEY2);
-      if (!data) {
-        return [];
-      }
-      const apps = JSON.parse(data);
-      return Array.isArray(apps) ? apps : [];
-    } catch (error) {
-      console.error("[OptedOutApps] Error reading opted-out apps:", error);
-      return [];
-    }
-  }
-  /**
-   * Save opted-out apps to storage
-   */
-  saveOptedOutApps(apps) {
-    try {
-      localStorage.setItem(STORAGE_KEY2, JSON.stringify(apps));
-    } catch (error) {
-      console.error("[OptedOutApps] Error saving opted-out apps:", error);
-    }
-  }
-};
-
 // src/iframe/lib/signing-manager.ts
 var SigningManager = class extends TokenRefreshApiClient {
   constructor() {
@@ -4406,11 +4404,11 @@ var SigningManager = class extends TokenRefreshApiClient {
 };
 
 // src/iframe/main.ts
-var IFRAME_VERSION = "0.1.1";
+var IFRAME_VERSION = "0.1.3";
 var IframeWallet = class {
   constructor() {
     console.log("=".repeat(60));
-    console.log(`  Lumia Passport Secure Wallet - iframe version ${IFRAME_VERSION}`);
+    console.log(`  EmbarkAI Secure Wallet - iframe version ${IFRAME_VERSION}`);
     console.log("=".repeat(60));
     this.messenger = new SecureMessenger();
     this.sdkChannelManager = new SdkChannelManager();
@@ -4521,11 +4519,15 @@ var IframeWallet = class {
     const { messageId } = message;
     const isValid = this.sdkChannelManager.validateChannel(sessionToken, origin);
     const stats = this.sdkChannelManager.getStats();
-    this.messenger.sendResponse(messageId, {
-      type: "LUMIA_PASSPORT_HEARTBEAT_RESPONSE",
-      valid: isValid,
-      channelsCount: stats.total
-    }, origin);
+    this.messenger.sendResponse(
+      messageId,
+      {
+        type: "LUMIA_PASSPORT_HEARTBEAT_RESPONSE",
+        valid: isValid,
+        channelsCount: stats.total
+      },
+      origin
+    );
     console.log(`[iframe] HEARTBEAT: valid=${isValid}, channels=${stats.total}`);
   }
   async handleSDKAuth(message, origin) {
@@ -4570,13 +4572,7 @@ var IframeWallet = class {
           if (!isOptedOut) {
             const metadata = await this.authManager.getProjectMetadata(projectId);
             console.log(`[iframe] Got metadata for auto-trust:`, metadata?.name, metadata?.logo);
-            this.trustedApps.addTrustedApp(
-              userId,
-              projectId,
-              origin,
-              metadata?.name,
-              metadata?.logo
-            );
+            this.trustedApps.addTrustedApp(userId, projectId, origin, metadata?.name, metadata?.logo);
             console.log(`[iframe] \u2705 Auto-added to trusted apps list for seamless transactions`);
           } else {
             console.log(`[iframe] \u2139\uFE0F User opted-out of auto-trust for this app, skipping`);