@loafmarkets/ui 0.1.85 → 0.1.86

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -2690,7 +2690,7 @@ var PropertyTour = React5__namespace.forwardRef(
2690
2690
  }
2691
2691
  );
2692
2692
  PropertyTour.displayName = "PropertyTour";
2693
- var ITEMS_PER_PAGE = 4;
2693
+ var ITEMS_PER_PAGE = 5;
2694
2694
  var ensureAnimationsInjected = () => {
2695
2695
  if (typeof document === "undefined") return;
2696
2696
  if (document.getElementById("property-news-updates-animations")) return;
@@ -2938,10 +2938,10 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
2938
2938
  children: [
2939
2939
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
2940
2940
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
2941
- isHomeVariant && /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor", style: { color: "var(--color-text, #fff)" }, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-5 14H4v-4h11v4zm0-5H4V9h11v4zm5 5h-4V9h4v9z" }) }),
2941
+ isHomeVariant && /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", style: { color: "var(--color-text, #fff)", flexShrink: 0, display: "block" }, children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-5 14H4v-4h11v4zm0-5H4V9h11v4zm5 5h-4V9h4v9z" }) }),
2942
2942
  isPurchaseVariant && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-block", width: "8px", height: "8px", borderRadius: "50%", backgroundColor: "#0ecb81", boxShadow: "0 0 8px rgba(14,203,129,0.8)", animation: "propertyNewsPulse 1.5s infinite" } }),
2943
2943
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
2944
- /* @__PURE__ */ jsxRuntime.jsx("p", { className: isHomeVariant ? "text-base font-semibold text-white" : "text-lg font-semibold text-white", children: resolvedHeading }),
2944
+ /* @__PURE__ */ jsxRuntime.jsx("p", { className: isHomeVariant ? "text-base font-semibold text-white" : "text-lg font-semibold text-white", style: { margin: 0 }, children: resolvedHeading }),
2945
2945
  subheading ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-white/60", children: subheading }) : null
2946
2946
  ] })
2947
2947
  ] }),
@@ -2956,7 +2956,7 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
2956
2956
  "LIVE"
2957
2957
  ] }) : null
2958
2958
  ] }),
2959
- isHomeVariant && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", gap: 0, marginTop: "0.75rem", marginBottom: "0.25rem" }, children: ["all", "property", "market"].map((tab) => /* @__PURE__ */ jsxRuntime.jsx(
2959
+ isHomeVariant && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", gap: "1.5rem", marginTop: "0.75rem", marginBottom: "0.5rem", borderBottom: "1px solid rgba(255, 255, 255, 0.08)", paddingBottom: "0.5rem" }, children: ["all", "property", "market"].map((tab) => /* @__PURE__ */ jsxRuntime.jsx(
2960
2960
  "button",
