@loafmarkets/ui 0.1.408 → 0.1.409

package/dist/index.mjs

@@ -5078,6 +5078,7 @@ var Header = ({
   onSettingsClick,
   onReferClick,
   portfolioSummary,
+  totalPoints,
   fundsPending = false,
   transparentOnTop = false,
   headerCta = "deposit",
@@ -5541,6 +5542,11 @@ var Header = ({
             }
           ),
           isUserMenuOpen && /* @__PURE__ */ jsxs(DropdownMenu, { className: "user-menu-dropdown", children: [
+            totalPoints != null && /* @__PURE__ */ jsxs(PointsHeader, { children: [
+              /* @__PURE__ */ jsx("div", { className: "pts-label", children: "Total Points" }),
+              /* @__PURE__ */ jsx("div", { className: "pts-value", children: totalPoints.toLocaleString() }),
+              /* @__PURE__ */ jsx("div", { className: "pts-note", children: "Cumulative points earned. More soon." })
+            ] }),
             /* @__PURE__ */ jsx(
               "button",
               {
@@ -5598,7 +5604,7 @@ var Header = ({
           }
         )
       ] }) : /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center" }, children: [
-        /* @__PURE__ */ jsx(Button2, { className: "signup", onClick: handleSignIn, children: "Connect" }),
+        /* @__PURE__ */ jsx(Button2, { className: "signup", onClick: handleSignIn, children: "Join Competition" }),
         /* @__PURE__ */ jsx(
           MobileOnlyButton,
           {
@@ -6126,6 +6132,33 @@ var DropdownMenu = styled10.div`
     display: block;
   }
 `;
+var PointsHeader = styled10.div`
+  padding: 0.7rem 1.25rem 0.8rem;
+  margin-bottom: 0.35rem;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
+  .pts-note {
+    margin-top: 0.4rem;
+    font-size: 0.6rem;
+    line-height: 1.4;
+    color: rgba(255, 255, 255, 0.4);
+  }
+  .pts-label {
+    font-family: 'SF Mono', 'Fira Code', ui-monospace, monospace;
+    font-size: 0.56rem;
+    font-weight: 700;
+    letter-spacing: 0.16em;
+    text-transform: uppercase;
+    color: rgba(255, 255, 255, 0.45);
+  }
+  .pts-value {
+    margin-top: 0.2rem;
+    font-size: 1.15rem;
+    font-weight: 800;
+    color: #E6C87E;
+    font-variant-numeric: tabular-nums;
+    line-height: 1;
+  }
+`;
 var MenuItem = styled10.div`
   padding: 0.75rem 1.25rem;
   cursor: pointer;
@@ -9028,6 +9061,48 @@ var CodeLink = styled10.button`
     text-underline-offset: 2px;
   }
 `;
+var HandleField = styled10.div`
+  display: flex;
+  align-items: center;
+  gap: 0.1rem;
+  width: 100%;
+  margin-bottom: 0.4rem;
+  padding: 0 0.9rem;
+  background: rgba(255, 255, 255, 0.04);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 10px;
+  transition: border-color 0.15s ease;
+
+  &:focus-within {
+    border-color: rgba(230, 200, 126, 0.6);
+  }
+`;
+var HandleAt = styled10.span`
+  color: rgba(255, 255, 255, 0.4);
+  font-size: 1rem;
+  font-weight: 600;
+`;
+var HandleInput = styled10.input`
+  flex: 1;
+  min-width: 0;
+  padding: 0.85rem 0.4rem;
+  border: none;
+  background: transparent;
+  color: #fff;
+  font-size: 1rem;
+  font-family: inherit;
+  outline: none;
+
+  &::placeholder {
+    color: rgba(255, 255, 255, 0.35);
+  }
+`;
+var FieldError = styled10.div`
+  width: 100%;
+  margin-bottom: 0.6rem;
+  font-size: 0.78rem;
+  color: #ff6b6b;
+`;
 function OnboardingGuide({
   open,
   fundsReady,
@@ -9035,8 +9110,21 @@ function OnboardingGuide({
   onBrowseProperties,
   onEnterCode,
   onClose,
+  onClaimHandle,
   logoSrc = "/Loaf-logo-Banner.png"
 }) {
+  const [step, setStep] = useState(onClaimHandle ? "handle" : "funds");
+  const [handle, setHandle] = useState("");
+  const [claiming, setClaiming] = useState(false);
+  const [handleError, setHandleError] = useState("");
+  useEffect(() => {
+    if (open) {
+      setStep(onClaimHandle ? "handle" : "funds");
+      setHandle("");
+      setClaiming(false);
+      setHandleError("");
+    }
+  }, [open, onClaimHandle]);
   useEffect(() => {
     if (!open) return;
     const onKey = (e) => {
@@ -9046,6 +9134,58 @@ function OnboardingGuide({
     return () => window.removeEventListener("keydown", onKey);
   }, [open, onClose]);
   if (!open) return null;
+  const handleClaimContinue = async () => {
+    const trimmed = handle.trim().replace(/^@+/, "");
+    if (trimmed && onClaimHandle) {
+      setClaiming(true);
+      setHandleError("");
+      try {
+        await onClaimHandle(trimmed);
+      } catch (err) {
+        setHandleError(err instanceof Error ? err.message : "Couldn't claim that handle. Try another or skip.");
+        setClaiming(false);
+        return;
+      }
+      setClaiming(false);
+    }
+    setStep("funds");
+  };
+  if (step === "handle") {
+    return /* @__PURE__ */ jsx(Overlay3, { onClick: onClose, role: "dialog", "aria-modal": "true", "aria-label": "Claim your handle", children: /* @__PURE__ */ jsxs(Card2, { onClick: (e) => e.stopPropagation(), children: [
+      /* @__PURE__ */ jsx(CloseButton2, { onClick: onClose, "aria-label": "Skip", children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 6l12 12M18 6L6 18" }) }) }),
+      /* @__PURE__ */ jsxs(LogoRow, { children: [
+        /* @__PURE__ */ jsx(LogoImage2, { src: logoSrc, alt: "Loaf" }),
+        /* @__PURE__ */ jsx(LogoBeta2, { children: "Private Beta" })
+      ] }),
+      /* @__PURE__ */ jsx(Title2, { children: "Claim your handle" }),
+      /* @__PURE__ */ jsx(Subtitle2, { children: "Pick a username for your Loaf profile. It's optional \u2014 you can set or change it later." }),
+      /* @__PURE__ */ jsxs(HandleField, { children: [
+        /* @__PURE__ */ jsx(HandleAt, { children: "@" }),
+        /* @__PURE__ */ jsx(
+          HandleInput,
+          {
+            type: "text",
+            autoComplete: "off",
+            autoCapitalize: "none",
+            spellCheck: false,
+            placeholder: "username (optional)",
+            value: handle,
+            onChange: (e) => {
+              setHandle(e.target.value.replace(/[^a-zA-Z0-9_]/g, ""));
+              setHandleError("");
+            },
+            onKeyDown: (e) => {
+              if (e.key === "Enter" && !claiming) void handleClaimContinue();
+            },
+            autoFocus: true
+          }
+        )
+      ] }),
+      handleError && /* @__PURE__ */ jsx(FieldError, { children: handleError }),
+      /* @__PURE__ */ jsx(PrimaryButton, { onClick: () => void handleClaimContinue(), disabled: claiming, children: claiming ? "Saving\u2026" : "Continue" }),
+      /* @__PURE__ */ jsx(SkipButton, { onClick: () => setStep("funds"), disabled: claiming, children: "Skip for now" })
+    ] }) });
+  }
   return /* @__PURE__ */ jsx(Overlay3, { onClick: onClose, role: "dialog", "aria-modal": "true", "aria-label": "Welcome to Loaf", children: /* @__PURE__ */ jsxs(Card2, { onClick: (e) => e.stopPropagation(), children: [
     /* @__PURE__ */ jsx(CloseButton2, { onClick: onClose, "aria-label": "Skip", children: /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 6l12 12M18 6L6 18" }) }) }),
     /* @__PURE__ */ jsxs(LogoRow, { children: [
@@ -12109,6 +12249,11 @@ var DocIcon = () => /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", vie
   /* @__PURE__ */ jsx("line", { x1: "16", y1: "17", x2: "8", y2: "17" }),
   /* @__PURE__ */ jsx("polyline", { points: "10 9 9 9 8 9" })
 ] });
+var DownloadIcon = () => /* @__PURE__ */ jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ jsx("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
+  /* @__PURE__ */ jsx("polyline", { points: "7 10 12 15 17 10" }),
+  /* @__PURE__ */ jsx("line", { x1: "12", y1: "15", x2: "12", y2: "3" })
+] });
 var LIVE_TITLE_PATTERNS = [/term\s*sheet/i, /memo/i];
 var COMING_SOON_TITLES = [
   "Valuation Report",
@@ -12123,11 +12268,30 @@ var COMING_SOON_TITLES = [
 ];
 function PropertyDocuments({ documentsData, highlightDocument, onClearHighlight }) {
   const highlightRef = useRef(null);
-  useRef(null);
+  const [previewUrl, setPreviewUrl] = useState(null);
+  const [previewTitle, setPreviewTitle] = useState(null);
+  const backendDocuments = Array.isArray(documentsData?.documents) ? documentsData.documents : [];
+  const liveDocs = backendDocuments.filter(
+    (d) => Boolean(d.documentUrl) && LIVE_TITLE_PATTERNS.some((rx) => rx.test(d.title))
+  );
+  const comingSoonDocs = COMING_SOON_TITLES.filter(
+    (title) => !liveDocs.some((d) => d.title.toLowerCase().includes(title.toLowerCase()) || title.toLowerCase().includes(d.title.toLowerCase()))
+  ).map((title) => ({ title, documentUrl: "" }));
+  const documents = [...liveDocs, ...comingSoonDocs];
+  const activeUrl = previewUrl ?? (liveDocs[0]?.documentUrl || null);
+  const activeTitle = previewUrl ? previewTitle : liveDocs[0]?.title || null;
+  const selectPreview = (doc) => {
+    setPreviewUrl(doc.documentUrl);
+    setPreviewTitle(doc.title);
+  };
   useEffect(() => {
     if (highlightDocument && highlightRef.current) {
       highlightRef.current.scrollIntoView({ behavior: "smooth", block: "nearest" });
     }
+    if (highlightDocument) {
+      const hit = liveDocs.find((d) => d.title.toLowerCase().includes(highlightDocument.toLowerCase()));
+      if (hit) selectPreview(hit);
+    }
   }, [highlightDocument]);
   useEffect(() => {
     if (!highlightDocument || !onClearHighlight) return;
@@ -12139,36 +12303,58 @@ function PropertyDocuments({ documentsData, highlightDocument, onClearHighlight
     document.addEventListener("click", handler, true);
     return () => document.removeEventListener("click", handler, true);
   }, [highlightDocument, onClearHighlight]);
-  const backendDocuments = Array.isArray(documentsData?.documents) ? documentsData.documents : [];
-  const liveDocs = backendDocuments.filter(
-    (d) => Boolean(d.documentUrl) && LIVE_TITLE_PATTERNS.some((rx) => rx.test(d.title))
-  );
-  const comingSoonDocs = COMING_SOON_TITLES.filter(
-    (title) => !liveDocs.some((d) => d.title.toLowerCase().includes(title.toLowerCase()) || title.toLowerCase().includes(d.title.toLowerCase()))
-  ).map((title) => ({ title, documentUrl: "" }));
-  const documents = [...liveDocs, ...comingSoonDocs];
   return /* @__PURE__ */ jsxs(Section2, { children: [
     /* @__PURE__ */ jsx(SectionHeading, { children: "Investment Documents" }),
-    /* @__PURE__ */ jsx(DocList, { children: documents.map(({ documentUrl, title }) => {
-      const isAvailable = Boolean(documentUrl);
-      const isHighlighted = highlightDocument != null && title.toLowerCase().includes(highlightDocument.toLowerCase());
-      return /* @__PURE__ */ jsx(
-        DocItem,
+    /* @__PURE__ */ jsxs(SplitLayout, { children: [
+      /* @__PURE__ */ jsx(DocList, { children: documents.map(({ documentUrl, title }) => {
+        const isAvailable = Boolean(documentUrl);
+        const isHighlighted = highlightDocument != null && title.toLowerCase().includes(highlightDocument.toLowerCase());
+        const isActive = isAvailable && documentUrl === activeUrl;
+        return /* @__PURE__ */ jsx(
+          DocItem,
+          {
+            ref: isHighlighted ? highlightRef : void 0,
+            $highlighted: isHighlighted,
+            children: /* @__PURE__ */ jsxs(
+              DocRow,
+              {
+                $available: isAvailable,
+                $active: isActive,
+                onMouseEnter: isAvailable ? () => selectPreview({ documentUrl, title }) : void 0,
+                onClick: isAvailable ? () => selectPreview({ documentUrl, title }) : void 0,
+                children: [
+                  /* @__PURE__ */ jsxs(DocName, { $available: isAvailable, children: [
+                    /* @__PURE__ */ jsx(DocIconWrapper, { children: /* @__PURE__ */ jsx(DocIcon, {}) }),
+                    title
+                  ] }),
+                  isAvailable ? /* @__PURE__ */ jsx(
+                    DownloadBtn,
+                    {
+                      href: documentUrl,
+                      target: "_blank",
+                      rel: "noopener noreferrer",
+                      "aria-label": `Open ${title}`,
+                      title: "Open document",
+                      onClick: (e) => e.stopPropagation(),
+                      children: /* @__PURE__ */ jsx(DownloadIcon, {})
+                    }
+                  ) : /* @__PURE__ */ jsx(ComingSoonBadge, { children: "Coming Soon" })
+                ]
+              }
+            )
+          },
+          `${title}-${documentUrl || "pending"}`
+        );
+      }) }),
+      /* @__PURE__ */ jsx(PreviewPane, { children: activeUrl ? /* @__PURE__ */ jsx(
+        PreviewFrame,
         {
-          ref: isHighlighted ? highlightRef : void 0,
-          $highlighted: isHighlighted,
-          children: isAvailable ? /* @__PURE__ */ jsxs(DocLink, { href: documentUrl, target: "_blank", rel: "noopener noreferrer", children: [
-            /* @__PURE__ */ jsx(DocIconWrapper, { children: /* @__PURE__ */ jsx(DocIcon, {}) }),
-            title
-          ] }) : /* @__PURE__ */ jsxs(DocItemDisabled, { children: [
-            /* @__PURE__ */ jsx(DocIconWrapper, { children: /* @__PURE__ */ jsx(DocIcon, {}) }),
-            title,
-            /* @__PURE__ */ jsx(ComingSoonBadge, { children: "Coming Soon" })
-          ] })
+          src: `${activeUrl}#toolbar=0&navpanes=0&view=FitH`,
+          title: activeTitle ?? "Document preview"
         },
-        `${title}-${documentUrl || "pending"}`
-      );
-    }) })
+        activeUrl
+      ) : /* @__PURE__ */ jsx(PreviewEmpty, { children: "Hover a document to preview it here" }) })
+    ] })
   ] });
 }
 var Section2 = styled10.section`
@@ -12188,45 +12374,103 @@ var SectionHeading = styled10.h2`
   align-items: center;
   gap: 0.5rem;
 `;
+var SplitLayout = styled10.div`
+  display: flex;
+  gap: 1.25rem;
+  align-items: stretch;
+
+  @media (max-width: 768px) {
+    flex-direction: column;
+  }
+`;
 var DocList = styled10.ul`
   list-style: none;
   padding: 0;
   margin: 0;
