@loafmarkets/ui 0.1.396 → 0.1.398

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 CHANGED
@@ -442,6 +442,10 @@ type PropertyHeroHeaderProps = React$1.HTMLAttributes<HTMLDivElement> & {
442
442
  name: string;
443
443
  address?: string;
444
444
  location: string;
445
+ /** Text/border colour of the type/location badge pill (defaults to brand gold). */
446
+ typeBadgeColor?: string;
447
+ /** Fill of the type/location badge pill (defaults to translucent brand gold). */
448
+ typeBadgeBackground?: string;
445
449
  price?: number;
446
450
  currencySymbol?: string;
447
451
  changePercent?: number;
@@ -479,6 +483,10 @@ declare const PropertyHeroHeader: React$1.ForwardRefExoticComponent<React$1.HTML
479
483
  name: string;
480
484
  address?: string;
481
485
  location: string;
486
+ /** Text/border colour of the type/location badge pill (defaults to brand gold). */
487
+ typeBadgeColor?: string;
488
+ /** Fill of the type/location badge pill (defaults to translucent brand gold). */
489
+ typeBadgeBackground?: string;
482
490
  price?: number;
483
491
  currencySymbol?: string;
484
492
  changePercent?: number;
package/dist/index.d.ts CHANGED
@@ -442,6 +442,10 @@ type PropertyHeroHeaderProps = React$1.HTMLAttributes<HTMLDivElement> & {
442
442
  name: string;
443
443
  address?: string;
444
444
  location: string;
445
+ /** Text/border colour of the type/location badge pill (defaults to brand gold). */
446
+ typeBadgeColor?: string;
447
+ /** Fill of the type/location badge pill (defaults to translucent brand gold). */
448
+ typeBadgeBackground?: string;
445
449
  price?: number;
446
450
  currencySymbol?: string;
447
451
  changePercent?: number;
@@ -479,6 +483,10 @@ declare const PropertyHeroHeader: React$1.ForwardRefExoticComponent<React$1.HTML
479
483
  name: string;
480
484
  address?: string;
481
485
  location: string;
486
+ /** Text/border colour of the type/location badge pill (defaults to brand gold). */
487
+ typeBadgeColor?: string;
488
+ /** Fill of the type/location badge pill (defaults to translucent brand gold). */
489
+ typeBadgeBackground?: string;
482
490
  price?: number;
483
491
  currencySymbol?: string;
484
492
  changePercent?: number;
package/dist/index.js CHANGED
@@ -4640,6 +4640,8 @@ var PropertyHeroHeader = React5__namespace.forwardRef(
4640
4640
  name,
4641
4641
  address,
4642
4642
  location,
4643
+ typeBadgeColor = "#E6C87E",
4644
+ typeBadgeBackground = "rgba(230, 200, 126, 0.12)",
4643
4645
  price,
4644
4646
  currencySymbol = "$",
4645
4647
  changePercent,
@@ -4713,7 +4715,7 @@ var PropertyHeroHeader = React5__namespace.forwardRef(
4713
4715
  /* @__PURE__ */ jsxRuntime.jsx(NameGroup, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column" }, children: [
4714
4716
  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.75rem", flexWrap: "wrap" }, children: [
4715
4717
  /* @__PURE__ */ jsxRuntime.jsx("h1", { style: headingStyle, className: "break-words", children: name }),
4716
- location ? /* @__PURE__ */ jsxRuntime.jsx(TypeBadge, { children: location }) : null
4718
+ location ? /* @__PURE__ */ jsxRuntime.jsx(TypeBadge, { $color: typeBadgeColor, $bg: typeBadgeBackground, children: location }) : null
4717
4719
  ] }),
4718
4720
  address ? /* @__PURE__ */ jsxRuntime.jsx(AddressText, { children: address }) : null
4719
4721
  ] }) }),
@@ -4941,8 +4943,8 @@ var TypeBadge = styled10__default.default.span`
4941
4943
  letter-spacing: 0.03em;
4942
4944
  text-transform: uppercase;
4943
4945
  line-height: 1;
4944
- color: #E6C87E;
4945
- background: rgba(230, 200, 126, 0.12);
4946
+ color: ${(p) => p.$color};
4947
+ background: ${(p) => p.$bg};
4946
4948
  white-space: nowrap;
4947
4949
  flex-shrink: 0;
4948
4950
  `;
@@ -15567,6 +15569,10 @@ function PortfolioActivityPanel({
15567
15569
  ] }),