2961
2961
  {
2962
2962
  type: "button",
@@ -2965,7 +2965,8 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
2965
2965
  background: "transparent",
2966
2966
  border: "none",
2967
2967
  borderBottom: homeTab === tab ? "2px solid var(--color-accent, #f0b90b)" : "2px solid transparent",
2968
- padding: "0.5rem 0.75rem",
2968
+ padding: "0 0 0.5rem 0",
2969
+ marginBottom: "-1px",
2969
2970
  fontSize: "0.75rem",
2970
2971
  fontWeight: homeTab === tab ? 600 : 400,
2971
2972
  color: homeTab === tab ? "var(--color-text, #fff)" : "var(--color-text-secondary, #848e9c)",
@@ -2979,7 +2980,7 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
2979
2980
  /* @__PURE__ */ jsxRuntime.jsx(
2980
2981
  "div",
2981
2982
  {
2982
- className: "mt-4 flex flex-1 flex-col gap-3 overflow-hidden",
2983
+ className: cn("flex flex-1 flex-col overflow-hidden", isHomeVariant ? "mt-2 gap-0" : "mt-4 gap-3"),
2983
2984
  style: !isPurchaseVariant && !isHomeVariant ? { minHeight: `${ITEMS_PER_PAGE * 86}px` } : void 0,
2984
2985
  children: isPurchaseVariant ? purchaseItems.length > 0 ? purchaseItems.slice(0, 7).map((purchase, index) => {
2985
2986
  const maxAmount = 6e4;
@@ -3018,7 +3019,7 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
3018
3019
  style: {
3019
3020
  width: "100%",
3020
3021
  textAlign: "left",
3021
- background: "transparent",
3022
+ backgroundColor: "transparent",
3022
3023
  border: "none",
3023
3024
  cursor: "pointer",
3024
3025
  padding: "0.75rem 0",
@@ -3027,11 +3028,22 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
3027
3028
  justifyContent: "space-between",
3028
3029
  alignItems: "flex-start",
3029
3030
  gap: "0.5rem",
3030
- color: "inherit"
3031
+ color: "inherit",
3032
+ transition: "background-color 0.15s"
3033
+ },
3034
+ onMouseEnter: (e) => {
3035
+ e.currentTarget.style.backgroundColor = "rgba(255,255,255,0.04)";
3036
+ const title = e.currentTarget.querySelector("h3");
3037
+ if (title) title.style.color = "var(--color-accent, #E6C87E)";
3038
+ },
3039
+ onMouseLeave: (e) => {
3040
+ e.currentTarget.style.backgroundColor = "transparent";
3041
+ const title = e.currentTarget.querySelector("h3");
3042
+ if (title) title.style.color = "#f8f9fa";
3031
3043
  },
3032
3044
  children: [
3033
3045
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1 }, children: [
3034
- /* @__PURE__ */ jsxRuntime.jsx("h3", { style: { fontSize: "0.85rem", fontWeight: 400, marginBottom: "0.25rem", color: "#f8f9fa", lineHeight: 1.4 }, children: item.title }),
3046
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { style: { fontSize: "0.85rem", fontWeight: 400, marginBottom: "0.25rem", color: "#f8f9fa", lineHeight: 1.4, transition: "color 0.15s" }, children: item.title }),
3035
3047
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: "0.5rem", alignItems: "center", flexWrap: "wrap" }, children: [
3036
3048
  /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#848e9c", fontSize: "0.7rem" }, children: typeof item.date === "string" ? item.date : formatDate(item.date) }),
3037
3049
  item.source && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: "0.1rem 0.4rem", borderRadius: "3px", fontSize: "0.62rem", fontWeight: 500, backgroundColor: "rgba(255,255,255,0.07)", color: "#848e9c", whiteSpace: "nowrap" }, children: item.source }),
@@ -3121,8 +3133,8 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
3121
3133
  type: "button",
3122
3134
  onClick: () => setHomePage((p) => Math.max(0, p - 1)),
3123
3135
  disabled: homePage === 0,
3124
- style: { background: "transparent", border: "1px solid rgba(255,255,255,0.15)", borderRadius: "999px", padding: "0.2rem 0.75rem", fontSize: "0.7rem", textTransform: "uppercase", letterSpacing: "0.15em", cursor: homePage === 0 ? "not-allowed" : "pointer", opacity: homePage === 0 ? 0.4 : 1, color: "rgba(255,255,255,0.6)" },
3125
- children: "Prev"
3136
+ style: { background: "transparent", border: "1px solid rgba(255,255,255,0.15)", borderRadius: "50%", width: "28px", height: "28px", display: "flex", alignItems: "center", justifyContent: "center", padding: 0, cursor: homePage === 0 ? "not-allowed" : "pointer", opacity: homePage === 0 ? 0.4 : 1, color: "rgba(255,255,255,0.6)" },
3137
+ children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z" }) })
3126
3138
  }
3127
3139
  ),
3128
3140
  /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontSize: "0.7rem", color: "rgba(255,255,255,0.5)" }, children: [
@@ -3136,8 +3148,8 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
3136
3148
  type: "button",
3137
3149
  onClick: () => setHomePage((p) => Math.min(homeTotalPages - 1, p + 1)),
3138
3150
  disabled: homePage >= homeTotalPages - 1,
3139
- style: { background: "transparent", border: "1px solid rgba(255,255,255,0.15)", borderRadius: "999px", padding: "0.2rem 0.75rem", fontSize: "0.7rem", textTransform: "uppercase", letterSpacing: "0.15em", cursor: homePage >= homeTotalPages - 1 ? "not-allowed" : "pointer", opacity: homePage >= homeTotalPages - 1 ? 0.4 : 1, color: "rgba(255,255,255,0.6)" },
3140
- children: "Next"
3151
+ style: { background: "transparent", border: "1px solid rgba(255,255,255,0.15)", borderRadius: "50%", width: "28px", height: "28px", display: "flex", alignItems: "center", justifyContent: "center", padding: 0, cursor: homePage >= homeTotalPages - 1 ? "not-allowed" : "pointer", opacity: homePage >= homeTotalPages - 1 ? 0.4 : 1, color: "rgba(255,255,255,0.6)" },
3152
+ children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }) })
3141
3153
  }
3142
3154
  )
3143
3155
  ] }),
@@ -3148,8 +3160,9 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
3148
3160
  type: "button",
3149
3161
  onClick: () => setPage((p) => Math.max(0, p - 1)),
3150
3162
  disabled: page === 0,
3151
- className: cn("rounded-full border border-white/15 px-3 py-1 uppercase tracking-[0.2em]", page === 0 ? "opacity-40 cursor-not-allowed" : "hover:border-white/40"),
3152
- children: "Prev"
3163
+ className: cn("rounded-full border border-white/15 flex items-center justify-center", page === 0 ? "opacity-40 cursor-not-allowed" : "hover:border-white/40"),
3164
+ style: { width: "28px", height: "28px", padding: 0, background: "transparent", color: "rgba(255,255,255,0.6)" },
3165
+ children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z" }) })
3153
3166
  }
