@gearbox-protocol/permissionless-ui 1.22.0-next.4 → 1.22.0-next.40

package/dist/types/components/modal/modal.d.ts

@@ -0,0 +1,33 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from "react";
+declare const dialogModalVariants: (props?: ({
+    colorTheme?: "default" | "dark" | "dark-transparent" | null | undefined;
+    backdrop?: "default" | "success" | "failure" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface ModalProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof dialogModalVariants> {
+    /**
+     * Whether to show the dialog container
+     * When false, renders null
+     * @default true
+     */
+    show?: boolean;
+    /**
+     * Callback when clicking outside the container (on the overlay)
+     * Only works when used as a modal overlay
+     */
+    onClickOutside?: () => void;
+}
+/**
+ * Modal component for responsive content width within dialogs
+ * Follows the same pattern as Container from layout/container
+ *
+ * @example
+ * ```tsx
+ * // With show/hide control
+ * <Modal show={isOpen} onClickOutside={handleClose}>
+ *   <Content />
+ * </Modal>
+ * ```
+ */
+declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;
+export { Modal };

package/dist/types/components/navbar/navbar-indicator-context.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from '../../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import { default as React } from 'react';
 interface NavbarIndicatorContextType {
     registerItem: (id: string, element: HTMLElement) => void;
     unregisterItem: (id: string) => void;

package/dist/types/components/network-icon/network-icon.d.ts

@@ -8,14 +8,21 @@
  * Props:
  * - `network` — network name (required).
  * - `size` — icon size in pixels (defaults to 20).
+ * - `isTest` — whether this is a test network (shows test badge).
+ * - `suffixSize` — size of the test badge (defaults to 12).
+ * - `showTooltip` — whether to show a tooltip with the network name.
+ * - `rounded` — whether to clip the icon to a circle.
  *
- * Note: Fetches icon from Gearbox static CDN based on network name.
- * Automatically falls back to default icon if network icon is not found.
- * Icon displays in its original shape (not clipped).
+ * Internally uses `RoundedImage` for image loading, retry and fallback logic.
+ * Automatically falls back to a default "all networks" icon when loading fails.
  */
 export interface NetworkIconProps {
     network: string | undefined;
     size?: number;
+    isTest?: boolean;
+    suffixSize?: number;
+    showTooltip?: boolean;
+    rounded?: boolean;
     className?: string;
 }
-export declare function NetworkIcon({ network, size, className, }: NetworkIconProps): import("react/jsx-runtime").JSX.Element;
+export declare function NetworkIcon({ network, size, isTest, suffixSize, showTooltip, rounded, className, }: NetworkIconProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/points-icon/points-icon.d.ts

@@ -1,3 +1,4 @@
+import { RoundedImageProps } from '../rounded-image/rounded-image';
 import * as React from "react";
 export interface PointsReward {
     /**
@@ -9,7 +10,7 @@ export interface PointsReward {
      */
     type: string;
 }
-export interface PointsIconProps extends React.HTMLAttributes<HTMLImageElement> {
+export interface PointsIconProps extends React.HTMLAttributes<HTMLImageElement>, Omit<RoundedImageProps, "size" | "src" | "alt"> {
     /**
      * Reward information with name and type
      */
@@ -22,10 +23,6 @@ export interface PointsIconProps extends React.HTMLAttributes<HTMLImageElement>
      * Base URL for static assets (defaults to Gearbox static CDN)
      */
     staticBaseUrl?: string;
-    /**
-     * Whether to apply rounded corners (circle)
-     */
-    rounded?: boolean;
 }
 /**
  * PointsIcon — component for displaying reward/points program icons.

package/dist/types/components/pool-apy-tooltip/pool-apy-tooltip.d.ts

@@ -1,4 +1,17 @@
 import type * as React from "react";
+/**
+ * Pool points tip for displaying points/rewards info
+ */
+export interface PoolAPYPointsTip {
+    reward?: {
+        duration?: string;
+        condition?: string;
+    };
+    amount: string;
+    name: string;
+    tokenTitle?: string;
+    fullTip: string;
+}
 export interface PoolAPYTooltipProps {
     /**
      * Trigger element
@@ -35,6 +48,10 @@ export interface PoolAPYTooltipProps {
         apy: number;
         token?: string;
     }>;
+    /**
+     * Pool points data
+     */
+    points?: Array<PoolAPYPointsTip>;
     /**
      * APY 7 days ago (for comparison)
      */
@@ -42,6 +59,15 @@ export interface PoolAPYTooltipProps {
         value?: number;
         loading?: boolean;
     };
+    /**
+     * External APY data
+     */
+    externalAPY?: {
+        totalValue: number;
+        apy: number;
+        name: string;
+        tooltip: string;
+    };
     /**
      * Tokens list for displaying token names
      */
@@ -56,4 +82,4 @@ export interface PoolAPYTooltipProps {
 /**
  * PoolAPYTooltip — a tooltip showing pool APY breakdown
  */
-export declare function PoolAPYTooltip({ children, totalAPY, extraAPYTotal, loading7DAgo, loading, baseAPY, extraAPY, apy7DAgo, tokensList, className, }: PoolAPYTooltipProps): import("react/jsx-runtime").JSX.Element;
+export declare function PoolAPYTooltip({ children, totalAPY, extraAPYTotal, loading7DAgo, loading, baseAPY, extraAPY, points, apy7DAgo, externalAPY, tokensList, className, }: PoolAPYTooltipProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/pool-points-indicator/pool-points-indicator.d.ts

@@ -1,4 +1,4 @@
-import { PropsWithChildren } from '../../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import { PropsWithChildren } from 'react';
 export type PoolPointsColor = "primary" | "secondary" | "green" | "blue" | "yellow";
 export interface PoolPointsIndicatorProps {
     /**

package/dist/types/components/rounded-image/rounded-image.d.ts

@@ -1,11 +1,26 @@
-import type * as React from "react";
-export interface RoundedImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
+import * as React from "react";
+export interface RoundedImageProps extends Omit<React.ImgHTMLAttributes<HTMLImageElement>, "onError"> {
     /**
      * Size of the image in pixels
      */
-    size?: number;
+    size: number;
+    /**
+     * Whether to apply rounded corners (circle)
+     */
+    rounded?: boolean;
+    /**
+     * Default icon to display if the image fails to load
+     */
+    defaultIcon?: string;
+    /**
+     * Image fit behavior
+     * - "contain" — show full image without cropping (best for icons)
+     * - "cover" — fill bounds, may crop (best for photos/avatars)
+     */
+    fit?: "contain" | "cover";
 }
 /**
  * RoundedImage — a circular image component
  */
-export declare function RoundedImage({ className, size, style, ...props }: RoundedImageProps): import("react/jsx-runtime").JSX.Element;
+declare const RoundedImage: React.ForwardRefExoticComponent<RoundedImageProps & React.RefAttributes<HTMLImageElement>>;
+export { RoundedImage };

package/dist/types/components/segmented-control/segmented-control.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const segmentedControlVariants: (props?: ({
-    size?: "default" | "sm" | "lg" | "xs" | "md" | null | undefined;
+    size?: "default" | "xs" | "sm" | "lg" | "md" | null | undefined;
     fullWidth?: boolean | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 /**

package/dist/types/components/short-string/short-string.d.ts

@@ -3,10 +3,10 @@ import type * as React from "react";
  * ShortStringProps — props for ShortString component.
  */
 export interface ShortStringProps {
-    children: string;
-    maxLength?: number;
-    className?: string;
+    children: React.ReactNode;
+    maxLength?: number | "text-overflow";
     showTooltip?: boolean;
+    className?: string;
 }
 /**
  * ShortString — component for truncating text with tooltip showing full content.
@@ -36,4 +36,4 @@ export interface ShortStringProps {
  * </ShortString>
  * ```
  */
-export declare function ShortString({ children, maxLength, className, showTooltip, }: ShortStringProps): React.ReactElement;
+export declare function ShortString({ children, maxLength, showTooltip, className, }: ShortStringProps): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;

package/dist/types/components/skeleton/skeleton.d.ts

@@ -2,9 +2,9 @@ import { VariantProps } from 'class-variance-authority';
 import type * as React from "react";
 declare const skeletonVariants: (props?: ({
     variant?: "default" | "lighter" | "darker" | null | undefined;
-    speed?: "default" | "slow" | "fast" | null | undefined;
-    width?: "full" | "sm" | "lg" | "xs" | "md" | "xl" | "3/4" | "1/2" | "1/3" | "1/4" | "2xl" | null | undefined;
-    height?: "sm" | "lg" | "xs" | "md" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | null | undefined;
+    speed?: "default" | "fast" | "slow" | null | undefined;
+    width?: "full" | "xs" | "sm" | "lg" | "xl" | "2xl" | "md" | "3/4" | "1/2" | "1/3" | "1/4" | null | undefined;
+    height?: "xs" | "sm" | "lg" | "xl" | "2xl" | "md" | "3xl" | "4xl" | "5xl" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 type WidthPreset = NonNullable<VariantProps<typeof skeletonVariants>["width"]>;
 type HeightPreset = NonNullable<VariantProps<typeof skeletonVariants>["height"]>;

package/dist/types/components/stat-badge/stat-badge.d.ts

@@ -135,7 +135,7 @@ export interface StatBadgeProps extends Omit<React.HTMLAttributes<HTMLDivElement
  */
 export declare const StatBadge: React.ForwardRefExoticComponent<StatBadgeProps & React.RefAttributes<HTMLDivElement>>;
 declare const statBadgeGridVariants: (props?: ({
-    cols?: 2 | 1 | 3 | 5 | 4 | 6 | null | undefined;
+    cols?: 2 | 1 | 3 | 4 | 5 | 6 | null | undefined;
     gap?: "default" | "sm" | "lg" | "xl" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface StatBadgeGridProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof statBadgeGridVariants> {

package/dist/types/components/status-dot/status-dot.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const statusDotVariants: (props?: ({
     variant?: "default" | "muted" | "success" | "warning" | "primary" | "alert" | "secondary" | null | undefined;
-    size?: "default" | "sm" | "lg" | "xs" | "xl" | null | undefined;
+    size?: "default" | "xs" | "sm" | "lg" | "xl" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface StatusDotProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof statusDotVariants> {
     /**

package/dist/types/components/status-elements/index.d.ts

@@ -0,0 +1 @@
+export * from './status-elements';

package/dist/types/components/status-elements/status-elements.d.ts

@@ -0,0 +1,16 @@
+import { HFZones } from '..';
+export interface AccountHealthDotProps {
+    zone: HFZones;
+    size?: number;
+}
+/**
+ * HealthDot — colored dot indicating health factor zone.
+ */
+export declare function HealthDot({ zone, size }: AccountHealthDotProps): import("react/jsx-runtime").JSX.Element;
+export interface StatusBarsProps {
+    zone: HFZones;
+}
+/**
+ * StatusBars — row of bars indicating health factor zone (1–3 filled).
+ */
+export declare function StatusBars({ zone }: StatusBarsProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/table/grid-loading-line.d.ts

@@ -13,6 +13,15 @@ export interface GridLoadingLineProps extends React.HTMLAttributes<HTMLDivElemen
      * @default 6
      */
     columns?: number;
+    /**
+     * Custom class name for each cell
+     */
+    cellClassName?: string;
+    /**
+     * Whether this is the last row (hides bottom border)
+     * @default false
+     */
+    last?: boolean;
 }
 /**
  * GridLoadingLine — loading skeleton row component for grid tables.
@@ -24,6 +33,8 @@ export interface GridLoadingLineProps extends React.HTMLAttributes<HTMLDivElemen
  * Props:
  * - `height` — height of the loading line (defaults to "70px").
  * - `columns` — number of skeleton columns to show (defaults to 6).
+ * - `cellClassName` — custom class name for each cell.
+ * - `last` — whether this is the last row (hides bottom border).
  *
  * Note: Displays multiple skeleton cells matching the table structure with borders and padding.
  *
@@ -33,4 +44,4 @@ export interface GridLoadingLineProps extends React.HTMLAttributes<HTMLDivElemen
  * <GridLoadingLine /> // Uses defaults
  * ```
  */
-export declare function GridLoadingLine({ height, columns, className, ...props }: GridLoadingLineProps): import("react/jsx-runtime").JSX.Element;
+export declare function GridLoadingLine({ height, columns, cellClassName, last, className, ...props }: GridLoadingLineProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/table/grid-table.d.ts

@@ -163,6 +163,7 @@ declare const GridTableRow: React.ForwardRefExoticComponent<GridTableRowProps &
 declare const gridTableHeadVariants: (props?: ({
     size?: "default" | "sm" | "lg" | null | undefined;
     justify?: "center" | "start" | "end" | null | undefined;
+    gapBefore?: "none" | "sm" | "md" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 interface GridTableHeadProps extends ColProps, VariantProps<typeof gridTableHeadVariants> {
     children?: React.ReactNode;
@@ -179,6 +180,7 @@ interface GridTableHeadProps extends ColProps, VariantProps<typeof gridTableHead
  * - `span` — number of columns to span (defaults to 1).
  * - `size` — cell size variant: "sm", "default", "lg" (defaults to "default").
  * - `justify` — content alignment: "start", "center", "end" (defaults to "start").
+ * - `gapBefore` — extra left padding for visual separation ("sm" | "md" | "none"). Uses padding so hover covers the gap.
  *
  * Note: Automatically applies border, muted text color, and medium font weight.
  */
@@ -186,6 +188,7 @@ declare const GridTableHead: React.ForwardRefExoticComponent<GridTableHeadProps
 declare const gridTableCellVariants: (props?: ({
     size?: "default" | "sm" | "lg" | null | undefined;
     textAlign?: "left" | "center" | "right" | null | undefined;
+    gapBefore?: "none" | "sm" | "md" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 interface GridTableCellProps extends ColProps, VariantProps<typeof gridTableCellVariants> {
     children?: React.ReactNode;
@@ -202,6 +205,7 @@ interface GridTableCellProps extends ColProps, VariantProps<typeof gridTableCell
  * - `span` — number of columns to span (defaults to 1).
  * - `size` — cell size variant: "sm", "default", "lg" (defaults to "default").
  * - `textAlign` — text alignment: "left", "center", "right".
+ * - `gapBefore` — extra left padding for visual separation ("sm" | "md" | "none"). Uses padding so hover covers the gap.
  *
  * Note: Automatically applies appropriate padding based on size variant.
  *

package/dist/types/components/table/table-loader.d.ts

@@ -18,6 +18,10 @@ export interface TableLoaderProps extends React.HTMLAttributes<HTMLDivElement> {
      * @default 5
      */
     rows?: number;
+    /**
+     * Custom class name for each cell in loading lines
+     */
+    cellClassName?: string;
 }
 /**
  * TableLoader — loading skeleton component for tables.
@@ -43,4 +47,4 @@ export interface TableLoaderProps extends React.HTMLAttributes<HTMLDivElement> {
  * </GridTable>
  * ```
  */
-export declare function TableLoader({ height, columns, rows, className, ...props }: TableLoaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function TableLoader({ height, columns, rows, cellClassName, className, ...props }: TableLoaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/text-button/text-button.d.ts

@@ -1,44 +1,32 @@
+import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
-export interface TextButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    /**
-     * Icon element (legacy API with $ prefix)
-     */
-    $icon?: React.ReactNode;
+declare const textColorVariants: (props?: ({
+    buttonColor?: "primaryDashed" | "secondaryDashed" | "empty" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+declare const layoutVariants: (props?: ({
+    size?: "default" | "sm" | "lg" | "md" | null | undefined;
+    width?: "compact" | "wide" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface TextButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof layoutVariants>, VariantProps<typeof textColorVariants> {
     /**
      * Icon element (new API)
      */
     icon?: React.ReactNode;
-    /**
-     * Size variant (legacy API with $ prefix)
-     */
-    $size?: "sm" | "md" | "lg";
-    /**
-     * Size variant (new API)
-     */
-    size?: "sm" | "md" | "lg";
-    /**
-     * Color variant (legacy API with $ prefix)
-     */
-    $color?: "primary" | "secondary" | "muted" | "primaryDashed" | "secondaryDashed" | "empty";
-    /**
-     * Color variant (new API)
-     */
-    color?: "primary" | "secondary" | "muted" | "primaryDashed" | "secondaryDashed" | "empty";
     /**
      * Element type to render as
      */
     as?: "button" | "a" | "div" | "span";
 }
 /**
- * TextButton — text-only button with underline on hover
+ * TextButton — text-only button with optional dashed underline (matches interface TextButton)
  *
  * @example
  * ```tsx
- * <TextButton onClick={handleClick} color="primary">
+ * <TextButton onClick={handleClick} color="primaryDashed">
  *   Click me
  * </TextButton>
  *
- * <TextButton icon={<Icon />} size="sm" color="muted">
+ * <TextButton icon={<Icon />} size="sm" color="secondaryDashed">
  *   Edit
  * </TextButton>
  * ```
@@ -46,3 +34,4 @@ export interface TextButtonProps extends React.ButtonHTMLAttributes<HTMLButtonEl
 export declare const TextButton: React.ForwardRefExoticComponent<TextButtonProps & {
     children?: React.ReactNode | undefined;
 } & React.RefAttributes<HTMLButtonElement>>;
+export {};

package/dist/types/components/theme-provider.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from '../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import { ReactNode } from 'react';
 /**
  * Theme types
  */

package/dist/types/components/tip-card/tip-card.d.ts

@@ -1,60 +1,40 @@
 import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const tipCardVariants: (props?: ({
-    variant?: "default" | "success" | "warning" | "info" | "light" | "error" | null | undefined;
-    hasIndicator?: boolean | null | undefined;
+    backgroundColor?: "transparent" | "dark" | "light" | "gray-10" | "gray-20" | "gray-30" | "gray-40" | "gray-50" | "gray-60" | "gray-70" | "gray-80" | "gray-90" | "gray-100" | "gray-110" | null | undefined;
+    textColor?: "unset" | "dark" | "light" | null | undefined;
+    borderColor?: "none" | "dark" | "light" | "gradient" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
-declare const indicatorColors: {
-    readonly default: "bg-muted-foreground";
-    readonly info: "bg-blue-500";
-    readonly warning: "bg-yellow-500";
-    readonly error: "bg-red-500";
-    readonly success: "bg-green-500";
-    readonly light: "bg-muted-foreground";
-    readonly primary: "bg-primary";
-    readonly alert: "bg-red-500";
-};
-type IndicatorColor = keyof typeof indicatorColors;
-export interface TipCardProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof tipCardVariants> {
-    /**
-     * Color variant of the tip card
-     */
-    variant?: "default" | "info" | "warning" | "error" | "success" | "light";
-    /**
-     * Show colored indicator on the left side
-     */
-    indicatorColor?: IndicatorColor;
-    /**
-     * Icon to display before content
-     */
-    icon?: React.ReactNode;
+declare const indicatorVariants: (props?: ({
+    attributeColor?: "success" | "warning" | "primary" | "alert" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface TipCardProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof tipCardVariants>, VariantProps<typeof indicatorVariants> {
 }
 /**
  * TipCard — card component for displaying tips, warnings, and information.
  *
  * @usage
- * Use TipCard to display contextual information, warnings, tips, or alerts:
- * - info: general information and helpful tips
- * - warning: important notices that require attention
- * - error: error messages and critical alerts
- * - success: confirmation and success messages
- * - light: subtle information in muted style
+ * TipCard is a lightweight card container with optional styling variants:
+ * - `backgroundColor`: `transparent` | `light` | `dark`
+ * - `textColor`: `unset` | `light` | `dark`
+ * - `borderColor`: `light` | `dark` | `gradient` | `none`
+ * - `attributeColor`: adds a 4px left stripe (via `::after`): `warning` | `alert` | `success` | `primary`
  *
  * @example
  * ```tsx
  * // Basic usage
- * <TipCard variant="info">
- *   This is an informational tip.
+ * <TipCard borderColor="light" backgroundColor="dark" textColor="light">
+ *   This is a tip card.
  * </TipCard>
  *
- * // With indicator
- * <TipCard variant="warning" indicatorColor="warning">
- *   Warning: Please review before proceeding.
+ * // Gradient border
+ * <TipCard borderColor="gradient">
+ *   This card has a gradient border.
  * </TipCard>
  *
- * // With icon
- * <TipCard variant="error" icon={<AlertIcon />}>
- *   An error occurred during the operation.
+ * // With attribute stripe (4px on the left)
+ * <TipCard attributeColor="warning">
+ *   Warning: please review before proceeding.
  * </TipCard>
  * ```
  */

package/dist/types/components/token-icon/token-icon.d.ts

@@ -1,3 +1,5 @@
+import { default as React } from 'react';
+import { RoundedImageProps } from '../rounded-image/rounded-image';
 /**
  * TokenIcon — component for displaying token/asset icons.
  *
@@ -18,12 +20,16 @@
  * - for address identifiers (use Identicon component).
  * - for custom images or logos (use Image component).
  */
-export interface TokenIconProps {
-    symbol: string;
+type SymbolOrIcon = string | {
+    icon: string;
+};
+export interface TokenIconProps extends Omit<RoundedImageProps, "src" | "size"> {
+    symbol: SymbolOrIcon | undefined;
     size?: number;
     className?: string;
 }
-export declare function TokenIcon({ symbol, size, className }: TokenIconProps): import("react/jsx-runtime").JSX.Element;
+declare const TokenIcon: React.ForwardRefExoticComponent<TokenIconProps & React.RefAttributes<HTMLImageElement>>;
+export { TokenIcon };
 /**
  * Preload token icons into browser cache.
  * Call this function early in your app initialization with the list of token symbols.
@@ -37,4 +43,4 @@ export declare function TokenIcon({ symbol, size, className }: TokenIconProps):
  * preloadTokenIcons(tokens);
  * ```
  */
-export declare function preloadTokenIcons(symbols: string[]): void;
+export declare function preloadTokenIcons(symbols: SymbolOrIcon[]): void;

package/dist/types/components/token-symbol/token-symbol.d.ts

@@ -1,10 +1,15 @@
 import { NetworkType } from '@gearbox-protocol/sdk';
-import type * as React from "react";
+import { VariantProps } from 'class-variance-authority';
+import { default as React } from 'react';
+declare const tokenSymbolVariants: (props?: ({
+    marginSize?: "sm" | "lg" | "md" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
 type PartialTokenData = {
     symbol: string;
     title?: string;
+    icon?: string;
 };
-export interface TokenSymbolProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
+export interface TokenSymbolProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title">, VariantProps<typeof tokenSymbolVariants> {
     /**
      * Token data object or symbol string
      */
@@ -67,5 +72,5 @@ export interface TokenSymbolProps extends Omit<React.HTMLAttributes<HTMLDivEleme
  * <TokenSymbol token="WETH" showSymbol={true} />
  * ```
  */
-export declare function TokenSymbol({ token, title, className, comment, showIcon, showSymbol, size, chainId, network, maxLength, ...props }: TokenSymbolProps): import("react/jsx-runtime").JSX.Element;
-export {};
+declare const TokenSymbol: React.ForwardRefExoticComponent<TokenSymbolProps & React.RefAttributes<HTMLDivElement>>;
+export { TokenSymbol };

package/dist/types/components/token-template/token-template.d.ts

@@ -1,40 +1,19 @@
 import { TokenData } from '@gearbox-protocol/sdk';
+import { ParseSmallNumberResult } from '../../utils';
 import { negativeTokenTemplate, tokenTemplateString } from '../../utils/templates';
+import { FormattedNumberStringProps } from '../formatted-number';
 import type * as React from "react";
 type PartialTokenData = Pick<TokenData, "title" | "decimals"> & {
     symbol?: string;
 };
-export interface TokenTemplateProps {
-    /**
-     * Token amount in base units (bigint, string, number, or undefined)
-     */
+export interface TokenTemplateProps extends Omit<FormattedNumberStringProps, "value"> {
     value: bigint | string | number | undefined;
-    /**
-     * Token data with title/symbol and decimals
-     */
     token: PartialTokenData | undefined;
-    /**
-     * Number of decimal places to display
-     */
     precision?: number;
-    /**
-     * Symbol to use between amount and token name
-     * @default " "
-     */
-    spaceSymbol?: string;
-    /**
-     * Maximum length of the result string (truncates if exceeded)
-     */
     maxLength?: number;
-    /**
-     * Allow displaying negative values with sign
-     * @default false
-     */
-    allowNegative?: boolean;
-    /**
-     * Additional className for styling
-     */
-    className?: string;
+    formatter?: (amount: bigint | string | number | undefined, decimals: number, precision?: number) => string | ParseSmallNumberResult;
+    noFormattedAmountValue?: React.ReactNode;
+    showSymbol?: boolean;
 }
 /**
  * TokenTemplate — component for displaying token amounts with symbol.
@@ -72,5 +51,5 @@ export interface TokenTemplateProps {
  * // Output: "-1.5 ETH"
  * ```
  */
-export declare function TokenTemplate({ value, token, precision, spaceSymbol, maxLength, allowNegative, className, }: TokenTemplateProps): React.ReactElement;
+export declare function TokenTemplate({ value, token, precision, formatter, noFormattedAmountValue, showSymbol, maxLength, ...rest }: TokenTemplateProps): import("react/jsx-runtime").JSX.Element;
 export { tokenTemplateString, negativeTokenTemplate };

package/dist/types/components/tooltip/index.d.ts

@@ -1 +1,2 @@
+export * from './simple-tooltip';
 export * from './tooltip';