@loafmarkets/ui 0.1.380 → 0.1.382

package/dist/index.d.mts

@@ -580,6 +580,13 @@ type LoginPopupProps = {
     onFundWallet?: (params: FundWalletParams) => Promise<FundWalletResult> | void;
     /** Optional view to show immediately when the popup opens. */
     initialView?: LoginPopupView;
+    /**
+     * Gate-only: an access code supplied out-of-band (e.g. the `?code=` param on an
+     * invite link). Any form is accepted ("LOAF-M8TRP" / "loaf-m8trp" / "M8TRP").
+     * Pre-fills the code field and, when complete, auto-validates on open so the
+     * gate advances straight to sign-in.
+     */
+    initialCode?: string;
     /** Wallet address used for the receive funds view (bypasses Privy modal). */
     walletAddress?: string | null;
     /** Called when the user submits a referral code during onboarding. */

package/dist/index.d.ts

@@ -580,6 +580,13 @@ type LoginPopupProps = {
     onFundWallet?: (params: FundWalletParams) => Promise<FundWalletResult> | void;
     /** Optional view to show immediately when the popup opens. */
     initialView?: LoginPopupView;
+    /**
+     * Gate-only: an access code supplied out-of-band (e.g. the `?code=` param on an
+     * invite link). Any form is accepted ("LOAF-M8TRP" / "loaf-m8trp" / "M8TRP").
+     * Pre-fills the code field and, when complete, auto-validates on open so the
+     * gate advances straight to sign-in.
+     */
+    initialCode?: string;
     /** Wallet address used for the receive funds view (bypasses Privy modal). */
     walletAddress?: string | null;
     /** Called when the user submits a referral code during onboarding. */

package/dist/index.js

@@ -6626,6 +6626,9 @@ PropertySubheader.displayName = "PropertySubheader";
 var DEFAULT_LOGO_SRC = Loaf_logo_Banner_default;
 var DEFAULT_LOGO_ALT = "Loaf";
 var OTP_INPUT_LENGTH = 6;
+var CODE_PREFIX = "LOAF-";
+var CODE_SUFFIX_LEN = 5;
+var normalizeAccessCode = (raw) => CODE_PREFIX + raw.toUpperCase().replace(/^LOAF-?/, "").replace(/[^A-Z0-9]/g, "").slice(0, CODE_SUFFIX_LEN);
 var friendlyError = (err, fallback) => {
   const data = err?.response?.data;
   if (typeof data?.error === "string" && data.error.trim()) return data.error;
@@ -6652,6 +6655,7 @@ var LoginPopup = ({
   renderKycWidget,
   onFundWallet,
   initialView,
+  initialCode,
   kycStatus: kycStatusProp,
   walletAddress,
   onSubmitReferralCode,
@@ -6665,7 +6669,9 @@ var LoginPopup = ({
   const [otp, setOtp] = React5.useState(Array(OTP_INPUT_LENGTH).fill(""));
   const [error, setError] = React5.useState("");
   const [copied, setCopied] = React5.useState(false);
-  const [referralCode, setReferralCode] = React5.useState("");
+  const [referralCode, setReferralCode] = React5.useState(
+    () => gate && initialCode ? normalizeAccessCode(initialCode) : ""
+  );
   const [referralLoading, setReferralLoading] = React5.useState(false);
   const [referralError, setReferralError] = React5.useState("");
   const [codeStatus, setCodeStatus] = React5.useState("idle");
@@ -6674,20 +6680,6 @@ var LoginPopup = ({
   const [signInMode, setSignInMode] = React5.useState(false);
   const [loading, setLoading] = React5.useState(false);
   const [isSignUp, setIsSignUp] = React5.useState(false);
-  const [gateViewportH, setGateViewportH] = React5.useState(void 0);
-  React5.useEffect(() => {
-    if (!gate || typeof window === "undefined") return;
-    const vv = window.visualViewport;
-    if (!vv) return;
-    const sync = () => setGateViewportH(vv.height);
-    sync();
-    vv.addEventListener("resize", sync);
-    vv.addEventListener("scroll", sync);
-    return () => {
-      vv.removeEventListener("resize", sync);
-      vv.removeEventListener("scroll", sync);
-    };
-  }, [gate]);
   const [fundingAmount] = React5.useState("");
   const [kycLoading, setKycLoading] = React5.useState(false);
   const [showKycWidget, setShowKycWidget] = React5.useState(false);
@@ -6724,6 +6716,37 @@ var LoginPopup = ({
     );
     return false;
   }, [gate, onSubmitReferralCode, onCheckAccess]);
+  const runCodeValidation = React5__namespace.default.useCallback(async (fullCode) => {
+    setCodeStatus("checking");
+    setError("");
+    try {
+      const ok = onValidateCode ? await onValidateCode(fullCode) : true;
+      if (!ok) {
+        validatedCodeRef.current = null;
+        setCodeStatus("invalid");
+        return;
+      }
+      validatedCodeRef.current = fullCode;
+      setCodeStatus("valid");
+      if (isAuthenticated) {
+        if (await finishGate()) setTimeout(() => onClose(), 500);
+        return;
+      }
+      setIsSignUp(true);
+      setSignInRevealed(true);
+    } catch {
+      validatedCodeRef.current = null;
+      setCodeStatus("invalid");
+    }
+  }, [onValidateCode, isAuthenticated, finishGate, onClose]);
+  const autoCodeTriedRef = React5__namespace.default.useRef(false);
+  React5.useEffect(() => {
+    if (autoCodeTriedRef.current || !gate || !initialCode) return;
+    const full = normalizeAccessCode(initialCode);
+    if (full.length !== CODE_PREFIX.length + CODE_SUFFIX_LEN) return;
+    autoCodeTriedRef.current = true;
+    void runCodeValidation(full);
+  }, [gate, initialCode, runCodeValidation]);
   React5.useEffect(() => {
     if (typeof initialView === "string") {
       setView(initialView);
@@ -7209,7 +7232,7 @@ var LoginPopup = ({
   }
   if (view === "otp") {
     if (gate) {
-      return /* @__PURE__ */ jsxRuntime.jsxs(GateShell, { $h: gateViewportH, children: [
+      return /* @__PURE__ */ jsxRuntime.jsxs(GateShell, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(GateTint, { $reveal: otpStatus === "valid" ? 3 : 2 }),
         /* @__PURE__ */ jsxRuntime.jsxs(GateForm, { children: [
           /* @__PURE__ */ jsxRuntime.jsxs(GateBrand, { children: [
@@ -7492,31 +7515,7 @@ var LoginPopup = ({
         setReferralLoading(false);
       }
     };
-    const CODE_PREFIX = "LOAF-";
     const codeSuffix = referralCode.startsWith(CODE_PREFIX) ? referralCode.slice(CODE_PREFIX.length) : referralCode.replace(/^LOAF-?/i, "");
-    const runCodeValidation = async (fullCode) => {
-      setCodeStatus("checking");
-      setError("");
-      try {
-        const ok = onValidateCode ? await onValidateCode(fullCode) : true;
-        if (!ok) {
-          validatedCodeRef.current = null;
-          setCodeStatus("invalid");
-          return;
-        }
-        validatedCodeRef.current = fullCode;
-        setCodeStatus("valid");
-        if (isAuthenticated) {
-          if (await finishGate()) setTimeout(() => onClose(), 500);
-          return;
-        }
-        setIsSignUp(true);
-        setSignInRevealed(true);
-      } catch {
-        validatedCodeRef.current = null;
-        setCodeStatus("invalid");
-      }
-    };
     const setCodeSuffix = (suffix) => {
       setReferralCode(CODE_PREFIX + suffix);
       setReferralError("");
@@ -7590,7 +7589,7 @@ var LoginPopup = ({
     if (gate) {
       const codeAccepted = codeStatus === "valid";
       const showSignIn = signInMode || signInRevealed;
-      return /* @__PURE__ */ jsxRuntime.jsxs(GateShell, { $h: gateViewportH, children: [
+      return /* @__PURE__ */ jsxRuntime.jsxs(GateShell, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(GateTint, { $reveal: showSignIn ? 1 : 0 }),
         /* @__PURE__ */ jsxRuntime.jsxs(GateForm, { children: [
           /* @__PURE__ */ jsxRuntime.jsxs(GateBrand, { children: [
@@ -8217,21 +8216,12 @@ var GateForm = styled10__default.default.div`
 `;
 var GateShell = styled10__default.default.div`
   position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  /* Visual-viewport height when available (see gateViewportH) so the gate ends
-     at the keyboard top with nothing hidden below it to scroll to; 100% else. */
-  height: ${(props) => props.$h ? `${props.$h}px` : "100%"};
+  inset: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 10000;
   background-color: rgba(10, 10, 12, 0.66);
-  /* If content can't fit the visible area (very short screen + keyboard), scroll
-     WITHIN the gate only — never chain to the platform underneath. */
-  overflow-y: auto;
-  overscroll-behavior: contain;
 `;
 var GateTint = styled10__default.default.div`
   position: absolute;