@gearbox-protocol/ui-kit 4.0.0-next.11 → 4.0.0-next.13

package/dist/cjs/components/base/amount-input/token-select-panel.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),f=require("../../confirm-menu/confirm-menu.cjs");require("react-intl");require("../../buttons/button/button.cjs");const b=require("../../vspace/vspace.cjs"),n=require("../../table/grid-table.cjs");require("../../skeleton/skeleton.cjs");require("react");require("@gearbox-protocol/sdk");require("clsx");require("tailwind-merge");require("sonner");const h=require("../../../utils/format-asset-amount.cjs"),q=require("../../../utils/format-money.cjs");require("@gearbox-protocol/sdk/common-utils");require("luxon");require("../../../utils/z-index.cjs");require("../../table/table.cjs");const _=require("../../token-symbol/token-symbol.cjs"),g=require("../../typed-intl/index.cjs"),a=require("./constants.cjs");function c(s,t){if(s)return s[t]??s[t.toLowerCase()]}function j({tokens:s,balances:t,usdPrices:u,onSelect:d,onClose:m}){return e.jsxs("div",{"data-testid":a.AmountInputTest.selectPanel,className:"flex max-h-[calc(100vh-40px)] w-full flex-col overflow-hidden rounded-lg border border-gray-10 bg-modal p-4 shadow-[0_4px_28px_4px_rgba(0,0,0,0.25)] sm:max-h-[560px]",children:[e.jsx(f.ConfirmMenu,{title:e.jsx(g.FormattedMessageTyped,{messageId:"components.amountInput.selectToken"}),onClose:m}),e.jsx(b.VSpace,{size:16}),e.jsx("div",{className:"flex min-h-[260px] flex-col overflow-y-auto pr-1",children:e.jsx(n.GridTable,{cols:"minmax(0,1fr) 120px",gap:0,size:"sm",wrapperClassName:"overflow-visible",children:e.jsx(n.GridTableBody,{children:s.map((r,x)=>{const o=c(t,r.address)??0n,i=c(u,r.address),p=Number(o)/10**r.decimals,l=i!==void 0?q.formatMoney(p*i,4):void 0;return e.jsxs(n.GridTableRow,{last:x===s.length-1,height:"56px","data-testid":a.AmountInputTest.selectOption,onRowClick:()=>d(r),children:[e.jsx(n.GridTableCell,{size:"sm",children:e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx(_.TokenSymbol,{token:r,size:24,showSymbol:!1}),e.jsx("span",{className:"truncate",children:r.name})]})}),e.jsx(n.GridTableCell,{size:"sm",textAlign:"right",children:e.jsxs("div",{children:[e.jsx("div",{className:"block text-xs font-normal tabular-nums text-foreground",children:h.formatAssetAmount(o,r.decimals)}),l!==void 0?e.jsx("div",{className:"block text-[11px] font-normal leading-[13px] tabular-nums text-secondary-foreground",children:l}):null]})})]},r.address)})})})})]})}exports.TokenSelectPanel=j;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),p=require("../../confirm-menu/confirm-menu.cjs");require("react-intl");require("../../buttons/button/button.cjs");const b=require("../../vspace/vspace.cjs"),r=require("../../table/grid-table.cjs");require("../../skeleton/skeleton.cjs");require("react");require("@gearbox-protocol/sdk");require("clsx");require("tailwind-merge");require("sonner");const f=require("../../../utils/format-asset-amount.cjs"),h=require("../../../utils/format-money.cjs");require("@gearbox-protocol/sdk/common-utils");require("luxon");require("../../../utils/z-index.cjs");require("../../table/table.cjs");const q=require("../../token-symbol/token-symbol.cjs"),g=require("../../typed-intl/index.cjs"),i=require("./constants.cjs");function _({tokens:n,balances:a,usdPrices:c,onSelect:d,onClose:u}){return e.jsxs("div",{"data-testid":i.AmountInputTest.selectPanel,className:"flex max-h-[calc(100vh-40px)] w-full flex-col overflow-hidden rounded-lg border border-gray-10 bg-modal p-4 shadow-[0_4px_28px_4px_rgba(0,0,0,0.25)] sm:max-h-[560px]",children:[e.jsx(p.ConfirmMenu,{title:e.jsx(g.FormattedMessageTyped,{messageId:"components.amountInput.selectToken"}),onClose:u}),e.jsx(b.VSpace,{size:16}),e.jsx("div",{className:"flex min-h-[260px] flex-col overflow-y-auto pr-1",children:e.jsx(r.GridTable,{cols:"minmax(0,1fr) 120px",gap:0,size:"sm",wrapperClassName:"overflow-visible",children:e.jsx(r.GridTableBody,{children:n.map((s,m)=>{const t=a?.get(s.address)??0n,o=c?.get(s.address),x=Number(t)/10**s.decimals,l=o!==void 0?h.formatMoney(x*o,4):void 0;return e.jsxs(r.GridTableRow,{last:m===n.length-1,height:"56px","data-testid":i.AmountInputTest.selectOption,onRowClick:()=>d(s),children:[e.jsx(r.GridTableCell,{size:"sm",children:e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx(q.TokenSymbol,{token:s,size:24,showSymbol:!1}),e.jsx("span",{className:"truncate",children:s.name})]})}),e.jsx(r.GridTableCell,{size:"sm",textAlign:"right",children:e.jsxs("div",{children:[e.jsx("div",{className:"block text-xs font-normal tabular-nums text-foreground",children:f.formatAssetAmount(t,s.decimals)}),l!==void 0?e.jsx("div",{className:"block text-[11px] font-normal leading-[13px] tabular-nums text-secondary-foreground",children:l}):null]})})]},s.address)})})})})]})}exports.TokenSelectPanel=_;

