@loafmarkets/ui 0.1.385 → 0.1.387

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.mjs CHANGED
@@ -5036,15 +5036,7 @@ function useIsNarrow(maxWidthPx = 768) {
5036
5036
  }, [query]);
5037
5037
  return narrow;
5038
5038
  }
5039
- var DEFAULT_TRADE_PATH = "/trade";
5040
5039
  var DEFAULT_HOME_PATH = "/";
5041
- var DEFAULT_ABOUT_PATH = "/about";
5042
- var DEFAULT_LEARN_PATH = "/learn";
5043
- var DEFAULT_API_PATH = "/api";
5044
- var DEFAULT_PROPERTY_MAP_PATH = "/map";
5045
- var DEFAULT_LEADERBOARD_PATH = "/league";
5046
- var DEFAULT_LEADERBOARD_PAGE_PATH = "/leaderboard";
5047
- var DEFAULT_PORTFOLIO_PATH = "/portfolio";
5048
5040
  var DEFAULT_LOAF_LIQUIDITY_PATH = "/loaf-liquidity";
5049
5041
  var DEFAULT_AUTH_RETURN_PARAM = "returnTo";
5050
5042
  var LOGIN_POPUP_EVENT = "loaf:open-login-popup";
@@ -5052,21 +5044,13 @@ var Header = ({
5052
5044
  currentUser,
5053
5045
  isAuthenticated = false,
5054
5046
  locationPath = DEFAULT_HOME_PATH,
5055
- activeTab,
5047
+ navItems,
5048
+ activeKey,
5056
5049
  onNavigate,
5057
5050
  onLogout,
5058
5051
  onSignInClick,
5059
5052
  loginPopupComponent: LoginPopupComponent,
5060
- tradePath = DEFAULT_TRADE_PATH,
5061
5053
  homePath = DEFAULT_HOME_PATH,
5062
- aboutPath = DEFAULT_ABOUT_PATH,
5063
- learnPath = DEFAULT_LEARN_PATH,
5064
- apiPath = DEFAULT_API_PATH,
5065
- offeringsPath,
5066
- propertyMapPath = DEFAULT_PROPERTY_MAP_PATH,
5067
- leaderboardPath = DEFAULT_LEADERBOARD_PATH,
5068
- leaderboardPagePath = DEFAULT_LEADERBOARD_PAGE_PATH,
5069
- portfolioPath = DEFAULT_PORTFOLIO_PATH,
5070
5054
  loafLiquidityPath = DEFAULT_LOAF_LIQUIDITY_PATH,
5071
5055
  authLoginUrl,
5072
5056
  authReturnParam = DEFAULT_AUTH_RETURN_PARAM,
@@ -5074,12 +5058,10 @@ var Header = ({
5074
5058
  logoHref,
5075
5059
  onLogoClick,
5076
5060
  onLoafLiquidityClick,
5077
- onTradeClick,
5078
5061
  onProfileNavigate: _onProfileNavigate,
5079
5062
  onOrdersNavigate: _onOrdersNavigate,
5080
5063
  onWalletNavigate: _onWalletNavigate,
5081
5064
  onSettingsClick,
5082
- showTradeTab = true,
5083
5065
  portfolioSummary,
5084
5066
  fundsPending = false,
5085
5067
  transparentOnTop = false
@@ -5223,10 +5205,6 @@ var Header = ({
5223
5205
  window.location.href = path;
5224
5206
  }
5225
5207
  };
5226
- const handleNavigation = (path) => {
5227
- closeMenus();
5228
- performNavigation(path);
5229
- };
5230
5208
  const handleLogoNavigation = (event) => {
5231
5209
  event.preventDefault();
5232
5210
  closeMenus();
@@ -5244,16 +5222,19 @@ var Header = ({
5244
5222
  }
5245
5223
  performNavigation(resolvedLoafLiquidityPath);
5246
5224
  };
5247
- const handleTradeNavigation = () => {
5248
- if (!showTradeTab) {
5225
+ const handleNavItem = (item) => {
5226
+ closeMenus();
5227
+ if (item.onSelect) {
5228
+ item.onSelect();
5249
5229
  return;
5250
5230
  }
5251
- closeMenus();
5252
- if (onTradeClick) {
5253
- onTradeClick();
5231
+ if (item.external) {
5232
+ if (typeof window !== "undefined") {
5233
+ window.open(item.path, "_blank", "noopener,noreferrer");
5234
+ }
5254
5235
  return;
5255
5236
  }
5256
- performNavigation(resolvedTradePath);
5237
+ performNavigation(item.path);
5257
5238
  };
5258
5239
  const handleLogoutClick = async (event) => {
5259
5240
  event?.preventDefault();
@@ -5331,42 +5312,23 @@ var Header = ({
5331
5312
  setShowLoginPopup(false);
5332
5313
  setLoginPopupInitialView(void 0);
5333
5314
  }, []);
5334
- const resolvedTradePath = tradePath ?? DEFAULT_TRADE_PATH;
5335
5315
  const resolvedHomePath = homePath ?? DEFAULT_HOME_PATH;
5336
- const resolvedAboutPath = aboutPath ?? DEFAULT_ABOUT_PATH;
5337
- const resolvedLearnPath = learnPath ?? DEFAULT_LEARN_PATH;
5338
- const resolvedApiPath = apiPath ?? DEFAULT_API_PATH;
5339
- const resolvedOfferingsPath = offeringsPath ?? void 0;
5340
- const offeringsHref = resolvedOfferingsPath ?? resolvedHomePath;
5341
- const resolvedPropertyMapPath = propertyMapPath ?? DEFAULT_PROPERTY_MAP_PATH;
5342
- const resolvedLeaderboardPath = leaderboardPath ?? DEFAULT_LEADERBOARD_PATH;
5343
- const resolvedLeaderboardPagePath = leaderboardPagePath ?? DEFAULT_LEADERBOARD_PAGE_PATH;
5344
- const resolvedPortfolioPath = portfolioPath ?? DEFAULT_PORTFOLIO_PATH;
5345
5316
  const resolvedLoafLiquidityPath = loafLiquidityPath ?? DEFAULT_LOAF_LIQUIDITY_PATH;
5346
- const inferredActiveTab = (() => {
5347
- if (showTradeTab && locationPath === resolvedTradePath) return "trade";
5348
- if (locationPath === resolvedHomePath) return "home";
5349
- if (locationPath === resolvedAboutPath) return "about";
5350
- if (locationPath === resolvedLearnPath) return "learn";
5351
- if (locationPath === resolvedApiPath) return "api";
5352
- if (resolvedOfferingsPath && locationPath.startsWith(resolvedOfferingsPath)) return "offerings";
5353
- if (locationPath === resolvedPropertyMapPath) return "propertyMap";
5354
- if (locationPath === resolvedLeaderboardPagePath) return "leaderboardPage";
5355
- if (locationPath === resolvedLeaderboardPath) return "leaderboard";
5356
- if (locationPath === resolvedPortfolioPath) return "portfolio";
5357
- return null;
5358
- })();
5359
- const resolvedActiveTab = activeTab ?? inferredActiveTab;
5360
- const tradeActive = showTradeTab && resolvedActiveTab === "trade";
5361
- const homeActive = resolvedActiveTab === "home";
5362
- const offeringsActive = resolvedActiveTab === "offerings";
5363
- const propertyMapActive = resolvedActiveTab === "propertyMap";
5364
- const leaderboardActive = resolvedActiveTab === "leaderboard";
5365
- const leaderboardPageActive = resolvedActiveTab === "leaderboardPage";
5366
- const aboutActive = resolvedActiveTab === "about";
5367
- const portfolioActive = resolvedActiveTab === "portfolio";
5368
- const learnActive = resolvedActiveTab === "learn";
5369
- const apiActive = resolvedActiveTab === "api";
5317
+ const inferredActiveKey = navItems.find(
5318
+ (item) => item.external ? false : item.match === "prefix" ? locationPath.startsWith(item.path) : locationPath === item.path
5319
+ )?.key ?? null;
5320
+ const resolvedActiveKey = activeKey ?? inferredActiveKey;
5321
+ const primaryItems = navItems.filter((item) => (item.group ?? "primary") === "primary");
5322
+ const moreItems = navItems.filter((item) => item.group === "more");
5323
+ const moreActive = moreItems.some((item) => item.key === resolvedActiveKey);
5324
+ const navLinkClick = (item) => (event) => {
5325
+ if (item.external) {
5326
+ closeMenus();
5327
+ return;
5328
+ }
5329
+ event.preventDefault();
5330
+ handleNavItem(item);
5331
+ };
5370
5332
  return /* @__PURE__ */ jsxs(Fragment, { children: [
5371
5333
  /* @__PURE__ */ jsx(SafeAreaCover, {}),
5372
5334
  /* @__PURE__ */ jsx(Overlay, { $isOpen: isMobileMenuOpen, onClick: () => setIsMobileMenuOpen(false) }),
@@ -5383,108 +5345,23 @@ var Header = ({
5383
5345
  style: { display: "flex", flexDirection: "row", alignItems: "center", height: "56px" },
5384
5346
  className: "desktop-nav",
5385
5347
  children: [
5386
- /* @__PURE__ */ jsx(
5387
- NavLink,
5388
- {
5389
- href: resolvedHomePath,
5390
- className: homeActive ? "active" : "",
5391
- onClick: (event) => {
5392
- event.preventDefault();
5393
- handleNavigation(resolvedHomePath);
5394
- },
5395
- children: "Home"
5396
- }
5397
- ),
5398
- /* @__PURE__ */ jsx(
5399
- NavLink,
5400
- {
5401
- href: resolvedPortfolioPath,
5402
- className: portfolioActive ? "active" : "",
5403
- onClick: (event) => {
5404
- event.preventDefault();
5405
- handleNavigation(resolvedPortfolioPath);
5406
- },
5407
- children: "Portfolio"
5408
- }
5409
- ),
5410
- showTradeTab && /* @__PURE__ */ jsx(
5411
- NavLink,
5412
- {
5413
- href: resolvedTradePath,
5414
- className: tradeActive ? "active" : "",
5415
- onClick: (event) => {
5416
- event.preventDefault();
5417
- handleTradeNavigation();
5418
- },
5419
- children: "Trade"
5420
- }
5421
- ),
5422
- /* @__PURE__ */ jsx(
5423
- NavLink,
5424
- {
5425
- href: offeringsHref,
5426
- className: offeringsActive ? "active" : "",
5427
- onClick: (event) => {
5428
- event.preventDefault();
5429
- handleNavigation(offeringsHref);
5430
- },
5431
- children: "Initial Offerings"
5432
- }
5433
- ),
5434
- /* @__PURE__ */ jsx(
5435
- NavLink,
5436
- {
5437
- href: resolvedPropertyMapPath,
5438
- className: propertyMapActive ? "active" : "",
5439
- onClick: (event) => {
5440
- event.preventDefault();
5441
- handleNavigation(resolvedPropertyMapPath);
5442
- },
5443
- children: "Property Map"
5444
- }
5445
- ),
5446
- /* @__PURE__ */ jsx(
5348
+ primaryItems.map((item) => /* @__PURE__ */ jsx(
5447
5349
  NavLink,
5448
5350
  {
5449
- href: resolvedLeaderboardPath,
5450
- className: leaderboardActive ? "active" : "",
5451
- onClick: (event) => {
5452
- event.preventDefault();
5453
- handleNavigation(resolvedLeaderboardPath);
5454
- },
5455
- children: "Competition"
5456
- }
5457
- ),
5458
- /* @__PURE__ */ jsx(
5459
- NavLink,
5460
- {
5461
- href: resolvedLeaderboardPagePath,
5462
- className: leaderboardPageActive ? "active" : "",
5463
- onClick: (event) => {
5464
- event.preventDefault();
5465
- handleNavigation(resolvedLeaderboardPagePath);
5466
- },
5467
- children: "Leaderboard"
5468
- }
5469
- ),
5470
- /* @__PURE__ */ jsx(
5471
- NavLink,
5472
- {
5473
- href: resolvedLearnPath,
5474
- className: learnActive ? "active" : "",
5475
- onClick: (event) => {
5476
- event.preventDefault();
5477
- handleNavigation(resolvedLearnPath);
5478
- },
5479
- children: "Learn"
5480
- }
5481
- ),
5482
- /* @__PURE__ */ jsxs(MoreMenu, { className: "more-menu", children: [
5351
+ href: item.path,
5352
+ ...item.external ? { target: "_blank", rel: "noopener noreferrer" } : {},
5353
+ className: item.key === resolvedActiveKey ? "active" : "",
5354
+ onClick: navLinkClick(item),
5355
+ children: item.label
5356
+ },
5357
+ item.key
5358
+ )),
5359
+ moreItems.length > 0 && /* @__PURE__ */ jsxs(MoreMenu, { className: "more-menu", children: [
5483
5360
  /* @__PURE__ */ jsxs(
5484
5361
  MoreTrigger,
5485
5362
  {
5486
5363
  type: "button",
5487
- className: `${isMoreMenuOpen ? "open" : ""} ${aboutActive || apiActive ? "active" : ""}`,
5364
+ className: `${isMoreMenuOpen ? "open" : ""} ${moreActive ? "active" : ""}`,
5488
5365
  "aria-haspopup": "true",
5489
5366
  "aria-expanded": isMoreMenuOpen,
5490
5367
  onClick: () => setIsMoreMenuOpen((open) => !open),
@@ -5494,42 +5371,17 @@ var Header = ({
5494
5371
  ]
5495
5372
  }
5496
5373
  ),
5497
- isMoreMenuOpen && /* @__PURE__ */ jsxs(MoreDropdown, { children: [
5498
- /* @__PURE__ */ jsx(
5499
- MoreItem,
5500
- {
5501
- href: resolvedAboutPath,
5502
- className: aboutActive ? "active" : "",
5503
- onClick: (event) => {
5504
- event.preventDefault();
5505
- handleNavigation(resolvedAboutPath);
5506
- },
5507
- children: "About"
5508
- }
5509
- ),
5510
- /* @__PURE__ */ jsx(
5511
- MoreItem,
5512
- {
5513
- href: resolvedApiPath,
5514
- className: apiActive ? "active" : "",
5515
- onClick: (event) => {
5516
- event.preventDefault();
5517
- handleNavigation(resolvedApiPath);
5518
- },
5519
- children: "API"
5520
- }
5521
- ),
5522
- /* @__PURE__ */ jsx(
5523
- MoreItem,
5524
- {
5525
- href: "https://docs.loafmarkets.com/en/",
5526
- target: "_blank",
5527
- rel: "noopener noreferrer",
5528
- onClick: () => setIsMoreMenuOpen(false),
5529
- children: "Docs"
5530
- }
5531
- )
5532
- ] })
5374
+ isMoreMenuOpen && /* @__PURE__ */ jsx(MoreDropdown, { children: moreItems.map((item) => /* @__PURE__ */ jsx(
5375
+ MoreItem,
5376
+ {
5377
+ href: item.path,
5378
+ ...item.external ? { target: "_blank", rel: "noopener noreferrer" } : {},
5379
+ className: item.key === resolvedActiveKey ? "active" : "",
5380
+ onClick: navLinkClick(item),
5381
+ children: item.label
5382
+ },
5383
+ item.key
5384
+ )) })
5533
5385
  ] }),
5534
5386
  /* @__PURE__ */ jsx("div", { style: { marginLeft: "auto", display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsx(
5535
5387
  "div",
@@ -5552,31 +5404,7 @@ var Header = ({
5552
5404
  ),
5553
5405
  /* @__PURE__ */ jsxs("div", { className: "mobile-menu-content", children: [
5554
5406
  /* @__PURE__ */ jsx(MobileMenuHeader, { children: /* @__PURE__ */ jsx(MobileMenuClose, { onClick: () => setIsMobileMenuOpen(false), "aria-label": "Close menu", children: /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" }) }) }) }),
5555
- /* @__PURE__ */ jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedHomePath), children: "Home" }),
5556
- /* @__PURE__ */ jsx(
5557
- MobileNavItem,
5558
- {
5559
- onClick: () => handleNavigation(resolvedPortfolioPath),
5560
- children: "Portfolio"
5561
- }
5562
- ),
5563
- showTradeTab && /* @__PURE__ */ jsx(
5564
- MobileNavItem,
5565
- {
5566
- onClick: () => {
5567
- handleTradeNavigation();
5568
- },
5569
- children: "Trade"
5570
- }
5571
- ),
5572
- /* @__PURE__ */ jsx(MobileNavItem, { onClick: () => handleNavigation(offeringsHref), children: "Initial Offerings" }),
5573
- /* @__PURE__ */ jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedPropertyMapPath), children: "Property Map" }),
5574
- /* @__PURE__ */ jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedLeaderboardPath), children: "Competition" }),
5575
- /* @__PURE__ */ jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedLeaderboardPagePath), children: "Leaderboard" }),
5576
- /* @__PURE__ */ jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedLearnPath), children: "Learn" }),
5577
- /* @__PURE__ */ jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedAboutPath), children: "About" }),
5578
- /* @__PURE__ */ jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedApiPath), children: "API" }),
5579
- /* @__PURE__ */ jsx(MobileNavItem, { onClick: () => window.open("https://docs.loafmarkets.com/en/", "_blank", "noopener,noreferrer"), children: "Docs" }),
5407
+ navItems.map((item) => /* @__PURE__ */ jsx(MobileNavItem, { onClick: () => handleNavItem(item), children: item.label }, item.key)),
5580
5408
  /* @__PURE__ */ jsx("div", { style: { borderTop: "1px solid #2b3139", margin: "8px 0" } }),
5581
5409
  /* @__PURE__ */ jsx(
5582
5410
  MobileNavItem,
@@ -14968,6 +14796,7 @@ function PortfolioActivityPanel({
14968
14796
  showPositionsTab = false,
14969
14797
  showSubscriptionsTab = true,
14970
14798
  onPositionClick,
14799
+ onSharePosition,
14971
14800
  onAssetClick,
14972
14801
  onClosePosition,
14973
14802
  offeringOrders = [],
@@ -15259,17 +15088,23 @@ function PortfolioActivityPanel({
15259
15088
  ] }),
15260
15089
  /* @__PURE__ */ jsxs(CPnlCell, { children: [
15261
15090
  /* @__PURE__ */ jsx(CCellLabel, { children: "PNL (%)" }),
15262
- /* @__PURE__ */ jsxs(CPnlLine, { children: [
15263
- /* @__PURE__ */ jsxs(CPnlValue, { $positive: isPositive, children: [
15264
- isPositive ? "+" : "-",
15265
- formatCurrency4(Math.abs(pnl))
15091
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.4rem" }, children: [
15092
+ /* @__PURE__ */ jsxs(CPnlLine, { children: [
15093
+ /* @__PURE__ */ jsxs(CPnlValue, { $positive: isPositive, children: [
15094
+ isPositive ? "+" : "-",
15095
+ formatCurrency4(Math.abs(pnl))
15096
+ ] }),
15097
+ /* @__PURE__ */ jsxs(CPnlPct, { $positive: isPositive, children: [
15098
+ "(",
15099
+ isPositive ? "+" : "",
15100
+ pnlPercent.toFixed(1),
15101
+ "%)"
15102
+ ] })
15266
15103
  ] }),
15267
- /* @__PURE__ */ jsxs(CPnlPct, { $positive: isPositive, children: [
15268
- "(",
15269
- isPositive ? "+" : "",
15270
- pnlPercent.toFixed(1),
15271
- "%)"
15272
- ] })
15104
+ onSharePosition && !pos.settling && /* @__PURE__ */ jsx(CShareIconBtn, { role: "button", "aria-label": "Share position", onClick: (e) => {
15105
+ e.stopPropagation();
15106
+ onSharePosition(pos);
15107
+ }, children: /* @__PURE__ */ jsx(ShareIcon, {}) })
15273
15108
  ] })
15274
15109
  ] }),
15275
15110
  /* @__PURE__ */ jsx(CChevronWrap, { $open: posExpanded, children: /* @__PURE__ */ jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "rgba(255,255,255,0.5)", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" }) }) })
@@ -15289,16 +15124,16 @@ function PortfolioActivityPanel({
15289
15124
  /* @__PURE__ */ jsx(CDValue, { children: formatCurrency4(pos.marketPrice) })
15290
15125
  ] })
15291
15126
  ] }),
15292
- onClosePosition && !pos.settling && /* @__PURE__ */ jsxs(CActionRow, { children: [
15293
- /* @__PURE__ */ jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice), children: "Market Sell" }),
15294
- /* @__PURE__ */ jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice), children: "Limit Sell" })
15127
+ (onClosePosition || onSharePosition) && !pos.settling && /* @__PURE__ */ jsxs(CActionRow, { children: [
15128
+ onClosePosition && /* @__PURE__ */ jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice), children: "Market Sell" }),
15129
+ onClosePosition && /* @__PURE__ */ jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice), children: "Limit Sell" })
15295
15130
  ] })
15296
15131
  ] })