3154
3167
  ),
3155
3168
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-medium text-white/70", children: [
@@ -3164,8 +3177,9 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
3164
3177
  type: "button",
3165
3178
  onClick: () => setPage((p) => Math.min(totalPages - 1, p + 1)),
3166
3179
  disabled: page >= totalPages - 1,
3167
- className: cn("rounded-full border border-white/15 px-3 py-1 uppercase tracking-[0.2em]", page >= totalPages - 1 ? "opacity-40 cursor-not-allowed" : "hover:border-white/40"),
3168
- children: "Next"
3180
+ className: cn("rounded-full border border-white/15 flex items-center justify-center", page >= totalPages - 1 ? "opacity-40 cursor-not-allowed" : "hover:border-white/40"),
3181
+ style: { width: "28px", height: "28px", padding: 0, background: "transparent", color: "rgba(255,255,255,0.6)" },
3182
+ children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z" }) })
3169
3183
  }
3170
3184
  )
3171
3185
  ] }),
@@ -5674,8 +5688,19 @@ var HeaderContainer = styled25__default.default.header`
5674
5688
  box-sizing: border-box;
5675
5689
 
5676
5690
  @media (max-width: 768px) {
5677
- padding: 0 1rem;
5678
- padding-top: max(env(safe-area-inset-top, 0px), var(--telegram-safe-top, 0px));
5691
+ top: 0.5rem;
5692
+ left: 0.75rem;
5693
+ right: 0.75rem;
5694
+ width: calc(100% - 1.5rem);
5695
+ height: 46px;
5696
+ min-height: 46px;
5697
+ padding: 0 0.75rem;
5698
+ border-radius: 12px;
5699
+ background-color: rgba(13, 17, 23, 0.92);
5700
+ backdrop-filter: blur(12px);
5701
+ border: 1px solid rgba(255, 255, 255, 0.08);
5702
+ border-bottom: 1px solid rgba(255, 255, 255, 0.08);
5703
+ box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
5679
5704
  }
5680
5705
  `;
5681
5706
  var HeaderSpacer = styled25__default.default.div`
@@ -5683,6 +5708,10 @@ var HeaderSpacer = styled25__default.default.div`
5683
5708
  min-height: 56px;
5684
5709
  min-height: calc(56px + max(env(safe-area-inset-top, 0px), var(--telegram-safe-top, 0px)));
5685
5710
  flex-shrink: 0;
5711
+
5712
+ @media (max-width: 768px) {
5713
+ min-height: calc(46px + 0.5rem);
5714
+ }
5686
5715
  `;
5687
5716
  var Logo = styled25__default.default.div`
5688
5717
  display: flex;
@@ -6693,7 +6722,7 @@ var LoginPopup = ({
6693
6722
  ] }) });
6694
6723
  }
