@gearbox-protocol/ui-kit 3.14.0-next.12 → 3.14.0-next.14

package/dist/esm/components/composites/tx-preview/prerequisites/PrerequisitesCard.js

@@ -0,0 +1,207 @@
+import { jsxs as d, jsx as r } from "react/jsx-runtime";
+import { Card as f, CardHeader as u, CardTitle as c, CardContent as C } from "../../../cards/card/card.js";
+import { ErrorLineMessage as q } from "../../../error-message/error-line-message.js";
+import "react-intl";
+import "../../../buttons/button/button.js";
+import "../../../dialog/dialog-container.js";
+import "react";
+import "@gearbox-protocol/sdk";
+import "clsx";
+import "tailwind-merge";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import "luxon";
+import "../../../../utils/z-index.js";
+import { SkeletonStack as h } from "../../../skeleton/skeleton-stack.js";
+import "../components/AddressAvatar.js";
+import "@gearbox-protocol/static";
+import "@fortawesome/free-solid-svg-icons";
+import "../../../icons/fa-icon.js";
+import "../../../accordion/accordion.js";
+import "../../../alert-badge/alert-badge.js";
+import "../../../alert-dialog/alert-dialog.js";
+import "../../../alert-modal/alert-modal.js";
+import "../../../tooltip/simple-tooltip.js";
+import "../../../tooltip/tooltip.js";
+import "../../../arc-loader/arc-loader.js";
+import "../../../asset-line/asset-line.js";
+import "../../../buttons/back-button/back-button.js";
+import "../../../buttons/copy-button/copy-button.js";
+import "../../../buttons/external-button/external-button.js";
+import "../../../buttons/filter-button/filter-button.js";
+import "../../../buttons/navigation-button/navigation-button.js";
+import "../../../buttons/tab-button/tab-button.js";
+import "../../../token-icon/token-icon.js";
+import "wagmi";
+import "../../../auth/wallet-ui-context.js";
+import "../../../avatar/avatar.js";
+import "../../../badge/badge.js";
+import "../../../base-link/base-link.js";
+import "../../../navigation-context/navigation-context.js";
+import "../../../button-checkbox/button-checkbox.js";
+import "../../../card-grid/card-grid.js";
+import "../../../carousel/carousel.js";
+import "../../../checkbox/checkbox.js";
+import "../../../checkbox/checkbox-labeled.js";
+import "../../../checkbox-item/checkbox-item.js";
+import "../../../client-adapters/styled-button/styled-button.js";
+import "../../../client-adapters/styled-dialog-container/styled-dialog-container.js";
+import "../../../client-adapters/styled-rounded-image/styled-rounded-image.js";
+import "../../../colored-text/colored-text.js";
+import "../../../input/input.js";
+import "../../../with-title/with-title.js";
+import "../../../smart-number-input/balance-indicator.js";
+import "../../../smart-number-input/smart-number-input.js";
+import "../../../table/grid-table.js";
+import "../../../token-symbol/token-symbol.js";
+import "../../../typography/typography.js";
+import "../../../help-tip/help-tip.js";
+import "../../../description/description.js";
+import "../../../confirm-menu/confirm-menu.js";
+import "../../../dialog/dialog-modal-container.js";
+import "../../../text-button/text-button.js";
+import "../../../vertical-indicator/vertical-indicator.js";
+import "../../../points-icon/points-icon.js";
+import "../../../skeleton/skeleton.js";
+import "../../../vertical-list/vertical-list.js";
+import "../../../rounded-image/rounded-image.js";
+import "../../../progress/progress.js";
+import "../../../pool-indicator-icon/pool-indicator-icon.js";
+import "../../strategies-table/components/feature/feature.styles.js";
+import "viem";
+import "../../../icon-button/icon-button.js";
+import "../../../separate-line/separate-line.js";
+import "../../../tip-card/tip-card.js";
+import "../../strategies-table/components/rewards-tooltip/rewards-tooltip-root.js";
+import "../../../currency-button/currency-button.js";
+import "../../../detailed-apy/detailed-apy.js";
+import "../../../detailed-page-title/detailed-page-title.js";
+import "../../../detailed-page-title/detailed-page-title-copy-button.js";
+import "../../../detailed-page-title/detailed-page-title-explorer-dropdown.js";
+import "../../../modal/modal.js";
+import "@radix-ui/react-dialog";
+import "../../../dialog/dialog-content.js";
+import "../../../dialog/dialog-description.js";
+import "../../../dialog/dialog-footer.js";
+import "../../../dialog/dialog-header.js";
+import "../../../dialog/dialog-title.js";
+import "../../../dialog/dialog-overlay.js";
+import "../../../label/label.js";
+import "../../../dropdown-menu/dropdown-menu.js";
+import "../../../dropdown-menu/dropdown-menu-checkbox-item.js";
+import "../../../dropdown-menu/dropdown-menu-content.js";
+import "../../../dropdown-menu/dropdown-menu-item.js";
+import "../../../dropdown-menu/dropdown-menu-label.js";
+import "../../../dropdown-menu/dropdown-menu-radio-item.js";
+import "../../../dropdown-menu/dropdown-menu-separator.js";
+import "../../../dropdown-menu/dropdown-menu-shortcut.js";
+import "../../../dropdown-menu/dropdown-menu-sub-content.js";
+import "../../../dropdown-menu/dropdown-menu-sub-trigger.js";
+import "../../../edit-input/edit-input.js";
+import "../../../fadeout-loading/fadeout-loading.js";
+import "../../../filter/filter-block.js";
+import "../../../filter/filter-checkbox-item.js";
+import "../../../filter/filter-chip.js";
+import "../../../filter/filter-chips.js";
+import "../../../filter/filter-dropdown-item.js";
+import "../../../filter/filter-group.js";
+import "../../../filter/filter-label.js";
+import "../../../search-line/search-line.js";
+import "../../../tabs/tabs.js";
+import "../../../filter/filter-modal-item.js";
+import "../../../filter/filter-radio-item.js";
+import "../../../filter/filter-separator.js";
+import "../../../filter/variants.js";
+import "../../../graph/formatters.js";
+import "lightweight-charts";
+import "../../../graph/graph-view.js";
+import "../../../health-factor/health-factor.js";
+import "../../../horizontal-indicator/horizontal-indicator.js";
+import "../../../layout/col/col.js";
+import "../../../layout/container/container.js";
+import "../../../layout/footer/footer.js";
+import "../../../layout/grid/grid.js";
+import "../../../layout/header/header.js";
+import "../../../layout/layout/layout.js";
+import "../../../layout/main-aside-layout/main-aside-layout.js";
+import "../../../page-title/page-title.js";
+import "../../../layout/social-icons/social-icons.js";
+import "../../../legal-agreement/legal-agreement-theme.js";
+import "../../../link/link.js";
+import "../../../../utils/reactochart-compat.js";
+import "../../../status-elements/status-elements.js";
+import "../../../loader/loader.js";
+import "../../../loading/loading.js";
+import "../../../loading-bar/loading-bar.js";
+import "react-markdown";
+import "remark-gfm";
+import "../../../navbar/navbar.js";
+import "../../../navbar/navbar-indicator-context.js";
+import "../../../app-bar/app-bar.js";
+import "../../../navitem/navitem.js";
+import "../../../simple-dropdown/simple-dropdown.js";
+import "../../../progress-bar/progress-bar.js";
+import "../../../radio-group/radio-group.js";
+import "../../../search-bar/search-bar.js";
+import "../../../segmented-control/segmented-control.js";
+import "../../../select/select.js";
+import "../../../separator/separator.js";
+import "../../../simple-accordion/simple-accordion.js";
+import "../../../simple-dropdown/simple-dropdown-menu-item.js";
+import "../../../slider/slider.js";
+import "../../../slider/slider-context.js";
+import "@radix-ui/react-slider";
+import "../../../spinner/spinner.js";
+import "../../../spinner-loader/spinner-loader.js";
+import "../../../split-list/split-list.js";
+import "../../../stat-badge/stat-badge.js";
+import "../../../status-dot/status-dot.js";
+import "../../../stepper/stepper.js";
+import "../../../switch/switch.js";
+import "../../../table/table.js";
+import "../../../table/grid-table-loader.js";
+import "../../../textarea/textarea.js";
+import "../../../theme-provider.js";
+import "../../../time-to-liquidation/time-to-liquidation.js";
+import "../../../toggle/toggle.js";
+import "../../../with-filter-button/with-filter-button.js";
+import { CollapsibleCard as P } from "../components/CollapsibleCard.js";
+import { PrerequisiteRow as g } from "./PrerequisiteRow.js";
+import { usePrerequisites as v } from "./usePrerequisites.js";
+function wt({
+  sdk: o,
+  operation: p,
+  wallet: e,
+  blockNumber: s,
+  refreshNonce: n
+}) {
+  const { data: t, isLoading: a, error: m } = v({
+    sdk: o,
+    operation: p,
+    wallet: e,
+    blockNumber: s,
+    refreshNonce: n
+  });
+  if (a)
+    return /* @__PURE__ */ d(f, { children: [
+      /* @__PURE__ */ r(u, { children: /* @__PURE__ */ r(c, { children: "Prerequisites" }) }),
+      /* @__PURE__ */ r(C, { children: /* @__PURE__ */ r(h, { lines: 3 }) })
+    ] });
+  if (m)
+    return /* @__PURE__ */ r(q, { err: m, title: "Failed to verify prerequisites" });
+  if (!t || t.length === 0)
+    return null;
+  const l = t.every((i) => !i.error && i.satisfied);
+  return /* @__PURE__ */ r(
+    P,
+    {
+      value: "prerequisites",
+      title: "Prerequisites",
+      defaultOpen: !l,
+      children: t.map((i) => /* @__PURE__ */ r(g, { result: i, sdk: o }, i.id))
+    }
+  );
+}
+export {
+  wt as PrerequisitesCard
+};

