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

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

@@ -1,48 +1,36 @@
+import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
-export interface HelpTipProps extends React.HTMLAttributes<HTMLSpanElement> {
-    /**
-     * Tooltip content (children)
-     */
+declare const iconColorVariants: (props?: ({
+    iconColor?: "muted" | "gray-10" | "gray-20" | "gray-30" | "gray-40" | "gray-50" | "gray-60" | "gray-70" | "gray-80" | "gray-90" | "gray-100" | "gray-110" | "foreground" | null | undefined;
+    iconHoverColor?: "muted" | "gray-10" | "gray-20" | "gray-30" | "gray-40" | "gray-50" | "gray-60" | "gray-70" | "gray-80" | "gray-90" | "gray-100" | "gray-110" | "foreground" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface HelpTipProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "title"> {
+    /** Tooltip popup content (what appears when hovering the icon). */
     children: React.ReactNode;
-    /**
-     * Max width of the tooltip
-     */
+    /** Maximum width of the tooltip panel. */
     maxWidth?: string;
-    /**
-     * Min width of the tooltip
-     */
+    /** Minimum width of the tooltip panel. */
     minWidth?: string;
-    /**
-     * Delay before showing tooltip (ms)
-     * @default 200
-     */
+    /** Delay before showing tooltip (ms). @default 200 */
     delayShow?: number;
-    /**
-     * Delay before hiding tooltip (ms)
-     * @default 150
-     */
-    delayHide?: number;
-    /**
-     * Tooltip placement
-     * @default "bottom"
-     */
-    side?: "top" | "right" | "bottom" | "left";
-    /**
-     * Size of the help icon
-     * @default 14
-     */
+    /** Tooltip placement relative to the icon. @default "bottom" */
+    placement?: "top" | "right" | "bottom" | "left";
+    /** Size of the help icon in pixels. @default 14 */
     iconSize?: number;
-    /**
-     * Side offset of the tooltip
-     * @default 4
-     */
-    sideOffset?: number;
+    /** Icon color variant (default gray-90). Theme-aware: dark → gray-40, light → gray-80. */
+    iconColor?: "gray-10" | "gray-20" | "gray-30" | "gray-40" | "gray-50" | "gray-60" | "gray-70" | "gray-80" | "gray-90" | "gray-100" | "gray-110" | "muted" | "foreground";
+    /** Icon color on hover (default gray-110). Theme-aware: dark → gray-70, light → gray-100. */
+    iconHoverColor?: "gray-10" | "gray-20" | "gray-30" | "gray-40" | "gray-50" | "gray-60" | "gray-70" | "gray-80" | "gray-90" | "gray-100" | "gray-110" | "muted" | "foreground";
+    /** Icon type: question circle or info. @default "question" */
+    iconVariant?: "question" | "info";
+    /** Called when the icon (trigger) is hovered. */
+    onPointerEnter?: React.PointerEventHandler<HTMLSpanElement>;
 }
 /**
- * HelpTip — tooltip with help icon for displaying contextual help
+ * HelpTip — contextual help trigger: icon opens a tooltip with explanation text.
  *
  * @usage
- * Use HelpTip to provide additional context or explanations:
+ * Use next to labels or terms to show extra context on hover:
  * field hints, term definitions, feature explanations.
  *
  * @example
@@ -57,19 +45,20 @@ export interface HelpTipProps extends React.HTMLAttributes<HTMLSpanElement> {
  * ```
  */
 declare const HelpTip: React.ForwardRefExoticComponent<HelpTipProps & React.RefAttributes<HTMLSpanElement>>;
-/**
- * HelpTipIcon — standalone help icon without tooltip (use with custom tooltip)
- */
-export interface HelpTipIconProps extends React.HTMLAttributes<HTMLSpanElement> {
-    /**
-     * Size of the icon
-     * @default 14
-     */
+export interface HelpTipIconProps extends Omit<React.HTMLAttributes<HTMLSpanElement>, "color">, VariantProps<typeof iconColorVariants> {
+    /** Size of the icon in pixels. @default 14 */
     iconSize?: number;
+    /** Icon type: question circle or info. @default "question" */
+    iconVariant?: "question" | "info";
 }
+/**
+ * HelpTipIcon — standalone help icon (gray-90 default, gray-110 on hover).
+ * Use with a custom tooltip or when you only need the icon.
+ */
 declare const HelpTipIcon: React.ForwardRefExoticComponent<HelpTipIconProps & React.RefAttributes<HTMLSpanElement>>;
 /**
- * TipWrap — wrapper for positioning help tips inline with text
+ * TipWrap — wrapper for spacing the help tip inline with text (e.g. after a label).
+ * Matches A: margin-left 6px, inline-block, line-height 0.
  */
 declare const TipWrap: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
 export { HelpTip, HelpTipIcon, TipWrap };

package/dist/types/components/icons/fa-icon.d.ts

@@ -0,0 +1,2 @@
+import { FontAwesomeIconProps } from '@fortawesome/react-fontawesome';
+export declare function FaIcon({ className, ...props }: FontAwesomeIconProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,2 @@
+export { faArrowDown, faArrowLeft, faArrowRight, faArrowsUpDown, faArrowUp, faBars, faBolt, faCaretDown, faCaretLeft, faCaretRight, faCaretUp, faCheck, faChevronLeft, faChevronRight, faCircle, faCircleCheck, faCircleExclamation, faCirclePlus, faCircleQuestion, faCloud, faCog, faCreditCard, faEllipsisVertical, faEnvelope, faKeyboard, faLifeRing, faMagnifyingGlass, faMessage, faPlus, faRightFromBracket, faTrash, faTriangleExclamation, faUser, faUserPlus, faUsers, faWallet, faXmark, } from '@fortawesome/free-solid-svg-icons';
+export { FaIcon } from './fa-icon';

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

@@ -62,8 +62,10 @@ export * from './label';
 export * from './layout';
 export * from './legal-agreement';
 export * from './liquidation';
+export * from './liquidation-price';
 export * from './loader-guard';
 export * from './markdown-viewer';
+export * from './modal';
 export * from './navbar';
 export * from './navbar-logo';
 export * from './navitem';
@@ -97,6 +99,7 @@ export * from './spinner';
 export * from './split-list';
 export * from './stat-badge';
 export * from './status-dot';
+export * from './status-elements';
 export * from './status-triangle';
 export * from './stepper';
 export * from './styled-dropdown';

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

@@ -1,13 +1,18 @@
 import { VariantProps } from 'class-variance-authority';
-import type * as React from "react";
+import * as React from "react";
 declare const inputVariants: (props?: ({
-    size?: "default" | "sm" | "lg" | null | undefined;
+    size?: "default" | "xs" | "sm" | "lg" | null | undefined;
+    colorTheme?: "outlined" | "filledDark" | "filledLight" | null | undefined;
     variant?: "default" | "success" | "error" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 /**
  * InputProps — props for Input component.
  */
-interface InputProps extends Omit<React.ComponentProps<"input">, "size">, VariantProps<typeof inputVariants> {
+export interface InputProps extends Omit<React.ComponentProps<"input">, "size">, VariantProps<typeof inputVariants> {
+    startingIcon?: React.ReactNode;
+    onStartingIconClick?: () => void;
+    endingIcon?: React.ReactNode;
+    onEndingIconClick?: () => void;
     hasError?: boolean;
     errorMessage?: string;
 }
@@ -40,5 +45,5 @@ interface InputProps extends Omit<React.ComponentProps<"input">, "size">, Varian
  * <Input size="sm" type="email" />
  * ```
  */
-export declare function Input({ hasError, errorMessage, value, size, variant, className, ...props }: InputProps): import("react/jsx-runtime").JSX.Element;
+export declare const Input: React.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
 export { inputVariants };

package/dist/types/components/input/use-icon-slot-widths.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+/**
+ * Returns callback refs and measured widths for two icon slot elements.
+ * Use the widths (with fallback) to set input padding so it matches the icon button width.
+ */
+export declare function useIconSlotWidths(): {
+    startSlotWidth: number | null;
+    endSlotWidth: number | null;
+    setStartRef: (el: HTMLButtonElement | null) => void;
+    setEndRef: (el: HTMLButtonElement | null) => void;
+    inputPaddingStyle: (hasStart: boolean, hasEnd: boolean) => React.CSSProperties;
+};

package/dist/types/components/layout/col/col.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from '../../../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import * as React from "react";
 /**
  * ColProps — props for Col component.
  */

package/dist/types/components/layout/container/container.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from '../../../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import * as React from "react";
 /**
  * ContainerProps — props for Container component.
  */

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

@@ -1,5 +1,5 @@
-import { default as React } from '../../../../node_modules/.pnpm/react@19.2.0/node_modules/react';
 import { LegalReferences } from '../legal-disclaimer';
+import * as React from "react";
 export interface FooterProps extends React.HTMLAttributes<HTMLElement> {
     logo?: React.ReactNode;
     copyright?: React.ReactNode;

package/dist/types/components/layout/grid/grid.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from '../../../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import * as React from "react";
 /**
  * GridProps — props for Grid component.
  */

package/dist/types/components/layout/header/header.d.ts

@@ -1,4 +1,4 @@
-import { default as React } from '../../../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import * as React from "react";
 interface MobileMenuContextValue {
     closeMobileMenu: () => void;
 }

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

@@ -1,4 +1,4 @@
-import { default as React } from '../../../../node_modules/.pnpm/react@19.2.0/node_modules/react';
+import * as React from "react";
 export interface LayoutProps extends React.HTMLAttributes<HTMLDivElement> {
     header?: React.ReactNode;
     footer?: React.ReactNode;

package/dist/types/components/liquidation-price/index.d.ts

@@ -0,0 +1 @@
+export * from './liquidation-price';

package/dist/types/components/liquidation-price/liquidation-price.d.ts

@@ -0,0 +1,41 @@
+import { HFZones } from '..';
+import type * as React from "react";
+export type LiquidationPriceType = {
+    type: "text";
+} | {
+    type: "redirect";
+    to: string;
+} | {
+    type: "graph";
+    props: {
+        onShow: () => void;
+    };
+};
+export interface LiquidationPriceProps {
+    /**
+     * Liquidation price (bigint or number)
+     */
+    liquidationPrice?: bigint | number;
+    /**
+     * How to render when price is 0 / N/A: text, redirect link, or button that opens graph
+     */
+    type?: LiquidationPriceType;
+    /**
+     * Health factor zone for optional dot or bars indicator
+     */
+    hfZone?: HFZones;
+    /**
+     * Indicator style when hfZone is set: dot (right) or bars (left)
+     */
+    zoneType?: "dot" | "bars";
+    /**
+     * Label for "check" link/button when type is redirect or graph (e.g. i18n "Check")
+     */
+    checkLabel?: React.ReactNode;
+    className?: string;
+}
+/**
+ * LiquidationPrice — displays liquidation price with optional HF zone indicator.
+ * Matches interface LiquidationPrice structure.
+ */
+export declare function LiquidationPrice({ liquidationPrice, type, hfZone, zoneType, checkLabel, className, }: LiquidationPriceProps): import("react/jsx-runtime").JSX.Element;

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

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

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,26 @@
+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 {
+    /** Health factor zone; determines how many bars are filled (1–3) and their color. */
+    zone: HFZones;
+}
+/**
+ * StatusBars — row of 3 small bars indicating health factor zone (1–3 filled, rest gray).
+ *
+ * @usage
+ * Use next to health factor or TTL to show zone at a glance.
+ *
+ * @example
+ * ```tsx
+ * <StatusBars zone="good" />
+ * <StatusBars zone="bad" />
+ * ```
+ */
+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;