6695
6724
  if (view === "funding") {
6696
- return /* @__PURE__ */ jsxRuntime.jsx(Overlay2, { onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsxs(
6725
+ return /* @__PURE__ */ jsxRuntime.jsx(Overlay2, { children: /* @__PURE__ */ jsxRuntime.jsxs(
6697
6726
  FundingPopupContainer,
6698
6727
  {
6699
6728
  onClick: (event) => event.stopPropagation(),
@@ -6763,6 +6792,16 @@ var Overlay2 = styled25__default.default.div`
6763
6792
  justify-content: center;
6764
6793
  align-items: center;
6765
6794
  z-index: 10000;
6795
+ animation: fadeIn 0.2s ease-in-out;
6796
+
6797
+ @keyframes fadeIn {
6798
+ from {
6799
+ opacity: 0;
6800
+ }
6801
+ to {
6802
+ opacity: 1;
6803
+ }
6804
+ }
6766
6805
  `;
6767
6806
  var PopupContainer = styled25__default.default.div`
6768
6807
  background-color: var(--color-background, #0a0a0a);
@@ -6772,8 +6811,20 @@ var PopupContainer = styled25__default.default.div`
6772
6811
  max-width: 440px;
6773
6812
  width: 90%;
6774
6813
  position: relative;
6814
+ animation: slideUp 0.3s ease-out;
6775
6815
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
6776
6816
 
6817
+ @keyframes slideUp {
6818
+ from {
6819
+ transform: translateY(20px);
6820
+ opacity: 0;
6821
+ }
6822
+ to {
6823
+ transform: translateY(0);
6824
+ opacity: 1;
6825
+ }
6826
+ }
6827
+
6777
6828
  @media (max-width: 768px) {
6778
6829
  padding: 2rem;
6779
6830
  max-width: 90%;
@@ -6787,9 +6838,21 @@ var KycPopupContainer = styled25__default.default.div`
6787
6838
  max-width: ${(props) => props.$expanded ? "680px" : "440px"};
6788
6839
  width: 90%;
6789
6840
  position: relative;
6841
+ animation: slideUp 0.3s ease-out;
6790
6842
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
6791
6843
  transition: max-width 0.3s ease;
6792
6844
 
6845
+ @keyframes slideUp {
6846
+ from {
6847
+ transform: translateY(20px);
6848
+ opacity: 0;
6849
+ }
6850
+ to {
6851
+ transform: translateY(0);
6852
+ opacity: 1;
6853
+ }
6854
+ }
6855
+
6793
6856
  @media (max-width: 768px) {
6794
6857
  padding: 1.5rem;
6795
6858
  max-width: 95%;
@@ -7117,9 +7180,21 @@ var FundingPopupContainer = styled25__default.default.div`
7117
7180
  max-width: ${(props) => props.$hasWidget ? "900px" : "440px"};
7118
7181
  width: 90%;
7119
7182
  position: relative;
7183
+ animation: slideUp 0.3s ease-out;
7120
7184
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
7121
7185
  overflow: hidden;
7122
7186
 
7187
+ @keyframes slideUp {
7188
+ from {
7189
+ transform: translateY(20px);
7190
+ opacity: 0;
7191
+ }
7192
+ to {
7193
+ transform: translateY(0);
7194
+ opacity: 1;
7195
+ }
7196
+ }
7197
+
7123
7198
  @media (max-width: 768px) {
7124
7199
  padding: ${(props) => props.$hasWidget ? "0" : "2rem"};
7125
7200
  max-width: 95%;
@@ -9624,6 +9699,7 @@ function OfferingProgressCard({
9624
9699
  raisedAmount,
9625
9700
  targetAmount,
9626
9701
  isPrivateClient = false,
9702
+ variant = "default",
9627
9703
  style,
9628
9704
  className
9629
9705
  }) {
@@ -9655,6 +9731,108 @@ function OfferingProgressCard({
9655
9731
  const interval = setInterval(() => setCountdown(calculateCountdown()), 1e3);
9656
9732
  return () => clearInterval(interval);
9657
9733
  }, [opensAt]);
9734
+ if (variant === "compact") {
9735
+ return /* @__PURE__ */ jsxRuntime.jsxs(CompactContainer, { style, className, children: [
9736
+ /* @__PURE__ */ jsxRuntime.jsx(ProgressBarOuter, { children: /* @__PURE__ */ jsxRuntime.jsx(ProgressBarInner, { style: { width: `${Math.min(percentSold, 100)}%` } }) }),
9737
+ /* @__PURE__ */ jsxRuntime.jsxs(ProgressInfo, { children: [
9738
+ /* @__PURE__ */ jsxRuntime.jsxs(ProgressSubscribers, { children: [
9739
+ "Subscribers: ",
9740
+ subscriberCount.toLocaleString()
9741
+ ] }),
9742
+ /* @__PURE__ */ jsxRuntime.jsxs(ProgressAmounts, { children: [
9743
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "raised", children: formatCurrency3(computedRaised) }),
9744
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "target", children: [
9745
+ " / ",
9746
+ formatCurrency3(computedTarget)
9747
+ ] })
9748
+ ] })
9749
+ ] })
9750
+ ] });
9751
+ }
9752
+ if (variant === "home") {
9753
+ const isPreLive = !ipoStarted && ipoStatus !== "CLOSED" && ipoStatus !== "CANCELLED";
9754
+ return /* @__PURE__ */ jsxRuntime.jsxs(Container, { style, className, children: [
9755
+ /* @__PURE__ */ jsxRuntime.jsxs(Header2, { children: [
9756
+ /* @__PURE__ */ jsxRuntime.jsxs("h3", { children: [
9757
+ /* @__PURE__ */ jsxRuntime.jsx(fa.FaChartLine, {}),
9758
+ " Offering Progress"
9759
+ ] }),
9760
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", alignItems: "center", gap: "0.4rem" }, children: ipoStarted ? /* @__PURE__ */ jsxRuntime.jsxs(StatusSpan, { $color: "#0ecb81", children: [
9761
+ /* @__PURE__ */ jsxRuntime.jsx(StatusDot, { $color: "#0ecb81", $pulse: true }),
9762
+ "LIVE"
9763
+ ] }) : /* @__PURE__ */ jsxRuntime.jsxs(StatusSpan, { $color: statusColor || "#D4AF37", children: [
9764
+ /* @__PURE__ */ jsxRuntime.jsx(StatusDot, { $color: statusColor || "#D4AF37" }),
9765
+ statusLabel || "Preparing"
9766
+ ] }) })
9767
+ ] }),
9768
+ isPreLive ? /* @__PURE__ */ jsxRuntime.jsxs(HomePreLiveRow, { children: [
9769
+ countdown ? /* @__PURE__ */ jsxRuntime.jsxs(HomeCountdownSide, { children: [
9770
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownLabel, { children: "Opens In" }),
9771
+ /* @__PURE__ */ jsxRuntime.jsxs(CountdownDigits, { children: [
9772
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownNumber, { children: String(countdown.days).padStart(2, "0") }),
9773
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownUnitLabel, { children: "D" }),
9774
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownSeparator, { children: ":" }),
9775
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownNumber, { children: String(countdown.hours).padStart(2, "0") }),
9776
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownUnitLabel, { children: "H" }),
9777
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownSeparator, { children: ":" }),
9778
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownNumber, { children: String(countdown.minutes).padStart(2, "0") }),
9779
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownUnitLabel, { children: "M" }),
9780
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownSeparator, { children: ":" }),
9781
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownNumber, { children: String(countdown.seconds).padStart(2, "0") }),
9782
+ /* @__PURE__ */ jsxRuntime.jsx(CountdownUnitLabel, { children: "S" })
9783
+ ] })
9784
+ ] }) : /* @__PURE__ */ jsxRuntime.jsx(HomeCountdownSide, { children: /* @__PURE__ */ jsxRuntime.jsx(PreLiveStatus, { $statusColor: statusColor, children: "Sale Not Yet Open" }) }),
9785
+ /* @__PURE__ */ jsxRuntime.jsxs(HomeUnitsSide, { children: [
9786
+ /* @__PURE__ */ jsxRuntime.jsx(HomeUnitsLabel, { children: "Units Subscribed" }),
9787
+ /* @__PURE__ */ jsxRuntime.jsxs(HomeUnitsValue, { children: [
9788
+ /* @__PURE__ */ jsxRuntime.jsx(HomeSpinner, {}),
9789
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
9790
+ " / ",
9791
+ supplyToSell.toLocaleString()
9792
+ ] })
9793
+ ] })
9794
+ ] })
9795
+ ] }) : /* @__PURE__ */ jsxRuntime.jsxs(LiveBody, { children: [
9796
+ /* @__PURE__ */ jsxRuntime.jsxs(LiveTopRow, { children: [
9797
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
9798
+ /* @__PURE__ */ jsxRuntime.jsxs(LiveLabel, { children: [
9799
+ "Offering Subscribed ",
9800
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: "\u24D8" })
9801
+ ] }),
9802
+ /* @__PURE__ */ jsxRuntime.jsxs(LivePercent, { children: [
9803
+ percentSold.toFixed(1),
9804
+ "%",
9805
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "arrow", children: "\u2191" })
9806
+ ] })
9807
+ ] }),
9808
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { textAlign: "right" }, children: [
9809
+ /* @__PURE__ */ jsxRuntime.jsx(LiveLabel, { children: "Units Subscribed" }),
9810
+ /* @__PURE__ */ jsxRuntime.jsxs(UnitsValue, { children: [
9811
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: totalSold.toLocaleString() }),
9812
+ /* @__PURE__ */ jsxRuntime.jsxs("small", { children: [
9813
+ "/ ",
9814
+ supplyToSell.toLocaleString()
9815
+ ] })
9816
+ ] })
9817
+ ] })
9818
+ ] }),
9819
+ /* @__PURE__ */ jsxRuntime.jsx(ProgressBarOuter, { children: /* @__PURE__ */ jsxRuntime.jsx(ProgressBarInner, { style: { width: `${Math.min(percentSold, 100)}%` } }) }),
9820
+ /* @__PURE__ */ jsxRuntime.jsxs(ProgressInfo, { children: [
9821
+ /* @__PURE__ */ jsxRuntime.jsxs(ProgressSubscribers, { children: [
9822
+ "Subscribers: ",
9823
+ subscriberCount.toLocaleString()
9824
+ ] }),
9825
+ /* @__PURE__ */ jsxRuntime.jsxs(ProgressAmounts, { children: [
9826
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "raised", children: formatCurrency3(computedRaised) }),
9827
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "target", children: [
9828
+ " / ",
9829
+ formatCurrency3(computedTarget)
9830
+ ] })
9831
+ ] })
9832
+ ] })
9833
+ ] })
9834
+ ] });
9835
+ }
9658
9836
  return /* @__PURE__ */ jsxRuntime.jsxs(Container, { style, className, children: [
9659
9837
  /* @__PURE__ */ jsxRuntime.jsxs(Header2, { children: [
9660
9838
  /* @__PURE__ */ jsxRuntime.jsxs("h3", { children: [
@@ -9723,7 +9901,7 @@ function OfferingProgressCard({
9723
9901
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "\u24D8" })
9724
9902
  ] }),
9725
9903
  /* @__PURE__ */ jsxRuntime.jsxs(LivePercent, { children: [
9726
- percentSold < 0.1 && percentSold > 0 ? percentSold.toFixed(3) : percentSold.toFixed(1),
9904
+ percentSold.toFixed(1),
9727
9905
  "%",
9728
9906
  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "arrow", children: "\u2191" })
9729
9907
  ] })
@@ -9956,6 +10134,59 @@ var ProgressAmounts = styled25__default.default.div`
9956
10134
  .raised { color: #D4AF37; }
9957
10135
  .target { color: rgba(255,255,255,0.3); }
9958
10136
  `;
10137
+ var CompactContainer = styled25__default.default.div`
10138
+ width: 100%;
10139
+ margin: 1.5rem 0;
10140
+ display: flex;
10141
+ flex-direction: column;
10142
+ gap: 0.5rem;
10143
+ `;
10144
+ var HomePreLiveRow = styled25__default.default.div`
10145
+ display: flex;
10146
+ align-items: center;
10147
+ justify-content: space-between;
10148
+ padding-top: 1rem;
10149
+ `;
10150
+ var HomeCountdownSide = styled25__default.default.div`
10151
+ display: flex;
10152
+ flex-direction: column;
10153
+ align-items: center;
10154
+ flex: 1;
10155
+ `;
10156
+ var HomeUnitsSide = styled25__default.default.div`
10157
+ text-align: center;
10158
+ flex-shrink: 0;
10159
+ `;
10160
+ var HomeUnitsLabel = styled25__default.default.div`
10161
+ font-size: 0.6rem;
10162
+ color: var(--color-text-secondary);
10163
+ text-transform: uppercase;
10164
+ letter-spacing: 0.1em;
10165
+ margin-bottom: 0.2rem;
10166
+ `;
10167
+ var HomeUnitsValue = styled25__default.default.div`
10168
+ font-size: 1.1rem;
10169
+ font-weight: 700;
10170
+ font-family: monospace;
10171
+ span {
10172
+ color: var(--color-text-secondary);
10173
+ font-weight: 400;
10174
+ }
10175
+ `;
10176
+ var HomeSpinner = styled25__default.default.span`
10177
+ display: inline-block;
10178
+ width: 14px;
10179
+ height: 14px;
10180
+ border: 2px solid rgba(255, 255, 255, 0.1);
10181
+ border-top-color: var(--color-accent, #f0b90b);
10182
+ border-radius: 50%;
10183
+ animation: homeSpin 1s linear infinite;
10184
+ vertical-align: middle;
10185
+ margin-right: 0.15rem;
10186
+ @keyframes homeSpin {
10187
+ to { transform: rotate(360deg); }
10188
+ }
10189
+ `;
9959
10190
  var MAX_DISPLAY_AMOUNT = 6e4;
9960
10191
  var formatCurrency4 = (amount) => {
9961
10192
  if (amount >= 1e6) return `$${(amount / 1e6).toFixed(2)}M`;
@@ -11633,7 +11864,7 @@ function PortfolioActivityPanel({
11633
11864
  formatTimestamp(trade.executedAt)
11634
11865
  ] })
11635
11866
  ] }),
11636
- trade.status === "SETTLEMENT_FAILED" ? /* @__PURE__ */ jsxRuntime.jsx(ActivityTag, { $color: "#f6465d", $bg: "rgba(246,70,93,0.12)", children: "Failed" }) : /* @__PURE__ */ jsxRuntime.jsx(
11867
+ /* @__PURE__ */ jsxRuntime.jsx(
11637
11868
  ActivityTag,
11638
11869
  {
11639
11870
  $color: trade.side === "SELL" ? "#f6465d" : "#0ecb81",
@@ -13712,7 +13943,7 @@ function PropertyValuation({
13712
13943
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: "0.5rem" }, children: [
13713
13944
  /* @__PURE__ */ jsxRuntime.jsxs(PricingModelDetail, { children: [
13714
13945
  /* @__PURE__ */ jsxRuntime.jsx(PropertyDetailLabel, { children: "Last Price" }),
13715
- /* @__PURE__ */ jsxRuntime.jsx(PricingDetailValue, { children: formatCompact(lastPrice) })
13946
+ /* @__PURE__ */ jsxRuntime.jsx(PricingDetailValue, { children: formatCurrency6(lastPrice) })
13716
13947
  ] }),
13717
13948
  /* @__PURE__ */ jsxRuntime.jsxs(PricingModelDetail, { children: [
13718
13949
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", width: "100%" }, children: [
@@ -13723,11 +13954,11 @@ function PropertyValuation({
13723
13954
  ] })
13724
13955
  ] }),
13725
13956
  /* @__PURE__ */ jsxRuntime.jsxs(PricingDetailValue, { style: { color: "var(--color-accent)", fontWeight: "bold" }, children: [
13726
- formatCompact(fairValue),
13957
+ formatCurrency6(fairValue),
13727
13958
  " ",
13728
13959
  /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontSize: "0.85em", fontWeight: "normal", opacity: 0.8 }, children: [
13729
13960
  "(",
13730
- formatCompact(fairValue * tokensOutstanding),
13961
+ formatCurrency6(fairValue * tokensOutstanding, { maximumFractionDigits: 0 }),
13731
13962
  ")"
13732
13963
  ] })
13733
13964
  ] })
@@ -13744,7 +13975,7 @@ function PropertyValuation({
13744
13975
  /* @__PURE__ */ jsxRuntime.jsx(GaugeIndicator, { type: "fairValue", position: 50 }),
13745
13976
  /* @__PURE__ */ jsxRuntime.jsxs(GaugePriceTag, { position: gaugePosition, children: [
13746
13977
  /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Last Price" }),
13747
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: formatCompact(lastPrice) })
13978
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: formatCurrency6(lastPrice) })
13748
13979
  ] }),