+  flex: 1 1 50%;
+  min-width: 0;
 `;
 var DocItem = styled10.li`
-  padding: 0.75rem 0;
+  padding: 0.35rem 0;
   border-bottom: 1px solid var(--color-border, rgba(255, 255, 255, 0.1));
   border-radius: ${(p) => p.$highlighted ? "6px" : "0"};
   background: ${(p) => p.$highlighted ? "rgba(212, 175, 55, 0.08)" : "transparent"};
-  ${(p) => p.$highlighted ? "padding: 0.75rem;" : ""}
   transition: background 0.3s;
 
   &:last-child {
     border-bottom: none;
   }
 `;
-var DocLink = styled10.a`
+var DocRow = styled10.div`
   display: flex;
   align-items: center;
-  color: var(--color-text);
-  text-decoration: none;
-  transition: color 0.2s;
+  gap: 0.5rem;
+  padding: 0.4rem 0.5rem;
+  border-radius: 6px;
+  cursor: ${(p) => p.$available ? "pointer" : "not-allowed"};
+  background: ${(p) => p.$active ? "rgba(230, 200, 126, 0.10)" : "transparent"};
+  transition: background 0.2s, color 0.2s;
 
-  &:hover {
-    color: var(--color-accent);
-  }
+  ${(p) => p.$available && !p.$active ? "&:hover { background: rgba(230, 200, 126, 0.06); }" : ""}
 `;
