@loafmarkets/ui 0.1.380 → 0.1.382

package/dist/index.mjs

@@ -6601,6 +6601,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;
@@ -6627,6 +6630,7 @@ var LoginPopup = ({
   renderKycWidget,
   onFundWallet,
   initialView,
+  initialCode,
   kycStatus: kycStatusProp,
   walletAddress,
   onSubmitReferralCode,
@@ -6640,7 +6644,9 @@ var LoginPopup = ({
   const [otp, setOtp] = useState(Array(OTP_INPUT_LENGTH).fill(""));
   const [error, setError] = useState("");
   const [copied, setCopied] = useState(false);
-  const [referralCode, setReferralCode] = useState("");
+  const [referralCode, setReferralCode] = useState(
+    () => gate && initialCode ? normalizeAccessCode(initialCode) : ""
+  );
   const [referralLoading, setReferralLoading] = useState(false);
   const [referralError, setReferralError] = useState("");
   const [codeStatus, setCodeStatus] = useState("idle");
@@ -6649,20 +6655,6 @@ var LoginPopup = ({
   const [signInMode, setSignInMode] = useState(false);
   const [loading, setLoading] = useState(false);
   const [isSignUp, setIsSignUp] = useState(false);
-  const [gateViewportH, setGateViewportH] = useState(void 0);
-  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] = useState("");
   const [kycLoading, setKycLoading] = useState(false);
   const [showKycWidget, setShowKycWidget] = useState(false);
@@ -6699,6 +6691,37 @@ var LoginPopup = ({
     );
     return false;
   }, [gate, onSubmitReferralCode, onCheckAccess]);
+  const runCodeValidation = React5__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__default.useRef(false);
+  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]);
   useEffect(() => {
     if (typeof initialView === "string") {
       setView(initialView);
@@ -7184,7 +7207,7 @@ var LoginPopup = ({
   }
   if (view === "otp") {
     if (gate) {
-      return /* @__PURE__ */ jsxs(GateShell, { $h: gateViewportH, children: [
+      return /* @__PURE__ */ jsxs(GateShell, { children: [
         /* @__PURE__ */ jsx(GateTint, { $reveal: otpStatus === "valid" ? 3 : 2 }),
         /* @__PURE__ */ jsxs(GateForm, { children: [
           /* @__PURE__ */ jsxs(GateBrand, { children: [
@@ -7467,31 +7490,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("");
@@ -7565,7 +7564,7 @@ var LoginPopup = ({
     if (gate) {
       const codeAccepted = codeStatus === "valid";
       const showSignIn = signInMode || signInRevealed;
-      return /* @__PURE__ */ jsxs(GateShell, { $h: gateViewportH, children: [
+      return /* @__PURE__ */ jsxs(GateShell, { children: [
         /* @__PURE__ */ jsx(GateTint, { $reveal: showSignIn ? 1 : 0 }),
         /* @__PURE__ */ jsxs(GateForm, { children: [
           /* @__PURE__ */ jsxs(GateBrand, { children: [
@@ -8192,21 +8191,12 @@ var GateForm = styled10.div`
 `;
 var GateShell = styled10.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.div`
   position: absolute;