package/dist/esm/components/composites/tx-preview/prerequisites/index.js

@@ -0,0 +1,11 @@
+import { PrerequisiteRow as i } from "./PrerequisiteRow.js";
+import { PrerequisitesCard as o } from "./PrerequisitesCard.js";
+import { prerequisiteDetailRenderers as u, renderPrerequisiteDetail as p } from "./prerequisiteDetails.js";
+import { usePrerequisites as f } from "./usePrerequisites.js";
+export {
+  i as PrerequisiteRow,
+  o as PrerequisitesCard,
+  u as prerequisiteDetailRenderers,
+  p as renderPrerequisiteDetail,
+  f as usePrerequisites
+};

package/dist/esm/components/composites/tx-preview/prerequisites/prerequisiteDetails.js

@@ -0,0 +1,58 @@
+import { jsx as r, jsxs as t } from "react/jsx-runtime";
+import { maxUint256 as d } from "viem";
+import { TokenIcon as p } from "../../../token-icon/token-icon.js";
+import { TokenTemplate as u } from "../../../token-template/token-template.js";
+import { resolveToken as l } from "../utils/poolTokenInfo.js";
+function i({
+  token: e,
+  required: n,
+  actual: s,
+  actualLabel: m = "Available"
+}) {
+  const c = {
+    symbol: e.symbol,
+    title: e.symbol,
+    decimals: e.decimals
+  }, a = (o) => o === d ? /* @__PURE__ */ t("span", { className: "flex items-center gap-1", title: "Unlimited", children: [
+    /* @__PURE__ */ r("span", { "aria-hidden": !0, children: "∞" }),
+    /* @__PURE__ */ r("span", { children: e.symbol })
+  ] }) : /* @__PURE__ */ r(u, { value: o, token: c, showSymbol: !0 });
+  return /* @__PURE__ */ t("span", { className: "flex flex-col items-end gap-0.5 text-sm", children: [
+    /* @__PURE__ */ t("span", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ r("span", { className: "text-muted-foreground", children: "Required" }),
+      /* @__PURE__ */ r(p, { symbol: e.symbol, size: 14 }),
+      a(n)
+    ] }),
+    s !== void 0 ? /* @__PURE__ */ t("span", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ r("span", { className: "text-muted-foreground", children: m }),
+      a(s)
+    ] }) : null
+  ] });
+}
+const f = {
+  allowance: (e, n) => /* @__PURE__ */ r(
+    i,
+    {
+      token: l(n, e.token),
+      required: e.required,
+      actual: e.actual,
+      actualLabel: "Approved"
+    }
+  ),
+  balance: (e, n) => /* @__PURE__ */ r(
+    i,
+    {
+      token: l(n, e.token),
+      required: e.required,
+      actual: e.actual
+    }
+  )
+};
+function g(e, n) {
+  const s = f[e.kind];
+  return s(e.detail, n);
+}
+export {
+  f as prerequisiteDetailRenderers,
+  g as renderPrerequisiteDetail
+};

