@loafmarkets/ui 0.1.430 → 0.1.431
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 +7 -4
- package/dist/index.d.ts +7 -4
- package/dist/index.js +68 -40
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +68 -40
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -16692,12 +16692,22 @@ var TickerTag = styled10.span`
|
|
|
16692
16692
|
margin-left: 0.3rem;
|
|
16693
16693
|
`;
|
|
16694
16694
|
var sideLabel = (side) => side?.toUpperCase() === "SELL" ? "Sell" : "Buy";
|
|
16695
|
+
var isLiveOrder = (o) => o.status === "OPEN" || o.status === "PARTIALLY_FILLED" || o.status === "PENDING" || o.status === "ARMED";
|
|
16696
|
+
var isMarketType = (type) => type === "MARKET" || type.endsWith("_MARKET");
|
|
16697
|
+
var filledLabel = (order) => order.filledQuantity == null ? "\u2014" : `${order.quantity > 0 ? Math.round(order.filledQuantity / order.quantity * 100) : 0}%`;
|
|
16698
|
+
var TriggerText = styled10.span`
|
|
16699
|
+
display: block;
|
|
16700
|
+
font-size: 0.68rem;
|
|
16701
|
+
color: rgba(255, 255, 255, 0.5);
|
|
16702
|
+
font-variant-numeric: tabular-nums;
|
|
16703
|
+
margin-top: 0.1rem;
|
|
16704
|
+
`;
|
|
16695
16705
|
var getOrderStatusMeta = (statusRaw) => {
|
|
16696
16706
|
const status = statusRaw.toUpperCase();
|
|
16697
|
-
if (status === "FILLED" || status === "CONFIRMED" || status === "ALLOCATED") {
|
|
16707
|
+
if (status === "FILLED" || status === "CONFIRMED" || status === "ALLOCATED" || status === "PLACED") {
|
|
16698
16708
|
return { color: "#0ecb81", bg: "rgba(14,203,129,0.1)" };
|
|
16699
16709
|
}
|
|
16700
|
-
if (status === "CANCELLED" || status === "CANCELED" || status === "REJECTED") {
|
|
16710
|
+
if (status === "CANCELLED" || status === "CANCELED" || status === "REJECTED" || status === "FAILED") {
|
|
16701
16711
|
return { color: "#f6465d", bg: "rgba(246,70,93,0.12)" };
|
|
16702
16712
|
}
|
|
16703
16713
|
return { color: "#E6C87E", bg: "rgba(240,185,11,0.15)" };
|
|
@@ -16912,14 +16922,12 @@ function PortfolioActivityPanel({
|
|
|
16912
16922
|
[transfers]
|
|
16913
16923
|
);
|
|
16914
16924
|
const positionsCount = positions.length;
|
|
16915
|
-
const openOrdersCount = useMemo(
|
|
16916
|
-
|
|
16925
|
+
const openOrdersCount = useMemo(() => openOrders.filter(isLiveOrder).length, [openOrders]);
|
|
16926
|
+
const cancellableOrdersCount = useMemo(
|
|
16927
|
+
() => openOrders.filter((o) => !o.isOfferingOrder && isLiveOrder(o)).length,
|
|
16917
16928
|
[openOrders]
|
|
16918
16929
|
);
|
|
16919
|
-
const pendingHistoryCount = useMemo(
|
|
16920
|
-
() => mergedOrderHistory.filter((o) => o.status === "OPEN" || o.status === "PARTIALLY_FILLED").length,
|
|
16921
|
-
[mergedOrderHistory]
|
|
16922
|
-
);
|
|
16930
|
+
const pendingHistoryCount = useMemo(() => mergedOrderHistory.filter(isLiveOrder).length, [mergedOrderHistory]);
|
|
16923
16931
|
const pendingOfferingsCount = useMemo(
|
|
16924
16932
|
() => offeringOrders.filter((o) => {
|
|
16925
16933
|
const s = o.status.toUpperCase();
|
|
@@ -17244,7 +17252,7 @@ function PortfolioActivityPanel({
|
|
|
17244
17252
|
/* @__PURE__ */ jsx(CDValue, { children: formatTimestamp(order.createdAt) })
|
|
17245
17253
|
] })
|
|
17246
17254
|
] }),
|
|
17247
|
-
order.
|
|
17255
|
+
order.rejectionReason && /* @__PURE__ */ jsx(CDValue, { style: { marginTop: "0.4rem", color: "#f6465d", fontSize: "0.7rem" }, children: order.rejectionReason })
|
|
17248
17256
|
] })
|
|
17249
17257
|
] }, rowKey);
|
|
17250
17258
|
}),
|
|
@@ -17270,7 +17278,7 @@ function PortfolioActivityPanel({
|
|
|
17270
17278
|
/* @__PURE__ */ jsx(GridCell, { children: /* @__PURE__ */ jsx(CellText, { children: formatCurrency4(order.price * order.quantity) }) }),
|
|
17271
17279
|
/* @__PURE__ */ jsxs(GridCell, { children: [
|
|
17272
17280
|
/* @__PURE__ */ jsx(ActivityTag, { $color: meta.color, $bg: meta.bg, title: order.status === "REJECTED" && order.rejectionReason ? order.rejectionReason : void 0, children: prettyLabel(order.status) }),
|
|
17273
|
-
order.
|
|
17281
|
+
order.rejectionReason && /* @__PURE__ */ jsx(CellText, { $muted: true, style: { fontSize: "0.62rem", marginTop: "0.2rem", maxWidth: "120px", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, title: order.rejectionReason, children: order.rejectionReason })
|
|
17274
17282
|
] }),
|
|
17275
17283
|
/* @__PURE__ */ jsx(GridCell, { children: /* @__PURE__ */ jsx(CellText, { $muted: true, children: formatTimestamp(order.createdAt) }) }),
|
|
17276
17284
|
/* @__PURE__ */ jsx(GridCell, { children: order.txHash && /* @__PURE__ */ jsx(TxLink, { href: `${_blockExplorerBaseUrl}/${order.txHash}`, target: "_blank", rel: "noopener noreferrer", title: "View on Arbiscan", children: /* @__PURE__ */ jsxs("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
@@ -17285,10 +17293,10 @@ function PortfolioActivityPanel({
|
|
|
17285
17293
|
activeTab === "open-orders" && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
17286
17294
|
openOrders.length === 0 && /* @__PURE__ */ jsx(EmptyState, { children: "Open orders will appear here while they are working in the market." }),
|
|
17287
17295
|
openOrders.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
17288
|
-
compactPositions && onCancelAllOrders &&
|
|
17296
|
+
compactPositions && onCancelAllOrders && cancellableOrdersCount > 0 && /* @__PURE__ */ jsx(CancelAllRow, { children: /* @__PURE__ */ jsx(CancelAllBtn, { type: "button", disabled: cancellingAll, onClick: () => setCancelAllConfirmOpen(true), children: "Cancel All" }) }),
|
|
17289
17297
|
compactPositions ? sortedOpenOrders.map((order) => {
|
|
17290
17298
|
const meta = getOrderStatusMeta(order.status);
|
|
17291
|
-
const filledPercent =
|
|
17299
|
+
const filledPercent = filledLabel(order);
|
|
17292
17300
|
const isCancelling = cancellingOrderId === order.id;
|
|
17293
17301
|
const ordExpanded = expandedOpenOrders.has(order.id);
|
|
17294
17302
|
const sideColor = sideLabel(order.side) === "Buy" ? "#0ecb81" : "#f6465d";
|
|
@@ -17303,8 +17311,7 @@ function PortfolioActivityPanel({
|
|
|
17303
17311
|
] }),
|
|
17304
17312
|
/* @__PURE__ */ jsxs(CUnitsCell, { children: [
|
|
17305
17313
|
/* @__PURE__ */ jsx(CCellLabel, { children: "Filled" }),
|
|
17306
|
-
filledPercent
|
|
17307
|
-
"%"
|
|
17314
|
+
filledPercent
|
|
17308
17315
|
] }),
|
|
17309
17316
|
/* @__PURE__ */ jsxs(CUnitsCell, { children: [
|
|
17310
17317
|
/* @__PURE__ */ jsx(CCellLabel, { children: "Qty" }),
|
|
@@ -17327,7 +17334,13 @@ function PortfolioActivityPanel({
|
|
|
17327
17334
|
] }),
|
|
17328
17335
|
/* @__PURE__ */ jsxs(CDetailItem, { children: [
|
|
17329
17336
|
/* @__PURE__ */ jsx(CDLabel, { children: "Price" }),
|
|
17330
|
-
/* @__PURE__ */
|
|
17337
|
+
/* @__PURE__ */ jsxs(CDValue, { children: [
|
|
17338
|
+
isMarketType(order.type) || !order.price ? "Market" : formatCurrency4(order.price),
|
|
17339
|
+
order.triggerPrice != null && /* @__PURE__ */ jsxs(TriggerText, { children: [
|
|
17340
|
+
"Trigger ",
|
|
17341
|
+
formatCurrency4(order.triggerPrice)
|
|
17342
|
+
] })
|
|
17343
|
+
] })
|
|
17331
17344
|
] }),
|
|
17332
17345
|
/* @__PURE__ */ jsxs(CDetailItem, { children: [
|
|
17333
17346
|
/* @__PURE__ */ jsx(CDLabel, { children: "Status" }),
|
|
@@ -17358,12 +17371,12 @@ function PortfolioActivityPanel({
|
|
|
17358
17371
|
/* @__PURE__ */ jsx(GridHeaderCell, { children: "Price" }),
|
|
17359
17372
|
/* @__PURE__ */ jsx(GridHeaderCell, { children: "Filled" }),
|
|
17360
17373
|
/* @__PURE__ */ jsx(GridHeaderCell, { children: "Status" }),
|
|
17361
|
-
onCancelOrder && /* @__PURE__ */ jsx(GridHeaderCell, { children: onCancelAllOrders &&
|
|
17374
|
+
onCancelOrder && /* @__PURE__ */ jsx(GridHeaderCell, { children: onCancelAllOrders && cancellableOrdersCount > 0 && /* @__PURE__ */ jsx(CancelButton, { type: "button", disabled: cancellingAll, onClick: () => setCancelAllConfirmOpen(true), children: "Cancel All" }) })
|
|
17362
17375
|
] }),
|
|
17363
17376
|
pagedOpenOrders.map((order) => {
|
|
17364
17377
|
const meta = getOrderStatusMeta(order.status);
|
|
17365
|
-
const isMarket = order.type
|
|
17366
|
-
const filledPercent =
|
|
17378
|
+
const isMarket = isMarketType(order.type);
|
|
17379
|
+
const filledPercent = filledLabel(order);
|
|
17367
17380
|
const isCancelling = cancellingOrderId === order.id;
|
|
17368
17381
|
const sideColor = sideLabel(order.side) === "Buy" ? "#0ecb81" : "#f6465d";
|
|
17369
17382
|
return /* @__PURE__ */ jsxs(GridRow, { $columns: onCancelOrder ? "0.5fr 1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 82px" : "0.5fr 1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr", children: [
|
|
@@ -17375,12 +17388,18 @@ function PortfolioActivityPanel({
|
|
|
17375
17388
|
formatNumber2(order.quantity),
|
|
17376
17389
|
order.ticker && /* @__PURE__ */ jsx(TickerTag, { children: order.ticker.toUpperCase() })
|
|
17377
17390
|
] }) }),
|
|
17378
|
-
/* @__PURE__ */
|
|
17379
|
-
|
|
17380
|
-
|
|
17381
|
-
|
|
17382
|
-
|
|
17383
|
-
|
|
17391
|
+
/* @__PURE__ */ jsxs(GridCell, { children: [
|
|
17392
|
+
/* @__PURE__ */ jsx(CellText, { children: isMarket || !order.price ? "Market" : formatCurrency4(order.price) }),
|
|
17393
|
+
order.triggerPrice != null && /* @__PURE__ */ jsxs(TriggerText, { children: [
|
|
17394
|
+
"Trigger ",
|
|
17395
|
+
formatCurrency4(order.triggerPrice)
|
|
17396
|
+
] })
|
|
17397
|
+
] }),
|
|
17398
|
+
/* @__PURE__ */ jsx(GridCell, { children: /* @__PURE__ */ jsx(CellText, { $muted: true, children: filledPercent }) }),
|
|
17399
|
+
/* @__PURE__ */ jsxs(GridCell, { children: [
|
|
17400
|
+
/* @__PURE__ */ jsx(ActivityTag, { $color: meta.color, $bg: meta.bg, children: prettyLabel(order.status) }),
|
|
17401
|
+
order.triggerPrice != null && order.rejectionReason && /* @__PURE__ */ jsx(TriggerText, { title: order.rejectionReason, children: order.rejectionReason })
|
|
17402
|
+
] }),
|
|
17384
17403
|
onCancelOrder && /* @__PURE__ */ jsx(GridCell, { children: /* @__PURE__ */ jsx(
|
|
17385
17404
|
CancelButton,
|
|
17386
17405
|
{
|
|
@@ -17402,7 +17421,7 @@ function PortfolioActivityPanel({
|
|
|
17402
17421
|
mergedOrderHistory.length === 0 && /* @__PURE__ */ jsx(EmptyState, { children: "No orders yet. Place a trade to see it appear here." }),
|
|
17403
17422
|
mergedOrderHistory.length > 0 && compactPositions && pagedOrderHistory.map((order) => {
|
|
17404
17423
|
const meta = getOrderStatusMeta(order.status);
|
|
17405
|
-
const filledPercent =
|
|
17424
|
+
const filledPercent = filledLabel(order);
|
|
17406
17425
|
const typeLabel = order.isOfferingOrder ? "Initial Offering" : prettyLabel(order.type);
|
|
17407
17426
|
const sideColor = sideLabel(order.side) === "Buy" ? "#0ecb81" : "#f6465d";
|
|
17408
17427
|
const rowKey = `oh-${order.id}`;
|
|
@@ -17441,21 +17460,24 @@ function PortfolioActivityPanel({
|
|
|
17441
17460
|
] }),
|
|
17442
17461
|
/* @__PURE__ */ jsxs(CDetailItem, { children: [
|
|
17443
17462
|
/* @__PURE__ */ jsx(CDLabel, { children: "Price" }),
|
|
17444
|
-
/* @__PURE__ */
|
|
17463
|
+
/* @__PURE__ */ jsxs(CDValue, { children: [
|
|
17464
|
+
isMarketType(order.type) || !order.price ? "Market" : formatCurrency4(order.price),
|
|
17465
|
+
order.triggerPrice != null && /* @__PURE__ */ jsxs(TriggerText, { children: [
|
|
17466
|
+
"Trigger ",
|
|
17467
|
+
formatCurrency4(order.triggerPrice)
|
|
17468
|
+
] })
|
|
17469
|
+
] })
|
|
17445
17470
|
] }),
|
|
17446
17471
|
/* @__PURE__ */ jsxs(CDetailItem, { children: [
|
|
17447
17472
|
/* @__PURE__ */ jsx(CDLabel, { children: "Filled" }),
|
|
17448
|
-
/* @__PURE__ */
|
|
17449
|
-
filledPercent,
|
|
17450
|
-
"%"
|
|
17451
|
-
] })
|
|
17473
|
+
/* @__PURE__ */ jsx(CDValue, { children: filledPercent })
|
|
17452
17474
|
] }),
|
|
17453
17475
|
/* @__PURE__ */ jsxs(CDetailItem, { children: [
|
|
17454
17476
|
/* @__PURE__ */ jsx(CDLabel, { children: "Date" }),
|
|
17455
17477
|
/* @__PURE__ */ jsx(CDValue, { children: formatTimestamp(order.createdAt) })
|
|
17456
17478
|
] })
|
|
17457
17479
|
] }),
|
|
17458
|
-
order.
|
|
17480
|
+
order.rejectionReason && /* @__PURE__ */ jsx(CDValue, { style: { marginTop: "0.4rem", color: "#f6465d", fontSize: "0.7rem" }, children: order.rejectionReason })
|
|
17459
17481
|
] })
|
|
17460
17482
|
] }, rowKey);
|
|
17461
17483
|
}),
|
|
@@ -17473,8 +17495,8 @@ function PortfolioActivityPanel({
|
|
|
17473
17495
|
] }),
|
|
17474
17496
|
pagedOrderHistory.map((order) => {
|
|
17475
17497
|
const meta = getOrderStatusMeta(order.status);
|
|
17476
|
-
const isMarket = order.type
|
|
17477
|
-
const filledPercent =
|
|
17498
|
+
const isMarket = isMarketType(order.type);
|
|
17499
|
+
const filledPercent = filledLabel(order);
|
|
17478
17500
|
const typeLabel = order.isOfferingOrder ? "Initial Offering" : prettyLabel(order.type);
|
|
17479
17501
|
const sideColor = sideLabel(order.side) === "Buy" ? "#0ecb81" : "#f6465d";
|
|
17480
17502
|
return /* @__PURE__ */ jsxs(GridRow, { $columns: "0.5fr 1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 1fr", children: [
|
|
@@ -17486,12 +17508,18 @@ function PortfolioActivityPanel({
|
|
|
17486
17508
|
formatNumber2(order.quantity),
|
|
17487
17509
|
order.ticker && /* @__PURE__ */ jsx(TickerTag, { children: order.ticker.toUpperCase() })
|
|
17488
17510
|
] }) }),
|
|
17489
|
-
/* @__PURE__ */
|
|
17490
|
-
|
|
17491
|
-
|
|
17492
|
-
|
|
17493
|
-
|
|
17494
|
-
|
|
17511
|
+
/* @__PURE__ */ jsxs(GridCell, { children: [
|
|
17512
|
+
/* @__PURE__ */ jsx(CellText, { children: isMarket || !order.price ? "Market" : formatCurrency4(order.price) }),
|
|
17513
|
+
order.triggerPrice != null && /* @__PURE__ */ jsxs(TriggerText, { children: [
|
|
17514
|
+
"Trigger ",
|
|
17515
|
+
formatCurrency4(order.triggerPrice)
|
|
17516
|
+
] })
|
|
17517
|
+
] }),
|
|
17518
|
+
/* @__PURE__ */ jsx(GridCell, { children: /* @__PURE__ */ jsx(CellText, { $muted: true, children: filledPercent }) }),
|
|
17519
|
+
/* @__PURE__ */ jsxs(GridCell, { children: [
|
|
17520
|
+
/* @__PURE__ */ jsx(ActivityTag, { $color: meta.color, $bg: meta.bg, children: prettyLabel(order.status) }),
|
|
17521
|
+
order.triggerPrice != null && order.rejectionReason && /* @__PURE__ */ jsx(TriggerText, { title: order.rejectionReason, children: order.rejectionReason })
|
|
17522
|
+
] }),
|
|
17495
17523
|
/* @__PURE__ */ jsx(GridCell, { children: /* @__PURE__ */ jsx(CellText, { $muted: true, children: formatTimestamp(order.createdAt) }) })
|
|
17496
17524
|
] }, order.id);
|
|
17497
17525
|
})
|
|
@@ -17695,7 +17723,7 @@ function PortfolioActivityPanel({
|
|
|
17695
17723
|
/* @__PURE__ */ jsx(CancelConfirmTitle, { children: "Cancel All Orders" }),
|
|
17696
17724
|
/* @__PURE__ */ jsxs(CancelConfirmBody, { children: [
|
|
17697
17725
|
"Are you sure you want to cancel all ",
|
|
17698
|
-
|
|
17726
|
+
cancellableOrdersCount,
|
|
17699
17727
|
" open orders? This action cannot be undone."
|
|
17700
17728
|
] }),
|
|
17701
17729
|
/* @__PURE__ */ jsxs(CancelConfirmActions, { children: [
|