15568
15570
  expanded && /* @__PURE__ */ jsxRuntime.jsxs(CExpandedWrap, { children: [
15569
15571
  /* @__PURE__ */ jsxRuntime.jsxs(CDetailGrid3, { children: [
15572
+ /* @__PURE__ */ jsxRuntime.jsxs(CDetailItem, { children: [
15573
+ /* @__PURE__ */ jsxRuntime.jsx(CDLabel, { children: "Order ID" }),
15574
+ /* @__PURE__ */ jsxRuntime.jsx(CDValue, { children: order.id > 0 ? `#${order.id}` : "\u2014" })
15575
+ ] }),
15570
15576
  /* @__PURE__ */ jsxRuntime.jsxs(CDetailItem, { children: [
15571
15577
  /* @__PURE__ */ jsxRuntime.jsx(CDLabel, { children: "Type" }),
15572
15578
  /* @__PURE__ */ jsxRuntime.jsx(CDValue, { children: typeLabel })
@@ -15592,7 +15598,8 @@ function PortfolioActivityPanel({
15592
15598
  ] }, rowKey);
15593
15599
  }),
15594
15600
  mergedOrderHistory.length > 0 && !compactPositions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
15595
- /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 1fr", children: [
15601
+ /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "0.5fr 1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 1fr", children: [
15602
+ /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "ID" }),
15596
15603
  /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Asset" }),
15597
15604
  /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Side" }),
15598
15605
  /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Type" }),
@@ -15608,7 +15615,8 @@ function PortfolioActivityPanel({
15608
15615
  const filledPercent = order.quantity > 0 ? Math.round(order.filledQuantity / order.quantity * 100) : 0;
15609
15616
  const typeLabel = order.isOfferingOrder ? "Initial Offering" : prettyLabel(order.type);
15610
15617
  const sideColor = sideLabel(order.side) === "Buy" ? "#0ecb81" : "#f6465d";
15611
- return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 1fr", children: [
15618
+ return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "0.5fr 1.2fr 0.6fr 0.7fr 0.8fr 1fr 0.8fr 0.8fr 1fr", children: [
15619
+ /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: order.id > 0 ? `#${order.id}` : "\u2014" }) }),
15612
15620
  /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, $color: sideColor, $noHoverColor: true, $clickable: !!onAssetClick, onClick: onAssetClick ? () => onAssetClick(order.tokenName) : void 0, children: order.tokenName }) }),
15613
15621
  /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: sideLabel(order.side), children: sideLabel(order.side) }) }),
15614
15622
  /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $muted: true, children: typeLabel }) }),
@@ -15662,7 +15670,14 @@ function PortfolioActivityPanel({
15662
15670
  ] }),
15663
15671
  /* @__PURE__ */ jsxRuntime.jsx(CChevronWrap, { $open: expanded, children: /* @__PURE__ */ jsxRuntime.jsx(ChevronDown, {}) })
15664
15672
  ] }),
15665
- expanded && /* @__PURE__ */ jsxRuntime.jsx(CExpandedWrap, { children: /* @__PURE__ */ jsxRuntime.jsxs(CDetailGrid, { children: [
15673
+ expanded && /* @__PURE__ */ jsxRuntime.jsx(CExpandedWrap, { children: /* @__PURE__ */ jsxRuntime.jsxs(CDetailGrid3, { children: [
15674
+ /* @__PURE__ */ jsxRuntime.jsxs(CDetailItem, { children: [
15675
+ /* @__PURE__ */ jsxRuntime.jsx(CDLabel, { children: "Trade ID" }),
15676
+ /* @__PURE__ */ jsxRuntime.jsxs(CDValue, { children: [
15677
+ "#",
15678
+ trade.tradeId
15679
+ ] })
15680
+ ] }),
15666
15681
  /* @__PURE__ */ jsxRuntime.jsxs(CDetailItem, { children: [
15667
15682
  /* @__PURE__ */ jsxRuntime.jsx(CDLabel, { children: "Price" }),
15668
15683
  /* @__PURE__ */ jsxRuntime.jsx(CDValue, { children: formatCurrency4(trade.price) })
@@ -15679,7 +15694,8 @@ function PortfolioActivityPanel({
15679
15694
  ] }, rowKey);
15680
15695
  }),
15681
15696
  tradeHistory.length > 0 && !compactPositions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
15682
- /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "1.2fr 0.6fr 0.8fr 1fr 1fr 1fr 1fr 36px", children: [
15697
+ /* @__PURE__ */ jsxRuntime.jsxs(GridHeader, { $columns: "0.5fr 1.2fr 0.6fr 0.8fr 1fr 1fr 1fr 1fr 36px", children: [
15698
+ /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "ID" }),
15683
15699
  /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Asset" }),
15684
15700
  /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Side" }),
15685
15701
  /* @__PURE__ */ jsxRuntime.jsx(GridHeaderCell, { children: "Qty" }),
@@ -15697,7 +15713,11 @@ function PortfolioActivityPanel({
15697
15713
  const settlementLabel = isSettled ? "Settled" : isFailed ? "Settlement Failed" : isSettling ? prettyLabel(trade.status) : "\u2014";
15698
15714
  const settlementMeta = isSettled ? { color: "#0ecb81", bg: "rgba(14,203,129,0.1)" } : isFailed ? { color: "#f6465d", bg: "rgba(246,70,93,0.12)" } : isSettling ? { color: "#E6C87E", bg: "rgba(240,185,11,0.15)" } : null;
15699
15715
  const sideColor = sideLabel(trade.side) === "Buy" ? "#0ecb81" : "#f6465d";
15700
- return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "1.2fr 0.6fr 0.8fr 1fr 1fr 1fr 1fr 36px", children: [
15716
+ return /* @__PURE__ */ jsxRuntime.jsxs(GridRow, { $columns: "0.5fr 1.2fr 0.6fr 0.8fr 1fr 1fr 1fr 1fr 36px", children: [
15717
+ /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CellText, { $muted: true, children: [
15718
+ "#",
15719
+ trade.tradeId
15720
+ ] }) }),
15701
15721
  /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(CellText, { $primary: true, $color: sideColor, $noHoverColor: true, $clickable: !!onAssetClick, onClick: onAssetClick ? () => onAssetClick(trade.tokenName) : void 0, children: trade.tokenName }) }),
15702
15722
  /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsx(SideBadge, { $side: sideLabel(trade.side), children: sideLabel(trade.side) }) }),
15703
15723
  /* @__PURE__ */ jsxRuntime.jsx(GridCell, { children: /* @__PURE__ */ jsxRuntime.jsxs(CellText, { children: [