package/dist/esm/components/composites/tx-preview/prerequisites/usePrerequisites.js

@@ -0,0 +1,39 @@
+import { json_stringify as n } from "@gearbox-protocol/sdk";
+import { verifyPrerequisites as o, buildPrerequisites as f } from "@gearbox-protocol/sdk/preview";
+import { useQuery as y } from "@tanstack/react-query";
+function p({
+  sdk: s,
+  operation: e,
+  wallet: r,
+  blockNumber: t,
+  refreshNonce: u
+}) {
+  return y({
+    queryKey: [
+      "prerequisites",
+      n(e),
+      r,
+      t?.toString(),
+      u
+    ],
+    queryFn: () => {
+      const i = {
+        sdk: s,
+        wallet: r,
+        blockNumber: t
+      };
+      return o(f(e, i), i);
+    },
+    // Kept reactive so external changes (a deposit / approval done in another
+    // window) are reflected: short stale time + refetch on window focus and a
+    // modest interval. The submit flow additionally bumps `refreshNonce` for an
+    // immediate re-check right after its own actions.
+    staleTime: 1e4,
+    refetchOnWindowFocus: !0,
+    refetchInterval: 3e4,
+    retry: !1
+  });
+}
+export {
+  p as usePrerequisites
+};

package/dist/esm/components/composites/tx-preview/state-change/BalanceChangeGroup.js