13749
13980
  /* @__PURE__ */ jsxRuntime.jsx(GaugeIndicator, { type: "lastPrice", position: gaugePosition })
13750
13981
  ] }),
@@ -13752,36 +13983,36 @@ function PropertyValuation({
13752
13983
  /* @__PURE__ */ jsxRuntime.jsx(ValuationItem, { children: /* @__PURE__ */ jsxRuntime.jsxs(ValuationValue, { style: { color: "#4CAF50" }, children: [
13753
13984
  /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
13754
13985
  "< ",
13755
- formatCompact(undervaluedThreshold)
13986
+ formatCurrency6(undervaluedThreshold)
13756
13987
  ] }),
13757
13988
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "valuation-amount-span", style: { fontSize: "0.8rem", fontWeight: "normal" }, children: [
13758
13989
  "(",
13759
- formatCompact(undervaluedThreshold * tokensOutstanding),
13990
+ formatMillions(undervaluedThreshold * tokensOutstanding),
13760
13991
  ")"
13761
13992
  ] })
13762
13993
  ] }) }),
13763
13994
  /* @__PURE__ */ jsxRuntime.jsx(ValuationItem, { children: /* @__PURE__ */ jsxRuntime.jsxs(ValuationValue, { style: { color: "var(--color-accent)" }, children: [
13764
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: formatCompact(fairValue) }),
13995
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: formatCurrency6(fairValue) }),
13765
13996
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "valuation-amount-span", style: { fontSize: "0.8rem", fontWeight: "normal" }, children: [
13766
13997
  "(",
13767
- formatCompact(fairValue * tokensOutstanding),
13998
+ formatMillions(fairValue * tokensOutstanding),
13768
13999
  ")"
13769
14000
  ] })