-var DocItemDisabled = styled10.div`
+var DocName = styled10.span`
   display: flex;
   align-items: center;
-  color: var(--color-text-secondary);
-  cursor: not-allowed;
-  opacity: 0.6;
+  flex: 1;
+  min-width: 0;
+  color: ${(p) => p.$available ? "var(--color-text)" : "var(--color-text-secondary)"};
+  opacity: ${(p) => p.$available ? 1 : 0.6};
 `;
 var DocIconWrapper = styled10.span`
   margin-right: 0.75rem;
   flex-shrink: 0;
   color: var(--color-text-secondary);
+  display: inline-flex;
+`;
+var DownloadBtn = styled10.a`
+  flex-shrink: 0;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 30px;
+  height: 30px;
+  border-radius: 6px;
+  color: var(--color-text-secondary);
+  transition: color 0.2s, background 0.2s;
+
+  &:hover {
+    color: var(--color-accent);
+    background: rgba(230, 200, 126, 0.1);
+  }
+`;
+var PreviewPane = styled10.div`
+  flex: 1 1 50%;
+  min-width: 0;
+  min-height: 360px;
+  display: flex;
+  border: 1px solid var(--color-border, rgba(255, 255, 255, 0.1));
+  border-radius: 10px;
+  overflow: hidden;
+  background: rgba(0, 0, 0, 0.25);
+
+  /* No hover on touch devices — fall back to the list + download icon. */
+  @media (max-width: 768px) {
+    display: none;
+  }
+`;
+var PreviewFrame = styled10.iframe`
+  width: 100%;
+  height: 100%;
+  min-height: 360px;
+  border: 0;
+  background: #fff;
+`;
+var PreviewEmpty = styled10.div`
+  margin: auto;
+  padding: 1rem;
+  text-align: center;
+  color: var(--color-text-secondary);
+  font-size: 0.85rem;
 `;
 var ComingSoonBadge = styled10.span`
   margin-left: auto;