15297
15132
  ] }, pos.tokenName);
15298
15133
  })
15299
15134
  ] }),
15300
15135
  positions.length > 0 && !compactPositions && /* @__PURE__ */ jsxs(Fragment, { children: [
15301
- /* @__PURE__ */ jsxs(PositionsHeader, { $hasClose: !!onClosePosition, children: [
15136
+ /* @__PURE__ */ jsxs(PositionsHeader, { $hasClose: !!(onClosePosition || onSharePosition), children: [
15302
15137
  /* @__PURE__ */ jsxs(SortableHeaderCell, { $active: posSortKey === "asset", onClick: () => handlePosSort("asset"), children: [
15303
15138
  "Asset ",
15304
15139
  posSortKey === "asset" && (posSortAsc ? "\u2191" : "\u2193")
@@ -15331,7 +15166,7 @@ function PortfolioActivityPanel({
15331
15166
  const pnl = pos.propertyPnl ?? currentValue - costBasis;
15332
15167
  const pnlPercent = pos.propertyPnlPercent ?? pos.percentChange ?? 0;
15333
15168
  const isPositive = pnl >= 0;
15334
- return /* @__PURE__ */ jsxs(PositionsRow, { $hasClose: !!onClosePosition, children: [
15169
+ return /* @__PURE__ */ jsxs(PositionsRow, { $hasClose: !!(onClosePosition || onSharePosition), children: [
15335
15170
  /* @__PURE__ */ jsx(PositionsCell, { children: /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
15336
15171
  /* @__PURE__ */ jsx(HoldingsPropertyLink, { onClick: () => onPositionClick?.(pos.tokenName, pos.isIpoAllocation), children: pos.tokenName }),
15337
15172
  pos.settling && /* @__PURE__ */ jsx(SettlingTip, { children: /* @__PURE__ */ jsx(SettlingSpinner, {}) })
@@ -15348,23 +15183,29 @@ function PortfolioActivityPanel({
15348
15183
  ] }) }),
15349
15184
  /* @__PURE__ */ jsx(PositionsCell, { children: /* @__PURE__ */ jsx("span", { style: { color: "rgba(255,255,255,0.7)", fontSize: "0.8rem" }, children: formatCurrency4(pos.averageEntryPrice) }) }),
15350
15185
  /* @__PURE__ */ jsx(PositionsCell, { children: /* @__PURE__ */ jsx("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: formatCurrency4(pos.marketPrice) }) }),
15351
- /* @__PURE__ */ jsxs(PositionsCell, { children: [
15352
- /* @__PURE__ */ jsxs(PnLAmount, { $positive: isPositive, children: [
15353
- isPositive ? "+" : "-",
15354
- formatCurrency4(Math.abs(pnl))
15186
+ /* @__PURE__ */ jsx(PositionsCell, { children: /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.4rem" }, children: [
15187
+ /* @__PURE__ */ jsxs("span", { style: { display: "flex", flexDirection: "column" }, children: [
15188
+ /* @__PURE__ */ jsxs(PnLAmount, { $positive: isPositive, children: [
15189
+ isPositive ? "+" : "-",
15190
+ formatCurrency4(Math.abs(pnl))
15191
+ ] }),
15192
+ /* @__PURE__ */ jsxs(PnLPercentage, { $positive: isPositive, children: [
15193
+ isPositive ? "+" : "",
15194
+ pnlPercent.toFixed(1),
15195
+ "%"
15196
+ ] })
15355
15197
  ] }),
15356
- /* @__PURE__ */ jsxs(PnLPercentage, { $positive: isPositive, children: [
15357
- isPositive ? "+" : "",
15358
- pnlPercent.toFixed(1),
15359
- "%"
15360
- ] })
15361
- ] }),
15362
- onClosePosition && /* @__PURE__ */ jsx(PositionsCell, { children: !pos.settling && /* @__PURE__ */ jsxs(CloseActions, { children: [
15363
- /* @__PURE__ */ jsx(CloseBtn, { onClick: (e) => {
15198
+ onSharePosition && !pos.settling && /* @__PURE__ */ jsx(CShareIconBtn, { role: "button", "aria-label": "Share position", onClick: (e) => {
15199
+ e.stopPropagation();
15200
+ onSharePosition(pos);
15201
+ }, children: /* @__PURE__ */ jsx(ShareIcon, {}) })
15202
+ ] }) }),
15203
+ (onClosePosition || onSharePosition) && /* @__PURE__ */ jsx(PositionsCell, { children: !pos.settling && /* @__PURE__ */ jsxs(CloseActions, { children: [
15204
+ onClosePosition && /* @__PURE__ */ jsx(CloseBtn, { onClick: (e) => {
15364
15205
  e.stopPropagation();
15365
15206
  onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice);
15366
15207
  }, children: "Market Sell" }),
15367
- /* @__PURE__ */ jsx(CloseBtn, { onClick: (e) => {
15208
+ onClosePosition && /* @__PURE__ */ jsx(CloseBtn, { onClick: (e) => {
15368
15209
  e.stopPropagation();
15369
15210
  onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice);
15370
15211
  }, children: "Limit Sell" })
@@ -16255,6 +16096,29 @@ var CloseBtn = styled10.button`
16255
16096
  border-color: rgba(230, 200, 126, 0.5);
16256
16097
  }
16257
16098
  `;
16099
+ var CShareIconBtn = styled10.span`
16100
+ display: inline-flex;
16101
+ align-items: center;
16102
+ justify-content: center;
16103
+ width: 26px;
16104
+ height: 26px;
16105
+ border-radius: 6px;
16106
+ color: #E6C87E;
16107
+ cursor: pointer;
16108
+ pointer-events: auto;
16109
+ transition: color 0.15s ease, background 0.15s ease;
16110
+ &:hover {
16111
+ color: #F2D898;
16112
+ background: rgba(230, 200, 126, 0.14);
16113
+ }
16114
+ &:active { background: rgba(230, 200, 126, 0.22); }
16115
+ svg { width: 15px; height: 15px; }
16116
+ `;
16117
+ var ShareIcon = () => /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
16118
+ /* @__PURE__ */ jsx("path", { d: "M4 12v7a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-7" }),
16119
+ /* @__PURE__ */ jsx("polyline", { points: "16 6 12 2 8 6" }),
16120
+ /* @__PURE__ */ jsx("line", { x1: "12", y1: "2", x2: "12", y2: "15" })
16121
+ ] });
16258
16122
  var CloseAllHeaderBtn = styled10.button`
16259
16123
  background: rgba(230, 200, 126, 0.1);
16260
16124
  border: 1px solid rgba(230, 200, 126, 0.3);