@gearbox-protocol/permissionless-ui 1.22.0-next.3 → 1.22.0-next.31

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/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?: "empty" | "primaryDashed" | "secondaryDashed" | 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/typed-intl/index.d.ts

@@ -6,8 +6,6 @@ export type Values = FormattedMessageProps["values"];
 export type LocaleKeys = string;
 export interface FormattedMessageTypedProps {
     messageId: LocaleKeys;
-    /** @deprecated Use messageId instead */
-    id?: LocaleKeys;
     values?: Values;
     defaultMessage?: string;
 }

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

@@ -1,8 +1,8 @@
 import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const typographyVariants: (props?: ({
-    variant?: "body" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "bodySmall" | "overline" | null | undefined;
-    color?: "inherit" | "default" | "muted" | "success" | "warning" | "destructive" | "primary" | null | undefined;
+    variant?: "body" | "caption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "bodySmall" | "overline" | "inherit" | null | undefined;
+    color?: "inherit" | "default" | "muted" | "success" | "warning" | "destructive" | "primary" | "secondary" | null | undefined;
     weight?: "medium" | "inherit" | "normal" | "semibold" | "bold" | null | undefined;
     align?: "inherit" | "left" | "center" | "right" | null | undefined;
     leading?: "inherit" | "normal" | "tight" | "relaxed" | null | undefined;

package/dist/types/components/vertical-list/vertical-list.d.ts

@@ -1,14 +1,11 @@
 import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const verticalListVariants: (props?: ({
-    gap?: "default" | "sm" | "lg" | "xs" | "md" | null | undefined;
+    rowGap?: "default" | "xs" | "md" | null | undefined;
     divided?: boolean | null | undefined;
+    nested?: boolean | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface VerticalListProps extends React.HTMLAttributes<HTMLUListElement>, VariantProps<typeof verticalListVariants> {
-    /**
-     * Gap between items
-     */
-    gap?: "xs" | "sm" | "default" | "md" | "lg";
     /**
      * Show dividers between items
      */

package/dist/types/components/with-copy/with-copy.d.ts

@@ -1,4 +1,4 @@
-import { PropsWithChildren } from '../../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import { PropsWithChildren } from 'react';
 import type * as React from "react";
 export interface WithCopyProps {
     /** Text to copy to clipboard */

package/dist/types/configs/tailwind-preset.d.ts

@@ -57,6 +57,8 @@ export declare const preset: {
                     foreground: string;
                 };
                 success: string;
+                "success-foreground": string;
+                "success-hover": string;
                 warning: string;
                 liquidation: string;
                 border: string;

package/dist/types/hooks/index.d.ts

@@ -7,5 +7,4 @@ export * from './use-hf';
 export * from './use-liquidation';
 export * from './use-media-query';
 export * from './use-opened-state';
-export * from './use-pool-points-tips';
 export * from './use-previous';

package/dist/types/hooks/use-filter.d.ts

@@ -6,11 +6,11 @@ export interface SelectFilterList<T> {
 /**
  * Hook for managing range filter state
  */
-export declare function useRangeFilter(): readonly [FilterRange | null, import('../../node_modules/.pnpm/react@19.2.0/node_modules/react').Dispatch<import('../../node_modules/.pnpm/react@19.2.0/node_modules/react').SetStateAction<FilterRange | null>>, () => void];
+export declare function useRangeFilter(): readonly [FilterRange | null, import('react').Dispatch<import('react').SetStateAction<FilterRange | null>>, () => void];
 /**
  * Hook for managing select filter state
  */
-export declare function useSelectFilter<T>(initialState?: SelectFilterList<T> | null): readonly [SelectFilterList<T> | null, import('../../node_modules/.pnpm/react@19.2.0/node_modules/react').Dispatch<import('../../node_modules/.pnpm/react@19.2.0/node_modules/react').SetStateAction<SelectFilterList<T> | null>>, () => void];
+export declare function useSelectFilter<T>(initialState?: SelectFilterList<T> | null): readonly [SelectFilterList<T> | null, import('react').Dispatch<import('react').SetStateAction<SelectFilterList<T> | null>>, () => void];
 type SortType = "desc" | "asc";
 export interface FilterSortField<T> {
     field: T;

package/dist/types/index.d.ts

@@ -60,6 +60,7 @@ export * from './components/legal-agreement';
 export * from './components/liquidation';
 export * from './components/loader-guard';
 export * from './components/markdown-viewer';
+export * from './components/modal';
 export * from './components/navbar';
 export * from './components/navbar-logo';
 export * from './components/navitem';

package/dist/types/types/component-props.d.ts

@@ -1,5 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
-import { default as React } from '../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import { default as React } from 'react';
 /**
  * Utility for extracting variants from CVA
  */

package/dist/types/types/footer.d.ts

@@ -21,7 +21,7 @@ export interface NetworkById {
     [chainId: number]: string;
 }
 export interface BlockSyncProps {
-    blockByChain: BlockByChain;
+    blockByChain: BlockByChain | undefined;
     explorerAddresses: ExplorerAddresses;
     networkById: NetworkById;
 }

package/dist/types/utils/bn-to-pretty-view.d.ts

@@ -1,3 +1,4 @@
+import { ParseSmallNumberResult } from './parse-input-to-bn';
 /**
  * Formats a BigInt value to a pretty human-readable string with locale formatting
  *
@@ -12,4 +13,4 @@
  * bnToPrettyView(1000000000000000000n, 18) // "1"
  * ```
  */
-export declare function bnToPrettyView(value: bigint, decimals: number, options?: Intl.NumberFormatOptions): string;
+export declare function bnToPrettyView(number: bigint | undefined | string | number, decimals: number, precision?: number, allowNegative?: boolean): ParseSmallNumberResult;

package/dist/types/utils/format-money.d.ts

@@ -84,18 +84,3 @@ export declare const SLIPPAGE_DECIMALS = 1000n;
  * ```
  */
 export declare function formatMoneyAmount(value: number | bigint | string, options?: number | Intl.NumberFormatOptions): string;
-/**
- * Formats a slippage value to percentage string
- *
- * @param slippage - The slippage value (e.g., 10 for 1%)
- * @param precision - Number of decimal places (default: 1)
- * @returns Formatted slippage string like "1.0%"
- *
- * @example
- * ```ts
- * slippageTemplate(10) // "1.0%"
- * slippageTemplate(5, 2) // "0.50%"
- * slippageTemplate(undefined) // "-"
- * ```
- */
-export declare function slippageTemplate(slippage?: number, precision?: number): string;

package/dist/types/utils/format-slippage.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Formats a slippage value to percentage string
+ *
+ * @param slippage - The slippage value (e.g., 10 for 1%)
+ * @param precision - Number of decimal places (default: 1)
+ * @returns Formatted slippage string like "1.0%"
+ *
+ * @example
+ * ```ts
+ * slippageTemplate(10) // "1.0%"
+ * slippageTemplate(5, 2) // "0.50%"
+ * slippageTemplate(undefined) // "-"
+ * ```
+ */
+export declare function slippageTemplate(slippage?: number, precision?: number): string;

package/dist/types/utils/index.d.ts

@@ -7,9 +7,11 @@ export * from './colors';
 export * from './copy';
 export * from './format';
 export * from './format-asset-amount';
-export { formatMoney, formatMoney as formatMoneyAmount, formatPercentAmount, PERCENTAGE_FACTOR, percentageTemplate, percentTemplate, SLIPPAGE_DECIMALS, slippageTemplate, } from './format-money';
+export { formatMoney, formatMoney as formatMoneyAmount, formatPercentAmount, PERCENTAGE_FACTOR, percentageTemplate, percentTemplate, SLIPPAGE_DECIMALS, } from './format-money';
 export { FORMAT_CONSTANTS, type FormatNumberOptions, formatNumberWithSuffix, formatPrice, getAdaptiveDecimals, isBelowDisplayThreshold, isEffectivelyZero, toSignificantDigits, } from './format-number';
+export * from './format-slippage';
 export * from './interface';
+export * from './loading';
 export * from './network-icons';
 export * from './parse-input-to-bn';
 export * from './plural';
@@ -23,3 +25,4 @@ export type { SortField as UtilsSortField, SortType } from './sort';
 export * from './templates';
 export * from './ttl';
 export * from './window';
+export * from './z-index';

package/dist/types/utils/loading.d.ts

@@ -0,0 +1,3 @@
+export declare function allLoaded(itemsToLoad: Array<unknown>): boolean;
+export declare function round5(value: number): number;
+export declare function loadingProgress(itemsToLoad: Array<unknown>): number;

package/dist/types/utils/network-icons.d.ts

@@ -1,19 +1,10 @@
+import { NetworkType } from '@gearbox-protocol/sdk';
 /**
- * Network icon paths mapping
+ * Known network icons type.
+ * Accepts any NetworkType from SDK plus "AllNetworks" and arbitrary strings
+ * for forward compatibility with new networks.
  */
-export type NetworkType = "Mainnet" | "Arbitrum" | "Optimism" | "Sonic" | "Monad" | "AllNetworks" | string;
-/**
- * Alias for backward compatibility
- */
-export type NetworkIcons = NetworkType;
-/**
- * Network configuration
- */
-export interface NetworkConfig {
-    name: string;
-    icon: string;
-    chainId: number;
-}
+export type NetworkIcons = NetworkType | "AllNetworks";
 /**
  * Get network icon path by network name
  *
@@ -26,22 +17,4 @@ export interface NetworkConfig {
  * getNetworkIcon("Unknown") // ""
  * ```
  */
-export declare function getNetworkIcon(network: NetworkType): string;
-/**
- * Get network name by chain ID
- *
- * @param chainId - Chain ID
- * @returns Network name or undefined if not found
- */
-export declare function getNetworkByChainId(chainId: number): string | undefined;
-/**
- * Get network config by name
- *
- * @param network - Network name
- * @returns Network config or undefined if not found
- */
-export declare function getNetworkConfig(network: NetworkType): NetworkConfig | undefined;
-/**
- * Get all available networks
- */
-export declare function getAllNetworks(): NetworkConfig[];
+export declare function getNetworkIcon(network: NetworkIcons): string;

package/dist/types/utils/parse-input-to-bn.d.ts

@@ -1,16 +1,13 @@
-/**
- * Parses a string input to BigInt with decimal support
- *
- * @param input - The input string to parse (e.g., "123.45")
- * @param decimals - Number of decimal places for the token
- * @param allowNegative - Whether to allow negative values
- * @returns Tuple of [bigint value, cleaned input string] or [null, null] on error
- *
- * @example
- * ```ts
- * parseInputToBN("123.45", 18) // [123450000000000000000n, "123.45"]
- * parseInputToBN("", 18) // [0n, ""]
- * parseInputToBN("invalid", 18) // [null, null]
- * ```
- */
-export declare function parseInputToBN(input: string | undefined | null, decimals: number, allowNegative?: boolean): [bigint | null, string | null];
+export declare function isPositiveFloat(val: string): boolean;
+export type ParseOutput = [bigint | null, string | null];
+export declare const parseInputToBN: (input: string, decimals: number, allowNegative?: boolean) => ParseOutput;
+export interface SmallNumberParseResult {
+    integer: string;
+    repeat: number;
+    decimal: string | undefined;
+}
+export type ParseSmallNumberResult = SmallNumberParseResult | {
+    originalValue: string;
+};
+export declare function parseSmallNumber(numStr: string): ParseSmallNumberResult;
+export declare function bnToLiquidationPriceView(number: bigint, precision?: number): ParseSmallNumberResult;

package/dist/types/utils/shorten-string.d.ts

@@ -12,4 +12,5 @@
  * shortenString("A very long string", 10) // "A very lon..."
  * ```
  */
-export declare function shortenString(str: string, maxLength?: number): string;
+export declare function shortenString(str: string, maxLength: number): string;
+export declare function isLongString(str: string, maxLength: number): boolean;

package/dist/types/utils/static.d.ts

@@ -0,0 +1,3 @@
+export declare const STATIC_SERVER = "https://static.gearbox.finance";
+export declare const buildStaticUrl: (domain?: string) => (url: string) => string;
+export declare const getStatic: (url: string) => string;

package/dist/types/utils/templates.d.ts

@@ -38,7 +38,7 @@ type PartialTokenData = Pick<TokenData, "title" | "decimals"> & {
  * // "1.00 Very..." (truncated to 10 chars)
  * ```
  */
-export declare function tokenTemplate(value: bigint | string | number | undefined, token: PartialTokenData | undefined, precision?: number, spaceSymbol?: string, maxLength?: number): React.ReactElement;
+export declare function tokenTemplate(value: bigint | string | number | undefined, token: PartialTokenData | undefined, precision?: number, spaceSymbol?: string, maxLength?: number): string;
 /**
  * Formats a token amount and returns it as a string with token title
  * Use this when you need a formatted number string with token name (not a React element)

package/dist/types/utils/window.d.ts

@@ -12,4 +12,6 @@
  * openInNewWindow("https://example.com")
  * ```
  */
-export declare function openInNewWindow(url: string): void;
+type Target = "_blank" | "_self" | "_parent" | "_top";
+export declare function openInNewWindow(url: string, target?: Target, features?: string): void;
+export {};

package/dist/types/utils/z-index.d.ts

@@ -0,0 +1,8 @@
+/**
+ * TODO: remove me
+ * Temporary added to avoid conflicts with other libraries
+ */
+export declare const Z_INDEX: {
+    readonly MODAL: "z-[50]";
+    readonly TOOLTIP: "z-[9999]";
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gearbox-protocol/permissionless-ui",
-  "version": "1.22.0-next.3",
+  "version": "1.22.0-next.31",
   "description": "Internal UI components",
   "license": "MIT",
   "main": "./dist/cjs/index.js",
@@ -82,10 +82,10 @@
     "react-markdown": "^9.0.3",
     "react-markdown-math": "^1.0.2",
     "react-slick": "^0.31.0",
-    "slick-carousel": "^1.8.1",
     "remark-gfm": "^4.0.0",
+    "slick-carousel": "^1.8.1",
     "sonner": "^2.0.7",
-    "tailwind-merge": "^2.6.0",
+    "tailwind-merge": "^3.4.0",
     "tailwindcss-animate": "^1.0.7"
   },
   "peerDependencies": {
@@ -105,6 +105,9 @@
     "wagmi": "^2.0.0"
   },
   "peerDependenciesMeta": {
+    "connectkit": {
+      "optional": true
+    },
     "next": {
       "optional": true
     },
@@ -124,7 +127,7 @@
     "@commitlint/cli": "^20.1.0",
     "@commitlint/config-conventional": "^20.0.0",
     "@gearbox-protocol/biome-config": "^1.0.2",
-    "@gearbox-protocol/sdk": "*",
+    "@gearbox-protocol/sdk": "^12.6.7",
     "@rollup/plugin-typescript": "^12.3.0",
     "@storybook/addon-a11y": "^10.0.8",
     "@storybook/addon-docs": "^10.0.8",
@@ -136,9 +139,9 @@
     "@tanstack/react-query": "^5.64.1",
     "@types/cross-spawn": "^6.0.6",
     "@types/luxon": "^3.4.2",
-    "@types/react-slick": "^0.23.13",
     "@types/react": "^19.1.16",
     "@types/react-dom": "^19.1.9",
+    "@types/react-slick": "^0.23.13",
     "@vitejs/plugin-react": "^5.1.1",
     "@vitest/browser-playwright": "^4.0.14",
     "@vitest/coverage-v8": "^4.0.14",
@@ -165,7 +168,7 @@
     "tailwind-scrollbar": "^4.0.2",
     "tailwindcss": "^4.1.14",
     "typescript": "^5.9.3",
-    "viem": "^2.39.0",
+    "viem": "^2.45.3",
     "vite": "^6.3.5",
     "vite-plugin-dts": "^4.5.4",
     "vite-tsconfig-paths": "^5.1.4",