@loafmarkets/ui 0.1.290 → 0.1.292
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 +41 -97
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +41 -97
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -12828,7 +12828,7 @@ function OrderPanel({
|
|
|
12828
12828
|
var Panel = styled9__default.default.div`
|
|
12829
12829
|
background-color: var(--color-card-darker, #111);
|
|
12830
12830
|
border-radius: 8px;
|
|
12831
|
-
padding: 1.
|
|
12831
|
+
padding: 1.25rem;
|
|
12832
12832
|
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
|
|
12833
12833
|
border: 1px solid var(--color-border);
|
|
12834
12834
|
height: 100%;
|
|
@@ -12856,11 +12856,11 @@ var PanelHeader2 = styled9__default.default.div`
|
|
|
12856
12856
|
display: flex;
|
|
12857
12857
|
justify-content: space-between;
|
|
12858
12858
|
align-items: center;
|
|
12859
|
-
margin-bottom:
|
|
12860
|
-
padding-bottom: 0.
|
|
12859
|
+
margin-bottom: 0.75rem;
|
|
12860
|
+
padding-bottom: 0.5rem;
|
|
12861
12861
|
border-bottom: 1px solid var(--color-border);
|
|
12862
12862
|
span:first-child {
|
|
12863
|
-
font-size:
|
|
12863
|
+
font-size: 0.9rem;
|
|
12864
12864
|
font-weight: 600;
|
|
12865
12865
|
color: var(--color-text);
|
|
12866
12866
|
}
|
|
@@ -12881,18 +12881,18 @@ var StatusBadge2 = styled9__default.default.span`
|
|
|
12881
12881
|
var Card2 = styled9__default.default.div`
|
|
12882
12882
|
background: rgba(0,0,0,0.4);
|
|
12883
12883
|
border: 1px solid rgba(255,255,255,0.15);
|
|
12884
|
-
border-radius:
|
|
12885
|
-
padding: 1rem
|
|
12884
|
+
border-radius: 10px;
|
|
12885
|
+
padding: 0.75rem 1rem;
|
|
12886
12886
|
|
|
12887
12887
|
@media (max-width: 480px) {
|
|
12888
|
-
padding: 0.
|
|
12889
|
-
border-radius:
|
|
12888
|
+
padding: 0.6rem 0.85rem;
|
|
12889
|
+
border-radius: 8px;
|
|
12890
12890
|
}
|
|
12891
12891
|
`;
|
|
12892
12892
|
var CardLabel = styled9__default.default.div`
|
|
12893
|
-
font-size: 0.
|
|
12893
|
+
font-size: 0.7rem;
|
|
12894
12894
|
color: var(--color-text-secondary);
|
|
12895
|
-
margin-bottom: 0.
|
|
12895
|
+
margin-bottom: 0.3rem;
|
|
12896
12896
|
`;
|
|
12897
12897
|
var CardInputRow = styled9__default.default.div`
|
|
12898
12898
|
display: flex;
|
|
@@ -12902,17 +12902,17 @@ var CardInputRow = styled9__default.default.div`
|
|
|
12902
12902
|
background: transparent;
|
|
12903
12903
|
border: none;
|
|
12904
12904
|
outline: none;
|
|
12905
|
-
font-size: 1.
|
|
12905
|
+
font-size: 1.4rem;
|
|
12906
12906
|
font-weight: 600;
|
|
12907
12907
|
color: #fff;
|
|
12908
12908
|
width: 100%;
|
|
12909
12909
|
|
|
12910
12910
|
@media (max-width: 480px) {
|
|
12911
|
-
font-size: 1.
|
|
12911
|
+
font-size: 1.15rem;
|
|
12912
12912
|
}
|
|
12913
12913
|
}
|
|
12914
12914
|
span {
|
|
12915
|
-
font-size:
|
|
12915
|
+
font-size: 0.9rem;
|
|
12916
12916
|
color: var(--color-text-secondary);
|
|
12917
12917
|
font-weight: 500;
|
|
12918
12918
|
margin-left: 0.75rem;
|
|
@@ -12921,14 +12921,14 @@ var CardInputRow = styled9__default.default.div`
|
|
|
12921
12921
|
`;
|
|
12922
12922
|
var QuickSelectRow = styled9__default.default.div`
|
|
12923
12923
|
display: flex;
|
|
12924
|
-
gap: 0.
|
|
12925
|
-
margin-top: 0.
|
|
12924
|
+
gap: 0.4rem;
|
|
12925
|
+
margin-top: 0.5rem;
|
|
12926
12926
|
flex-wrap: wrap;
|
|
12927
12927
|
button {
|
|
12928
12928
|
flex: 1;
|
|
12929
12929
|
min-width: 50px;
|
|
12930
|
-
padding: 0.
|
|
12931
|
-
font-size: 0.
|
|
12930
|
+
padding: 0.3rem 0;
|
|
12931
|
+
font-size: 0.7rem;
|
|
12932
12932
|
font-weight: 500;
|
|
12933
12933
|
background: rgba(255,255,255,0.05);
|
|
12934
12934
|
border: 1px solid rgba(255,255,255,0.1);
|
|
@@ -12971,7 +12971,7 @@ var DepositButton2 = styled9__default.default.button`
|
|
|
12971
12971
|
`;
|
|
12972
12972
|
var Divider2 = styled9__default.default.div`
|
|
12973
12973
|
text-align: center;
|
|
12974
|
-
margin: 0.
|
|
12974
|
+
margin: 0.25rem 0;
|
|
12975
12975
|
color: var(--color-text-secondary);
|
|
12976
12976
|
`;
|
|
12977
12977
|
var CardTopRow = styled9__default.default.div`
|
|
@@ -12987,12 +12987,12 @@ var CardHint = styled9__default.default.span`
|
|
|
12987
12987
|
`;
|
|
12988
12988
|
var OrderSummary = styled9__default.default.div`
|
|
12989
12989
|
border-top: 1px solid rgba(255,255,255,0.08);
|
|
12990
|
-
padding-top:
|
|
12991
|
-
margin-top: 0.
|
|
12992
|
-
font-size: 0.
|
|
12990
|
+
padding-top: 0.65rem;
|
|
12991
|
+
margin-top: 0.35rem;
|
|
12992
|
+
font-size: 0.75rem;
|
|
12993
12993
|
display: flex;
|
|
12994
12994
|
flex-direction: column;
|
|
12995
|
-
gap: 0.
|
|
12995
|
+
gap: 0.35rem;
|
|
12996
12996
|
`;
|
|
12997
12997
|
var SummaryRow = styled9__default.default.div`
|
|
12998
12998
|
display: flex;
|
|
@@ -13011,15 +13011,15 @@ var SummaryTotal = styled9__default.default(SummaryRow)`
|
|
|
13011
13011
|
var FormBody = styled9__default.default.div`
|
|
13012
13012
|
display: flex;
|
|
13013
13013
|
flex-direction: column;
|
|
13014
|
-
gap: 0.
|
|
13014
|
+
gap: 0.5rem;
|
|
13015
13015
|
`;
|
|
13016
13016
|
var SubscribeButton = styled9__default.default.button`
|
|
13017
13017
|
width: 100%;
|
|
13018
|
-
margin-top:
|
|
13019
|
-
padding: 0.
|
|
13018
|
+
margin-top: 0.75rem;
|
|
13019
|
+
padding: 0.7rem;
|
|
13020
13020
|
border-radius: 6px;
|
|
13021
13021
|
font-weight: 600;
|
|
13022
|
-
font-size: 0.
|
|
13022
|
+
font-size: 0.85rem;
|
|
13023
13023
|
border: none;
|
|
13024
13024
|
cursor: pointer;
|
|
13025
13025
|
transition: all 0.2s;
|
|
@@ -13040,27 +13040,27 @@ var SubscribeButton = styled9__default.default.button`
|
|
|
13040
13040
|
`;
|
|
13041
13041
|
var BalanceCards = styled9__default.default.div`
|
|
13042
13042
|
display: flex;
|
|
13043
|
-
gap:
|
|
13044
|
-
margin-top:
|
|
13043
|
+
gap: 0.75rem;
|
|
13044
|
+
margin-top: 0.75rem;
|
|
13045
13045
|
flex-wrap: wrap;
|
|
13046
13046
|
`;
|
|
13047
13047
|
var BalanceCard = styled9__default.default.div`
|
|
13048
13048
|
flex: 1;
|
|
13049
13049
|
background: rgba(255,255,255,0.03);
|
|
13050
|
-
border-radius:
|
|
13051
|
-
padding:
|
|
13050
|
+
border-radius: 10px;
|
|
13051
|
+
padding: 0.75rem;
|
|
13052
13052
|
text-align: center;
|
|
13053
13053
|
position: relative;
|
|
13054
13054
|
`;
|
|
13055
13055
|
var BalanceLabel = styled9__default.default.div`
|
|
13056
|
-
font-size: 0.
|
|
13056
|
+
font-size: 0.7rem;
|
|
13057
13057
|
color: var(--color-text-secondary);
|
|
13058
13058
|
text-transform: uppercase;
|
|
13059
13059
|
letter-spacing: 0.5px;
|
|
13060
|
-
margin-bottom: 0.
|
|
13060
|
+
margin-bottom: 0.35rem;
|
|
13061
13061
|
`;
|
|
13062
13062
|
var BalanceValue = styled9__default.default.div`
|
|
13063
|
-
font-size: 1.
|
|
13063
|
+
font-size: 1.25rem;
|
|
13064
13064
|
font-weight: 700;
|
|
13065
13065
|
color: #fff;
|
|
13066
13066
|
span {
|
|
@@ -13664,7 +13664,6 @@ function PortfolioActivityPanel({
|
|
|
13664
13664
|
}) {
|
|
13665
13665
|
const resolvedDefaultTab = defaultTab ?? (showPositionsTab ? "positions" : showSubscriptionsTab ? "subscriptions" : "orders");
|
|
13666
13666
|
const [activeTab, setActiveTab] = React5.useState(resolvedDefaultTab);
|
|
13667
|
-
const [activityPage, setActivityPage] = React5.useState(0);
|
|
13668
13667
|
const [pendingCancelOrderId, setPendingCancelOrderId] = React5.useState(null);
|
|
13669
13668
|
const [cancelAllConfirmOpen, setCancelAllConfirmOpen] = React5.useState(false);
|
|
13670
13669
|
const [cancellingAll, setCancellingAll] = React5.useState(false);
|
|
@@ -13767,7 +13766,7 @@ function PortfolioActivityPanel({
|
|
|
13767
13766
|
}));
|
|
13768
13767
|
return [...orderHistory, ...mapped].sort((a, b) => b.createdAt - a.createdAt);
|
|
13769
13768
|
}, [showSubscriptionsTab, offeringOrders, orderHistory]);
|
|
13770
|
-
|
|
13769
|
+
React5.useMemo(() => {
|
|
13771
13770
|
switch (activeTab) {
|
|
13772
13771
|
case "positions":
|
|
13773
13772
|
return positions.length;
|
|
@@ -13801,11 +13800,8 @@ function PortfolioActivityPanel({
|
|
|
13801
13800
|
}).length,
|
|
13802
13801
|
[offeringOrders]
|
|
13803
13802
|
);
|
|
13804
|
-
const activityTotalPages = Math.ceil(activeTabTotal / pageSize);
|
|
13805
|
-
const pageSlice = (arr) => arr.slice(activityPage * pageSize, (activityPage + 1) * pageSize);
|
|
13806
13803
|
const handleTabChange = (tab) => {
|
|
13807
13804
|
setActiveTab(tab);
|
|
13808
|
-
setActivityPage(0);
|
|
13809
13805
|
};
|
|
13810
13806
|
return /* @__PURE__ */ jsxRuntime.jsxs(Container3, { className, style, children: [
|
|
13811
13807
|
/* @__PURE__ */ jsxRuntime.jsx(PanelTitle, { children: "Activity" }),
|
|
@@ -13867,7 +13863,7 @@ function PortfolioActivityPanel({
|
|
|
13867
13863
|
onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(CToolbarLink, { onClick: () => setCloseAllOpen(true), children: "Sell All" })
|
|
13868
13864
|
] })
|
|
13869
13865
|
] }),
|
|
13870
|
-
|
|
13866
|
+
sortedPositions.map((pos) => {
|
|
13871
13867
|
const currentValue = pos.quantity * pos.marketPrice;
|
|
13872
13868
|
const costBasis = pos.quantity * pos.averageEntryPrice;
|
|
13873
13869
|
const pnl = pos.propertyPnl ?? currentValue - costBasis;
|
|
@@ -13961,7 +13957,7 @@ function PortfolioActivityPanel({
|
|
|
13961
13957
|
] }),
|
|
13962
13958
|
onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(PositionsHeaderCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CloseAllHeaderBtn, { onClick: () => setCloseAllOpen(true), children: "Sell All" }) })
|
|
13963
13959
|
] }),
|
|
13964
|
-
|
|
13960
|
+
sortedPositions.map((pos) => {
|
|
13965
13961
|
const currentValue = pos.quantity * pos.marketPrice;
|
|
13966
13962
|
const costBasis = pos.quantity * pos.averageEntryPrice;
|
|
13967
13963
|
const pnl = pos.propertyPnl ?? currentValue - costBasis;
|
|
@@ -14038,7 +14034,7 @@ function PortfolioActivityPanel({
|
|
|
14038
14034
|
/* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
|
|
14039
14035
|
/* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
|
|
14040
14036
|
] }),
|
|
14041
|
-
|
|
14037
|
+
offeringOrders.map((order) => {
|
|
14042
14038
|
const meta = getOrderStatusMeta(order.status);
|
|
14043
14039
|
return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.8fr 1fr 1fr 0.8fr 1fr", children: [
|
|
14044
14040
|
/* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: order.tokenName }) }),
|
|
@@ -14065,7 +14061,7 @@ function PortfolioActivityPanel({
|
|
|
14065
14061
|
/* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
|
|
14066
14062
|
onCancelOrder && /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, {})
|
|
14067
14063
|
] }),
|
|
14068
|
-
|
|
14064
|
+
openOrders.map((order) => {
|
|
14069
14065
|
const meta = getOrderStatusMeta(order.status);
|
|
14070
14066
|
const isMarket = order.type === "MARKET";
|
|
14071
14067
|
const filledPercent = order.quantity > 0 ? Math.round(order.filledQuantity / order.quantity * 100) : 0;
|
|
@@ -14110,7 +14106,7 @@ function PortfolioActivityPanel({
|
|
|
14110
14106
|
/* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
|
|
14111
14107
|
/* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
|
|
14112
14108
|
] }),
|
|
14113
|
-
|
|
14109
|
+
mergedOrderHistory.map((order) => {
|
|
14114
14110
|
const meta = getOrderStatusMeta(order.status);
|
|
14115
14111
|
const isMarket = order.type === "MARKET";
|
|
14116
14112
|
const filledPercent = order.quantity > 0 ? Math.round(order.filledQuantity / order.quantity * 100) : 0;
|
|
@@ -14143,7 +14139,7 @@ function PortfolioActivityPanel({
|
|
|
14143
14139
|
/* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Fee" }),
|
|
14144
14140
|
/* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
|
|
14145
14141
|
] }),
|
|
14146
|
-
|
|
14142
|
+
tradeHistory.map((trade) => /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.6fr 0.8fr 1fr 1fr 0.8fr 1fr", children: [
|
|
14147
14143
|
/* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, children: trade.tokenName }) }),
|
|
14148
14144
|
/* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: sideLabel(trade.side), children: sideLabel(trade.side) }) }),
|
|
14149
14145
|
/* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { children: formatNumber2(trade.quantity) }) }),
|
|
@@ -14164,7 +14160,7 @@ function PortfolioActivityPanel({
|
|
|
14164
14160
|
/* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Status" }),
|
|
14165
14161
|
/* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Date" })
|
|
14166
14162
|
] }),
|
|
14167
|
-
|
|
14163
|
+
transfers.map((t, idx) => {
|
|
14168
14164
|
const isDeposit = t.type === "DEPOSIT";
|
|
14169
14165
|
const statusMeta = getOrderStatusMeta(t.status);
|
|
14170
14166
|
return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "0.8fr 1fr 1.5fr 0.8fr 1fr", children: [
|
|
@@ -14179,31 +14175,6 @@ function PortfolioActivityPanel({
|
|
|
14179
14175
|
] }, t.blockchainTxHash ?? `transfer-${idx}`);
|
|
14180
14176
|
})
|
|
14181
14177
|
] })
|
|
14182
|
-
] }),
|
|
14183
|
-
activityTotalPages > 1 && /* @__PURE__ */ jsxRuntime.jsxs(PaginationRow, { children: [
|
|
14184
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
14185
|
-
PaginationButton,
|
|
14186
|
-
{
|
|
14187
|
-
type: "button",
|
|
14188
|
-
onClick: () => setActivityPage((p) => p - 1),
|
|
14189
|
-
disabled: activityPage === 0,
|
|
14190
|
-
children: "\u2190 Prev"
|
|
14191
|
-
}
|
|
14192
|
-
),
|
|
14193
|
-
/* @__PURE__ */ jsxRuntime.jsxs(PaginationLabel, { children: [
|
|
14194
|
-
activityPage + 1,
|
|
14195
|
-
" / ",
|
|
14196
|
-
activityTotalPages
|
|
14197
|
-
] }),
|
|
14198
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
14199
|
-
PaginationButton,
|
|
14200
|
-
{
|
|
14201
|
-
type: "button",
|
|
14202
|
-
onClick: () => setActivityPage((p) => p + 1),
|
|
14203
|
-
disabled: activityPage >= activityTotalPages - 1,
|
|
14204
|
-
children: "Next \u2192"
|
|
14205
|
-
}
|
|
14206
|
-
)
|
|
14207
14178
|
] })
|
|
14208
14179
|
] }),
|
|
14209
14180
|
cancelAllConfirmOpen && /* @__PURE__ */ jsxRuntime.jsx(CancelConfirmOverlay, { onClick: () => setCancelAllConfirmOpen(false), children: /* @__PURE__ */ jsxRuntime.jsxs(CancelConfirmModal, { onClick: (e) => e.stopPropagation(), children: [
|
|
@@ -14418,33 +14389,6 @@ var EmptyState = styled9__default.default.div`
|
|
|
14418
14389
|
font-size: 0.8rem;
|
|
14419
14390
|
color: rgba(255, 255, 255, 0.45);
|
|
14420
14391
|
`;
|
|
14421
|
-
var PaginationRow = styled9__default.default.div`
|
|
14422
|
-
display: flex;
|
|
14423
|
-
align-items: center;
|
|
14424
|
-
justify-content: center;
|
|
14425
|
-
gap: 0.75rem;
|
|
14426
|
-
margin-top: 1rem;
|
|
14427
|
-
padding-top: 1rem;
|
|
14428
|
-
border-top: 1px solid rgba(255, 255, 255, 0.06);
|
|
14429
|
-
`;
|
|
14430
|
-
var PaginationButton = styled9__default.default.button`
|
|
14431
|
-
background: transparent;
|
|
14432
|
-
border: 1px solid rgba(255, 255, 255, 0.12);
|
|
14433
|
-
border-radius: 8px;
|
|
14434
|
-
padding: 0.35rem 0.75rem;
|
|
14435
|
-
font-size: 0.8rem;
|
|
14436
|
-
cursor: pointer;
|
|
14437
|
-
color: rgba(255, 255, 255, 0.7);
|
|
14438
|
-
|
|
14439
|
-
&:disabled {
|
|
14440
|
-
color: rgba(255, 255, 255, 0.2);
|
|
14441
|
-
cursor: default;
|
|
14442
|
-
}
|
|
14443
|
-
`;
|
|
14444
|
-
var PaginationLabel = styled9__default.default.span`
|
|
14445
|
-
font-size: 0.8rem;
|
|
14446
|
-
color: rgba(255, 255, 255, 0.4);
|
|
14447
|
-
`;
|
|
14448
14392
|
var PositionsHeader = styled9__default.default.div`
|
|
14449
14393
|
display: grid;
|
|
14450
14394
|
grid-template-columns: ${(p) => p.$hasClose ? "repeat(6, 1fr) minmax(130px, auto)" : "repeat(6, 1fr)"};
|