13770
14001
  ] }) }),
13771
14002
  /* @__PURE__ */ jsxRuntime.jsx(ValuationItem, { children: /* @__PURE__ */ jsxRuntime.jsxs(ValuationValue, { style: { color: "#F44336" }, children: [
13772
14003
  /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
13773
14004
  "> ",
13774
- formatCompact(overvaluedThreshold)
14005
+ formatCurrency6(overvaluedThreshold)
13775
14006
  ] }),
13776
14007
  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "valuation-amount-span", style: { fontSize: "0.8rem", fontWeight: "normal" }, children: [
13777
14008
  "(",
13778
- formatCompact(overvaluedThreshold * tokensOutstanding),
14009
+ formatMillions(overvaluedThreshold * tokensOutstanding),
13779
14010
  ")"
13780
14011
  ] })
13781
14012
  ] }) })
13782
14013
  ] })
13783
14014
  ] }),
13784
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
14015
+ /* @__PURE__ */ jsxRuntime.jsxs(HiddenMobileChart, { children: [
13785
14016
  /* @__PURE__ */ jsxRuntime.jsx("h3", { style: { marginBottom: "1rem", fontSize: "1.1rem", color: "#fff" }, children: "Historical Valuation" }),
13786
14017
  /* @__PURE__ */ jsxRuntime.jsx(ChartContainer, { children: /* @__PURE__ */ jsxRuntime.jsxs(ChartBackground, { children: [
13787
14018
  axisLabels.map((label, index) => /* @__PURE__ */ jsxRuntime.jsx(YAxisLabel, { style: { top: `${10 + index * 22}%` }, children: label }, `${label}-${index}`)),
@@ -13900,7 +14131,15 @@ function PropertyValuation({
13900
14131
  ] })
13901
14132
  ] }) })
13902
14133
  ] })
