@gearbox-protocol/ui-kit 4.0.0-next.5 → 4.0.0-next.50

package/dist/esm/components/collateral-allocation-tooltip/collateral-allocation-tooltip.js

@@ -1,18 +1,15 @@
-import { jsx as t, jsxs as i } from "react/jsx-runtime";
+import { jsx as t, jsxs as l } from "react/jsx-runtime";
 import { faPause as k } from "@fortawesome/free-solid-svg-icons";
 import { FaIcon as v } from "../icons/fa-icon.js";
 import { TokenIcon as w } from "../token-icon/token-icon.js";
 import { SimpleTooltip as y } from "../tooltip/simple-tooltip.js";
 import "../tooltip/tooltip.js";
-import "react";
-import "@gearbox-protocol/sdk";
+import "@gearbox-protocol/sdk/onchain";
 import { cn as N } from "../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../utils/z-index.js";
 import { AllocationWheel as U } from "./allocation-wheel.js";
-import { CollateralAllocationTooltipTest as l } from "./constants.js";
+import { CollateralAllocationTooltipTest as a } from "./constants.js";
 function I(o) {
   return new Intl.NumberFormat("en-US", {
     style: "currency",
@@ -27,15 +24,15 @@ function p(o) {
 function C(o) {
   return o.valueUsd != null;
 }
-function E({
+function P({
   data: o,
   children: u,
-  className: a
+  className: i
 }) {
   const s = o.slices.reduce(
     (e, r) => e + p(r.amount),
     0
-  ), m = o.slices.some((e) => C(e.amount));
+  ), d = o.slices.some((e) => C(e.amount));
   let f = 0;
   const x = /* @__PURE__ */ t(
     "div",
@@ -46,16 +43,16 @@ function E({
         "border border-border",
         "shadow-[0_4px_28px_4px_rgba(0,0,0,0.15)]"
       ),
-      "data-testid": l.root,
+      "data-testid": a.root,
       children: o.slices.map((e, r) => {
-        const d = p(e.amount), h = s > 0 ? d / s : 0, n = e.kind === "idle", g = n ? 0 : f++, b = e.kind === "idle" ? "idle" : `${e.token.address}-${r}`, c = m && e.amount.valueUsd != null ? I(d) : void 0;
-        return /* @__PURE__ */ i(
+        const m = p(e.amount), h = s > 0 ? m / s : 0, n = e.kind === "idle", g = n ? 0 : f++, b = e.kind === "idle" ? "idle" : `${e.token.address}-${r}`, c = d && e.amount.valueUsd != null ? I(m) : void 0;
+        return /* @__PURE__ */ l(
           "div",
           {
             className: "flex h-[34px] items-center justify-between gap-3 px-2 py-[7px]",
-            "data-testid": l.row,
+            "data-testid": a.row,
             children: [
-              /* @__PURE__ */ i("div", { className: "flex min-w-0 items-center gap-2", children: [
+              /* @__PURE__ */ l("div", { className: "flex min-w-0 items-center gap-2", children: [
                 n ? /* @__PURE__ */ t("span", { className: "flex size-5 shrink-0 items-center justify-center rounded-[10px] bg-muted", children: /* @__PURE__ */ t(
                   v,
                   {
@@ -65,9 +62,9 @@ function E({
                 ) }) : /* @__PURE__ */ t(w, { token: e.token, size: 20 }),
                 /* @__PURE__ */ t("span", { className: "truncate text-sm leading-5 text-foreground", children: n ? "Idle" : e.token.symbol })
               ] }),
-              m && /* @__PURE__ */ i("div", { className: "flex shrink-0 items-center gap-2", children: [
+              d && /* @__PURE__ */ l("div", { className: "flex shrink-0 items-center gap-2", children: [
                 c != null && /* @__PURE__ */ t("span", { className: "text-sm font-semibold leading-5 tabular-nums text-foreground", children: c }),
-                /* @__PURE__ */ t("span", { "data-testid": l.wheel, children: /* @__PURE__ */ t(
+                /* @__PURE__ */ t("span", { "data-testid": a.wheel, children: /* @__PURE__ */ t(
                   U,
                   {
                     share: h,
@@ -91,12 +88,12 @@ function E({
       type: "modal-tooltip",
       minWidth: "100%",
       maxWidth: "100%",
-      title: /* @__PURE__ */ t("span", { className: a, children: u }),
-      triggerClassName: a,
+      title: /* @__PURE__ */ t("span", { className: i, children: u }),
+      triggerClassName: i,
       children: x
     }
   );
 }
 export {
-  E as CollateralAllocationTooltip
+  P as CollateralAllocationTooltip
 };

package/dist/esm/components/composites/index.js

@@ -3,48 +3,44 @@ import { PoolAssetsTableTest as e } from "./pool-assets-table/constants.js";
 import { PoolAssetsTable as s } from "./pool-assets-table/pool-assets-table.js";
 import { PoolAssetsTableHead as m } from "./pool-assets-table/pool-assets-table-head.js";
 import { PoolAssetsTableRow as c } from "./pool-assets-table/pool-assets-table-row.js";
-import { TransactionConfirmAmountFieldTest as l, TransactionConfirmAmountPairTest as p } from "./tx-preview/confirm/amounts/constants.js";
-import { TransactionConfirmAmountField as C } from "./tx-preview/confirm/amounts/TransactionConfirmAmountField.js";
-import { computeTransactionConfirmDialogLayout as P } from "./tx-preview/confirm/dialog/computeTransactionConfirmDialogLayout.js";
-import { TransactionConfirmDialogTest as g, transactionConfirmDialogShellVariants as w, transactionConfirmModalContainerVariants as A, transactionConfirmPreviewScrollVariants as R, transactionConfirmShellContentVariants as d } from "./tx-preview/confirm/dialog/constants.js";
-import { TransactionConfirmModalView as V } from "./tx-preview/confirm/dialog/TransactionConfirmModalView.js";
-import { TransactionConfirmPageView as F } from "./tx-preview/confirm/dialog/TransactionConfirmPageView.js";
-import { TransactionConfirmExecuteButton as H } from "./tx-preview/confirm/execution/TransactionConfirmExecuteButton.js";
-import { TransactionConfirmExecuteButtonTest as E, TransactionConfirmFailureResultTest as M, TransactionConfirmSuccessResultTest as v, TransactionConfirmTxHashRowTest as y } from "./tx-preview/confirm/result/constants.js";
-import { TransactionConfirmFailureResult as L } from "./tx-preview/confirm/result/TransactionConfirmFailureResult.js";
-import { TransactionConfirmSuccessIcon as j } from "./tx-preview/confirm/result/TransactionConfirmSuccessIcon.js";
-import { TransactionConfirmSuccessResult as q } from "./tx-preview/confirm/result/TransactionConfirmSuccessResult.js";
-import { TransactionConfirmTxHashRow as G } from "./tx-preview/confirm/result/TransactionConfirmTxHashRow.js";
-import { ProgressStepperTest as K } from "./tx-preview/confirm/stepper/constants.js";
-import { ProgressStepper as Q } from "./tx-preview/confirm/stepper/ProgressStepper.js";
-import { shouldShowTransactionProgressStepper as W } from "./tx-preview/confirm/stepper/transactionExecutionStepTypes.js";
+import { TransactionConfirmAmountFieldTest as T } from "./tx-preview/confirm/amounts/constants.js";
+import { TransactionConfirmAmountField as x, resolveAmountSlots as C } from "./tx-preview/confirm/amounts/TransactionConfirmAmountField.js";
+import { computeTransactionConfirmDialogLayout as S } from "./tx-preview/confirm/dialog/computeTransactionConfirmDialogLayout.js";
+import { TransactionConfirmDialogTest as P, transactionConfirmDialogShellVariants as R, transactionConfirmModalContainerVariants as g, transactionConfirmPreviewScrollVariants as h, transactionConfirmShellContentVariants as b } from "./tx-preview/confirm/dialog/constants.js";
+import { TransactionConfirmShell as w } from "./tx-preview/confirm/dialog/TransactionConfirmShell.js";
+import { TransactionConfirmExecuteButton as V } from "./tx-preview/confirm/execution/TransactionConfirmExecuteButton.js";
+import { TransactionConfirmExecuteButtonTest as H, TransactionConfirmFailureResultTest as v, TransactionConfirmSuccessResultTest as B, TransactionConfirmTxHashRowTest as E } from "./tx-preview/confirm/result/constants.js";
+import { TransactionConfirmFailureResult as I } from "./tx-preview/confirm/result/TransactionConfirmFailureResult.js";
+import { TransactionConfirmSuccessIcon as M } from "./tx-preview/confirm/result/TransactionConfirmSuccessIcon.js";
+import { TransactionConfirmSuccessResult as j } from "./tx-preview/confirm/result/TransactionConfirmSuccessResult.js";
+import { TransactionConfirmTxHashRow as q } from "./tx-preview/confirm/result/TransactionConfirmTxHashRow.js";
+import { ProgressStepperTest as G } from "./tx-preview/confirm/stepper/constants.js";
+import { ProgressStepper as K } from "./tx-preview/confirm/stepper/ProgressStepper.js";
 export {
   t as NotificationCenter,
   s as PoolAssetsTable,
   m as PoolAssetsTableHead,
   c as PoolAssetsTableRow,
   e as PoolAssetsTableTest,
-  Q as ProgressStepper,
-  K as ProgressStepperTest,
-  C as TransactionConfirmAmountField,
-  l as TransactionConfirmAmountFieldTest,
-  p as TransactionConfirmAmountPairTest,
-  g as TransactionConfirmDialogTest,
-  H as TransactionConfirmExecuteButton,
-  E as TransactionConfirmExecuteButtonTest,
-  L as TransactionConfirmFailureResult,
-  M as TransactionConfirmFailureResultTest,
-  V as TransactionConfirmModalView,
-  F as TransactionConfirmPageView,
-  j as TransactionConfirmSuccessIcon,
-  q as TransactionConfirmSuccessResult,
-  v as TransactionConfirmSuccessResultTest,
-  G as TransactionConfirmTxHashRow,
-  y as TransactionConfirmTxHashRowTest,
-  P as computeTransactionConfirmDialogLayout,
-  W as shouldShowTransactionProgressStepper,
-  w as transactionConfirmDialogShellVariants,
-  A as transactionConfirmModalContainerVariants,
-  R as transactionConfirmPreviewScrollVariants,
-  d as transactionConfirmShellContentVariants
+  K as ProgressStepper,
+  G as ProgressStepperTest,
+  x as TransactionConfirmAmountField,
+  T as TransactionConfirmAmountFieldTest,
+  P as TransactionConfirmDialogTest,
+  V as TransactionConfirmExecuteButton,
+  H as TransactionConfirmExecuteButtonTest,
+  I as TransactionConfirmFailureResult,
+  v as TransactionConfirmFailureResultTest,
+  w as TransactionConfirmShell,
+  M as TransactionConfirmSuccessIcon,
+  j as TransactionConfirmSuccessResult,
+  B as TransactionConfirmSuccessResultTest,
+  q as TransactionConfirmTxHashRow,
+  E as TransactionConfirmTxHashRowTest,
+  S as computeTransactionConfirmDialogLayout,
+  C as resolveAmountSlots,
+  R as transactionConfirmDialogShellVariants,
+  g as transactionConfirmModalContainerVariants,
+  h as transactionConfirmPreviewScrollVariants,
+  b as transactionConfirmShellContentVariants
 };

package/dist/esm/components/composites/notification-center/notification-center.js

@@ -1,20 +1,17 @@
-import { jsx as e, jsxs as i, Fragment as x } from "react/jsx-runtime";
+import { jsx as e, jsxs as n, Fragment as x } from "react/jsx-runtime";
 import { faBell as h } from "@fortawesome/free-solid-svg-icons";
 import { FaIcon as g } from "../../icons/fa-icon.js";
 import { SimpleDropdown as y } from "../../simple-dropdown/simple-dropdown.js";
 import "../../simple-dropdown/simple-dropdown-menu-item.js";
 import { FormattedMessageTyped as r } from "../../typed-intl/index.js";
-import { Typography as n } from "../../typography/typography.js";
-import "react";
-import "@gearbox-protocol/sdk";
+import { Typography as i } from "../../typography/typography.js";
+import "@gearbox-protocol/sdk/onchain";
 import { cn as c } from "../../../utils/cn.js";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 import { notificationCenterTestIds as a } from "./constants.js";
 function b({ row: t }) {
-  const s = /* @__PURE__ */ i(x, { children: [
+  const s = /* @__PURE__ */ n(x, { children: [
     /* @__PURE__ */ e(
       "span",
       {
@@ -24,10 +21,10 @@ function b({ row: t }) {
         )
       }
     ),
-    /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
-      /* @__PURE__ */ i("div", { className: "flex items-start justify-between gap-3", children: [
+    /* @__PURE__ */ n("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-start justify-between gap-3", children: [
         /* @__PURE__ */ e(
-          n,
+          i,
           {
             as: "span",
             variant: "bodySmall",
@@ -36,7 +33,7 @@ function b({ row: t }) {
           }
         ),
         /* @__PURE__ */ e(
-          n,
+          i,
           {
             as: "span",
             variant: "bodySmall",
@@ -46,7 +43,7 @@ function b({ row: t }) {
           }
         )
       ] }),
-      /* @__PURE__ */ e(n, { as: "span", variant: "bodySmall", color: "muted", children: t.positionName })
+      /* @__PURE__ */ e(i, { as: "span", variant: "bodySmall", color: "muted", children: t.positionName })
     ] })
   ] });
   return t.isClickable && t.onExecute ? /* @__PURE__ */ e(
@@ -67,7 +64,7 @@ function b({ row: t }) {
     }
   );
 }
-function L({
+function T({
   open: t,
   onOpenChange: s,
   deferredRows: o,
@@ -85,7 +82,7 @@ function L({
       align: "end",
       asChild: !0,
       className: "w-[460px] max-w-[calc(100vw-32px)] bg-modal p-0",
-      title: /* @__PURE__ */ i(
+      title: /* @__PURE__ */ n(
         "button",
         {
           type: "button",
@@ -107,14 +104,14 @@ function L({
           ]
         }
       ),
-      children: /* @__PURE__ */ i(
+      children: /* @__PURE__ */ n(
         "div",
         {
           "data-testid": a.panel,
           className: "flex flex-col p-8",
           children: [
             f ? null : /* @__PURE__ */ e(
-              n,
+              i,
               {
                 as: "span",
                 variant: "bodySmall",
@@ -123,14 +120,14 @@ function L({
                 children: /* @__PURE__ */ e(r, { messageId: "components.notificationCenter.empty" })
               }
             ),
-            o.length > 0 ? /* @__PURE__ */ i(
+            o.length > 0 ? /* @__PURE__ */ n(
               "div",
               {
                 className: "flex flex-col",
                 "data-testid": a.requestsSection,
                 children: [
                   /* @__PURE__ */ e(
-                    n,
+                    i,
                     {
                       as: "span",
                       variant: "bodySmall",
@@ -142,7 +139,7 @@ function L({
                 ]
               }
             ) : null,
-            d.length > 0 ? /* @__PURE__ */ i(
+            d.length > 0 ? /* @__PURE__ */ n(
               "div",
               {
                 className: c(
@@ -151,9 +148,9 @@ function L({
                 ),
                 "data-testid": a.successSection,
                 children: [
-                  /* @__PURE__ */ i("div", { className: "flex items-center justify-between pb-2", children: [
+                  /* @__PURE__ */ n("div", { className: "flex items-center justify-between pb-2", children: [
                     /* @__PURE__ */ e(
-                      n,
+                      i,
                       {
                         as: "span",
                         variant: "bodySmall",
@@ -172,7 +169,7 @@ function L({
                       }
                     ) : null
                   ] }),
-                  /* @__PURE__ */ e("div", { className: "-mr-2 flex max-h-[30dvh] flex-col overflow-y-auto overflow-x-hidden pr-2 [scrollbar-gutter:stable]", children: d.map((l) => /* @__PURE__ */ i(
+                  /* @__PURE__ */ e("div", { className: "-mr-2 flex max-h-[30dvh] flex-col overflow-y-auto overflow-x-hidden pr-2 [scrollbar-gutter:stable]", children: d.map((l) => /* @__PURE__ */ n(
                     "button",
                     {
                       type: "button",
@@ -181,7 +178,7 @@ function L({
                       className: "flex cursor-pointer items-center justify-between gap-3 py-2 text-left hover:opacity-80",
                       children: [
                         /* @__PURE__ */ e(
-                          n,
+                          i,
                           {
                             as: "span",
                             variant: "bodySmall",
@@ -189,7 +186,7 @@ function L({
                             children: l.label
                           }
                         ),
-                        /* @__PURE__ */ e(n, { as: "span", variant: "caption", color: "muted", children: l.timestampLabel })
+                        /* @__PURE__ */ e(i, { as: "span", variant: "caption", color: "muted", children: l.timestampLabel })
                       ]
                     },
                     l.id
@@ -204,5 +201,5 @@ function L({
   );
 }
 export {
-  L as NotificationCenter
+  T as NotificationCenter
 };

package/dist/esm/components/composites/pool-assets-table/pool-assets-table-head.js

@@ -1,32 +1,30 @@
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { jsxs as p, jsx as e } from "react/jsx-runtime";
 import { HeadCell as i } from "../../head-cell/head-cell.js";
 import "react-intl";
 import "../../buttons/button/button.js";
-import "react";
-import "@gearbox-protocol/sdk";
+import "@gearbox-protocol/sdk/onchain";
 import "clsx";
 import "tailwind-merge";
-import "sonner";
-import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 import { GridTableRow as l, GridTableHead as r } from "../../table/grid-table.js";
 import "../../skeleton/skeleton.js";
+import "react";
 import "../../table/table.js";
 import { useIntlTyped as c, FormattedMessageTyped as a } from "../../typed-intl/index.js";
 import { getSortForField as m } from "../../../hooks/use-filter.js";
 import "../../breakpoint-provider.js";
-function D({
-  sort: p
+function P({
+  sort: n
 }) {
-  const o = c(), { state: s, set: t } = p;
-  return /* @__PURE__ */ n(l, { noHover: !0, height: "35px", children: [
+  const s = c(), { state: o, set: t } = n;
+  return /* @__PURE__ */ p(l, { noHover: !0, height: "35px", children: [
     /* @__PURE__ */ e(r, { className: "pl-4", justify: "start", size: "sm", children: /* @__PURE__ */ e(
       i,
       {
         arrowPosition: "right",
-        sortDirection: m("name", s),
-        sortField: o.formatMessage({
+        sortDirection: m("name", o),
+        sortField: s.formatMessage({
           messageId: "components.poolAssetsTable.asset"
         }),
         title: /* @__PURE__ */ e(a, { messageId: "components.poolAssetsTable.asset" }),
@@ -37,8 +35,8 @@ function D({
       i,
       {
         arrowPosition: "left",
-        sortDirection: m("exposure", s),
-        sortField: o.formatMessage({
+        sortDirection: m("exposure", o),
+        sortField: s.formatMessage({
           messageId: "components.poolAssetsTable.exposure"
         }),
         title: /* @__PURE__ */ e(a, { messageId: "components.poolAssetsTable.exposure" }),
@@ -49,8 +47,8 @@ function D({
       i,
       {
         arrowPosition: "left",
-        sortDirection: m("cap", s),
-        sortField: o.formatMessage({
+        sortDirection: m("cap", o),
+        sortField: s.formatMessage({
           messageId: "components.poolAssetsTable.cap"
         }),
         title: /* @__PURE__ */ e(a, { messageId: "components.poolAssetsTable.cap" }),
@@ -61,8 +59,8 @@ function D({
       i,
       {
         arrowPosition: "left",
-        sortDirection: m("capUtilization", s),
-        sortField: o.formatMessage({
+        sortDirection: m("capUtilization", o),
+        sortField: s.formatMessage({
           messageId: "components.poolAssetsTable.capUtilization"
         }),
         title: /* @__PURE__ */ e(a, { messageId: "components.poolAssetsTable.capUtilization" }),
@@ -72,5 +70,5 @@ function D({
   ] });
 }
 export {
-  D as PoolAssetsTableHead
+  P as PoolAssetsTableHead
 };

package/dist/esm/components/composites/pool-assets-table/pool-assets-table-row.js

@@ -1,37 +1,36 @@
-import { jsx as e, jsxs as s, Fragment as C } from "react/jsx-runtime";
-import "react";
-import "@gearbox-protocol/sdk";
+import { jsx as e, jsxs as a, Fragment as y } from "react/jsx-runtime";
+import { NoValue as b } from "../../base/values/no-value.js";
+import "@gearbox-protocol/sdk/onchain";
 import "clsx";
 import "tailwind-merge";
-import "sonner";
-import { formatMoney as S } from "../../../utils/format-money.js";
-import "@gearbox-protocol/sdk/common-utils";
+import { formatMoney as C } from "../../../utils/format-money.js";
 import "luxon";
 import "../../../utils/z-index.js";
 import "../../points-icon/points-icon.js";
-import { UtilizationValue as y } from "../../base/values/scalars.js";
+import { UtilizationValue as S } from "../../base/values/scalars.js";
 import "../../badge/badge.js";
 import "../../badge/chip.js";
 import { FormattedMessageTyped as m } from "../../typed-intl/index.js";
-import { AllocationWheel as L } from "../../collateral-allocation-tooltip/allocation-wheel.js";
+import { AllocationWheel as k } from "../../collateral-allocation-tooltip/allocation-wheel.js";
 import "@fortawesome/free-solid-svg-icons";
 import "../../icons/fa-icon.js";
 import "../../token-icon/token-icon.js";
 import "../../tooltip/simple-tooltip.js";
 import "../../tooltip/tooltip.js";
-import { NameCell as U } from "../../name-cell/name-cell.js";
-import { ShortString as x } from "../../short-string/short-string.js";
+import { NameCell as w } from "../../name-cell/name-cell.js";
+import { ShortString as L } from "../../short-string/short-string.js";
 import "react-intl";
 import "../../buttons/button/button.js";
-import { GridTableRow as k, GridTableCell as o } from "../../table/grid-table.js";
+import { GridTableRow as U, GridTableCell as o } from "../../table/grid-table.js";
 import "../../skeleton/skeleton.js";
+import "react";
 import "../../table/table.js";
-import { TableLineSm as w, TableCellSm as a } from "../../table/table-sm.js";
-import { TokenSymbol as I } from "../../token-symbol/token-symbol.js";
-import { TokenTemplate as b } from "../../token-template/token-template.js";
-import { VerticalIndicator as P } from "../../vertical-indicator/vertical-indicator.js";
-import { PoolAssetsTableTest as n } from "./constants.js";
-function j(i, t) {
+import { TableLineSm as I, TableCellSm as n } from "../../table/table-sm.js";
+import { TokenSymbol as P } from "../../token-symbol/token-symbol.js";
+import { TokenTemplate as x } from "../../token-template/token-template.js";
+import { VerticalIndicator as j } from "../../vertical-indicator/vertical-indicator.js";
+import { PoolAssetsTableTest as p } from "./constants.js";
+function V(i, t) {
   if (t !== 0n)
     return Number(i * 10000n / t);
 }
@@ -39,29 +38,28 @@ function B(i, t) {
   return t <= 0n || i <= 0n ? 0 : Number(i * 10000n / t) / 1e4;
 }
 function he({
-  poolName: i,
-  asset: t,
-  underlyingToken: p,
+  asset: i,
+  underlyingToken: t,
   last: T,
   isCompact: c,
   totalUsed: z,
-  colorIndex: A
+  colorIndex: A,
+  explorerUrl: d
 }) {
-  const { token: d, limit: r, used: l } = t, N = c ? 40 : 21, u = B(l.value, z), h = () => /* @__PURE__ */ e(
-    U,
+  const { token: r, limit: s, used: l } = i, N = c ? 40 : 21, u = B(l.value, z), h = () => /* @__PURE__ */ e(
+    w,
     {
-      leading: /* @__PURE__ */ e(I, { size: 32, token: d }),
-      title: /* @__PURE__ */ e(x, { maxLength: N, children: d.name }),
-      subtitle: /* @__PURE__ */ e(x, { maxLength: 20, children: i })
+      leading: /* @__PURE__ */ e(P, { size: 32, token: r }),
+      title: /* @__PURE__ */ e(L, { maxLength: N, children: r.symbol })
     }
-  ), f = () => /* @__PURE__ */ s(
+  ), f = () => /* @__PURE__ */ a(
     "div",
     {
       className: "flex items-center justify-end gap-2",
-      "data-testid": n.exposureCell,
+      "data-testid": p.exposureCell,
       children: [
         /* @__PURE__ */ e(
-          L,
+          k,
           {
             share: u,
             colorIndex: A,
@@ -69,42 +67,43 @@ function he({
           }
         ),
         /* @__PURE__ */ e(
-          P,
+          j,
           {
             value: /* @__PURE__ */ e(
-              b,
+              x,
               {
                 decimalPartLength: 2,
                 precision: 2,
                 showSymbol: !1,
-                token: p,
+                token: t,
                 value: l.value
               }
             ),
-            valueDescription: l.valueUsd === null ? "—" : S(l.valueUsd)
+            valueDescription: l.valueUsd === null ? /* @__PURE__ */ e(b, {}) : C(l.valueUsd)
           }
         )
       ]
     }
-  ), g = () => /* @__PURE__ */ e("div", { "data-testid": n.capCell, children: r.value === 0n ? /* @__PURE__ */ e("span", { children: "—" }) : /* @__PURE__ */ e(
-    b,
+  ), g = () => /* @__PURE__ */ e("div", { "data-testid": p.capCell, children: s.value === 0n ? /* @__PURE__ */ e(b, {}) : /* @__PURE__ */ e(
+    x,
     {
       decimalPartLength: 2,
       precision: 2,
       showSymbol: !1,
-      token: p,
-      value: r.value
+      token: t,
+      value: s.value
     }
-  ) }), v = () => /* @__PURE__ */ e("div", { "data-testid": n.capUtilizationCell, children: /* @__PURE__ */ e(y, { data: j(l.value, r.value) }) });
+  ) }), v = () => /* @__PURE__ */ e("div", { "data-testid": p.capUtilizationCell, children: /* @__PURE__ */ e(S, { data: V(l.value, s.value) }) });
   return /* @__PURE__ */ e(
-    k,
+    U,
     {
       last: T,
       height: "auto",
-      className: "cursor-default",
+      href: d ? `${d}/address/${r.address}` : void 0,
+      target: "_blank",
       style: { minHeight: "75px" },
-      children: c ? /* @__PURE__ */ e(o, { className: "px-3 py-0!", size: "sm", span: "full", children: /* @__PURE__ */ s(
-        w,
+      children: c ? /* @__PURE__ */ e(o, { className: "px-3 py-0!", size: "sm", span: "full", children: /* @__PURE__ */ a(
+        I,
         {
           className: "w-full",
           columns: 3,
@@ -112,21 +111,21 @@ function he({
           title: h(),
           children: [
             /* @__PURE__ */ e(
-              a,
+              n,
               {
                 title: /* @__PURE__ */ e(m, { messageId: "components.poolAssetsTable.exposure" }),
                 children: f()
               }
             ),
             /* @__PURE__ */ e(
-              a,
+              n,
               {
                 title: /* @__PURE__ */ e(m, { messageId: "components.poolAssetsTable.cap" }),
                 children: g()
               }
             ),
             /* @__PURE__ */ e(
-              a,
+              n,
               {
                 title: /* @__PURE__ */ e(m, { messageId: "components.poolAssetsTable.capUtilization" }),
                 children: v()
@@ -134,7 +133,7 @@ function he({
             )
           ]
         }
-      ) }) : /* @__PURE__ */ s(C, { children: [
+      ) }) : /* @__PURE__ */ a(y, { children: [
         /* @__PURE__ */ e(o, { className: "pl-4", size: "sm", textAlign: "left", children: h() }),
         /* @__PURE__ */ e(o, { size: "sm", textAlign: "right", children: f() }),
         /* @__PURE__ */ e(o, { size: "sm", textAlign: "right", children: g() }),