@loafmarkets/ui 0.1.53 → 0.1.55
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.d.mts +2 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +129 -9
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +129 -9
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -2722,17 +2722,30 @@ var PropertyNewsUpdates = React5.forwardRef(
|
|
|
2722
2722
|
const isHomeVariant = variant === "home";
|
|
2723
2723
|
const resolvedHeading = heading ?? (isPurchaseVariant ? "Live Purchases" : "Property News & Headlines");
|
|
2724
2724
|
const [homeTab, setHomeTab] = React5.useState("all");
|
|
2725
|
+
const [homePage, setHomePage] = React5.useState(0);
|
|
2725
2726
|
const purchaseItems = purchasesProp ?? [];
|
|
2726
2727
|
const [page, setPage] = React5.useState(0);
|
|
2727
2728
|
React5.useEffect(() => {
|
|
2728
2729
|
ensureAnimationsInjected();
|
|
2729
2730
|
}, []);
|
|
2731
|
+
React5.useEffect(() => {
|
|
2732
|
+
setHomePage(0);
|
|
2733
|
+
}, [homeTab]);
|
|
2730
2734
|
const hasItems = Array.isArray(items) && items.length > 0;
|
|
2731
2735
|
const totalPages = React5.useMemo(() => hasItems ? Math.max(1, Math.ceil(items.length / ITEMS_PER_PAGE)) : 1, [hasItems, items.length]);
|
|
2732
2736
|
React5.useEffect(() => {
|
|
2733
2737
|
setPage((prev) => Math.min(prev, totalPages - 1));
|
|
2734
2738
|
}, [totalPages]);
|
|
2735
2739
|
const paginatedItems = hasItems ? items.slice(page * ITEMS_PER_PAGE, page * ITEMS_PER_PAGE + ITEMS_PER_PAGE) : [];
|
|
2740
|
+
const homeFilteredItems = React5.useMemo(
|
|
2741
|
+
() => hasItems ? items.filter((it) => homeTab === "all" || it.type === homeTab) : [],
|
|
2742
|
+
[hasItems, items, homeTab]
|
|
2743
|
+
);
|
|
2744
|
+
const homeTotalPages = React5.useMemo(
|
|
2745
|
+
() => Math.max(1, Math.ceil(homeFilteredItems.length / ITEMS_PER_PAGE)),
|
|
2746
|
+
[homeFilteredItems.length]
|
|
2747
|
+
);
|
|
2748
|
+
const homePaginatedItems = homeFilteredItems.slice(homePage * ITEMS_PER_PAGE, (homePage + 1) * ITEMS_PER_PAGE);
|
|
2736
2749
|
return /* @__PURE__ */ jsxs(
|
|
2737
2750
|
"div",
|
|
2738
2751
|
{
|
|
@@ -2913,26 +2926,46 @@ var PropertyNewsUpdates = React5.forwardRef(
|
|
|
2913
2926
|
}
|
|
2914
2927
|
),
|
|
2915
2928
|
/* @__PURE__ */ jsx("span", { style: { fontSize: "0.8rem", color: "rgba(255,255,255,0.4)" }, children: "Awaiting offering..." })
|
|
2916
|
-
] }) : isHomeVariant ? hasItems ?
|
|
2929
|
+
] }) : isHomeVariant ? hasItems ? homePaginatedItems.map((item, index) => {
|
|
2917
2930
|
const key = item.displayId ?? item.id ?? `${item.title}-${index}`;
|
|
2918
2931
|
const tagType = item.type;
|
|
2919
2932
|
const isProperty = tagType === "property";
|
|
2920
2933
|
return /* @__PURE__ */ jsxs(
|
|
2921
|
-
"
|
|
2934
|
+
"a",
|
|
2922
2935
|
{
|
|
2936
|
+
href: item.url ?? "#",
|
|
2937
|
+
target: "_blank",
|
|
2938
|
+
rel: "noopener noreferrer",
|
|
2923
2939
|
style: {
|
|
2924
2940
|
display: "flex",
|
|
2925
2941
|
justifyContent: "space-between",
|
|
2926
2942
|
alignItems: "center",
|
|
2927
2943
|
padding: "0.75rem 0",
|
|
2928
|
-
borderBottom: index <
|
|
2929
|
-
cursor: "pointer"
|
|
2944
|
+
borderBottom: index < homePaginatedItems.length - 1 ? "1px solid rgba(255,255,255,0.05)" : "none",
|
|
2945
|
+
cursor: "pointer",
|
|
2946
|
+
textDecoration: "none",
|
|
2947
|
+
color: "inherit"
|
|
2930
2948
|
},
|
|
2931
2949
|
children: [
|
|
2932
2950
|
/* @__PURE__ */ jsxs("div", { style: { flex: 1 }, children: [
|
|
2933
2951
|
/* @__PURE__ */ jsx("h3", { style: { fontSize: "0.85rem", fontWeight: 400, marginBottom: "0.25rem", color: "#f8f9fa", lineHeight: 1.4 }, children: item.title }),
|
|
2934
|
-
/* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "0.
|
|
2952
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "0.5rem", alignItems: "center", flexWrap: "wrap" }, children: [
|
|
2935
2953
|
/* @__PURE__ */ jsx("span", { style: { color: "#848e9c", fontSize: "0.7rem" }, children: typeof item.date === "string" ? item.date : formatDate(item.date) }),
|
|
2954
|
+
item.source && /* @__PURE__ */ jsx(
|
|
2955
|
+
"span",
|
|
2956
|
+
{
|
|
2957
|
+
style: {
|
|
2958
|
+
padding: "0.1rem 0.4rem",
|
|
2959
|
+
borderRadius: "3px",
|
|
2960
|
+
fontSize: "0.62rem",
|
|
2961
|
+
fontWeight: 500,
|
|
2962
|
+
backgroundColor: "rgba(255,255,255,0.07)",
|
|
2963
|
+
color: "#848e9c",
|
|
2964
|
+
whiteSpace: "nowrap"
|
|
2965
|
+
},
|
|
2966
|
+
children: item.source
|
|
2967
|
+
}
|
|
2968
|
+
),
|
|
2936
2969
|
/* @__PURE__ */ jsx(
|
|
2937
2970
|
"span",
|
|
2938
2971
|
{
|
|
@@ -2972,7 +3005,22 @@ var PropertyNewsUpdates = React5.forwardRef(
|
|
|
2972
3005
|
animation: item.isNew ? "propertyNewsSlideIn 0.5s ease-out" : void 0
|
|
2973
3006
|
},
|
|
2974
3007
|
children: [
|
|
2975
|
-
/* @__PURE__ */ jsx("p", { style: { fontSize: "0.9375rem", fontWeight: 500, marginBottom: "0.35rem" }, children: item.
|
|
3008
|
+
/* @__PURE__ */ jsx("p", { style: { fontSize: "0.9375rem", fontWeight: 500, marginBottom: "0.35rem" }, children: item.url ? /* @__PURE__ */ jsx(
|
|
3009
|
+
"a",
|
|
3010
|
+
{
|
|
3011
|
+
href: item.url,
|
|
3012
|
+
target: "_blank",
|
|
3013
|
+
rel: "noopener noreferrer",
|
|
3014
|
+
style: { color: "inherit", textDecoration: "none" },
|
|
3015
|
+
onMouseEnter: (e) => {
|
|
3016
|
+
e.currentTarget.style.textDecoration = "underline";
|
|
3017
|
+
},
|
|
3018
|
+
onMouseLeave: (e) => {
|
|
3019
|
+
e.currentTarget.style.textDecoration = "none";
|
|
3020
|
+
},
|
|
3021
|
+
children: item.title
|
|
3022
|
+
}
|
|
3023
|
+
) : item.title }),
|
|
2976
3024
|
/* @__PURE__ */ jsxs(
|
|
2977
3025
|
"div",
|
|
2978
3026
|
{
|
|
@@ -2981,10 +3029,31 @@ var PropertyNewsUpdates = React5.forwardRef(
|
|
|
2981
3029
|
justifyContent: "space-between",
|
|
2982
3030
|
alignItems: "center",
|
|
2983
3031
|
fontSize: "0.75rem",
|
|
2984
|
-
color: "#b5b8c5"
|
|
3032
|
+
color: "#b5b8c5",
|
|
3033
|
+
gap: "0.5rem"
|
|
2985
3034
|
},
|
|
2986
3035
|
children: [
|
|
2987
|
-
/* @__PURE__ */
|
|
3036
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem", minWidth: 0 }, children: [
|
|
3037
|
+
/* @__PURE__ */ jsx("span", { style: { color: isHighlighted ? "#0ecb81" : "inherit", whiteSpace: "nowrap" }, children: dateLabel }),
|
|
3038
|
+
item.source && /* @__PURE__ */ jsx(
|
|
3039
|
+
"span",
|
|
3040
|
+
{
|
|
3041
|
+
style: {
|
|
3042
|
+
padding: "0.15rem 0.45rem",
|
|
3043
|
+
borderRadius: "3px",
|
|
3044
|
+
fontSize: "0.65rem",
|
|
3045
|
+
fontWeight: 500,
|
|
3046
|
+
backgroundColor: "rgba(255,255,255,0.07)",
|
|
3047
|
+
color: "#848e9c",
|
|
3048
|
+
whiteSpace: "nowrap",
|
|
3049
|
+
overflow: "hidden",
|
|
3050
|
+
textOverflow: "ellipsis",
|
|
3051
|
+
maxWidth: "120px"
|
|
3052
|
+
},
|
|
3053
|
+
children: item.source
|
|
3054
|
+
}
|
|
3055
|
+
)
|
|
3056
|
+
] }),
|
|
2988
3057
|
/* @__PURE__ */ jsx(
|
|
2989
3058
|
"span",
|
|
2990
3059
|
{
|
|
@@ -2996,7 +3065,9 @@ var PropertyNewsUpdates = React5.forwardRef(
|
|
|
2996
3065
|
color: styles2.color,
|
|
2997
3066
|
fontSize: "0.68rem",
|
|
2998
3067
|
fontWeight: 600,
|
|
2999
|
-
textTransform: "uppercase"
|
|
3068
|
+
textTransform: "uppercase",
|
|
3069
|
+
whiteSpace: "nowrap",
|
|
3070
|
+
flexShrink: 0
|
|
3000
3071
|
},
|
|
3001
3072
|
children: item.type === "property" ? styles2.label : "Market News"
|
|
3002
3073
|
}
|
|
@@ -3014,6 +3085,55 @@ var PropertyNewsUpdates = React5.forwardRef(
|
|
|
3014
3085
|
] })
|
|
3015
3086
|
}
|
|
3016
3087
|
),
|
|
3088
|
+
isHomeVariant && homeTotalPages > 1 ? /* @__PURE__ */ jsxs("div", { className: "mt-3 flex items-center justify-between text-xs text-white/60", children: [
|
|
3089
|
+
/* @__PURE__ */ jsx(
|
|
3090
|
+
"button",
|
|
3091
|
+
{
|
|
3092
|
+
type: "button",
|
|
3093
|
+
onClick: () => setHomePage((prev) => Math.max(0, prev - 1)),
|
|
3094
|
+
disabled: homePage === 0,
|
|
3095
|
+
style: {
|
|
3096
|
+
background: "transparent",
|
|
3097
|
+
border: "1px solid rgba(255,255,255,0.15)",
|
|
3098
|
+
borderRadius: "999px",
|
|
3099
|
+
padding: "0.2rem 0.75rem",
|
|
3100
|
+
fontSize: "0.7rem",
|
|
3101
|
+
textTransform: "uppercase",
|
|
3102
|
+
letterSpacing: "0.15em",
|
|
3103
|
+
cursor: homePage === 0 ? "not-allowed" : "pointer",
|
|
3104
|
+
opacity: homePage === 0 ? 0.4 : 1,
|
|
3105
|
+
color: "rgba(255,255,255,0.6)"
|
|
3106
|
+
},
|
|
3107
|
+
children: "Prev"
|
|
3108
|
+
}
|
|
3109
|
+
),
|
|
3110
|
+
/* @__PURE__ */ jsxs("span", { style: { fontSize: "0.7rem", color: "rgba(255,255,255,0.5)" }, children: [
|
|
3111
|
+
homePage + 1,
|
|
3112
|
+
" / ",
|
|
3113
|
+
homeTotalPages
|
|
3114
|
+
] }),
|
|
3115
|
+
/* @__PURE__ */ jsx(
|
|
3116
|
+
"button",
|
|
3117
|
+
{
|
|
3118
|
+
type: "button",
|
|
3119
|
+
onClick: () => setHomePage((prev) => Math.min(homeTotalPages - 1, prev + 1)),
|
|
3120
|
+
disabled: homePage >= homeTotalPages - 1,
|
|
3121
|
+
style: {
|
|
3122
|
+
background: "transparent",
|
|
3123
|
+
border: "1px solid rgba(255,255,255,0.15)",
|
|
3124
|
+
borderRadius: "999px",
|
|
3125
|
+
padding: "0.2rem 0.75rem",
|
|
3126
|
+
fontSize: "0.7rem",
|
|
3127
|
+
textTransform: "uppercase",
|
|
3128
|
+
letterSpacing: "0.15em",
|
|
3129
|
+
cursor: homePage >= homeTotalPages - 1 ? "not-allowed" : "pointer",
|
|
3130
|
+
opacity: homePage >= homeTotalPages - 1 ? 0.4 : 1,
|
|
3131
|
+
color: "rgba(255,255,255,0.6)"
|
|
3132
|
+
},
|
|
3133
|
+
children: "Next"
|
|
3134
|
+
}
|
|
3135
|
+
)
|
|
3136
|
+
] }) : null,
|
|
3017
3137
|
!isPurchaseVariant && !isHomeVariant && hasItems && totalPages > 1 ? /* @__PURE__ */ jsxs("div", { className: "mt-4 flex items-center justify-between text-xs text-white/60", children: [
|
|
3018
3138
|
/* @__PURE__ */ jsx(
|
|
3019
3139
|
"button",
|