13903
- ] })
14134
+ ] }),
14135
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "desktop-only-historical-chart", style: { marginBottom: "1rem", fontSize: "1.1rem", color: "#fff" }, children: "Historical Valuation" }),
14136
+ /* @__PURE__ */ jsxRuntime.jsx(ChartContainer, { className: "desktop-only-historical-chart", children: /* @__PURE__ */ jsxRuntime.jsxs(ChartBackground, { children: [
14137
+ axisLabels.map((label, index) => /* @__PURE__ */ jsxRuntime.jsx(YAxisLabel, { style: { top: `${10 + index * 22}%` }, children: label }, `${label}-${index}`)),
14138
+ /* @__PURE__ */ jsxRuntime.jsxs(ValuationSvg, { viewBox: `0 0 ${CHART_WIDTH} ${CHART_HEIGHT}`, preserveAspectRatio: "none", children: [
14139
+ valuationPath ? /* @__PURE__ */ jsxRuntime.jsx("path", { d: valuationPath, fill: "none", stroke: "#D4AF37", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", vectorEffect: "non-scaling-stroke" }) : null,
14140
+ fairValuePath ? /* @__PURE__ */ jsxRuntime.jsx("path", { d: fairValuePath, fill: "none", stroke: "#FFFFFF", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", vectorEffect: "non-scaling-stroke" }) : null
14141
+ ] })
14142
+ ] }) })
13904
14143
  ] })
13905
14144
  ] }),
