@loafmarkets/ui 0.1.385 → 0.1.387

package/dist/index.js

@@ -5061,15 +5061,7 @@ function useIsNarrow(maxWidthPx = 768) {
   }, [query]);
   return narrow;
 }
-var DEFAULT_TRADE_PATH = "/trade";
 var DEFAULT_HOME_PATH = "/";
-var DEFAULT_ABOUT_PATH = "/about";
-var DEFAULT_LEARN_PATH = "/learn";
-var DEFAULT_API_PATH = "/api";
-var DEFAULT_PROPERTY_MAP_PATH = "/map";
-var DEFAULT_LEADERBOARD_PATH = "/league";
-var DEFAULT_LEADERBOARD_PAGE_PATH = "/leaderboard";
-var DEFAULT_PORTFOLIO_PATH = "/portfolio";
 var DEFAULT_LOAF_LIQUIDITY_PATH = "/loaf-liquidity";
 var DEFAULT_AUTH_RETURN_PARAM = "returnTo";
 var LOGIN_POPUP_EVENT = "loaf:open-login-popup";
@@ -5077,21 +5069,13 @@ var Header = ({
   currentUser,
   isAuthenticated = false,
   locationPath = DEFAULT_HOME_PATH,
-  activeTab,
+  navItems,
+  activeKey,
   onNavigate,
   onLogout,
   onSignInClick,
   loginPopupComponent: LoginPopupComponent,
-  tradePath = DEFAULT_TRADE_PATH,
   homePath = DEFAULT_HOME_PATH,
-  aboutPath = DEFAULT_ABOUT_PATH,
-  learnPath = DEFAULT_LEARN_PATH,
-  apiPath = DEFAULT_API_PATH,
-  offeringsPath,
-  propertyMapPath = DEFAULT_PROPERTY_MAP_PATH,
-  leaderboardPath = DEFAULT_LEADERBOARD_PATH,
-  leaderboardPagePath = DEFAULT_LEADERBOARD_PAGE_PATH,
-  portfolioPath = DEFAULT_PORTFOLIO_PATH,
   loafLiquidityPath = DEFAULT_LOAF_LIQUIDITY_PATH,
   authLoginUrl,
   authReturnParam = DEFAULT_AUTH_RETURN_PARAM,
@@ -5099,12 +5083,10 @@ var Header = ({
   logoHref,
   onLogoClick,
   onLoafLiquidityClick,
-  onTradeClick,
   onProfileNavigate: _onProfileNavigate,
   onOrdersNavigate: _onOrdersNavigate,
   onWalletNavigate: _onWalletNavigate,
   onSettingsClick,
-  showTradeTab = true,
   portfolioSummary,
   fundsPending = false,
   transparentOnTop = false
@@ -5248,10 +5230,6 @@ var Header = ({
       window.location.href = path;
     }
   };
-  const handleNavigation = (path) => {
-    closeMenus();
-    performNavigation(path);
-  };
   const handleLogoNavigation = (event) => {
     event.preventDefault();
     closeMenus();
@@ -5269,16 +5247,19 @@ var Header = ({
     }
     performNavigation(resolvedLoafLiquidityPath);
   };
-  const handleTradeNavigation = () => {
-    if (!showTradeTab) {
+  const handleNavItem = (item) => {
+    closeMenus();
+    if (item.onSelect) {
+      item.onSelect();
       return;
     }
-    closeMenus();
-    if (onTradeClick) {
-      onTradeClick();
+    if (item.external) {
+      if (typeof window !== "undefined") {
+        window.open(item.path, "_blank", "noopener,noreferrer");
+      }
       return;
     }
-    performNavigation(resolvedTradePath);
+    performNavigation(item.path);
   };
   const handleLogoutClick = async (event) => {
     event?.preventDefault();
@@ -5356,42 +5337,23 @@ var Header = ({
     setShowLoginPopup(false);
     setLoginPopupInitialView(void 0);
   }, []);
-  const resolvedTradePath = tradePath ?? DEFAULT_TRADE_PATH;
   const resolvedHomePath = homePath ?? DEFAULT_HOME_PATH;
-  const resolvedAboutPath = aboutPath ?? DEFAULT_ABOUT_PATH;
-  const resolvedLearnPath = learnPath ?? DEFAULT_LEARN_PATH;
-  const resolvedApiPath = apiPath ?? DEFAULT_API_PATH;
-  const resolvedOfferingsPath = offeringsPath ?? void 0;
-  const offeringsHref = resolvedOfferingsPath ?? resolvedHomePath;
-  const resolvedPropertyMapPath = propertyMapPath ?? DEFAULT_PROPERTY_MAP_PATH;
-  const resolvedLeaderboardPath = leaderboardPath ?? DEFAULT_LEADERBOARD_PATH;
-  const resolvedLeaderboardPagePath = leaderboardPagePath ?? DEFAULT_LEADERBOARD_PAGE_PATH;
-  const resolvedPortfolioPath = portfolioPath ?? DEFAULT_PORTFOLIO_PATH;
   const resolvedLoafLiquidityPath = loafLiquidityPath ?? DEFAULT_LOAF_LIQUIDITY_PATH;
-  const inferredActiveTab = (() => {
-    if (showTradeTab && locationPath === resolvedTradePath) return "trade";
-    if (locationPath === resolvedHomePath) return "home";
-    if (locationPath === resolvedAboutPath) return "about";
-    if (locationPath === resolvedLearnPath) return "learn";
-    if (locationPath === resolvedApiPath) return "api";
-    if (resolvedOfferingsPath && locationPath.startsWith(resolvedOfferingsPath)) return "offerings";
-    if (locationPath === resolvedPropertyMapPath) return "propertyMap";
-    if (locationPath === resolvedLeaderboardPagePath) return "leaderboardPage";
-    if (locationPath === resolvedLeaderboardPath) return "leaderboard";
-    if (locationPath === resolvedPortfolioPath) return "portfolio";
-    return null;
-  })();
-  const resolvedActiveTab = activeTab ?? inferredActiveTab;
-  const tradeActive = showTradeTab && resolvedActiveTab === "trade";
-  const homeActive = resolvedActiveTab === "home";
-  const offeringsActive = resolvedActiveTab === "offerings";
-  const propertyMapActive = resolvedActiveTab === "propertyMap";
-  const leaderboardActive = resolvedActiveTab === "leaderboard";
-  const leaderboardPageActive = resolvedActiveTab === "leaderboardPage";
-  const aboutActive = resolvedActiveTab === "about";
-  const portfolioActive = resolvedActiveTab === "portfolio";
-  const learnActive = resolvedActiveTab === "learn";
-  const apiActive = resolvedActiveTab === "api";
+  const inferredActiveKey = navItems.find(
+    (item) => item.external ? false : item.match === "prefix" ? locationPath.startsWith(item.path) : locationPath === item.path
+  )?.key ?? null;
+  const resolvedActiveKey = activeKey ?? inferredActiveKey;
+  const primaryItems = navItems.filter((item) => (item.group ?? "primary") === "primary");
+  const moreItems = navItems.filter((item) => item.group === "more");
+  const moreActive = moreItems.some((item) => item.key === resolvedActiveKey);
+  const navLinkClick = (item) => (event) => {
+    if (item.external) {
+      closeMenus();
+      return;
+    }
+    event.preventDefault();
+    handleNavItem(item);
+  };
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(SafeAreaCover, {}),
     /* @__PURE__ */ jsxRuntime.jsx(Overlay, { $isOpen: isMobileMenuOpen, onClick: () => setIsMobileMenuOpen(false) }),
@@ -5408,108 +5370,23 @@ var Header = ({
               style: { display: "flex", flexDirection: "row", alignItems: "center", height: "56px" },
               className: "desktop-nav",
               children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  NavLink,
-                  {
-                    href: resolvedHomePath,
-                    className: homeActive ? "active" : "",
-                    onClick: (event) => {
-                      event.preventDefault();
-                      handleNavigation(resolvedHomePath);
-                    },
-                    children: "Home"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  NavLink,
-                  {
-                    href: resolvedPortfolioPath,
-                    className: portfolioActive ? "active" : "",
-                    onClick: (event) => {
-                      event.preventDefault();
-                      handleNavigation(resolvedPortfolioPath);
-                    },
-                    children: "Portfolio"
-                  }
-                ),
-                showTradeTab && /* @__PURE__ */ jsxRuntime.jsx(
-                  NavLink,
-                  {
-                    href: resolvedTradePath,
-                    className: tradeActive ? "active" : "",
-                    onClick: (event) => {
-                      event.preventDefault();
-                      handleTradeNavigation();
-                    },
-                    children: "Trade"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  NavLink,
-                  {
-                    href: offeringsHref,
-                    className: offeringsActive ? "active" : "",
-                    onClick: (event) => {
-                      event.preventDefault();
-                      handleNavigation(offeringsHref);
-                    },
-                    children: "Initial Offerings"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  NavLink,
-                  {
-                    href: resolvedPropertyMapPath,
-                    className: propertyMapActive ? "active" : "",
-                    onClick: (event) => {
-                      event.preventDefault();
-                      handleNavigation(resolvedPropertyMapPath);
-                    },
-                    children: "Property Map"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
+                primaryItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
                   NavLink,
                   {
-                    href: resolvedLeaderboardPath,
-                    className: leaderboardActive ? "active" : "",
-                    onClick: (event) => {
-                      event.preventDefault();
-                      handleNavigation(resolvedLeaderboardPath);
-                    },
-                    children: "Competition"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  NavLink,
-                  {
-                    href: resolvedLeaderboardPagePath,
-                    className: leaderboardPageActive ? "active" : "",
-                    onClick: (event) => {
-                      event.preventDefault();
-                      handleNavigation(resolvedLeaderboardPagePath);
-                    },
-                    children: "Leaderboard"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  NavLink,
-                  {
-                    href: resolvedLearnPath,
-                    className: learnActive ? "active" : "",
-                    onClick: (event) => {
-                      event.preventDefault();
-                      handleNavigation(resolvedLearnPath);
-                    },
-                    children: "Learn"
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsxs(MoreMenu, { className: "more-menu", children: [
+                    href: item.path,
+                    ...item.external ? { target: "_blank", rel: "noopener noreferrer" } : {},
+                    className: item.key === resolvedActiveKey ? "active" : "",
+                    onClick: navLinkClick(item),
+                    children: item.label
+                  },
+                  item.key
+                )),
+                moreItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(MoreMenu, { className: "more-menu", children: [
                   /* @__PURE__ */ jsxRuntime.jsxs(
                     MoreTrigger,
                     {
                       type: "button",
-                      className: `${isMoreMenuOpen ? "open" : ""} ${aboutActive || apiActive ? "active" : ""}`,
+                      className: `${isMoreMenuOpen ? "open" : ""} ${moreActive ? "active" : ""}`,
                       "aria-haspopup": "true",
                       "aria-expanded": isMoreMenuOpen,
                       onClick: () => setIsMoreMenuOpen((open) => !open),
@@ -5519,42 +5396,17 @@ var Header = ({
                       ]
                     }
                   ),
-                  isMoreMenuOpen && /* @__PURE__ */ jsxRuntime.jsxs(MoreDropdown, { children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      MoreItem,
-                      {
-                        href: resolvedAboutPath,
-                        className: aboutActive ? "active" : "",
-                        onClick: (event) => {
-                          event.preventDefault();
-                          handleNavigation(resolvedAboutPath);
-                        },
-                        children: "About"
-                      }
-                    ),
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      MoreItem,
-                      {
-                        href: resolvedApiPath,
-                        className: apiActive ? "active" : "",
-                        onClick: (event) => {
-                          event.preventDefault();
-                          handleNavigation(resolvedApiPath);
-                        },
-                        children: "API"
-                      }
-                    ),
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      MoreItem,
-                      {
-                        href: "https://docs.loafmarkets.com/en/",
-                        target: "_blank",
-                        rel: "noopener noreferrer",
-                        onClick: () => setIsMoreMenuOpen(false),
-                        children: "Docs"
-                      }
-                    )
-                  ] })
+                  isMoreMenuOpen && /* @__PURE__ */ jsxRuntime.jsx(MoreDropdown, { children: moreItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+                    MoreItem,
+                    {
+                      href: item.path,
+                      ...item.external ? { target: "_blank", rel: "noopener noreferrer" } : {},
+                      className: item.key === resolvedActiveKey ? "active" : "",
+                      onClick: navLinkClick(item),
+                      children: item.label
+                    },
+                    item.key
+                  )) })
                 ] }),
                 /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginLeft: "auto", display: "flex", alignItems: "center" }, children: /* @__PURE__ */ jsxRuntime.jsx(
                   "div",
@@ -5577,31 +5429,7 @@ var Header = ({
           ),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mobile-menu-content", children: [
             /* @__PURE__ */ jsxRuntime.jsx(MobileMenuHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(MobileMenuClose, { onClick: () => setIsMobileMenuOpen(false), "aria-label": "Close menu", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsxRuntime.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" }) }) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedHomePath), children: "Home" }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              MobileNavItem,
-              {
-                onClick: () => handleNavigation(resolvedPortfolioPath),
-                children: "Portfolio"
-              }
-            ),
-            showTradeTab && /* @__PURE__ */ jsxRuntime.jsx(
-              MobileNavItem,
-              {
-                onClick: () => {
-                  handleTradeNavigation();
-                },
-                children: "Trade"
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(MobileNavItem, { onClick: () => handleNavigation(offeringsHref), children: "Initial Offerings" }),
-            /* @__PURE__ */ jsxRuntime.jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedPropertyMapPath), children: "Property Map" }),
-            /* @__PURE__ */ jsxRuntime.jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedLeaderboardPath), children: "Competition" }),
-            /* @__PURE__ */ jsxRuntime.jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedLeaderboardPagePath), children: "Leaderboard" }),
-            /* @__PURE__ */ jsxRuntime.jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedLearnPath), children: "Learn" }),
-            /* @__PURE__ */ jsxRuntime.jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedAboutPath), children: "About" }),
-            /* @__PURE__ */ jsxRuntime.jsx(MobileNavItem, { onClick: () => handleNavigation(resolvedApiPath), children: "API" }),
-            /* @__PURE__ */ jsxRuntime.jsx(MobileNavItem, { onClick: () => window.open("https://docs.loafmarkets.com/en/", "_blank", "noopener,noreferrer"), children: "Docs" }),
+            navItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MobileNavItem, { onClick: () => handleNavItem(item), children: item.label }, item.key)),
             /* @__PURE__ */ jsxRuntime.jsx("div", { style: { borderTop: "1px solid #2b3139", margin: "8px 0" } }),
             /* @__PURE__ */ jsxRuntime.jsx(
               MobileNavItem,
@@ -14993,6 +14821,7 @@ function PortfolioActivityPanel({
   showPositionsTab = false,
   showSubscriptionsTab = true,
   onPositionClick,
+  onSharePosition,
   onAssetClick,
   onClosePosition,
   offeringOrders = [],
@@ -15284,17 +15113,23 @@ function PortfolioActivityPanel({
                 ] }),
                 /* @__PURE__ */ jsxRuntime.jsxs(CPnlCell, { children: [
                   /* @__PURE__ */ jsxRuntime.jsx(CCellLabel, { children: "PNL (%)" }),
-                  /* @__PURE__ */ jsxRuntime.jsxs(CPnlLine, { children: [
-                    /* @__PURE__ */ jsxRuntime.jsxs(CPnlValue, { $positive: isPositive, children: [
-                      isPositive ? "+" : "-",
-                      formatCurrency4(Math.abs(pnl))
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.4rem" }, children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs(CPnlLine, { children: [
+                      /* @__PURE__ */ jsxRuntime.jsxs(CPnlValue, { $positive: isPositive, children: [
+                        isPositive ? "+" : "-",
+                        formatCurrency4(Math.abs(pnl))
+                      ] }),
+                      /* @__PURE__ */ jsxRuntime.jsxs(CPnlPct, { $positive: isPositive, children: [
+                        "(",
+                        isPositive ? "+" : "",
+                        pnlPercent.toFixed(1),
+                        "%)"
+                      ] })
                     ] }),
-                    /* @__PURE__ */ jsxRuntime.jsxs(CPnlPct, { $positive: isPositive, children: [
-                      "(",
-                      isPositive ? "+" : "",
-                      pnlPercent.toFixed(1),
-                      "%)"
-                    ] })
+                    onSharePosition && !pos.settling && /* @__PURE__ */ jsxRuntime.jsx(CShareIconBtn, { role: "button", "aria-label": "Share position", onClick: (e) => {
+                      e.stopPropagation();
+                      onSharePosition(pos);
+                    }, children: /* @__PURE__ */ jsxRuntime.jsx(ShareIcon, {}) })
                   ] })
                 ] }),
                 /* @__PURE__ */ jsxRuntime.jsx(CChevronWrap, { $open: posExpanded, children: /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx("polyline", { points: "6 9 12 15 18 9" }) }) })
@@ -15314,16 +15149,16 @@ function PortfolioActivityPanel({
                     /* @__PURE__ */ jsxRuntime.jsx(CDValue, { children: formatCurrency4(pos.marketPrice) })
                   ] })
                 ] }),