@@ -0,0 +1,182 @@
+import { jsxs as e, jsx as r } from "react/jsx-runtime";
+import "../components/AddressAvatar.js";
+import "@gearbox-protocol/static";
+import "react";
+import "@fortawesome/free-solid-svg-icons";
+import "../../../icons/fa-icon.js";
+import "@gearbox-protocol/sdk";
+import "clsx";
+import "tailwind-merge";
+import "sonner";
+import "@gearbox-protocol/sdk/common-utils";
+import "luxon";
+import "../../../../utils/z-index.js";
+import "../../../accordion/accordion.js";
+import "../../../alert-badge/alert-badge.js";
+import "../../../alert-dialog/alert-dialog.js";
+import "../../../alert-modal/alert-modal.js";
+import "../../../tooltip/simple-tooltip.js";
+import "../../../tooltip/tooltip.js";
+import "react-intl";
+import "../../../arc-loader/arc-loader.js";
+import "../../../asset-line/asset-line.js";
+import "../../../buttons/back-button/back-button.js";
+import "../../../buttons/button/button.js";
+import "../../../buttons/copy-button/copy-button.js";
+import "../../../buttons/external-button/external-button.js";
+import "../../../buttons/filter-button/filter-button.js";
+import "../../../buttons/navigation-button/navigation-button.js";
+import "../../../buttons/tab-button/tab-button.js";
+import "../../../token-icon/token-icon.js";
+import "wagmi";
+import "../../../auth/wallet-ui-context.js";
+import "../../../avatar/avatar.js";
+import "../../../badge/badge.js";
+import "../../../base-link/base-link.js";
+import "../../../navigation-context/navigation-context.js";
+import "../../../button-checkbox/button-checkbox.js";
+import "../../../card-grid/card-grid.js";
+import "../../../cards/card/card.js";
+import "../../../carousel/carousel.js";
+import "../../../checkbox/checkbox.js";
+import "../../../checkbox/checkbox-labeled.js";
+import "../../../checkbox-item/checkbox-item.js";
+import "../../../client-adapters/styled-button/styled-button.js";
+import "../../../client-adapters/styled-dialog-container/styled-dialog-container.js";
+import "../../../client-adapters/styled-rounded-image/styled-rounded-image.js";
+import "../../../colored-text/colored-text.js";
+import "../../../input/input.js";
+import "../../../with-title/with-title.js";
+import "../../../smart-number-input/balance-indicator.js";
+import "../../../smart-number-input/smart-number-input.js";
+import "../../../table/grid-table.js";
+import "../../../token-symbol/token-symbol.js";
+import "../../../typography/typography.js";
+import "../../../help-tip/help-tip.js";
+import "../../../description/description.js";
+import "../../../confirm-menu/confirm-menu.js";
+import "../../../dialog/dialog-modal-container.js";
+import "../../../text-button/text-button.js";
+import "../../../vertical-indicator/vertical-indicator.js";
+import "../../../points-icon/points-icon.js";
+import "../../../skeleton/skeleton.js";
+import "../../../vertical-list/vertical-list.js";
+import "../../../rounded-image/rounded-image.js";
+import "../../../progress/progress.js";
+import "../../../pool-indicator-icon/pool-indicator-icon.js";
+import "../../strategies-table/components/feature/feature.styles.js";
+import "viem";
+import "../../../icon-button/icon-button.js";
+import "../../../separate-line/separate-line.js";
+import "../../../tip-card/tip-card.js";
+import "../../strategies-table/components/rewards-tooltip/rewards-tooltip-root.js";
+import "../../../currency-button/currency-button.js";
+import "../../../detailed-apy/detailed-apy.js";
+import "../../../detailed-page-title/detailed-page-title.js";
+import "../../../detailed-page-title/detailed-page-title-copy-button.js";
+import "../../../detailed-page-title/detailed-page-title-explorer-dropdown.js";
+import "../../../modal/modal.js";
+import "@radix-ui/react-dialog";
+import "../../../dialog/dialog-container.js";
+import "../../../dialog/dialog-content.js";
+import "../../../dialog/dialog-description.js";
+import "../../../dialog/dialog-footer.js";
+import "../../../dialog/dialog-header.js";
+import "../../../dialog/dialog-title.js";
+import "../../../dialog/dialog-overlay.js";
+import "../../../label/label.js";
+import "../../../dropdown-menu/dropdown-menu.js";
+import "../../../dropdown-menu/dropdown-menu-checkbox-item.js";
+import "../../../dropdown-menu/dropdown-menu-content.js";
+import "../../../dropdown-menu/dropdown-menu-item.js";
+import "../../../dropdown-menu/dropdown-menu-label.js";
+import "../../../dropdown-menu/dropdown-menu-radio-item.js";
+import "../../../dropdown-menu/dropdown-menu-separator.js";
+import "../../../dropdown-menu/dropdown-menu-shortcut.js";
+import "../../../dropdown-menu/dropdown-menu-sub-content.js";
+import "../../../dropdown-menu/dropdown-menu-sub-trigger.js";
+import "../../../edit-input/edit-input.js";
+import "../../../fadeout-loading/fadeout-loading.js";
+import "../../../filter/filter-block.js";
+import "../../../filter/filter-checkbox-item.js";
+import "../../../filter/filter-chip.js";
+import "../../../filter/filter-chips.js";
+import "../../../filter/filter-dropdown-item.js";
+import "../../../filter/filter-group.js";
+import "../../../filter/filter-label.js";
+import "../../../search-line/search-line.js";
+import "../../../tabs/tabs.js";
+import "../../../filter/filter-modal-item.js";
+import "../../../filter/filter-radio-item.js";
+import "../../../filter/filter-separator.js";
+import "../../../filter/variants.js";
+import "../../../graph/formatters.js";
+import "lightweight-charts";
+import "../../../graph/graph-view.js";
+import "../../../health-factor/health-factor.js";
+import "../../../horizontal-indicator/horizontal-indicator.js";
+import "../../../layout/col/col.js";
+import "../../../layout/container/container.js";
+import "../../../layout/footer/footer.js";
+import "../../../layout/grid/grid.js";
+import "../../../layout/header/header.js";
+import "../../../layout/layout/layout.js";
+import "../../../layout/main-aside-layout/main-aside-layout.js";
+import "../../../page-title/page-title.js";
+import "../../../layout/social-icons/social-icons.js";
+import "../../../legal-agreement/legal-agreement-theme.js";
+import "../../../link/link.js";
+import "../../../../utils/reactochart-compat.js";
+import "../../../status-elements/status-elements.js";
+import "../../../loader/loader.js";
+import "../../../loading/loading.js";
+import "../../../loading-bar/loading-bar.js";
+import "react-markdown";
+import "remark-gfm";
+import "../../../navbar/navbar.js";
+import "../../../navbar/navbar-indicator-context.js";
+import "../../../app-bar/app-bar.js";
+import "../../../navitem/navitem.js";
+import "../../../simple-dropdown/simple-dropdown.js";
+import "../../../progress-bar/progress-bar.js";
+import "../../../radio-group/radio-group.js";
+import "../../../search-bar/search-bar.js";
+import "../../../segmented-control/segmented-control.js";
+import "../../../select/select.js";
+import "../../../separator/separator.js";
+import "../../../simple-accordion/simple-accordion.js";
+import "../../../simple-dropdown/simple-dropdown-menu-item.js";
+import "../../../slider/slider.js";
+import "../../../slider/slider-context.js";
+import "@radix-ui/react-slider";
+import "../../../spinner/spinner.js";
+import "../../../spinner-loader/spinner-loader.js";
+import "../../../split-list/split-list.js";
+import "../../../stat-badge/stat-badge.js";
+import "../../../status-dot/status-dot.js";
+import "../../../stepper/stepper.js";
+import "../../../switch/switch.js";
+import "../../../table/table.js";
+import "../../../table/grid-table-loader.js";
+import "../../../textarea/textarea.js";
+import "../../../theme-provider.js";
+import "../../../time-to-liquidation/time-to-liquidation.js";
+import "../../../toggle/toggle.js";
+import "../../../with-filter-button/with-filter-button.js";
+import { getAddressLabel as a } from "../components/addressLabel.js";
+import { SectionDivider as l } from "../components/SectionDivider.js";
+import { BalanceChangeRow as n } from "./BalanceChangeRow.js";
+function hi({
+  sdk: m,
+  group: o,
+  labels: p
+}) {
+  const i = a(p, o.address)?.balancesLabel;
+  return /* @__PURE__ */ e("div", { className: "flex flex-col gap-3", children: [
+    i ? /* @__PURE__ */ r(l, { title: i }) : null,
+    /* @__PURE__ */ r("div", { className: "grid grid-cols-[minmax(0,1fr)_auto_auto] items-center gap-x-4 gap-y-2", children: o.changes.map((t) => /* @__PURE__ */ r(n, { sdk: m, change: t }, t.token)) })
+  ] });
+}
+export {
+  hi as BalanceChangeGroup
+};