13906
14145
  /* @__PURE__ */ jsxRuntime.jsxs(RecentSalesSection, { children: [
@@ -13974,14 +14213,6 @@ function formatMillions(value) {
13974
14213
  }
13975
14214
  return `$${(value / 1e6).toFixed(2)}m`;
13976
14215
  }
13977
- function formatCompact(value) {
13978
- if (value == null || !Number.isFinite(value)) return "\u2014";
13979
- const abs = Math.abs(value);
13980
- if (abs >= 1e9) return `$${(value / 1e9).toFixed(2)}B`;
13981
- if (abs >= 1e6) return `$${(value / 1e6).toFixed(2)}M`;
13982
- if (abs >= 1e3) return `$${(value / 1e3).toFixed(1)}K`;
13983
- return formatCurrency6(value);
13984
- }
13985
14216
  function formatBedroomLabel(bedrooms) {
13986
14217
  if (!Number.isFinite(bedrooms)) return "\u2014";
13987
14218
  return `${bedrooms} Bed`;
@@ -14105,6 +14336,12 @@ var GaugePriceTag = styled25__default.default.div`
14105
14336
  color: var(--color-accent);
14106
14337
  }
14107
14338
  `;
14339
+ var HiddenMobileChart = styled25__default.default.div`
14340
+ display: none;
14341
+ @media (max-width: 480px) {
14342
+ display: block;
14343
+ }
14344
+ `;
14108
14345
  var ValuationWrapper = styled25__default.default.div`
14109
14346
  display: flex;
14110
14347
  flex-direction: column;
@@ -14156,10 +14393,9 @@ var PricingModelCard = styled25__default.default.div`
14156
14393
  var PricingModelHeader = styled25__default.default.div`
14157
14394
  display: flex;
14158
14395
  justify-content: space-between;
14159
- align-items: flex-start;
14396
+ align-items: center;
14160
14397
  margin-bottom: 1.5rem;
14161
14398
  gap: 1rem;
14162
- flex-wrap: wrap;
14163
14399
 
14164
14400
  .valuation-info {
14165
14401
  display: flex;
@@ -14167,7 +14403,6 @@ var PricingModelHeader = styled25__default.default.div`
14167
14403
  gap: 0.25rem;
14168
14404
  font-size: 0.85rem;
14169
14405
  color: rgba(255, 255, 255, 0.75);
14170
- flex-shrink: 0;
14171
14406
  }
14172
14407
  `;
14173
14408
  var PricingModelTitle = styled25__default.default.h3`
@@ -14234,31 +14469,15 @@ var ValuationDetails = styled25__default.default.div`
14234
14469
  display: flex;
14235
14470
  justify-content: space-between;
14236
14471
  margin-top: 1rem;
14237
- gap: 0.25rem;
14238
14472
  `;
14239
14473
  var ValuationItem = styled25__default.default.div`
14240
14474
  display: flex;
14241
14475
  flex-direction: column;
14242
- min-width: 0;
14243
- overflow: hidden;
14244
14476
  `;
14245
14477
  var ValuationValue = styled25__default.default.div`
14246
14478
  font-size: 1rem;
14247
14479
  font-weight: 600;
14248
14480
  color: #fff;
14249
- display: flex;
14250
- flex-direction: column;
14251
- gap: 2px;
14252
- overflow-wrap: break-word;
14253
- word-break: break-word;
14254
-
14255
- @media (max-width: 480px) {
14256
- font-size: 0.72rem;
14257
-
14258
- .valuation-amount-span {
14259
- display: none;
14260
- }
14261
- }
14262
14481
  `;
14263
14482
  var ChartContainer = styled25__default.default.div`
14264
14483
  width: 100%;