@nibgate/sdk 0.2.31 → 0.2.33

package/dist/nibgate.js

@@ -27357,10 +27357,10 @@ ${prettyStateOverride(stateOverride)}`;
       <div id="nibgate-lottie" style="width:165px;height:168px;margin-bottom:24px"></div>
       <div style="font-size:50px;font-weight:700;letter-spacing:-.03em;color:${theme.fg};margin-bottom:12px">${esc(resource.price)} USDC</div>
       <div style="font-size:21px;color:${theme.muted};margin-bottom:48px">Pay to unlock this content</div>
-      <div data-nibgate-wallet-label class="nui-mono" style="font-size:18px;color:${theme.muted};margin-bottom:40px;min-height:28px">Connect wallet <span data-nibgate-bal style="display:none"><span data-nibgate-bal-txt></span></span></div>
+      <div data-nibgate-wallet-label class="nui-mono" style="font-size:18px;color:${theme.muted};margin-bottom:40px;min-height:28px">Connect wallet</div>
       <div data-nibgate-unlock-wrap style="width:100%;position:relative;border-radius:10px;overflow:hidden;cursor:pointer">
-        <div data-nibgate-unlock-progress style="position:absolute;inset:0;width:0%;background:${theme.accent};opacity:0.15;border-radius:10px;transition:width .05s linear;z-index:2"></div>
-        <button type="button" data-nibgate-unlock disabled style="width:100%;padding:14px 0;font-size:17px;font-weight:600;line-height:1;border:0;border-radius:10px;outline:none;cursor:pointer;position:relative;z-index:4;color:#fff;background:${theme.accent};transition:box-shadow .3s,transform .3s;font-family:inherit;display:flex;align-items:center;justify-content:center">${unlockSVG}Hold to pay</button></div>
+        <div data-nibgate-unlock-progress style="position:absolute;inset:0;width:0%;background:rgba(255,255,255,0.35);border-radius:10px;transition:width .05s linear;z-index:2"></div>
+        <button type="button" data-nibgate-unlock disabled style="width:100%;padding:14px 0;font-size:17px;font-weight:600;line-height:1;border:0;border-radius:10px;outline:none;cursor:pointer;position:relative;z-index:4;color:#fff;background:${theme.accent};box-shadow:0 4px 12px rgba(0,0,0,0.15);transition:transform .1s,box-shadow .1s;font-family:inherit;display:flex;align-items:center;justify-content:center">${unlockSVG}Hold to pay</button></div>
       <div class="nui-stat" style="text-align:center;margin-top:16px" data-nibgate-status></div>
     </div>
     <div data-nibgate-premium hidden style="margin-top:32px;border-top:1px solid ${theme.border};padding-top:32px">${options.premiumContentHTML || ""}</div>
@@ -27434,24 +27434,26 @@ ${prettyStateOverride(stateOverride)}`;
     }
     function updateLabel() {
       const addr = ctrl.getWalletAddress();
-      while (label.firstChild) label.removeChild(label.firstChild);
       if (addr) {
-        label.appendChild(document.createTextNode(shortAddress(addr) + " "));
-        const dc = el("span", { "data-nibgate-disconnect": "", style: "cursor:pointer" }, "\xB7 Disconnect");
-        dc.addEventListener("click", (e) => {
-          if (e.target.dataset.nibgateDisconnect !== void 0) ctrl.disconnect().then(updateLabel);
-        });
-        label.appendChild(dc);
-        if (balEl?.isConnected) label.appendChild(balEl);
+        label.innerHTML = shortAddress(addr) + ' <span data-nibgate-disconnect style="cursor:pointer">\xB7 Disconnect</span> <span data-nibgate-bal style="margin-left:4px;cursor:pointer;white-space:nowrap;color:var(--accent,#7c9a6d)">\xB7 <span data-nibgate-bal-txt></span> | ' + depIcon() + "</span>";
+        balEl = label.querySelector("[data-nibgate-bal]");
+        balEl?.addEventListener("click", showDeposit);
         btn.disabled = false;
         btn.style.cursor = "pointer";
       } else {
-        label.appendChild(document.createTextNode("Connect wallet"));
+        label.innerHTML = "Connect wallet";
         btn.disabled = true;
         btn.style.cursor = "default";
         btn.innerHTML = unlockSVG + "Hold to pay";
       }
     }