-                onClosePosition && !pos.settling && /* @__PURE__ */ jsxRuntime.jsxs(CActionRow, { children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice), children: "Market Sell" }),
-                  /* @__PURE__ */ jsxRuntime.jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice), children: "Limit Sell" })
+                (onClosePosition || onSharePosition) && !pos.settling && /* @__PURE__ */ jsxRuntime.jsxs(CActionRow, { children: [
+                  onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice), children: "Market Sell" }),
+                  onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(CCloseBtn, { onClick: () => onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice), children: "Limit Sell" })
                 ] })
               ] })
             ] }, pos.tokenName);
           })
         ] }),
         positions.length > 0 && !compactPositions && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(PositionsHeader, { $hasClose: !!onClosePosition, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(PositionsHeader, { $hasClose: !!(onClosePosition || onSharePosition), children: [
             /* @__PURE__ */ jsxRuntime.jsxs(SortableHeaderCell, { $active: posSortKey === "asset", onClick: () => handlePosSort("asset"), children: [
               "Asset ",
               posSortKey === "asset" && (posSortAsc ? "\u2191" : "\u2193")
@@ -15356,7 +15191,7 @@ function PortfolioActivityPanel({
             const pnl = pos.propertyPnl ?? currentValue - costBasis;
             const pnlPercent = pos.propertyPnlPercent ?? pos.percentChange ?? 0;
             const isPositive = pnl >= 0;
-            return /* @__PURE__ */ jsxRuntime.jsxs(PositionsRow, { $hasClose: !!onClosePosition, children: [
+            return /* @__PURE__ */ jsxRuntime.jsxs(PositionsRow, { $hasClose: !!(onClosePosition || onSharePosition), children: [
               /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
                 /* @__PURE__ */ jsxRuntime.jsx(HoldingsPropertyLink, { onClick: () => onPositionClick?.(pos.tokenName, pos.isIpoAllocation), children: pos.tokenName }),
                 pos.settling && /* @__PURE__ */ jsxRuntime.jsx(SettlingTip, { children: /* @__PURE__ */ jsxRuntime.jsx(SettlingSpinner, {}) })
@@ -15373,23 +15208,29 @@ function PortfolioActivityPanel({
               ] }) }),
               /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "rgba(255,255,255,0.7)", fontSize: "0.8rem" }, children: formatCurrency4(pos.averageEntryPrice) }) }),
               /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#fff", fontSize: "0.8rem" }, children: formatCurrency4(pos.marketPrice) }) }),
-              /* @__PURE__ */ jsxRuntime.jsxs(PositionsCell, { children: [
-                /* @__PURE__ */ jsxRuntime.jsxs(PnLAmount, { $positive: isPositive, children: [
-                  isPositive ? "+" : "-",
-                  formatCurrency4(Math.abs(pnl))
+              /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { display: "flex", alignItems: "center", gap: "0.4rem" }, children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { display: "flex", flexDirection: "column" }, children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs(PnLAmount, { $positive: isPositive, children: [
+                    isPositive ? "+" : "-",
+                    formatCurrency4(Math.abs(pnl))
+                  ] }),
+                  /* @__PURE__ */ jsxRuntime.jsxs(PnLPercentage, { $positive: isPositive, children: [
+                    isPositive ? "+" : "",
+                    pnlPercent.toFixed(1),
+                    "%"
+                  ] })
                 ] }),
-                /* @__PURE__ */ jsxRuntime.jsxs(PnLPercentage, { $positive: isPositive, children: [
-                  isPositive ? "+" : "",
-                  pnlPercent.toFixed(1),
-                  "%"
-                ] })
-              ] }),
-              onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: !pos.settling && /* @__PURE__ */ jsxRuntime.jsxs(CloseActions, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, { onClick: (e) => {
+                onSharePosition && !pos.settling && /* @__PURE__ */ jsxRuntime.jsx(CShareIconBtn, { role: "button", "aria-label": "Share position", onClick: (e) => {
+                  e.stopPropagation();
+                  onSharePosition(pos);
+                }, children: /* @__PURE__ */ jsxRuntime.jsx(ShareIcon, {}) })
+              ] }) }),
+              (onClosePosition || onSharePosition) && /* @__PURE__ */ jsxRuntime.jsx(PositionsCell, { children: !pos.settling && /* @__PURE__ */ jsxRuntime.jsxs(CloseActions, { children: [
+                onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, { onClick: (e) => {
                   e.stopPropagation();
                   onClosePosition(pos.tokenName, "market", pos.quantity, pos.marketPrice);
                 }, children: "Market Sell" }),
-                /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, { onClick: (e) => {
+                onClosePosition && /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, { onClick: (e) => {
                   e.stopPropagation();
                   onClosePosition(pos.tokenName, "limit", pos.quantity, pos.marketPrice);
                 }, children: "Limit Sell" })
@@ -16280,6 +16121,29 @@ var CloseBtn = styled10__default.default.button`
     border-color: rgba(230, 200, 126, 0.5);
   }
 `;
+var CShareIconBtn = styled10__default.default.span`
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 26px;
+  height: 26px;
+  border-radius: 6px;
+  color: #E6C87E;
+  cursor: pointer;
+  pointer-events: auto;
+  transition: color 0.15s ease, background 0.15s ease;
+  &:hover {
+    color: #F2D898;
+    background: rgba(230, 200, 126, 0.14);
+  }
+  &:active { background: rgba(230, 200, 126, 0.22); }
+  svg { width: 15px; height: 15px; }
+`;
+var ShareIcon = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+  /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4 12v7a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-7" }),
+  /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "16 6 12 2 8 6" }),
+  /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "12", y1: "2", x2: "12", y2: "15" })
+] });
 var CloseAllHeaderBtn = styled10__default.default.button`
   background: rgba(230, 200, 126, 0.1);
   border: 1px solid rgba(230, 200, 126, 0.3);