@gearbox-protocol/ui-kit 4.0.0-next.15 → 4.0.0-next.17

package/dist/esm/components/base/values/scalars.js

@@ -1,63 +1,82 @@
-import { jsx as e } from "react/jsx-runtime";
-import { CompoundAPY as s } from "../../compound-apy/compound-apy.js";
+import { jsx as r, jsxs as s } from "react/jsx-runtime";
+import { formatUnits as m } from "viem";
+import { CompoundAPY as p } from "../../compound-apy/compound-apy.js";
+import { SimpleTooltip as u } from "../../tooltip/simple-tooltip.js";
+import "../../tooltip/tooltip.js";
 import "react";
 import "@gearbox-protocol/sdk";
 import { cn as a } from "../../../utils/cn.js";
 import "sonner";
-import { formatLeverage as c } from "../../../utils/format-leverage.js";
-import { formatPercentAmount as m, formatMoney as l } from "../../../utils/format-money.js";
+import { formatAssetAmount as c } from "../../../utils/format-asset-amount.js";
+import { formatLeverage as d } from "../../../utils/format-leverage.js";
+import { formatPercentAmount as f, formatMoney as h } from "../../../utils/format-money.js";
 import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
-import { ValueTest as r } from "./constants.js";
-const d = "—";
-function i() {
-  return /* @__PURE__ */ e("span", { "data-testid": r.placeholder, children: d });
+import { ValueTest as e } from "./constants.js";
+const v = "—";
+function n() {
+  return /* @__PURE__ */ r("span", { "data-testid": e.placeholder, children: v });
 }
-function o(t) {
-  return `${m(t / 100, 2)}%`;
+function l(t) {
+  return `${f(t / 100, 2)}%`;
 }
-function P({ data: t }) {
-  return t === void 0 ? /* @__PURE__ */ e(i, {}) : typeof t == "number" ? /* @__PURE__ */ e("span", { "data-testid": r.apy, children: o(t) }) : /* @__PURE__ */ e("span", { "data-testid": r.apy, children: /* @__PURE__ */ e(s, { apy: t }) });
+function E({ data: t }) {
+  return t === void 0 ? /* @__PURE__ */ r(n, {}) : typeof t == "number" ? /* @__PURE__ */ r("span", { "data-testid": e.apy, children: l(t) }) : /* @__PURE__ */ r("span", { "data-testid": e.apy, children: /* @__PURE__ */ r(p, { apy: t }) });
 }
-function $({
+function H({
   data: t
 }) {
-  return t == null ? /* @__PURE__ */ e(i, {}) : /* @__PURE__ */ e("span", { "data-testid": r.usd, children: l(t) });
+  return t == null ? /* @__PURE__ */ r(n, {}) : /* @__PURE__ */ r("span", { "data-testid": e.usd, children: h(t) });
 }
-function z({
+function N({
   data: t
 }) {
-  return t === void 0 ? /* @__PURE__ */ e(i, {}) : /* @__PURE__ */ e("span", { "data-testid": r.leverage, children: `${c(t)}x` });
+  return t === void 0 ? /* @__PURE__ */ r(n, {}) : /* @__PURE__ */ r("span", { "data-testid": e.leverage, children: `${d(t)}x` });
 }
 function w({
   data: t
 }) {
-  return t === void 0 ? /* @__PURE__ */ e(i, {}) : /* @__PURE__ */ e("span", { "data-testid": r.utilization, children: o(t) });
+  return t === void 0 ? /* @__PURE__ */ r(n, {}) : /* @__PURE__ */ r("span", { "data-testid": e.utilization, children: l(t) });
 }
-function B({
+function D({
   data: t
 }) {
   if (t === void 0)
-    return /* @__PURE__ */ e(i, {});
-  const n = t < 1e4 ? "text-destructive" : t < 11e3 ? "text-warning" : "text-success";
-  return /* @__PURE__ */ e("span", { "data-testid": r.healthFactor, className: a(n), children: (t / 1e4).toFixed(2) });
+    return /* @__PURE__ */ r(n, {});
+  const i = t < 1e4 ? "text-destructive" : t < 11e3 ? "text-warning" : "text-success";
+  return /* @__PURE__ */ r("span", { "data-testid": e.healthFactor, className: a(i), children: (t / 1e4).toFixed(2) });
 }
-function C({
+function M({
   data: t,
-  token: n
+  token: i
 }) {
-  if (t === void 0 || n === void 0)
-    return /* @__PURE__ */ e(i, {});
-  const u = Number(t) / 10 ** n.decimals;
-  return /* @__PURE__ */ e("span", { "data-testid": r.tokenBigint, children: `${u.toLocaleString(void 0, { maximumFractionDigits: 6 })} ${n.symbol}` });
+  if (t === void 0 || i === void 0)
+    return /* @__PURE__ */ r(n, {});
+  const o = m(t, i.decimals);
+  return (
+    // `title` also keeps the amount where a hover tooltip cannot reach:
+    // keyboard, touch, and the browser's own find
+    /* @__PURE__ */ s("span", { "data-testid": e.tokenBigint, title: `${o} ${i.symbol}`, children: [
+      /* @__PURE__ */ r(
+        u,
+        {
+          placement: "top",
+          className: "break-all",
+          title: /* @__PURE__ */ r("span", { children: c(t, i.decimals) }),
+          children: /* @__PURE__ */ r("span", { children: o })
+        }
+      ),
+      ` ${i.symbol}`
+    ] })
+  );
 }
 export {
-  P as ApyValue,
-  B as HealthFactorValue,
-  z as LeverageValue,
-  C as TokenBigint,
-  $ as UsdValue,
+  E as ApyValue,
+  D as HealthFactorValue,
+  N as LeverageValue,
+  M as TokenBigint,
+  H as UsdValue,
   w as UtilizationValue,
-  o as bps
+  l as bps
 };

package/dist/esm/components/checkbox/checkbox-labeled.js

@@ -37,6 +37,7 @@ import "../simple-accordion/simple-accordion.js";
 import "../tip-card/tip-card.js";
 import "../typography/typography.js";
 import "../points-icon/points-icon.js";
+import "viem";
 import "../vertical-indicator/vertical-indicator.js";
 import "../base/page-title/page-title.js";
 import "../detailed-page-title/detailed-page-title-copy-button.js";
@@ -72,7 +73,6 @@ import "../dialog/dialog-header.js";
 import "../dialog/dialog-title.js";
 import "../dialog/dialog-modal-container.js";
 import "../dialog/dialog-overlay.js";
-import "viem";
 import "../input/input.js";
 import { Label as k } from "../label/label.js";
 import "../simple-dropdown/simple-dropdown.js";

package/dist/esm/components/client-adapters/styled-rounded-image/styled-rounded-image.js

@@ -37,6 +37,7 @@ import "../../simple-accordion/simple-accordion.js";
 import "../../tip-card/tip-card.js";
 import "../../typography/typography.js";
 import "../../points-icon/points-icon.js";
+import "viem";
 import "../../vertical-indicator/vertical-indicator.js";
 import "../../base/page-title/page-title.js";
 import "../../detailed-page-title/detailed-page-title-copy-button.js";
@@ -73,7 +74,6 @@ import "../../dialog/dialog-header.js";
 import "../../dialog/dialog-title.js";
 import "../../dialog/dialog-modal-container.js";
 import "../../dialog/dialog-overlay.js";
-import "viem";
 import "../../input/input.js";
 import "../../label/label.js";
 import "../../simple-dropdown/simple-dropdown.js";