@loafmarkets/ui 0.1.356 → 0.1.357
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 +1 -3
- package/dist/index.d.ts +1 -3
- package/dist/index.js +3 -210
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +3 -210
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -9012,15 +9012,12 @@ function PropertyOverview({
|
|
|
9012
9012
|
contractAddress,
|
|
9013
9013
|
chain = "Base (Ethereum L2)",
|
|
9014
9014
|
volume24h,
|
|
9015
|
-
openOrdersValue,
|
|
9016
|
-
holderCount,
|
|
9017
9015
|
priceHistory: priceHistoryProp,
|
|
9018
9016
|
beta = false,
|
|
9019
9017
|
marketHours
|
|
9020
9018
|
}) {
|
|
9021
9019
|
const [isDescExpanded, setDescExpanded] = useState(false);
|
|
9022
9020
|
const [showDividendHistory, setShowDividendHistory] = useState(false);
|
|
9023
|
-
const [showHolders, setShowHolders] = useState(false);
|
|
9024
9021
|
const [copiedAddress, setCopiedAddress] = useState(false);
|
|
9025
9022
|
const [statsTab, setStatsTab] = useState("token");
|
|
9026
9023
|
const description = descriptionProp ?? overviewData?.description ?? DEFAULT_DESCRIPTION;
|
|
@@ -9074,9 +9071,7 @@ function PropertyOverview({
|
|
|
9074
9071
|
const tokenStats = [
|
|
9075
9072
|
{ label: "Token Price", value: isLoading && tokenPriceValue == null ? loadingSkeleton : tokenPriceValue ? `$${tokenPriceValue.toFixed(2)}` : "\u2014", gold: true },
|
|
9076
9073
|
{ label: "24h Volume", value: isLoading && vol24hDollar == null ? loadingSkeleton : vol24hDollar != null && vol24hDollar > 0 ? fmtDollar(vol24hDollar) : "\u2014" },
|
|
9077
|
-
{ label: "Dividend Yield", value: isLoading && currentDividendYield == null ? loadingSkeleton : currentDividendYield ? `${currentDividendYield}%` : "\u2014" }
|
|
9078
|
-
{ label: "Open Orders", value: isLoading && openOrdersValue == null ? loadingSkeleton : openOrdersValue != null && openOrdersValue > 0 ? fmtDollar(openOrdersValue) : "\u2014" },
|
|
9079
|
-
{ label: "Holders", value: isLoading && holderCount == null ? loadingSkeleton : holderCount != null ? holderCount.toLocaleString() : "\u2014" }
|
|
9074
|
+
{ label: "Dividend Yield", value: isLoading && currentDividendYield == null ? loadingSkeleton : currentDividendYield ? `${currentDividendYield}%` : "\u2014" }
|
|
9080
9075
|
];
|
|
9081
9076
|
const growthPct = overviewData?.growth5Yr;
|
|
9082
9077
|
const propertyStats = [
|
|
@@ -9143,7 +9138,7 @@ function PropertyOverview({
|
|
|
9143
9138
|
/* @__PURE__ */ jsx(StatsRowLabel, { children: "Token Performance" }),
|
|
9144
9139
|
/* @__PURE__ */ jsx(StatsHRow, { children: tokenStats.map((item) => /* @__PURE__ */ jsxs(StatsHCell, { children: [
|
|
9145
9140
|
/* @__PURE__ */ jsx(StatsHCellLabel, { children: item.label }),
|
|
9146
|
-
|
|
9141
|
+
/* @__PURE__ */ jsx(StatsHCellValue, { $gold: !!item.gold, children: item.value })
|
|
9147
9142
|
] }, item.label)) })
|
|
9148
9143
|
] }),
|
|
9149
9144
|
/* @__PURE__ */ jsxs(StatsRowSection, { children: [
|
|
@@ -9162,7 +9157,7 @@ function PropertyOverview({
|
|
|
9162
9157
|
] }),
|
|
9163
9158
|
statsTab === "token" && /* @__PURE__ */ jsx(StatsTabContent, { children: tokenStats.map((item) => /* @__PURE__ */ jsxs(StatRow, { $gold: !!item.gold, children: [
|
|
9164
9159
|
/* @__PURE__ */ jsx(StatLabel, { children: item.label }),
|
|
9165
|
-
|
|
9160
|
+
/* @__PURE__ */ jsx(StatValue, { $gold: !!item.gold, children: item.value })
|
|
9166
9161
|
] }, item.label)) }),
|
|
9167
9162
|
statsTab === "property" && /* @__PURE__ */ jsxs(StatsTabContent, { children: [
|
|
9168
9163
|
propertyStats.map((item) => /* @__PURE__ */ jsxs(StatRow, { children: [
|
|
@@ -9184,14 +9179,6 @@ function PropertyOverview({
|
|
|
9184
9179
|
onClose: () => setShowDividendHistory(false)
|
|
9185
9180
|
}
|
|
9186
9181
|
),
|
|
9187
|
-
showHolders && /* @__PURE__ */ jsx(
|
|
9188
|
-
HoldersPopup,
|
|
9189
|
-
{
|
|
9190
|
-
contractAddress,
|
|
9191
|
-
ticker,
|
|
9192
|
-
onClose: () => setShowHolders(false)
|
|
9193
|
-
}
|
|
9194
|
-
),
|
|
9195
9182
|
/* @__PURE__ */ jsxs(Section, { children: [
|
|
9196
9183
|
/* @__PURE__ */ jsx(SectionHeader, { children: "The Asset" }),
|
|
9197
9184
|
galleryImages.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
@@ -9248,14 +9235,6 @@ function PropertyOverview({
|
|
|
9248
9235
|
/* @__PURE__ */ jsx(StatLabel, { children: "Suburb Median" }),
|
|
9249
9236
|
/* @__PURE__ */ jsx(StatValue, { children: overviewData?.suburbMedian != null ? fmtDollar(overviewData.suburbMedian) : "\u2014" })
|
|
9250
9237
|
] }),
|
|
9251
|
-
/* @__PURE__ */ jsxs(StatRow, { children: [
|
|
9252
|
-
/* @__PURE__ */ jsx(StatLabel, { children: "5yr Property Growth" }),
|
|
9253
|
-
/* @__PURE__ */ jsx(StatValue, { style: growthPct != null && growthPct > 0 ? { color: "#4ade80" } : void 0, children: growthPct != null ? `${growthPct > 0 ? "+" : ""}${growthPct}%` : "\u2014" })
|
|
9254
|
-
] }),
|
|
9255
|
-
/* @__PURE__ */ jsxs(StatRow, { children: [
|
|
9256
|
-
/* @__PURE__ */ jsx(StatLabel, { children: "Current Dividend" }),
|
|
9257
|
-
/* @__PURE__ */ jsx(StatValue, { children: overviewData?.lastDividend != null ? `$${overviewData.lastDividend.toFixed(2)} / share / mo` : "\u2014" })
|
|
9258
|
-
] }),
|
|
9259
9238
|
propertyHistory.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
9260
9239
|
/* @__PURE__ */ jsx(StatsColumnHeader, { style: { marginTop: "1.25rem" }, children: "Capital History" }),
|
|
9261
9240
|
/* @__PURE__ */ jsx(TimelineWrap, { children: propertyHistory.map((h, i) => {
|
|
@@ -9480,65 +9459,6 @@ function DividendHistoryPopup({
|
|
|
9480
9459
|
] }) })
|
|
9481
9460
|
] }) });
|
|
9482
9461
|
}
|
|
9483
|
-
var MOCK_HOLDERS = [
|
|
9484
|
-
{ rank: 1, address: "0xA1b2...9F3e", label: "Loaf Treasury", tokens: 12500, pct: 25 },
|
|
9485
|
-
{ rank: 2, address: "0xC4d5...1A7b", label: null, tokens: 6200, pct: 12.4 },
|
|
9486
|
-
{ rank: 3, address: "0xE8f9...3C2d", label: null, tokens: 4800, pct: 9.6 },
|
|
9487
|
-
{ rank: 4, address: "0x2B3c...7D4e", label: "Market Maker", tokens: 3500, pct: 7 },
|
|
9488
|
-
{ rank: 5, address: "0x5F6a...8E1c", label: null, tokens: 2900, pct: 5.8 },
|
|
9489
|
-
{ rank: 6, address: "0x7A8b...0F2d", label: null, tokens: 2400, pct: 4.8 },
|
|
9490
|
-
{ rank: 7, address: "0x9C0d...4A3e", label: null, tokens: 1800, pct: 3.6 },
|
|
9491
|
-
{ rank: 8, address: "0xB1e2...6C5f", label: null, tokens: 1500, pct: 3 },
|
|
9492
|
-
{ rank: 9, address: "0xD3f4...8E7a", label: null, tokens: 1200, pct: 2.4 },
|
|
9493
|
-
{ rank: 10, address: "0xF5a6...2B9c", label: null, tokens: 950, pct: 1.9 }
|
|
9494
|
-
];
|
|
9495
|
-
function HoldersPopup({
|
|
9496
|
-
contractAddress,
|
|
9497
|
-
ticker,
|
|
9498
|
-
onClose
|
|
9499
|
-
}) {
|
|
9500
|
-
useEffect(() => {
|
|
9501
|
-
const handleEsc = (e) => {
|
|
9502
|
-
if (e.key === "Escape") onClose();
|
|
9503
|
-
};
|
|
9504
|
-
window.addEventListener("keydown", handleEsc);
|
|
9505
|
-
return () => window.removeEventListener("keydown", handleEsc);
|
|
9506
|
-
}, [onClose]);
|
|
9507
|
-
const basescanUrl = contractAddress ? `https://sepolia.basescan.org/token/${contractAddress}#balances` : "https://sepolia.basescan.org";
|
|
9508
|
-
return /* @__PURE__ */ jsx(DivPopupOverlay, { onClick: onClose, children: /* @__PURE__ */ jsxs(HoldersPanel, { onClick: (e) => e.stopPropagation(), children: [
|
|
9509
|
-
/* @__PURE__ */ jsxs(DivPopupHeader, { children: [
|
|
9510
|
-
/* @__PURE__ */ jsxs(DivPopupTitle, { children: [
|
|
9511
|
-
"Top Holders",
|
|
9512
|
-
ticker ? ` (${ticker})` : ""
|
|
9513
|
-
] }),
|
|
9514
|
-
/* @__PURE__ */ jsxs(HoldersHeaderRight, { children: [
|
|
9515
|
-
/* @__PURE__ */ jsx(HoldersBasescanLink, { href: basescanUrl, target: "_blank", rel: "noopener noreferrer", children: "View on BaseScan\xA0\u2197" }),
|
|
9516
|
-
/* @__PURE__ */ jsx(DivPopupClose, { onClick: onClose, "aria-label": "Close holders", children: "\u2715" })
|
|
9517
|
-
] })
|
|
9518
|
-
] }),
|
|
9519
|
-
/* @__PURE__ */ jsxs(HoldersTableWrap, { children: [
|
|
9520
|
-
/* @__PURE__ */ jsxs(HoldersTableHeader, { children: [
|
|
9521
|
-
/* @__PURE__ */ jsx(HoldersColRank, { children: "#" }),
|
|
9522
|
-
/* @__PURE__ */ jsx(HoldersColAddr, { children: "Address" }),
|
|
9523
|
-
/* @__PURE__ */ jsx(HoldersColTokens, { children: "Tokens" }),
|
|
9524
|
-
/* @__PURE__ */ jsx(HoldersColPct, { children: "%" })
|
|
9525
|
-
] }),
|
|
9526
|
-
MOCK_HOLDERS.map((h) => /* @__PURE__ */ jsxs(HoldersTableRow, { children: [
|
|
9527
|
-
/* @__PURE__ */ jsx(HoldersColRank, { children: h.rank }),
|
|
9528
|
-
/* @__PURE__ */ jsxs(HoldersColAddr, { children: [
|
|
9529
|
-
/* @__PURE__ */ jsx(HolderAddrLink, { href: `https://sepolia.basescan.org/address/${h.address.replace("...", "")}`, target: "_blank", rel: "noopener noreferrer", children: h.address }),
|
|
9530
|
-
h.label && /* @__PURE__ */ jsx(HolderLabel, { children: h.label })
|
|
9531
|
-
] }),
|
|
9532
|
-
/* @__PURE__ */ jsx(HoldersColTokens, { children: h.tokens.toLocaleString() }),
|
|
9533
|
-
/* @__PURE__ */ jsxs(HoldersColPct, { children: [
|
|
9534
|
-
h.pct.toFixed(1),
|
|
9535
|
-
"%"
|
|
9536
|
-
] })
|
|
9537
|
-
] }, h.rank))
|
|
9538
|
-
] }),
|
|
9539
|
-
/* @__PURE__ */ jsx(HoldersFooter, { children: /* @__PURE__ */ jsx(HoldersFullListBtn, { href: basescanUrl, target: "_blank", rel: "noopener noreferrer", children: "See Full List of Holders\xA0\u2197" }) })
|
|
9540
|
-
] }) });
|
|
9541
|
-
}
|
|
9542
9462
|
var Wrapper = styled9.div`
|
|
9543
9463
|
display: flex;
|
|
9544
9464
|
flex-direction: column;
|
|
@@ -10148,133 +10068,6 @@ var DivTableTD = styled9.td`
|
|
|
10148
10068
|
font-size: 0.82rem;
|
|
10149
10069
|
color: rgba(255,255,255,0.75);
|
|
10150
10070
|
`;
|
|
10151
|
-
var HoldersPanel = styled9.div`
|
|
10152
|
-
background: #111;
|
|
10153
|
-
border: 1px solid rgba(255,255,255,0.08);
|
|
10154
|
-
border-radius: 14px;
|
|
10155
|
-
width: 90%;
|
|
10156
|
-
max-width: 520px;
|
|
10157
|
-
max-height: 85vh;
|
|
10158
|
-
overflow-y: auto;
|
|
10159
|
-
display: flex;
|
|
10160
|
-
flex-direction: column;
|
|
10161
|
-
`;
|
|
10162
|
-
var HoldersHeaderRight = styled9.div`
|
|
10163
|
-
display: flex;
|
|
10164
|
-
align-items: center;
|
|
10165
|
-
gap: 1rem;
|
|
10166
|
-
`;
|
|
10167
|
-
var HoldersBasescanLink = styled9.a`
|
|
10168
|
-
font-size: 0.75rem;
|
|
10169
|
-
color: rgba(255,255,255,0.4);
|
|
10170
|
-
text-decoration: none;
|
|
10171
|
-
transition: color 0.15s;
|
|
10172
|
-
&:hover { color: rgba(212,175,55,0.9); }
|
|
10173
|
-
`;
|
|
10174
|
-
var HoldersTableWrap = styled9.div`
|
|
10175
|
-
padding: 0 1.5rem;
|
|
10176
|
-
`;
|
|
10177
|
-
var HoldersTableHeader = styled9.div`
|
|
10178
|
-
display: flex;
|
|
10179
|
-
align-items: center;
|
|
10180
|
-
padding: 0.6rem 0;
|
|
10181
|
-
border-bottom: 1px solid rgba(255,255,255,0.08);
|
|
10182
|
-
font-size: 0.65rem;
|
|
10183
|
-
font-weight: 500;
|
|
10184
|
-
color: rgba(255,255,255,0.4);
|
|
10185
|
-
text-transform: uppercase;
|
|
10186
|
-
letter-spacing: 0.06em;
|
|
10187
|
-
`;
|
|
10188
|
-
var HoldersTableRow = styled9.div`
|
|
10189
|
-
display: flex;
|
|
10190
|
-
align-items: center;
|
|
10191
|
-
padding: 0.6rem 0;
|
|
10192
|
-
border-bottom: 1px solid rgba(255,255,255,0.03);
|
|
10193
|
-
font-size: 0.82rem;
|
|
10194
|
-
color: rgba(255,255,255,0.75);
|
|
10195
|
-
border-radius: 6px;
|
|
10196
|
-
transition: background 0.15s;
|
|
10197
|
-
&:hover { background: rgba(255,255,255,0.03); }
|
|
10198
|
-
&:last-child { border-bottom: none; }
|
|
10199
|
-
`;
|
|
10200
|
-
var HoldersColRank = styled9.span`
|
|
10201
|
-
width: 32px;
|
|
10202
|
-
flex-shrink: 0;
|
|
10203
|
-
color: rgba(255,255,255,0.35);
|
|
10204
|
-
font-size: 0.75rem;
|
|
10205
|
-
`;
|
|
10206
|
-
var HoldersColAddr = styled9.span`
|
|
10207
|
-
flex: 1;
|
|
10208
|
-
min-width: 0;
|
|
10209
|
-
display: flex;
|
|
10210
|
-
align-items: center;
|
|
10211
|
-
gap: 0.5rem;
|
|
10212
|
-
`;
|
|
10213
|
-
var HolderAddrLink = styled9.a`
|
|
10214
|
-
font-family: monospace;
|
|
10215
|
-
font-size: 0.8rem;
|
|
10216
|
-
color: rgba(255,255,255,0.7);
|
|
10217
|
-
text-decoration: none;
|
|
10218
|
-
&:hover { color: rgba(212,175,55,0.9); }
|
|
10219
|
-
`;
|
|
10220
|
-
var HolderLabel = styled9.span`
|
|
10221
|
-
font-size: 0.68rem;
|
|
10222
|
-
color: rgba(212,175,55,0.7);
|
|
10223
|
-
background: rgba(212,175,55,0.08);
|
|
10224
|
-
padding: 1px 6px;
|
|
10225
|
-
border-radius: 4px;
|
|
10226
|
-
white-space: nowrap;
|
|
10227
|
-
`;
|
|
10228
|
-
var HoldersColTokens = styled9.span`
|
|
10229
|
-
width: 90px;
|
|
10230
|
-
text-align: right;
|
|
10231
|
-
flex-shrink: 0;
|
|
10232
|
-
font-variant-numeric: tabular-nums;
|
|
10233
|
-
`;
|
|
10234
|
-
var HoldersColPct = styled9.span`
|
|
10235
|
-
width: 55px;
|
|
10236
|
-
text-align: right;
|
|
10237
|
-
flex-shrink: 0;
|
|
10238
|
-
font-variant-numeric: tabular-nums;
|
|
10239
|
-
color: rgba(255,255,255,0.5);
|
|
10240
|
-
`;
|
|
10241
|
-
var HoldersFooter = styled9.div`
|
|
10242
|
-
padding: 1rem 1.5rem 1.25rem;
|
|
10243
|
-
display: flex;
|
|
10244
|
-
justify-content: center;
|
|
10245
|
-
`;
|
|
10246
|
-
var HoldersFullListBtn = styled9.a`
|
|
10247
|
-
display: inline-flex;
|
|
10248
|
-
align-items: center;
|
|
10249
|
-
padding: 0.55rem 1.5rem;
|
|
10250
|
-
border: 1px solid rgba(255,255,255,0.1);
|
|
10251
|
-
border-radius: 8px;
|
|
10252
|
-
background: rgba(255,255,255,0.03);
|
|
10253
|
-
color: rgba(255,255,255,0.6);
|
|
10254
|
-
font-size: 0.78rem;
|
|
10255
|
-
font-weight: 500;
|
|
10256
|
-
text-decoration: none;
|
|
10257
|
-
transition: border-color 0.15s, color 0.15s, background 0.15s;
|
|
10258
|
-
&:hover {
|
|
10259
|
-
border-color: rgba(212,175,55,0.4);
|
|
10260
|
-
color: rgba(212,175,55,0.9);
|
|
10261
|
-
background: rgba(212,175,55,0.05);
|
|
10262
|
-
}
|
|
10263
|
-
`;
|
|
10264
|
-
var StatValueClickable = styled9.span`
|
|
10265
|
-
font-size: 0.88rem;
|
|
10266
|
-
font-weight: 500;
|
|
10267
|
-
color: #fff;
|
|
10268
|
-
cursor: pointer;
|
|
10269
|
-
text-decoration: underline;
|
|
10270
|
-
text-underline-offset: 3px;
|
|
10271
|
-
text-decoration-color: rgba(255,255,255,0.15);
|
|
10272
|
-
transition: color 0.15s, text-decoration-color 0.15s;
|
|
10273
|
-
&:hover {
|
|
10274
|
-
color: rgba(212,175,55,0.9);
|
|
10275
|
-
text-decoration-color: rgba(212,175,55,0.5);
|
|
10276
|
-
}
|
|
10277
|
-
`;
|
|
10278
10071
|
var STATUS_BG = {
|
|
10279
10072
|
active: "rgba(14,203,129,0.18)",
|
|
10280
10073
|
rejected: "rgba(246,70,93,0.18)",
|