@@ -12238,6 +12482,7 @@ var ComingSoonBadge = styled10.span`
   font-weight: 500;
   text-transform: uppercase;
   letter-spacing: 0.05em;
+  flex-shrink: 0;
 `;
 var formatIsoDate = (value) => {
   const parsed = new Date(value);
@@ -19875,7 +20120,7 @@ var OpenMailButton = styled10.a`
 `;
 var ContactPopup = ({ onClose }) => {
   const [copied, setCopied] = useState(false);
-  const email = "Gavin@loafmarkets.com";
+  const email = "admin@loafmarkets.com";
   const handleCopy = async () => {
     try {
       await navigator.clipboard.writeText(email);
@@ -20102,7 +20347,17 @@ var SiteFooter = () => {
             /* @__PURE__ */ jsx(FooterLinkItem, { children: /* @__PURE__ */ jsx(FooterLink, { href: "/trade", children: "Trade" }) }),
             /* @__PURE__ */ jsx(FooterLinkItem, { children: /* @__PURE__ */ jsx(FooterLink, { href: "/offerings", children: "Initial Offerings" }) }),
             /* @__PURE__ */ jsx(FooterLinkItem, { children: /* @__PURE__ */ jsx(FooterLink, { href: "/map", children: "Property Map" }) }),
-            /* @__PURE__ */ jsx(FooterLinkItem, { children: /* @__PURE__ */ jsx(FooterLink, { href: "/loaf-liquidity", children: "Loaf Liquidity" }) })
+            /* @__PURE__ */ jsx(FooterLinkItem, { children: /* @__PURE__ */ jsx(
+              FooterLink,
+              {
+                href: "/loaf-liquidity",
+                onClick: (e) => {
+                  e.preventDefault();
+                  if (typeof window !== "undefined") window.dispatchEvent(new CustomEvent("loaf:open-liquidity-popup"));
+                },
+                children: "Loaf Liquidity"
+              }
+            ) })
           ] })
         ] }),
         /* @__PURE__ */ jsxs(FooterColumn, { children: [
@@ -20138,7 +20393,7 @@ var SiteFooter = () => {
           /* @__PURE__ */ jsx(LegalLink, { href: "/cookies", children: "Cookie Policy" })
         ] })
       ] }),
-      /* @__PURE__ */ jsx(Disclaimer2, { children: /* @__PURE__ */ jsx(DisclaimerText, { children: "Warning: Digital asset prices can be volatile. The value of your investment can go down or up and you may not get back the amount invested. Past gains are not indicative of future returns. You are solely responsible for your investment decisions and Loaf is not liable for any losses you may incur. The information here should not be regarded as financial or investment advice. For more information, see our Terms of Use and Risk Warning." }) })
+      /* @__PURE__ */ jsx(Disclaimer2, { children: /* @__PURE__ */ jsx(DisclaimerText, { children: "Warning: Digital asset prices can be volatile. The value of your investment can go down or up and you may not get back the amount invested. Past gains are not indicative of future returns. You are solely responsible for your investment decisions and Loaf is not liable for any losses you may incur. The information here should not be regarded as financial or investment advice. For more information, see our Terms of Use." }) })
     ] }) }),
     showContactPopup && /* @__PURE__ */ jsx(ContactPopup, { onClose: () => setShowContactPopup(false) })
   ] });