package/dist/esm/components/composites/tx-preview/state-change/BalanceChangeRow.js

@@ -0,0 +1,61 @@
+import { jsxs as a, Fragment as c, jsx as e } from "react/jsx-runtime";
+import { faArrowRight as p } from "@fortawesome/free-solid-svg-icons";
+import { FaIcon as f } from "../../../icons/fa-icon.js";
+import { TokenIcon as d } from "../../../token-icon/token-icon.js";
+import { TokenTemplate as m } from "../../../token-template/token-template.js";
+import "viem";
+import { resolveToken as u } from "../utils/poolTokenInfo.js";
+function v({ sdk: r, change: t }) {
+  const s = u(r, t.token), l = t.delta >= 0n, i = l ? t.delta : -t.delta, o = l ? "text-success" : "text-destructive", n = {
+    symbol: s.symbol,
+    title: s.symbol,
+    decimals: s.decimals
+  };
+  return /* @__PURE__ */ a(c, { children: [
+    /* @__PURE__ */ a(
+      "div",
+      {
+        className: `flex min-w-0 items-center gap-2 justify-self-start ${o}`,
+        children: [
+          /* @__PURE__ */ e(d, { symbol: s.symbol, size: 16 }),
+          /* @__PURE__ */ e("span", { className: "truncate text-sm", children: s.symbol }),
+          s.name ? /* @__PURE__ */ e("span", { className: "truncate text-xs opacity-70", children: s.name }) : null
+        ]
+      }
+    ),
+    /* @__PURE__ */ a("span", { className: "flex items-center justify-self-end gap-2 whitespace-nowrap text-xs", children: [
+      /* @__PURE__ */ e("span", { className: `line-through ${o}`, children: /* @__PURE__ */ e(
+        m,
+        {
+          value: t.before,
+          token: n,
+          showSymbol: !1
+        }
+      ) }),
+      /* @__PURE__ */ e(f, { icon: p, className: `size-2.5 ${o}` }),
+      /* @__PURE__ */ e("span", { className: o, children: /* @__PURE__ */ e(
+        m,
+        {
+          value: t.after,
+          token: n,
+          showSymbol: !1
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ a(
+      "span",
+      {
+        className: `justify-self-start whitespace-nowrap text-xs ${o}`,
+        children: [
+          "(",
+          l ? "+" : "-",
+          /* @__PURE__ */ e(m, { value: i, token: n, showSymbol: !1 }),
+          ")"
+        ]
+      }
+    )
+  ] });
+}
+export {
+  v as BalanceChangeRow
+};

package/dist/esm/components/composites/tx-preview/state-change/PoolStateChangeCard.js

@@ -0,0 +1,23 @@
+import { jsx as a, Fragment as m } from "react/jsx-runtime";
+import { buildPoolOperationLabels as i } from "../utils/addressLabels.js";
+import { BalanceChangeGroup as p } from "./BalanceChangeGroup.js";
+function f({
+  sdk: o,
+  operation: e,
+  balanceChanges: t,
+  wallet: n
+}) {
+  const l = i(o, e, n);
+  return /* @__PURE__ */ a(m, { children: t.map((r) => /* @__PURE__ */ a(
+    p,
+    {
+      sdk: o,
+      group: r,
+      labels: l
+    },
+    r.address
+  )) });
+}
+export {
+  f as PoolStateChangeCard
+};