package/dist/esm/components/base/amount-input/token-select-panel.js

@@ -1,73 +1,69 @@
-import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
 import { ConfirmMenu as h } from "../../confirm-menu/confirm-menu.js";
 import "react-intl";
 import "../../buttons/button/button.js";
-import { VSpace as b } from "../../vspace/vspace.js";
-import { GridTable as g, GridTableBody as v, GridTableRow as w, GridTableCell as s } from "../../table/grid-table.js";
+import { VSpace as u } from "../../vspace/vspace.js";
+import { GridTable as b, GridTableBody as g, GridTableRow as v, GridTableCell as a } from "../../table/grid-table.js";
 import "../../skeleton/skeleton.js";
 import "react";
 import "@gearbox-protocol/sdk";
 import "clsx";
 import "tailwind-merge";
 import "sonner";
-import { formatAssetAmount as T } from "../../../utils/format-asset-amount.js";
-import { formatMoney as y } from "../../../utils/format-money.js";
+import { formatAssetAmount as w } from "../../../utils/format-asset-amount.js";
+import { formatMoney as T } from "../../../utils/format-money.js";
 import "@gearbox-protocol/sdk/common-utils";
 import "luxon";
 import "../../../utils/z-index.js";
 import "../../table/table.js";
-import { TokenSymbol as N } from "../../token-symbol/token-symbol.js";
-import { FormattedMessageTyped as z } from "../../typed-intl/index.js";
-import { AmountInputTest as n } from "./constants.js";
-function d(o, i) {
-  if (o)
-    return o[i] ?? o[i.toLowerCase()];
-}
-function Q({
-  tokens: o,
-  balances: i,
-  usdPrices: p,
-  onSelect: c,
-  onClose: f
+import { TokenSymbol as y } from "../../token-symbol/token-symbol.js";
+import { FormattedMessageTyped as N } from "../../typed-intl/index.js";
+import { AmountInputTest as s } from "./constants.js";
+function L({
+  tokens: i,
+  balances: d,
+  usdPrices: n,
+  onSelect: p,
+  onClose: c
 }) {
-  return /* @__PURE__ */ t(
+  return /* @__PURE__ */ o(
     "div",
     {
-      "data-testid": n.selectPanel,
+      "data-testid": s.selectPanel,
       className: "flex max-h-[calc(100vh-40px)] w-full flex-col overflow-hidden rounded-lg border border-gray-10 bg-modal p-4 shadow-[0_4px_28px_4px_rgba(0,0,0,0.25)] sm:max-h-[560px]",
       children: [
         /* @__PURE__ */ e(
           h,
           {
-            title: /* @__PURE__ */ e(z, { messageId: "components.amountInput.selectToken" }),
-            onClose: f
+            title: /* @__PURE__ */ e(N, { messageId: "components.amountInput.selectToken" }),
+            onClose: c
           }
         ),
-        /* @__PURE__ */ e(b, { size: 16 }),
+        /* @__PURE__ */ e(u, { size: 16 }),
         /* @__PURE__ */ e("div", { className: "flex min-h-[260px] flex-col overflow-y-auto pr-1", children: /* @__PURE__ */ e(
-          g,
+          b,
           {
             cols: "minmax(0,1fr) 120px",
             gap: 0,
             size: "sm",
             wrapperClassName: "overflow-visible",
-            children: /* @__PURE__ */ e(v, { children: o.map((r, x) => {
-              const l = d(i, r.address) ?? 0n, m = d(p, r.address), u = Number(l) / 10 ** r.decimals, a = m !== void 0 ? y(u * m, 4) : void 0;
-              return /* @__PURE__ */ t(
-                w,
+            children: /* @__PURE__ */ e(g, { children: i.map((r, f) => {
+              const t = d?.get(r.address) ?? 0n, l = n?.get(r.address), x = Number(t) / 10 ** r.decimals, m = l !== void 0 ? T(x * l, 4) : void 0;
+              return /* @__PURE__ */ o(
+                v,
                 {
-                  last: x === o.length - 1,
+                  last: f === i.length - 1,
                   height: "56px",
-                  "data-testid": n.selectOption,
-                  onRowClick: () => c(r),
+                  "data-testid": s.selectOption,
+                  onRowClick: () => p(r),
                   children: [
-                    /* @__PURE__ */ e(s, { size: "sm", children: /* @__PURE__ */ t("div", { className: "flex items-center gap-3", children: [
-                      /* @__PURE__ */ e(N, { token: r, size: 24, showSymbol: !1 }),
+                    /* @__PURE__ */ e(a, { size: "sm", children: /* @__PURE__ */ o("div", { className: "flex items-center gap-3", children: [
+                      /* @__PURE__ */ e(y, { token: r, size: 24, showSymbol: !1 }),
                       /* @__PURE__ */ e("span", { className: "truncate", children: r.name })
                     ] }) }),
-                    /* @__PURE__ */ e(s, { size: "sm", textAlign: "right", children: /* @__PURE__ */ t("div", { children: [
-                      /* @__PURE__ */ e("div", { className: "block text-xs font-normal tabular-nums text-foreground", children: T(l, r.decimals) }),
-                      a !== void 0 ? /* @__PURE__ */ e("div", { className: "block text-[11px] font-normal leading-[13px] tabular-nums text-secondary-foreground", children: a }) : null
+                    /* @__PURE__ */ e(a, { size: "sm", textAlign: "right", children: /* @__PURE__ */ o("div", { children: [
+                      /* @__PURE__ */ e("div", { className: "block text-xs font-normal tabular-nums text-foreground", children: w(t, r.decimals) }),
+                      m !== void 0 ? /* @__PURE__ */ e("div", { className: "block text-[11px] font-normal leading-[13px] tabular-nums text-secondary-foreground", children: m }) : null
                     ] }) })
                   ]
                 },
@@ -81,5 +77,5 @@ function Q({
   );
 }
 export {
-  Q as TokenSelectPanel
+  L as TokenSelectPanel
 };

package/dist/types/components/base/amount-input/amount-input.d.ts

@@ -1,3 +1,4 @@
+import { AddressMap } from '@gearbox-protocol/sdk';
 import { Token } from '@gearbox-protocol/sdk/model';
 import { default as React } from 'react';
 import { TitleText } from '../text';
@@ -14,9 +15,9 @@ export interface AmountInputProps {
     readonly onToken?: (token: Token) => void;
     readonly balance?: bigint;
     /** Wallet balances by token address — the picker's balance column. */
-    readonly balances?: Readonly<Record<string, bigint>>;
+    readonly balances?: AddressMap<bigint>;
     /** USD price per whole token by address — the picker's USD line. */
-    readonly usdPrices?: Readonly<Record<string, number>>;
+    readonly usdPrices?: AddressMap<number>;
     /** Label above the field; defaults to the "Amount" locale string. */
     readonly label?: TitleText;
     /** Label of the balance row; defaults to the "Balance" locale string. */

package/dist/types/components/base/amount-input/token-select-panel.d.ts

@@ -1,11 +1,12 @@
+import { AddressMap } from '@gearbox-protocol/sdk';
 import { Token } from '@gearbox-protocol/sdk/model';
 import { default as React } from 'react';
 export interface TokenSelectPanelProps {
     readonly tokens: ReadonlyArray<Token>;
-    /** Wallet balances by token address (either casing); shows a balance column. */
-    readonly balances?: Readonly<Record<string, bigint>>;
+    /** Wallet balances by token address; shows a balance column. */
+    readonly balances?: AddressMap<bigint>;
     /** USD price per one whole token by address; shows a USD line under the balance. */
-    readonly usdPrices?: Readonly<Record<string, number>>;
+    readonly usdPrices?: AddressMap<number>;
     readonly onSelect: (token: Token) => void;
     readonly onClose: () => void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gearbox-protocol/ui-kit",
-  "version": "4.0.0-next.11",
+  "version": "4.0.0-next.13",
   "description": "Internal UI components",
   "repository": {
     "type": "git",
@@ -92,11 +92,11 @@
     "axios": "^1.0.0",
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19",
-    "react-intl": "^6.0.0 || ^7.0.0",
+    "react-intl": "^6.0.0 || ^7.0.0 || ^10.0.0",
     "react-router-dom": "^6.0.0 || ^7.0.0",
     "sonner": "^2.0.0",
     "viem": "^2.0.0",
-    "wagmi": "^2.0.0"
+    "wagmi": "^2.0.0 || ^3.0.0"
   },
   "peerDependenciesMeta": {
     "react-intl": {