+    function attachBalClick() {
+      const b = label.querySelector("[data-nibgate-bal]");
+      if (b && !b._clickAttached) {
+        b.addEventListener("click", showDeposit);
+        b._clickAttached = true;
+      }
+    }
     function setBtnText(t) {
       btn.innerHTML = unlockSVG + t;
     }
@@ -27459,8 +27461,8 @@ ${prettyStateOverride(stateOverride)}`;
       holdActive = false;
       holdComplete = false;
       holdTimer = null;
-      btn.style.transform = "scale(1)";
-      btn.style.boxShadow = "0 4px 12px rgba(0,0,0,0.08)";
+      btn.style.transform = "";
+      btn.style.boxShadow = "";
       prog.style.width = "0%";
       if (!btn.disabled) setBtnText("Hold to pay");
     }
@@ -27469,8 +27471,8 @@ ${prettyStateOverride(stateOverride)}`;
       e.preventDefault();
       holdActive = true;
       holdComplete = false;
-      btn.style.transform = "scale(.97)";
-      btn.style.boxShadow = "0 2px 6px rgba(0,0,0,0.12)";
+      btn.style.transform = "scale(0.96)";
+      btn.style.boxShadow = "0 2px 8px rgba(0,0,0,0.2)";
       prog.style.transition = "none";
       prog.style.width = "0%";
       setBtnText("Hold\u2026");
@@ -27481,8 +27483,8 @@ ${prettyStateOverride(stateOverride)}`;
       holdTimer = setTimeout(() => {
         holdComplete = true;
         holdActive = false;
-        btn.style.transform = "scale(1)";
-        btn.style.boxShadow = "0 4px 12px rgba(0,0,0,0.08)";
+        btn.style.transform = "";
+        btn.style.boxShadow = "";
         prog.style.transition = "width .05s linear";
         setBtnText("Processing\u2026");
         btn.disabled = true;
@@ -27510,7 +27512,7 @@ ${prettyStateOverride(stateOverride)}`;
       document.removeEventListener("touchend", cancelHold);
     };
     card.addEventListener("remove", cleanup);
-    let balEl = null, gwOverlay = null, balTimer = null;
+    let gwOverlay = null, balTimer = null;
     function depIcon() {
       return '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="display:inline;vertical-align:middle"><path d="M12 17V3"/><path d="m6 11 6 6 6-6"/><path d="M19 21H5"/></svg>';
     }
@@ -27545,27 +27547,14 @@ ${prettyStateOverride(stateOverride)}`;
         document.removeEventListener("keydown", onDepKey);
       }
     }
-    function ensureBal() {
-      if (balEl && balEl.isConnected) return balEl;
-      balEl = label.querySelector("[data-nibgate-bal]");
-      if (balEl) {
-        balEl.style.display = "";
-        balEl.style.marginLeft = "4px";
-        balEl.style.cursor = "pointer";
-        balEl.style.whiteSpace = "nowrap";
-        balEl.style.color = "var(--accent,#7c9a6d)";
-        balEl.innerHTML = "\xB7\xA0<span data-nibgate-bal-txt></span>\xA0|\xA0" + depIcon();
-        balEl.addEventListener("click", showDeposit);
-      }
-      return balEl;
-    }
     async function refreshBal() {
       if (!card.isConnected || !window.ethereum || !options.gatewayBalanceUrl) return;
       try {
         const accts = await window.ethereum.request({ method: "eth_accounts" });
         const addr = Array.isArray(accts) && accts[0] ? accts[0] : null;
         if (!addr) return;
-        const t = ensureBal().querySelector("[data-nibgate-bal-txt]");
+        attachBalClick();
+        const t = label.querySelector("[data-nibgate-bal-txt]");
         if (!t) return;
         const r = await fetch(options.gatewayBalanceUrl, {
           method: "POST",