@loafmarkets/ui 0.1.64 → 0.1.66

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
@@ -7,6 +7,7 @@ var clsx = require('clsx');
7
7
  var tailwindMerge = require('tailwind-merge');
8
8
  var jsxRuntime = require('react/jsx-runtime');
9
9
  var styled25 = require('styled-components');
10
+ var ReactDOM = require('react-dom');
10
11
  var lucideReact = require('lucide-react');
11
12
  var LightweightCharts = require('lightweight-charts');
12
13
  var bi = require('react-icons/bi');
@@ -35,6 +36,7 @@ function _interopNamespace(e) {
35
36
 
36
37
  var React5__namespace = /*#__PURE__*/_interopNamespace(React5);
37
38
  var styled25__default = /*#__PURE__*/_interopDefault(styled25);
39
+ var ReactDOM__namespace = /*#__PURE__*/_interopNamespace(ReactDOM);
38
40
  var LightweightCharts__namespace = /*#__PURE__*/_interopNamespace(LightweightCharts);
39
41
 
40
42
  // src/components/button.tsx
@@ -2700,19 +2702,16 @@ var ensureAnimationsInjected = () => {
2700
2702
  50% { opacity: 1; transform: scale(1); }
2701
2703
  100% { opacity: 0.6; transform: scale(0.9); }
2702
2704
  }
2703
-
2704
2705
  @keyframes propertyNewsSlideIn {
2705
2706
  from { transform: translateY(-6px); opacity: 0; }
2706
2707
  to { transform: translateY(0); opacity: 1; }
2707
2708
  }
2708
-
2709
2709
  @keyframes propertyNewsSpin {
2710
2710
  to { transform: rotate(360deg); }
2711
2711
  }
2712
-
2713
- @keyframes propertyNewsFadeIn {
2714
- from { opacity: 0; max-height: 0; }
2715
- to { opacity: 1; max-height: 300px; }
2712
+ @keyframes propertyNewsModalIn {
2713
+ from { opacity: 0; transform: translateY(12px) scale(0.98); }
2714
+ to { opacity: 1; transform: translateY(0) scale(1); }
2716
2715
  }
2717
2716
  `;
2718
2717
  document.head.appendChild(style);
@@ -2734,11 +2733,7 @@ var categoryStyles = {
2734
2733
  var formatDate = (value) => {
2735
2734
  if (typeof value === "string") return value;
2736
2735
  if (!(value instanceof Date) || Number.isNaN(value.getTime())) return "";
2737
- return value.toLocaleDateString(void 0, {
2738
- month: "short",
2739
- day: "numeric",
2740
- year: "numeric"
2741
- });
2736
+ return value.toLocaleDateString(void 0, { month: "short", day: "numeric", year: "numeric" });
2742
2737
  };
2743
2738
  var formatTimeAgo = (timestamp) => {
2744
2739
  const diff = (Date.now() - new Date(timestamp).getTime()) / 1e3;
@@ -2752,24 +2747,137 @@ function getSentimentInfo(score) {
2752
2747
  if (score < -0.15) return { arrow: "\u25BC", label: "Bearish", color: "#f6465d" };
2753
2748
  return { arrow: "\u2014", label: "Neutral", color: "#848e9c" };
2754
2749
  }
2755
- function ChevronIcon({ isOpen }) {
2756
- return /* @__PURE__ */ jsxRuntime.jsx(
2757
- "svg",
2750
+ function NewsArticleModal({ item, onClose }) {
2751
+ const sentimentInfo = getSentimentInfo(item.sentimentScore);
2752
+ const catStyle = categoryStyles[item.type] ?? categoryStyles.market;
2753
+ React5__namespace.useEffect(() => {
2754
+ const handler = (e) => {
2755
+ if (e.key === "Escape") onClose();
2756
+ };
2757
+ document.addEventListener("keydown", handler);
2758
+ document.body.style.overflow = "hidden";
2759
+ return () => {
2760
+ document.removeEventListener("keydown", handler);
2761
+ document.body.style.overflow = "";
2762
+ };
2763
+ }, [onClose]);
2764
+ const modal = /* @__PURE__ */ jsxRuntime.jsx(
2765
+ "div",
2758
2766
  {
2759
- xmlns: "http://www.w3.org/2000/svg",
2760
- width: "14",
2761
- height: "14",
2762
- viewBox: "0 0 24 24",
2763
- fill: "currentColor",
2764
2767
  style: {
2765
- color: "rgba(255,255,255,0.4)",
2766
- transition: "transform 0.2s",
2767
- transform: isOpen ? "rotate(90deg)" : "rotate(0deg)",
2768
- flexShrink: 0
2768
+ position: "fixed",
2769
+ inset: 0,
2770
+ background: "rgba(0,0,0,0.72)",
2771
+ zIndex: 9999,
2772
+ display: "flex",
2773
+ alignItems: "center",
2774
+ justifyContent: "center",
2775
+ padding: "1rem"
2769
2776
  },
2770
- children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z" })
2777
+ onClick: onClose,
2778
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
2779
+ "div",
2780
+ {
2781
+ style: {
2782
+ background: "#1c1c1c",
2783
+ border: "1px solid rgba(255,255,255,0.12)",
2784
+ borderRadius: "14px",
2785
+ padding: "1.5rem",
2786
+ maxWidth: "540px",
2787
+ width: "100%",
2788
+ maxHeight: "80vh",
2789
+ overflowY: "auto",
2790
+ boxShadow: "0 24px 64px rgba(0,0,0,0.6)",
2791
+ animation: "propertyNewsModalIn 0.22s ease-out"
2792
+ },
2793
+ onClick: (e) => e.stopPropagation(),
2794
+ children: [
2795
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", justifyContent: "flex-end", marginBottom: "0.75rem" }, children: /* @__PURE__ */ jsxRuntime.jsx(
2796
+ "button",
2797
+ {
2798
+ type: "button",
2799
+ onClick: onClose,
2800
+ style: {
2801
+ background: "rgba(255,255,255,0.07)",
2802
+ border: "none",
2803
+ borderRadius: "6px",
2804
+ cursor: "pointer",
2805
+ color: "rgba(255,255,255,0.6)",
2806
+ padding: "0.3rem 0.5rem",
2807
+ lineHeight: 1,
2808
+ display: "flex",
2809
+ alignItems: "center"
2810
+ },
2811
+ children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }) })
2812
+ }
2813
+ ) }),
2814
+ sentimentInfo && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginBottom: "0.6rem" }, children: /* @__PURE__ */ jsxRuntime.jsxs(
2815
+ "span",
2816
+ {
2817
+ style: {
2818
+ display: "inline-flex",
2819
+ alignItems: "center",
2820
+ gap: "0.3rem",
2821
+ fontSize: "0.7rem",
2822
+ fontWeight: 700,
2823
+ color: sentimentInfo.color,
2824
+ padding: "0.2rem 0.55rem",
2825
+ borderRadius: "4px",
2826
+ background: `${sentimentInfo.color}1a`,
2827
+ border: `1px solid ${sentimentInfo.color}40`
2828
+ },
2829
+ children: [
2830
+ sentimentInfo.arrow,
2831
+ " ",
2832
+ sentimentInfo.label
2833
+ ]
2834
+ }
2835
+ ) }),
2836
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { style: { fontSize: "1rem", fontWeight: 600, color: "#fff", lineHeight: 1.5, margin: "0 0 1rem" }, children: item.title }),
2837
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: "0.5rem", alignItems: "center", flexWrap: "wrap", marginBottom: "1.25rem" }, children: [
2838
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.72rem", color: "#848e9c" }, children: typeof item.date === "string" ? item.date : formatDate(item.date) }),
2839
+ item.source && /* @__PURE__ */ jsxRuntime.jsx(
2840
+ "span",
2841
+ {
2842
+ style: {
2843
+ padding: "0.15rem 0.45rem",
2844
+ borderRadius: "3px",
2845
+ fontSize: "0.65rem",
2846
+ fontWeight: 500,
2847
+ background: "rgba(255,255,255,0.07)",
2848
+ color: "#848e9c"
2849
+ },
2850
+ children: item.source
2851
+ }
2852
+ ),
2853
+ /* @__PURE__ */ jsxRuntime.jsx(
2854
+ "span",
2855
+ {
2856
+ style: {
2857
+ padding: "0.2rem 0.55rem",
2858
+ borderRadius: "4px",
2859
+ border: `1px solid ${catStyle.borderColor}`,
2860
+ background: catStyle.backgroundColor,
2861
+ color: catStyle.color,
2862
+ fontSize: "0.65rem",
2863
+ fontWeight: 600,
2864
+ textTransform: "uppercase"
2865
+ },
2866
+ children: item.type === "property" ? catStyle.label : "Market News"
2867
+ }
2868
+ )
2869
+ ] }),
2870
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: "1px", background: "rgba(255,255,255,0.08)", marginBottom: "1.25rem" } }),
2871
+ item.summary ? /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "0.875rem", color: "rgba(255,255,255,0.8)", lineHeight: 1.75, margin: 0 }, children: item.summary }) : /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "0.8rem", color: "rgba(255,255,255,0.35)", fontStyle: "italic", margin: 0 }, children: "Summary not available for this article." })
2872
+ ]
2873
+ }
2874
+ )
2771
2875
  }
2772
2876
  );
2877
+ if (typeof document !== "undefined") {
2878
+ return ReactDOM__namespace.createPortal(modal, document.body);
2879
+ }
2880
+ return modal;
2773
2881
  }
2774
2882
  var PropertyNewsUpdates = React5__namespace.forwardRef(
2775
2883
  ({
@@ -2793,7 +2901,7 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
2793
2901
  const [homePage, setHomePage] = React5__namespace.useState(0);
2794
2902
  const purchaseItems = purchasesProp ?? [];
2795
2903
  const [page, setPage] = React5__namespace.useState(0);
2796
- const [expandedId, setExpandedId] = React5__namespace.useState(null);
2904
+ const [selectedItem, setSelectedItem] = React5__namespace.useState(null);
2797
2905
  React5__namespace.useEffect(() => {
2798
2906
  ensureAnimationsInjected();
2799
2907
  }, []);
@@ -2801,7 +2909,10 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
2801
2909
  setHomePage(0);
2802
2910
  }, [homeTab]);
2803
2911
  const hasItems = Array.isArray(items) && items.length > 0;
2804
- const totalPages = React5__namespace.useMemo(() => hasItems ? Math.max(1, Math.ceil(items.length / ITEMS_PER_PAGE)) : 1, [hasItems, items.length]);
2912
+ const totalPages = React5__namespace.useMemo(
2913
+ () => hasItems ? Math.max(1, Math.ceil(items.length / ITEMS_PER_PAGE)) : 1,
2914
+ [hasItems, items.length]
2915
+ );
2805
2916
  React5__namespace.useEffect(() => {
2806
2917
  setPage((prev) => Math.min(prev, totalPages - 1));
2807
2918
  }, [totalPages]);
@@ -2815,9 +2926,6 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
2815
2926
  [homeFilteredItems.length]
2816
2927
  );
2817
2928
  const homePaginatedItems = homeFilteredItems.slice(homePage * ITEMS_PER_PAGE, (homePage + 1) * ITEMS_PER_PAGE);
2818
- const toggleExpand = React5__namespace.useCallback((key) => {
2819
- setExpandedId((prev) => prev === key ? null : key);
2820
- }, []);
2821
2929
  return /* @__PURE__ */ jsxRuntime.jsxs(
2822
2930
  "div",
2823
2931
  {
@@ -2831,89 +2939,22 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
2831
2939
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
2832
2940
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [
2833
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" }) }),
2834
- isPurchaseVariant && /* @__PURE__ */ jsxRuntime.jsx(
2835
- "span",
2836
- {
2837
- style: {
2838
- display: "inline-block",
2839
- width: "8px",
2840
- height: "8px",
2841
- borderRadius: "50%",
2842
- backgroundColor: "#0ecb81",
2843
- boxShadow: "0 0 8px rgba(14,203,129,0.8)",
2844
- animation: "propertyNewsPulse 1.5s infinite"
2845
- }
2846
- }
2847
- ),
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" } }),
2848
2943
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
2849
2944
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: isHomeVariant ? "text-base font-semibold text-white" : "text-lg font-semibold text-white", children: resolvedHeading }),
2850
2945
  subheading ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-white/60", children: subheading }) : null
2851
2946
  ] })
2852
2947
  ] }),
2853
- isHomeVariant && viewAllHref ? /* @__PURE__ */ jsxRuntime.jsxs(
2854
- "a",
2855
- {
2856
- href: viewAllHref,
2857
- style: {
2858
- color: "var(--color-accent, #f0b90b)",
2859
- fontWeight: 500,
2860
- fontSize: "0.8rem",
2861
- textDecoration: "none",
2862
- display: "flex",
2863
- alignItems: "center",
2864
- gap: "0.25rem"
2865
- },
2866
- children: [
2867
- viewAllLabel,
2868
- /* @__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" }) })
2869
- ]
2870
- }
2871
- ) : !isHomeVariant && !isPurchaseVariant ? connectionStatus === "connecting" ? /* @__PURE__ */ jsxRuntime.jsxs(
2872
- "div",
2873
- {
2874
- className: "inline-flex items-center font-semibold uppercase",
2875
- style: { gap: "0.35rem", fontSize: "0.8rem", letterSpacing: "0.15em", color: "#f97316" },
2876
- children: [
2877
- /* @__PURE__ */ jsxRuntime.jsx(
2878
- "span",
2879
- {
2880
- style: {
2881
- display: "inline-block",
2882
- width: "10px",
2883
- height: "10px",
2884
- borderRadius: "50%",
2885
- border: "2px solid rgba(249,115,22,0.3)",
2886
- borderTopColor: "#f97316",
2887
- animation: "propertyNewsSpin 0.8s linear infinite"
2888
- }
2889
- }
2890
- ),
2891
- "CONNECTING"
2892
- ]
2893
- }
2894
- ) : /* @__PURE__ */ jsxRuntime.jsxs(
2895
- "div",
2896
- {
2897
- className: "inline-flex items-center font-semibold uppercase text-emerald-300",
2898
- style: { gap: "0.35rem", fontSize: "0.8rem", letterSpacing: "0.15em" },
2899
- children: [
2900
- /* @__PURE__ */ jsxRuntime.jsx(
2901
- "span",
2902
- {
2903
- style: {
2904
- display: "inline-block",
2905
- width: "6px",
2906
- height: "6px",
2907
- borderRadius: "50%",
2908
- backgroundColor: "#34d399",
2909
- animation: "propertyNewsPulse 2s infinite"
2910
- }
2911
- }
2912
- ),
2913
- "LIVE"
2914
- ]
2915
- }
2916
- ) : null
2948
+ isHomeVariant && viewAllHref ? /* @__PURE__ */ jsxRuntime.jsxs("a", { href: viewAllHref, style: { color: "var(--color-accent, #f0b90b)", fontWeight: 500, fontSize: "0.8rem", textDecoration: "none", display: "flex", alignItems: "center", gap: "0.25rem" }, children: [
2949
+ viewAllLabel,
2950
+ /* @__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" }) })
2951
+ ] }) : !isHomeVariant && !isPurchaseVariant ? connectionStatus === "connecting" ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center font-semibold uppercase", style: { gap: "0.35rem", fontSize: "0.8rem", letterSpacing: "0.15em", color: "#f97316" }, children: [
2952
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-block", width: "10px", height: "10px", borderRadius: "50%", border: "2px solid rgba(249,115,22,0.3)", borderTopColor: "#f97316", animation: "propertyNewsSpin 0.8s linear infinite" } }),
2953
+ "CONNECTING"
2954
+ ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center font-semibold uppercase text-emerald-300", style: { gap: "0.35rem", fontSize: "0.8rem", letterSpacing: "0.15em" }, children: [
2955
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "inline-block", width: "6px", height: "6px", borderRadius: "50%", backgroundColor: "#34d399", animation: "propertyNewsPulse 2s infinite" } }),
2956
+ "LIVE"
2957
+ ] }) : null
2917
2958
  ] }),
2918
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(
2919
2960
  "button",
@@ -2935,343 +2976,152 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
2935
2976
  },
2936
2977
  tab
2937
2978
  )) }),
2938
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex flex-1 flex-col gap-3 overflow-visible", children: isPurchaseVariant ? purchaseItems.length > 0 ? purchaseItems.slice(0, 7).map((purchase, index) => {
2939
- const maxAmount = 6e4;
2940
- const barPercent = Math.min(85, Math.max(15, purchase.amount / maxAmount * 100));
2941
- const isAlternate = index % 2 === 1;
2942
- return /* @__PURE__ */ jsxRuntime.jsxs(
2943
- "div",
2944
- {
2945
- style: {
2946
- display: "flex",
2947
- justifyContent: "space-between",
2948
- alignItems: "center",
2949
- padding: "0.625rem 0.75rem",
2950
- borderBottom: "1px solid rgba(255,255,255,0.05)",
2951
- position: "relative",
2952
- overflow: "hidden",
2953
- backgroundColor: isAlternate ? "rgba(255,255,255,0.03)" : "transparent"
2954
- },
2955
- children: [
2956
- /* @__PURE__ */ jsxRuntime.jsx(
2957
- "div",
2958
- {
2959
- style: {
2960
- position: "absolute",
2961
- top: 0,
2962
- right: 0,
2963
- bottom: 0,
2964
- width: `${barPercent}%`,
2965
- background: "linear-gradient(90deg, transparent 0%, rgba(14,203,129,0.15) 100%)",
2966
- pointerEvents: "none"
2967
- }
2968
- }
2969
- ),
2970
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", minWidth: 0, position: "relative" }, children: [
2971
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: 500, fontSize: "0.875rem", color: "#fff", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" }, children: purchase.name }),
2972
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.7rem", color: "var(--color-text-secondary, #848e9c)", marginTop: "0.125rem" }, children: formatTimeAgo(purchase.timestamp) })
2973
- ] }),
2974
- /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontWeight: 600, fontSize: "0.875rem", color: "#fff", whiteSpace: "nowrap", marginLeft: "1rem", position: "relative" }, children: [
2975
- "$",
2976
- purchase.amount >= 1e6 ? `${(purchase.amount / 1e6).toFixed(2)}M` : Math.round(purchase.amount).toLocaleString()
2977
- ] })
2978
- ]
2979
- },
2980
- purchase.id
2981
- );
2982
- }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", padding: "3rem 0", gap: "0.75rem" }, children: [
2983
- /* @__PURE__ */ jsxRuntime.jsx(
2984
- "div",
2985
- {
2986
- style: {
2987
- width: "28px",
2988
- height: "28px",
2989
- border: "3px solid rgba(255,255,255,0.1)",
2990
- borderTopColor: "var(--color-accent, #f0b90b)",
2991
- borderRadius: "50%",
2992
- animation: "propertyNewsSpin 1s linear infinite"
2993
- }
2994
- }
2995
- ),
2996
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.8rem", color: "rgba(255,255,255,0.4)" }, children: "Awaiting offering..." })
2997
- ] }) : isHomeVariant ? hasItems ? homePaginatedItems.map((item, index) => {
2998
- const key = item.displayId ?? item.id ?? `${item.title}-${index}`;
2999
- const tagType = item.type;
3000
- const isProperty = tagType === "property";
3001
- const sentimentInfo = getSentimentInfo(item.sentimentScore);
3002
- const isExpanded = expandedId === key;
3003
- return /* @__PURE__ */ jsxRuntime.jsxs(
3004
- "div",
3005
- {
3006
- style: {
3007
- padding: "0.75rem 0",
3008
- borderBottom: index < homePaginatedItems.length - 1 ? "1px solid rgba(255,255,255,0.05)" : "none"
3009
- },
3010
- children: [
3011
- /* @__PURE__ */ jsxRuntime.jsxs(
3012
- "button",
3013
- {
3014
- type: "button",
3015
- onClick: () => toggleExpand(key),
3016
- style: {
3017
- width: "100%",
3018
- textAlign: "left",
3019
- background: "transparent",
3020
- border: "none",
3021
- cursor: "pointer",
3022
- padding: 0,
3023
- display: "flex",
3024
- justifyContent: "space-between",
3025
- alignItems: "flex-start",
3026
- gap: "0.5rem",
3027
- color: "inherit"
3028
- },
3029
- children: [
3030
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1 }, children: [
3031
- /* @__PURE__ */ jsxRuntime.jsx("h3", { style: { fontSize: "0.85rem", fontWeight: 400, marginBottom: "0.25rem", color: "#f8f9fa", lineHeight: 1.4 }, children: item.title }),
3032
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: "0.5rem", alignItems: "center", flexWrap: "wrap" }, children: [
3033
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#848e9c", fontSize: "0.7rem" }, children: typeof item.date === "string" ? item.date : formatDate(item.date) }),
3034
- item.source && /* @__PURE__ */ jsxRuntime.jsx(
3035
- "span",
3036
- {
3037
- style: {
3038
- padding: "0.1rem 0.4rem",
3039
- borderRadius: "3px",
3040
- fontSize: "0.62rem",
3041
- fontWeight: 500,
3042
- backgroundColor: "rgba(255,255,255,0.07)",
3043
- color: "#848e9c",
3044
- whiteSpace: "nowrap"
3045
- },
3046
- children: item.source
3047
- }
3048
- ),
3049
- /* @__PURE__ */ jsxRuntime.jsx(
3050
- "span",
3051
- {
3052
- style: {
3053
- padding: "0.15rem 0.4rem",
3054
- borderRadius: "2px",
3055
- fontSize: "0.65rem",
3056
- fontWeight: 500,
3057
- backgroundColor: isProperty ? "rgba(14,203,129,0.1)" : "rgba(240,185,11,0.1)",
3058
- color: isProperty ? "#0ecb81" : "#f0b90b"
3059
- },
3060
- children: isProperty ? "Property Update" : "Market News"
3061
- }
3062
- ),
3063
- sentimentInfo && /* @__PURE__ */ jsxRuntime.jsxs(
3064
- "span",
3065
- {
3066
- style: {
3067
- fontSize: "0.65rem",
3068
- fontWeight: 600,
3069
- color: sentimentInfo.color
3070
- },
3071
- children: [
3072
- sentimentInfo.arrow,
3073
- " ",
3074
- sentimentInfo.label
3075
- ]
3076
- }
3077
- )
2979
+ /* @__PURE__ */ jsxRuntime.jsx(
2980
+ "div",
2981
+ {
2982
+ className: "mt-4 flex flex-1 flex-col gap-3 overflow-hidden",
2983
+ style: !isPurchaseVariant && !isHomeVariant ? { minHeight: `${ITEMS_PER_PAGE * 86}px` } : void 0,
2984
+ children: isPurchaseVariant ? purchaseItems.length > 0 ? purchaseItems.slice(0, 7).map((purchase, index) => {
2985
+ const maxAmount = 6e4;
2986
+ const barPercent = Math.min(85, Math.max(15, purchase.amount / maxAmount * 100));
2987
+ const isAlternate = index % 2 === 1;
2988
+ return /* @__PURE__ */ jsxRuntime.jsxs(
2989
+ "div",
2990
+ {
2991
+ style: { display: "flex", justifyContent: "space-between", alignItems: "center", padding: "0.625rem 0.75rem", borderBottom: "1px solid rgba(255,255,255,0.05)", position: "relative", overflow: "hidden", backgroundColor: isAlternate ? "rgba(255,255,255,0.03)" : "transparent" },
2992
+ children: [
2993
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { position: "absolute", top: 0, right: 0, bottom: 0, width: `${barPercent}%`, background: "linear-gradient(90deg, transparent 0%, rgba(14,203,129,0.15) 100%)", pointerEvents: "none" } }),
2994
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", minWidth: 0, position: "relative" }, children: [
2995
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontWeight: 500, fontSize: "0.875rem", color: "#fff", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" }, children: purchase.name }),
2996
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.7rem", color: "var(--color-text-secondary, #848e9c)", marginTop: "0.125rem" }, children: formatTimeAgo(purchase.timestamp) })
2997
+ ] }),
2998
+ /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontWeight: 600, fontSize: "0.875rem", color: "#fff", whiteSpace: "nowrap", marginLeft: "1rem", position: "relative" }, children: [
2999
+ "$",
3000
+ purchase.amount >= 1e6 ? `${(purchase.amount / 1e6).toFixed(2)}M` : Math.round(purchase.amount).toLocaleString()
3001
+ ] })
3002
+ ]
3003
+ },
3004
+ purchase.id
3005
+ );
3006
+ }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", padding: "3rem 0", gap: "0.75rem" }, children: [
3007
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "28px", height: "28px", border: "3px solid rgba(255,255,255,0.1)", borderTopColor: "var(--color-accent, #f0b90b)", borderRadius: "50%", animation: "propertyNewsSpin 1s linear infinite" } }),
3008
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.8rem", color: "rgba(255,255,255,0.4)" }, children: "Awaiting offering..." })
3009
+ ] }) : isHomeVariant ? hasItems ? homePaginatedItems.map((item, index) => {
3010
+ const key = item.displayId ?? item.id ?? `${item.title}-${index}`;
3011
+ const isProperty = item.type === "property";
3012
+ const sentimentInfo = getSentimentInfo(item.sentimentScore);
3013
+ return /* @__PURE__ */ jsxRuntime.jsxs(
3014
+ "button",
3015
+ {
3016
+ type: "button",
3017
+ onClick: () => setSelectedItem(item),
3018
+ style: {
3019
+ width: "100%",
3020
+ textAlign: "left",
3021
+ background: "transparent",
3022
+ border: "none",
3023
+ cursor: "pointer",
3024
+ padding: "0.75rem 0",
3025
+ borderBottom: index < homePaginatedItems.length - 1 ? "1px solid rgba(255,255,255,0.05)" : "none",
3026
+ display: "flex",
3027
+ justifyContent: "space-between",
3028
+ alignItems: "flex-start",
3029
+ gap: "0.5rem",
3030
+ color: "inherit"
3031
+ },
3032
+ children: [
3033
+ /* @__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 }),
3035
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: "0.5rem", alignItems: "center", flexWrap: "wrap" }, children: [
3036
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#848e9c", fontSize: "0.7rem" }, children: typeof item.date === "string" ? item.date : formatDate(item.date) }),
3037
+ 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 }),
3038
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: "0.15rem 0.4rem", borderRadius: "2px", fontSize: "0.65rem", fontWeight: 500, backgroundColor: isProperty ? "rgba(14,203,129,0.1)" : "rgba(240,185,11,0.1)", color: isProperty ? "#0ecb81" : "#f0b90b" }, children: isProperty ? "Property Update" : "Market News" }),
3039
+ sentimentInfo && /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontSize: "0.65rem", fontWeight: 600, color: sentimentInfo.color }, children: [
3040
+ sentimentInfo.arrow,
3041
+ " ",
3042
+ sentimentInfo.label
3078
3043
  ] })
3079
- ] }),
3080
- /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", alignItems: "center", color: "#848e9c", marginLeft: "0.5rem", paddingTop: "2px" }, children: /* @__PURE__ */ jsxRuntime.jsx(ChevronIcon, { isOpen: isExpanded }) })
3081
- ]
3082
- }
3083
- ),
3084
- isExpanded && item.summary && /* @__PURE__ */ jsxRuntime.jsx(
3085
- "div",
3086
- {
3087
- style: {
3088
- marginTop: "0.625rem",
3089
- padding: "0.75rem",
3090
- background: "rgba(255,255,255,0.04)",
3091
- borderRadius: "6px",
3092
- borderLeft: `3px solid ${sentimentInfo?.color ?? "rgba(255,255,255,0.15)"}`,
3093
- animation: "propertyNewsSlideIn 0.2s ease-out"
3094
- },
3095
- children: /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "0.8rem", color: "rgba(255,255,255,0.72)", lineHeight: 1.65, margin: 0 }, children: item.summary })
3096
- }
3097
- ),
3098
- isExpanded && !item.summary && /* @__PURE__ */ jsxRuntime.jsx(
3099
- "div",
3100
- {
3101
- style: {
3102
- marginTop: "0.625rem",
3103
- padding: "0.6rem 0.75rem",
3104
- background: "rgba(255,255,255,0.03)",
3105
- borderRadius: "6px",
3106
- animation: "propertyNewsSlideIn 0.2s ease-out"
3107
- },
3108
- children: /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "0.78rem", color: "rgba(255,255,255,0.35)", fontStyle: "italic", margin: 0 }, children: "Summary not available for this article." })
3109
- }
3110
- )
3111
- ]
3112
- },
3113
- key
3114
- );
3115
- }) : emptyState ?? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col items-center justify-center py-10 text-center text-sm text-white/60", children: "No property news yet." }) : hasItems ? paginatedItems.map((item, index) => {
3116
- const absoluteIndex = page * ITEMS_PER_PAGE + index;
3117
- const key = item.displayId ?? item.id ?? `${item.title}-${absoluteIndex}`;
3118
- const styles2 = categoryStyles[item.type] ?? categoryStyles.market;
3119
- const dateLabel = item.isNew ?? (highlightFirst && absoluteIndex === 0) ? "Just now" : typeof item.date === "string" && item.date.trim().length > 0 ? item.date : formatDate(item.date);
3120
- const isHighlighted = item.isNew ?? (highlightFirst && absoluteIndex === 0);
3121
- const sentimentInfo = getSentimentInfo(item.sentimentScore);
3122
- const isExpanded = expandedId === key;
3123
- return /* @__PURE__ */ jsxRuntime.jsxs(
3124
- "div",
3125
- {
3126
- style: {
3127
- borderRadius: "6px",
3128
- backgroundColor: isHighlighted ? "rgba(14, 203, 129, 0.1)" : "transparent",
3129
- border: "1px solid transparent",
3130
- transition: "background-color 0.2s",
3131
- animation: item.isNew ? "propertyNewsSlideIn 0.5s ease-out" : void 0
3132
- },
3133
- children: [
3134
- /* @__PURE__ */ jsxRuntime.jsxs(
3135
- "button",
3136
- {
3137
- type: "button",
3138
- onClick: () => toggleExpand(key),
3139
- style: {
3140
- width: "100%",
3141
- textAlign: "left",
3142
- background: "transparent",
3143
- border: "none",
3144
- cursor: "pointer",
3145
- padding: "0.75rem",
3146
- display: "block",
3147
- color: "inherit"
3148
- },
3149
- children: [
3150
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "flex-start", gap: "0.5rem", marginBottom: "0.35rem" }, children: [
3151
- /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "0.9375rem", fontWeight: 500, color: "#fff", margin: 0, flex: 1, lineHeight: 1.4 }, children: item.title }),
3152
- /* @__PURE__ */ jsxRuntime.jsx(ChevronIcon, { isOpen: isExpanded })
3153
- ] }),
3154
- /* @__PURE__ */ jsxRuntime.jsxs(
3155
- "div",
3156
- {
3157
- style: {
3158
- display: "flex",
3159
- justifyContent: "space-between",
3160
- alignItems: "center",
3161
- fontSize: "0.75rem",
3162
- color: "#b5b8c5",
3163
- gap: "0.5rem"
3164
- },
3165
- children: [
3166
- /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem", minWidth: 0, flexWrap: "wrap" }, children: [
3167
- /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: isHighlighted ? "#0ecb81" : "inherit", whiteSpace: "nowrap" }, children: dateLabel }),
3168
- item.source && /* @__PURE__ */ jsxRuntime.jsx(
3169
- "span",
3170
- {
3171
- style: {
3172
- padding: "0.15rem 0.45rem",
3173
- borderRadius: "3px",
3174
- fontSize: "0.65rem",
3175
- fontWeight: 500,
3176
- backgroundColor: "rgba(255,255,255,0.07)",
3177
- color: "#848e9c",
3178
- whiteSpace: "nowrap",
3179
- overflow: "hidden",
3180
- textOverflow: "ellipsis",
3181
- maxWidth: "120px"
3182
- },
3183
- children: item.source
3184
- }
3185
- ),
3186
- sentimentInfo && /* @__PURE__ */ jsxRuntime.jsxs(
3187
- "span",
3188
- {
3189
- style: {
3190
- fontSize: "0.65rem",
3191
- fontWeight: 700,
3192
- color: sentimentInfo.color,
3193
- whiteSpace: "nowrap"
3194
- },
3195
- children: [
3196
- sentimentInfo.arrow,
3197
- " ",
3198
- sentimentInfo.label
3199
- ]
3200
- }
3201
- )
3044
+ ] })
3045
+ ] }),
3046
+ /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#848e9c", paddingTop: "2px", flexShrink: 0 }, 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: "M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z" }) }) })
3047
+ ]
3048
+ },
3049
+ key
3050
+ );
3051
+ }) : emptyState ?? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col items-center justify-center py-10 text-center text-sm text-white/60", children: "No property news yet." }) : hasItems ? paginatedItems.map((item, index) => {
3052
+ const absoluteIndex = page * ITEMS_PER_PAGE + index;
3053
+ const key = item.displayId ?? item.id ?? `${item.title}-${absoluteIndex}`;
3054
+ const catStyle = categoryStyles[item.type] ?? categoryStyles.market;
3055
+ const dateLabel = item.isNew ?? (highlightFirst && absoluteIndex === 0) ? "Just now" : typeof item.date === "string" && item.date.trim().length > 0 ? item.date : formatDate(item.date);
3056
+ const isHighlighted = item.isNew ?? (highlightFirst && absoluteIndex === 0);
3057
+ const sentimentInfo = getSentimentInfo(item.sentimentScore);
3058
+ return /* @__PURE__ */ jsxRuntime.jsx(
3059
+ "button",
3060
+ {
3061
+ type: "button",
3062
+ onClick: () => setSelectedItem(item),
3063
+ style: {
3064
+ display: "block",
3065
+ width: "100%",
3066
+ textAlign: "left",
3067
+ background: "transparent",
3068
+ border: "none",
3069
+ cursor: "pointer",
3070
+ padding: 0,
3071
+ color: "inherit"
3072
+ },
3073
+ children: /* @__PURE__ */ jsxRuntime.jsxs(
3074
+ "div",
3075
+ {
3076
+ style: {
3077
+ padding: "0.75rem",
3078
+ borderRadius: "6px",
3079
+ backgroundColor: isHighlighted ? "rgba(14, 203, 129, 0.1)" : "transparent",
3080
+ transition: "background-color 0.15s",
3081
+ animation: item.isNew ? "propertyNewsSlideIn 0.5s ease-out" : void 0
3082
+ },
3083
+ onMouseEnter: (e) => {
3084
+ if (!isHighlighted) e.currentTarget.style.backgroundColor = "rgba(255,255,255,0.04)";
3085
+ },
3086
+ onMouseLeave: (e) => {
3087
+ if (!isHighlighted) e.currentTarget.style.backgroundColor = "transparent";
3088
+ },
3089
+ children: [
3090
+ /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "0.9375rem", fontWeight: 500, marginBottom: "0.4rem", color: "#fff", lineHeight: 1.4 }, children: item.title }),
3091
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "flex-end", gap: "0.5rem" }, children: [
3092
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem", minWidth: 0, flexWrap: "wrap" }, children: [
3093
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "0.75rem", color: isHighlighted ? "#0ecb81" : "#b5b8c5", whiteSpace: "nowrap" }, children: dateLabel }),
3094
+ item.source && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: "0.15rem 0.45rem", borderRadius: "3px", fontSize: "0.65rem", fontWeight: 500, backgroundColor: "rgba(255,255,255,0.07)", color: "#848e9c", whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis", maxWidth: "120px" }, children: item.source })
3095
+ ] }),
3096
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-end", gap: "0.3rem", flexShrink: 0 }, children: [
3097
+ sentimentInfo && /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontSize: "0.65rem", fontWeight: 700, color: sentimentInfo.color, whiteSpace: "nowrap" }, children: [
3098
+ sentimentInfo.arrow,
3099
+ " ",
3100
+ sentimentInfo.label
3202
3101
  ] }),
3203
- /* @__PURE__ */ jsxRuntime.jsx(
3204
- "span",
3205
- {
3206
- style: {
3207
- padding: "0.25rem 0.6rem",
3208
- borderRadius: "4px",
3209
- border: `1px solid ${styles2.borderColor}`,
3210
- backgroundColor: styles2.backgroundColor,
3211
- color: styles2.color,
3212
- fontSize: "0.68rem",
3213
- fontWeight: 600,
3214
- textTransform: "uppercase",
3215
- whiteSpace: "nowrap",
3216
- flexShrink: 0
3217
- },
3218
- children: item.type === "property" ? styles2.label : "Market News"
3219
- }
3220
- )
3221
- ]
3222
- }
3223
- )
3224
- ]
3225
- }
3226
- ),
3227
- isExpanded && /* @__PURE__ */ jsxRuntime.jsx(
3228
- "div",
3229
- {
3230
- style: {
3231
- padding: "0 0.75rem 0.75rem",
3232
- animation: "propertyNewsSlideIn 0.2s ease-out"
3233
- },
3234
- children: item.summary ? /* @__PURE__ */ jsxRuntime.jsx(
3235
- "div",
3236
- {
3237
- style: {
3238
- padding: "0.75rem",
3239
- background: "rgba(255,255,255,0.04)",
3240
- borderRadius: "6px",
3241
- borderLeft: `3px solid ${sentimentInfo?.color ?? "rgba(255,255,255,0.15)"}`
3242
- },
3243
- children: /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "0.85rem", color: "rgba(255,255,255,0.78)", lineHeight: 1.65, margin: 0 }, children: item.summary })
3244
- }
3245
- ) : /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "0.78rem", color: "rgba(255,255,255,0.3)", fontStyle: "italic", margin: 0 }, children: "Summary not available for this article." })
3246
- }
3247
- )
3248
- ]
3249
- },
3250
- key
3251
- );
3252
- }) : emptyState ?? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center rounded-2xl border border-dashed border-white/20 px-6 py-10 text-center text-sm text-white/60", children: [
3253
- /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Newspaper, { className: "mb-3 h-8 w-8 text-white/40" }),
3254
- "No property news yet. Updates will land here as soon as we receive new intelligence."
3255
- ] }) }),
3256
- isHomeVariant && homeTotalPages > 1 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 flex items-center justify-between text-xs text-white/60", children: [
3102
+ /* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: "0.25rem 0.6rem", borderRadius: "4px", border: `1px solid ${catStyle.borderColor}`, backgroundColor: catStyle.backgroundColor, color: catStyle.color, fontSize: "0.68rem", fontWeight: 600, textTransform: "uppercase", whiteSpace: "nowrap" }, children: item.type === "property" ? catStyle.label : "Market News" })
3103
+ ] })
3104
+ ] })
3105
+ ]
3106
+ }
3107
+ )
3108
+ },
3109
+ key
3110
+ );
3111
+ }) : emptyState ?? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center justify-center rounded-2xl border border-dashed border-white/20 px-6 py-10 text-center text-sm text-white/60", children: [
3112
+ /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Newspaper, { className: "mb-3 h-8 w-8 text-white/40" }),
3113
+ "No property news yet. Updates will land here as soon as we receive new intelligence."
3114
+ ] })
3115
+ }
3116
+ ),
3117
+ isHomeVariant && homeTotalPages > 1 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 flex items-center justify-between text-xs text-white/60", children: [
3257
3118
  /* @__PURE__ */ jsxRuntime.jsx(
3258
3119
  "button",
3259
3120
  {
3260
3121
  type: "button",
3261
- onClick: () => setHomePage((prev) => Math.max(0, prev - 1)),
3122
+ onClick: () => setHomePage((p) => Math.max(0, p - 1)),
3262
3123
  disabled: homePage === 0,
3263
- style: {
3264
- background: "transparent",
3265
- border: "1px solid rgba(255,255,255,0.15)",
3266
- borderRadius: "999px",
3267
- padding: "0.2rem 0.75rem",
3268
- fontSize: "0.7rem",
3269
- textTransform: "uppercase",
3270
- letterSpacing: "0.15em",
3271
- cursor: homePage === 0 ? "not-allowed" : "pointer",
3272
- opacity: homePage === 0 ? 0.4 : 1,
3273
- color: "rgba(255,255,255,0.6)"
3274
- },
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)" },
3275
3125
  children: "Prev"
3276
3126
  }
3277
3127
  ),
@@ -3284,35 +3134,21 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
3284
3134
  "button",
3285
3135
  {
3286
3136
  type: "button",
3287
- onClick: () => setHomePage((prev) => Math.min(homeTotalPages - 1, prev + 1)),
3137
+ onClick: () => setHomePage((p) => Math.min(homeTotalPages - 1, p + 1)),
3288
3138
  disabled: homePage >= homeTotalPages - 1,
3289
- style: {
3290
- background: "transparent",
3291
- border: "1px solid rgba(255,255,255,0.15)",
3292
- borderRadius: "999px",
3293
- padding: "0.2rem 0.75rem",
3294
- fontSize: "0.7rem",
3295
- textTransform: "uppercase",
3296
- letterSpacing: "0.15em",
3297
- cursor: homePage >= homeTotalPages - 1 ? "not-allowed" : "pointer",
3298
- opacity: homePage >= homeTotalPages - 1 ? 0.4 : 1,
3299
- color: "rgba(255,255,255,0.6)"
3300
- },
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)" },
3301
3140
  children: "Next"
3302
3141
  }
3303
3142
  )
3304
- ] }) : null,
3305
- !isPurchaseVariant && !isHomeVariant && hasItems && totalPages > 1 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4 flex items-center justify-between text-xs text-white/60", children: [
3143
+ ] }),
3144
+ !isPurchaseVariant && !isHomeVariant && hasItems && totalPages > 1 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-4 flex items-center justify-between text-xs text-white/60", children: [
3306
3145
  /* @__PURE__ */ jsxRuntime.jsx(
3307
3146
  "button",
3308
3147
  {
3309
3148
  type: "button",
3310
- onClick: () => setPage((prev) => Math.max(0, prev - 1)),
3149
+ onClick: () => setPage((p) => Math.max(0, p - 1)),
3311
3150
  disabled: page === 0,
3312
- className: cn(
3313
- "rounded-full border border-white/15 px-3 py-1 uppercase tracking-[0.2em]",
3314
- page === 0 ? "opacity-40 cursor-not-allowed" : "hover:border-white/40"
3315
- ),
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"),
3316
3152
  children: "Prev"
3317
3153
  }
3318
3154
  ),
@@ -3326,16 +3162,14 @@ var PropertyNewsUpdates = React5__namespace.forwardRef(
3326
3162
  "button",
3327
3163
  {
3328
3164
  type: "button",
3329
- onClick: () => setPage((prev) => Math.min(totalPages - 1, prev + 1)),
3165
+ onClick: () => setPage((p) => Math.min(totalPages - 1, p + 1)),
3330
3166
  disabled: page >= totalPages - 1,
3331
- className: cn(
3332
- "rounded-full border border-white/15 px-3 py-1 uppercase tracking-[0.2em]",
3333
- page >= totalPages - 1 ? "opacity-40 cursor-not-allowed" : "hover:border-white/40"
3334
- ),
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"),
3335
3168
  children: "Next"
3336
3169
  }
3337
3170
  )
3338
- ] }) : null
3171
+ ] }),
3172
+ selectedItem && !isHomeVariant && !isPurchaseVariant && /* @__PURE__ */ jsxRuntime.jsx(NewsArticleModal, { item: selectedItem, onClose: () => setSelectedItem(null) })
3339
3173
  ]
3340
3174
  }
3341
3175
  );