@gearbox-protocol/ui-kit 4.0.0-next.4 → 4.0.0-next.41

package/dist/types/components/composites/tx-preview/confirm/dialog/transactionConfirmShellTypes.d.ts

@@ -0,0 +1,98 @@
+import { default as React } from 'react';
+import { ProgressStepperStep } from '../stepper/ProgressStepper';
+import { TransactionConfirmPhase } from './transactionConfirmPhase';
+/**
+ * How the card is framed. The body is identical in both: `page` drops the card
+ * into page flow, `dialog` puts the same card inside a modal.
+ */
+export type TransactionConfirmShellMode = "page" | "dialog";
+/**
+ * Pre-labelled, ready-to-render steps. The slot no longer restricts step ids
+ * to the execution union: session-plan steppers (agreement/approve/confirm
+ * plus a delayed request/complete tail) carry their own ids and labels, and
+ * visibility is the caller's decision — omit the slot to hide the stepper.
+ */
+export type TransactionConfirmShellStepper = ReadonlyArray<ProgressStepperStep>;
+/**
+ * Shown instead of preview and execution once the phase is terminal.
+ *
+ * Both halves are required on purpose: supplying `result` at all is the
+ * caller's promise that either terminal phase can be rendered. A flow that
+ * cannot fail says so with an explicit `failure: null` rather than by omission,
+ * which would leave `phase: "failure"` with nothing to draw.
+ */
+export interface TransactionConfirmShellResult {
+    readonly success: React.ReactNode;
+    readonly failure: React.ReactNode;
+}
+/**
+ * What the card is showing.
+ *
+ * A discriminated union rather than a handful of loose flags: a caller cannot
+ * ask for a preview and an error at once, and does not have to spell out the
+ * props that mean "nothing here". `placeholder` and `error` also pin the card
+ * to the `confirm` phase, so neither can ask for a result view it did not
+ * supply — the failure mode that produced an empty card before.
+ */
+export type TransactionConfirmShellBody = 
+/**
+ * Nothing to show yet: a spinner and a caption, drawn here so no consumer
+ * has to assemble one. Distinct from `ready`'s `previewLoading`, which is a
+ * skeleton over a preview that already exists.
+ */
+{
+    readonly kind: "loading";
+} | {
+    readonly kind: "error";
+    /**
+     * Required: the discriminant already says the card failed, so the object
+     * has to be there. A caller holding `Error | null` picks this body only
+     * once it has one, and `placeholder` or `ready` while it does not.
+     */
+    readonly error: Error;
+    /** Heading above the error line. Defaults to this library's own copy. */
+    readonly title?: string;
+} | {
+    readonly kind: "ready";
+    readonly preview: React.ReactNode;
+    readonly execution?: React.ReactNode;
+    readonly stepper?: TransactionConfirmShellStepper;
+    readonly result?: TransactionConfirmShellResult;
+    /** This library's skeleton over the preview slot, for a live refetch. */
+    readonly previewLoading?: boolean;
+};
+interface TransactionConfirmShellBase {
+    readonly phase?: TransactionConfirmPhase;
+    readonly title: React.ReactNode;
+    readonly titleAddon?: React.ReactNode;
+    /** Drop the addon once the phase is terminal. */
+    readonly hideTitleAddonOnResult?: boolean;
+    readonly body: TransactionConfirmShellBody;
+    /** Merged onto the outer card; it never replaces the frame's own classes. */
+    readonly className?: string;
+    /**
+     * The scrollable preview column. Defaults to
+     * {@link transactionConfirmPreviewScrollVariants}; compose with it rather
+     * than replacing it, so later changes to the base still carry over.
+     */
+    readonly previewClassName?: string;
+    /** Outer card. The inner content keeps {@link TransactionConfirmDialogTest.root}. */
+    readonly "data-testid"?: string;
+    readonly shellTestId?: string;
+}
+export interface TransactionConfirmShellProps extends TransactionConfirmShellBase {
+    readonly mode: TransactionConfirmShellMode;
+    /** `dialog` only: the modal renders nothing while closed. Ignored on `page`. */
+    readonly open?: boolean;
+    /**
+     * Omit to hide the close control — that is how a surface without one, such
+     * as a verification page, opts out. A `dialog` without it cannot be
+     * dismissed, so pass one unless that is genuinely what you want.
+     *
+     * `mode` is deliberately a plain field rather than a discriminant that would
+     * make this required for dialogs: consumers carry the mode in a variable and
+     * a union would force every one of them to branch at the call site.
+     */
+    readonly onClose?: () => void;
+}
+export {};

package/dist/types/components/compound-apy/compound-apy.d.ts

@@ -17,12 +17,24 @@ export interface CompoundAPYProps {
     /** Strategy base borrow cost in bps. */
     borrowApy?: Bps;
     /** Strategy additional (quota) borrow cost in bps. */
-    additionalBorrowApy?: Bps;
+    quotaRate?: Bps;
     /**
      * Number of decimal places for the total APY string.
      * @default 2
      */
     decimals?: number;
+    /**
+     * Whether the figure carries the yield breakdown on hover.
+     *
+     * Off where the number is already explained — a badge that states one rate
+     * and stops, or a figure something else already wraps in a tooltip of its
+     * own. The incentives icon stays either way; only the hover goes.
+     *
+     * @default true
+     */
+    tooltip?: boolean;
+    /** When `"7d"`, tooltip labels carry the averaging-window suffix. */
+    period?: "7d";
     className?: string;
 }
 /**
@@ -31,4 +43,4 @@ export interface CompoundAPYProps {
  * No `tokensList`, no external APY, no 7D history, no "soon" points state.
  * For the legacy percent-based API see {@link CompoundAPYLegacy}.
  */
-export declare function CompoundAPY({ apy, maxLeverage, collateralApy, borrowApy, additionalBorrowApy, decimals, className, }: CompoundAPYProps): import("react/jsx-runtime").JSX.Element;
+export declare function CompoundAPY({ apy, maxLeverage, collateralApy, borrowApy, quotaRate, decimals, tooltip, period, className, }: CompoundAPYProps): import("react").JSX.Element;

package/dist/types/components/dialog/dialog-footer.d.ts

@@ -1,6 +1,6 @@
 import type * as React from "react";
 declare const DialogFooter: {
-    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
     displayName: string;
 };
 export { DialogFooter };

package/dist/types/components/dialog/dialog-header.d.ts

@@ -1,6 +1,6 @@
 import type * as React from "react";
 declare const DialogHeader: {
-    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
     displayName: string;
 };
 export { DialogHeader };

package/dist/types/components/dropdown-menu/dropdown-menu-shortcut.d.ts

@@ -1,6 +1,6 @@
 import type * as React from "react";
 declare const DropdownMenuShortcut: {
-    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
+    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): React.JSX.Element;
     displayName: string;
 };
 export { DropdownMenuShortcut };

package/dist/types/components/dropdown-menu/dropdown-menu.d.ts

@@ -1,7 +1,7 @@
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import type * as React from "react";
 declare const DropdownMenu: {
-    ({ modal, ...props }: React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+    ({ modal, ...props }: React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Root>): React.JSX.Element;
     displayName: string;
 };
 declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;

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

@@ -36,5 +36,5 @@ export interface EditInputProps extends Omit<React.ComponentProps<typeof Input>,
  * EditInput — inline editable field: view mode (TextButton + label) or edit mode (Input + arrow submit).
  * Matches interface EditInput structure and styles.
  */
-export declare function EditInput({ label, value, onChange, onSubmit, onEditModeChange, textButtonProps, inputSize, colorTheme, placeholder, inputMode, autoComplete, autoCorrect, type, spellCheck, className, onKeyDown: onKeyDownProp, ...restProps }: EditInputProps): import("react/jsx-runtime").JSX.Element;
+export declare function EditInput({ label, value, onChange, onSubmit, onEditModeChange, textButtonProps, inputSize, colorTheme, placeholder, inputMode, autoComplete, autoCorrect, type, spellCheck, className, onKeyDown: onKeyDownProp, ...restProps }: EditInputProps): React.JSX.Element;
 export {};

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

@@ -120,4 +120,4 @@ export interface FilterModalProps<T> {
      */
     showSearch?: boolean;
 }
-export declare function FilterModal<T>({ title, state, modalShow, onOpen, onClose, onReset, options, tabbedOptions, onSelect, className, optionsClassName, resetLabel, applyLabel, showApplyButton, showSearch, }: FilterModalProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function FilterModal<T>({ title, state, modalShow, onOpen, onClose, onReset, options, tabbedOptions, onSelect, className, optionsClassName, resetLabel, applyLabel, showApplyButton, showSearch, }: FilterModalProps<T>): React.JSX.Element;

package/dist/types/components/formatted-number/formatted-number.d.ts

@@ -18,4 +18,4 @@ export interface FormattedNumberStringProps extends React.HTMLAttributes<HTMLSpa
  * FormattedNumberString — displays a number with optional compact decimal (zeros as repeat count) and tooltip with full value.
  * Matches interface FormattedNumber structure and styles.
  */
-export declare function FormattedNumberString({ value, decimalPartLength, hideZerosIfMore, className, ...props }: FormattedNumberStringProps): import("react/jsx-runtime").JSX.Element;
+export declare function FormattedNumberString({ value, decimalPartLength, hideZerosIfMore, className, ...props }: FormattedNumberStringProps): React.JSX.Element;

package/dist/types/components/graph/default-config.d.ts

@@ -2,6 +2,29 @@ import { AreaSeriesPartialOptions, ChartOptions, DeepPartial } from 'lightweight
 import { VertLineOptions } from './plugins/vertical-line';
 export declare const DEFAULT_AREA_SERIES: AreaSeriesPartialOptions;
 export declare const DEFAULT_VERTICAL_LINE: Partial<VertLineOptions>;
+/** Matches UI `text-sm` so axis tick labels read with the rest of the chrome. */
+export declare const AXIS_FONT_SIZE = 14;
+/**
+ * Price-scale tick density. Higher → more space between labels (fewer ticks).
+ * Lightweight-charts defaults to 2.5, which packs ~12 labels onto a 460px pane.
+ */
+export declare const AXIS_TICK_MARK_DENSITY = 5;
+/**
+ * Pixel inset so a tick sitting on the pane edge is drawn fully inside the
+ * canvas (half the font plus a couple of pixels of breathing room).
+ */
+export declare const AXIS_EDGE_LABEL_PADDING_PX: number;
+/**
+ * Extra air above the top tick so the label does not sit flush with the
+ * chart frame. Larger than the bottom inset because the top edge has no
+ * time-axis chrome to separate it from the container.
+ */
+export declare const AXIS_TOP_LABEL_PADDING_PX: number;
+/**
+ * Horizontal inset so a centred date label (`dd MMM`, ~50px) sits fully
+ * inside the time-scale canvas with a few pixels of air on each side.
+ */
+export declare const AXIS_TIME_EDGE_PADDING_PX = 40;
 /**
  * Gets the default chart options with resolved CSS colors
  * Call this at runtime to ensure CSS variables are properly resolved

package/dist/types/components/graph/formatters.d.ts

@@ -22,17 +22,26 @@ export interface AdaptiveYAxisFormatterOptions {
      */
     yScaleMin?: number;
 }
+/**
+ * Compact unit on an already-formatted axis tick. Generic `"token"` / `"none"`
+ * stay bare so charts without a real unit don't render a placeholder.
+ */
+export declare function withYAxisUnit(label: string, unit: YMeasureUnits): string;
+/**
+ * Ratio units (`base / quote`) stay off axis ticks, the crosshair pill, and
+ * tooltip values — the pair belongs in the series title, not after the number.
+ */
+export declare function isRatioUnit(unit: YMeasureUnits): boolean;
 /**
  * Creates an adaptive Y-axis formatter that determines precision dynamically
  * based on visible range to ensure unique labels on the axis.
  * Data point values (like current price label) are shown with full precision.
  * Returns both the formatter and update functions.
  */
-export declare function createAdaptiveYAxisFormatter(initialValues: number[], _unit: YMeasureUnits, options?: AdaptiveYAxisFormatterOptions): {
+export declare function createAdaptiveYAxisFormatter(initialValues: number[], unit: YMeasureUnits, options?: AdaptiveYAxisFormatterOptions): {
     formatter: (price: number) => string;
     tickmarksFormatter: (prices: number[]) => string[];
     updateVisibleRange: (visibleValues: number[]) => void;
-    updateLastValues: (lastValues: number[]) => void;
 };
 export type XMeasureUnits = "time" | "%";
 type XFormatter = (time: Time, symbol: XMeasureUnits | undefined) => string;

package/dist/types/components/graph/graph-view.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 import { GraphProps } from './graph';
 import * as React from "react";
 declare const graphViewVariants: (props?: ({
-    variant?: "default" | "outlined" | "ghost" | "elevated" | null | undefined;
+    variant?: "default" | "outlined" | "ghost" | "elevated" | "plain" | null | undefined;
     size?: "full" | "default" | "sm" | "lg" | "xl" | null | undefined;
     padding?: "none" | "default" | "sm" | "lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

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

@@ -6,6 +6,12 @@ export type SeriesPriceScaleId = "left" | "right";
 export type SeriesChartType = "area" | "line";
 export interface SeriesConfig {
     data: Array<Point>;
+    /**
+     * Stable chart-instance key. Prefer this over `label` so renaming the legend
+     * (e.g. interpolating leverage into the title) updates the existing series
+     * instead of destroying it — which shuffles `seriesRefs` and breaks tooltips.
+     */
+    id?: string;
     label: string;
     /** Line color (area stroke). Alias: prefer `lineColor` for clarity; if both set, `lineColor` wins. */
     color?: string;
@@ -23,6 +29,8 @@ export interface SeriesConfig {
     /** Line dash style (line series only). */
     lineStyle?: LineStyle;
 }
+/** Chart-instance key: stable `id` when set, otherwise the display `label`. */
+export declare function seriesIdentity(series: Pick<SeriesConfig, "id" | "label">): string;
 export type VerticalLineOptions = Partial<{
     color: string;
     labelText: string;
@@ -30,6 +38,10 @@ export type VerticalLineOptions = Partial<{
     width: number;
     labelBackgroundColor: string;
     labelTextColor: string;
+    /**
+     * Time-axis (bottom) badge. Independent of the top overlay, which renders
+     * whenever `labelText`, `value`, or `tooltipText` is set.
+     */
     showLabel: boolean;
     /**
      * Text shown only on hover of the line's badge (not rendered inline). Use it
@@ -47,8 +59,8 @@ export interface PriceLineConfig {
     /** Y value (price) where the horizontal line is drawn. */
     price: number;
     /**
-     * Label of the series to attach the line to. When omitted, the line is
-     * attached to the first series that has data (its price scale is used).
+     * `id` (preferred) or display `label` of the series to attach the line to.
+     * When omitted, the line is attached to the first series that has data.
      */
     seriesLabel?: string;
     /** Line color. Defaults to the destructive theme color. */
@@ -76,8 +88,8 @@ export interface PriceZoneConfig {
     /** Fill color — use a translucent value. Defaults to a translucent destructive tint. */
     color?: string;
     /**
-     * Label of the series whose price scale the band is drawn against. When
-     * omitted, the first series with data is used.
+     * `id` (preferred) or display `label` of the series whose price scale the
+     * band is drawn against. When omitted, the first series with data is used.
      */
     seriesLabel?: string;
 }
@@ -221,8 +233,21 @@ export interface GraphProps {
  * Supports single or multiple series with different colors and legends
  */
 export declare function Graph({ series, className, showLegend, onUnselectSeries, xMeasureUnit, yMeasureUnit, optionsOverrides, verticalLineOptions, priceLineOptions, zoneOptions, currentValueDecimals, useSharedPriceScale, dualYAxis, defaultVisiblePriceScaleId, leftPriceScaleTitle, rightPriceScaleTitle: _rightPriceScaleTitle, showCurrentValue, graphTitle, yScaleMin, yScaleMinMultiple, visibleTimeFrom, disableZoom, hideDefaultTooltip, }: GraphProps): React.ReactElement;
+/**
+ * A legend entry that is not a data series — a vertical marker line, say.
+ * Such a line is drawn by its own layer and never reaches `series`, so
+ * without this the chart shows a coloured line nothing on screen names.
+ */
+export interface GraphLegendMarker {
+    id: string;
+    label: string;
+    /** Same value handed to the line itself, so legend and line agree. */
+    color: string;
+}
 export interface GraphLegendProps {
     series: Array<SeriesConfig>;
+    /** Non-series entries, rendered after the series in the same row. */
+    markers?: ReadonlyArray<GraphLegendMarker>;
     onUnselect?: (label: string) => void;
     /**
      * When true, the legend is laid out inline (no absolute positioning) so it
@@ -231,4 +256,4 @@ export interface GraphLegendProps {
      */
     inline?: boolean;
 }
-export declare function GraphLegend({ series, onUnselect, inline, }: GraphLegendProps): React.ReactElement;
+export declare function GraphLegend({ series, markers, onUnselect, inline, }: GraphLegendProps): React.ReactElement;

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

@@ -1,6 +1,6 @@
 export * from './default-config';
 export { getXFormatter, getXFormatters, getYFormatter, type Point as GraphPoint, type XFormatters, type XMeasureUnits, type YMeasureUnits, } from './formatters';
-export { DEFAULT_SERIES_COLORS, Graph, GraphLegend, type GraphLegendProps, type GraphProps, getSeriesColorPalette, getVerticalLineLabelStyle, getVerticalLineTooltipContent, type PriceLineConfig, type PriceZoneConfig, type SeriesColorPalette, type SeriesConfig, type VerticalLineOptions, } from './graph';
+export { DEFAULT_SERIES_COLORS, Graph, GraphLegend, type GraphLegendMarker, type GraphLegendProps, type GraphProps, getSeriesColorPalette, getVerticalLineLabelStyle, getVerticalLineTooltipContent, type PriceLineConfig, type PriceZoneConfig, type SeriesColorPalette, type SeriesConfig, type VerticalLineOptions, } from './graph';
 export * from './graph-current-value';
 export * from './graph-tooltip';
 export * from './graph-view';

package/dist/types/components/graph/y-axis-scale.d.ts

@@ -0,0 +1,48 @@
+/**
+ * Nice Y-axis range: a tick step from the same 1 / 2 / 2.5 / 5 × 10^n family
+ * that lightweight-charts uses, with min/max snapped onto that grid so the
+ * first and last labels sit on the pane edges.
+ */
+export interface PickTickSpanArgs {
+    min: number;
+    max: number;
+    scaleHeightPx: number;
+    fontSizePx: number;
+    tickMarkDensity: number;
+    minMove: number;
+}
+export interface NiceAxisRangeArgs {
+    min: number;
+    max: number;
+    /** Hard floor (e.g. `yScaleMin`, or 0 when the series never goes negative). */
+    floor?: number;
+    scaleHeightPx: number;
+    fontSizePx: number;
+    tickMarkDensity: number;
+    minMove?: number;
+    /** Pixel inset lightweight-charts will add via AutoscaleInfo.margins.below. */
+    edgePaddingPx?: number;
+    /** Pixel inset for AutoscaleInfo.margins.above. Defaults to `edgePaddingPx`. */
+    edgePaddingTopPx?: number;
+}
+export interface NiceAxisRange {
+    min: number;
+    max: number;
+    step: number;
+}
+/**
+ * Smallest price increment the scale should resolve. One thousandth of the
+ * data span, snapped down to a power of ten — coarse enough to stay stable,
+ * fine enough not to cap the tick step the way a hardcoded `0.01` does on
+ * narrow ratio charts.
+ */
+export declare function pickMinMove(range: number): number;
+/**
+ * Tick step lightweight-charts would pick for this visible range.
+ */
+export declare function pickTickSpan({ min, max, scaleHeightPx, fontSizePx, tickMarkDensity, minMove, }: PickTickSpanArgs): number;
+/**
+ * Expand `[min, max]` onto the tick grid so both edges are labelled, matching
+ * the step the library will use once pixel edge-padding is applied.
+ */
+export declare function niceAxisRange({ min: rawMin, max: rawMax, floor, scaleHeightPx, fontSizePx, tickMarkDensity, minMove: minMoveArg, edgePaddingPx, edgePaddingTopPx, }: NiceAxisRangeArgs): NiceAxisRange;

package/dist/types/components/health-factor/health-factor.d.ts

@@ -41,4 +41,4 @@ export interface HealthFactorProps extends React.HTMLAttributes<HTMLSpanElement>
  * <HealthFactor value={15000} debt={0n} />  // "N/A"
  * ```
  */
-export declare function HealthFactor({ value, debt, decimals, zone, zoneType, className, ...props }: HealthFactorProps): import("react/jsx-runtime").JSX.Element;
+export declare function HealthFactor({ value, debt, decimals, zone, zoneType, className, ...props }: HealthFactorProps): React.JSX.Element;

package/dist/types/components/hf-indicator/hf-indicator.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+export type HFIndicatorSize = "sm" | "md";
+export interface HFIndicatorProps {
+    /** Pre-formatted health factor, e.g. `"1.05"`. */
+    readonly value: string;
+    /** `md` stands alone on a screen; `sm` fits a one-row banner. */
+    readonly size?: HFIndicatorSize;
+}
+/**
+ * Concentric rings around a health-factor value. Presentation only: the number
+ * arrives formatted, and the colour does not follow it — every caller so far
+ * renders this because the factor is already low.
+ *
+ * The box is the outermost ring, so the component occupies exactly what it
+ * paints and a caller can place it like any other block.
+ */
+export declare function HFIndicator({ value, size, }: HFIndicatorProps): React.ReactElement;

package/dist/types/components/hf-indicator/index.d.ts

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

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

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

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

@@ -6,7 +6,7 @@ export * from './assets-list-cell';
 export * from './badge';
 export * from './base';
 export * from './base-link';
-export * from './block-sync-pill';
+export * from './base-table';
 export * from './breadcrumbs';
 export * from './breakpoint-provider';
 export * from './buttons';
@@ -14,6 +14,7 @@ export * from './cards';
 export * from './checkbox';
 export * from './checkbox-item';
 export * from './client-adapters';
+export * from './collateral-allocation-tooltip';
 export * from './composites';
 export * from './compound-apy';
 export * from './confirm-menu';
@@ -33,8 +34,10 @@ export * from './guard';
 export * from './head-cell';
 export * from './health-factor';
 export * from './help-tip';
+export * from './hf-indicator';
 export * from './icon-button';
 export * from './icons';
+export * from './infinite-scroll';
 export * from './input';
 export * from './label';
 export * from './layout';
@@ -44,13 +47,16 @@ export * from './loader';
 export * from './loading';
 export * from './loading-bar';
 export * from './modal';
+export * from './name-cell';
 export * from './navbar-logo';
 export * from './navigation-context';
 export * from './points-icon';
 export * from './pool-points-indicator';
+export * from './radio-group';
 export * from './rounded-image';
 export * from './rwa-feature';
 export * from './rwa-styles';
+export * from './sdk-status-pill';
 export * from './search-line';
 export * from './segmented-control';
 export * from './select';

package/dist/types/components/infinite-scroll/index.d.ts

@@ -0,0 +1 @@
+export * from './infinite-scroll-wrapper';

package/dist/types/components/infinite-scroll/infinite-scroll-wrapper.d.ts

@@ -0,0 +1,11 @@
+import { default as React, PropsWithChildren } from 'react';
+export interface InfiniteScrollWrapperProps {
+    readonly dataLength: number;
+    readonly hasMore: boolean;
+    readonly onNextLoad: () => void;
+}
+/**
+ * List footer that asks for the next page. Presentation only: the caller
+ * owns paging state and `onNextLoad`.
+ */
+export declare function InfiniteScrollWrapper({ hasMore, dataLength, children, onNextLoad, }: PropsWithChildren<InfiniteScrollWrapperProps>): React.ReactElement;

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

@@ -1,4 +1,3 @@
-import { BlockSyncProps } from '../../../types/footer';
 import * as React from "react";
 /**
  * A single legal/navigation link rendered in {@link AppFooter}.
@@ -30,20 +29,14 @@ export interface AppFooterProps extends React.HTMLAttributes<HTMLElement> {
      */
     year?: number;
     /**
-     * Whether to show the status pill on the far right. Defaults to `true`.
+     * Slot between the copyright and the links — typically a
+     * {@link SyncStatusPill}. The footer knows nothing about what goes in it.
+     *
+     * A slot rather than sync-specific props: the footer used to accept a fixed
+     * `blockSyncProps` shape and render its own pill from it, which made every
+     * change to the indicator a change to the footer's API.
      */
-    showStatus?: boolean;
-    /**
-     * Label rendered inside the status pill. Defaults to `Status`.
-     */
-    statusLabel?: React.ReactNode;
-    /**
-     * When provided, the status pill becomes a live network-synchronization
-     * indicator ({@link BlockSyncPill}): the dot color reflects the time since
-     * the last block update and hovering reveals per-chain block details.
-     * Without it, a static green status pill is rendered.
-     */
-    blockSyncProps?: BlockSyncProps;
+    status?: React.ReactNode;
 }
 /**
  * AppFooter — minimal, Hyperliquid-style footer used by the Gearbox App
@@ -56,7 +49,8 @@ export interface AppFooterProps extends React.HTMLAttributes<HTMLElement> {
  * @example
  * ```tsx
  * <AppFooter />
- * <AppFooter links={myLinks} copyright="© Acme, 2026" showStatus={false} />
+ * <AppFooter links={myLinks} copyright="© Acme, 2026" />
+ * <AppFooter status={<SyncStatusPill {...syncProps} />} />
  * ```
  */
 export declare const AppFooter: React.ForwardRefExoticComponent<AppFooterProps & React.RefAttributes<HTMLElement>>;

package/dist/types/components/legal-agreement/legal-agreement-dialog.d.ts

@@ -96,7 +96,7 @@ export interface LegalAgreementDialogProps {
  * <LegalAgreementDialog open={isOpen} onClose={handleClose} onSign={handleSign} isSigning={isSigning} config={config} />
  * ```
  */
-export declare function LegalAgreementDialog({ open, onClose, onSign, isSigning, hasV2Signature, isAwaitingSignature, config, theme, }: LegalAgreementDialogProps): import("react/jsx-runtime").JSX.Element;
+export declare function LegalAgreementDialog({ open, onClose, onSign, isSigning, hasV2Signature, isAwaitingSignature, config, theme, }: LegalAgreementDialogProps): React.JSX.Element;
 export interface BlockedRegionDialogProps {
     open: boolean;
     onClose: () => void;
@@ -116,4 +116,4 @@ export interface BlockedRegionDialogProps {
  *
  * Note: Displays information about access restriction with link to terms of service.
  */
-export declare function BlockedRegionDialog({ open, onClose, termsOfServiceLink, }: BlockedRegionDialogProps): import("react/jsx-runtime").JSX.Element;
+export declare function BlockedRegionDialog({ open, onClose, termsOfServiceLink, }: BlockedRegionDialogProps): React.JSX.Element;

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

@@ -21,7 +21,7 @@ export interface LoadingProps {
  * <Loading data={items} message={customMessage} />
  * ```
  */
-declare function Loading({ data, loadingFunction, message, subMessage, }: LoadingProps): import("react/jsx-runtime").JSX.Element;
+declare function Loading({ data, loadingFunction, message, subMessage, }: LoadingProps): import("react").JSX.Element;
 declare namespace Loading {
     var displayName: string;
 }

package/dist/types/components/name-cell/index.d.ts

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

package/dist/types/components/name-cell/name-cell.d.ts

@@ -0,0 +1,13 @@
+import { default as React, ReactNode } from 'react';
+export interface NameCellProps {
+    readonly title: ReactNode;
+    readonly subtitle?: ReactNode;
+    readonly chips?: ReactNode;
+    readonly caption?: ReactNode;
+    readonly leading?: ReactNode;
+    readonly disabledStyle?: boolean;
+}
+/**
+ * Table-name layout: optional leading slot, title + chips, subtitle, caption.
+ */
+export declare function NameCell({ title, subtitle, chips, caption, leading, disabledStyle, }: NameCellProps): React.ReactElement;

package/dist/types/components/navbar-logo/navbar-logo.d.ts

@@ -8,4 +8,4 @@ export interface NavBarLogoProps extends React.ImgHTMLAttributes<HTMLImageElemen
 /**
  * NavBarLogo — a logo image for navigation bar
  */
-export declare function NavBarLogo({ size, className, style, ...props }: NavBarLogoProps): import("react/jsx-runtime").JSX.Element;
+export declare function NavBarLogo({ size, className, style, ...props }: NavBarLogoProps): React.JSX.Element;

package/dist/types/components/navigation-context/navigation-context.d.ts

@@ -40,6 +40,6 @@ interface NavigationProviderProps extends NavigationAdapter {
  * </NextNavigationProvider>
  * ```
  */
-export declare function NavigationProvider({ Link, useLocation, useNavigate, children, }: NavigationProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function NavigationProvider({ Link, useLocation, useNavigate, children, }: NavigationProviderProps): React.JSX.Element;
 export declare function useNavigationAdapter(): NavigationAdapter;
 export {};

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

@@ -1,2 +1,3 @@
 export type { NetworkIconProps } from './network-icon';
 export * from './network-icon';
+export * from './network-indicator';

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

@@ -25,4 +25,4 @@ export interface NetworkIconProps {
     rounded?: boolean;
     className?: string;
 }
-export declare function NetworkIcon({ network, size, isTest, suffixSize, showTooltip, rounded, className, }: NetworkIconProps): import("react/jsx-runtime").JSX.Element;
+export declare function NetworkIcon({ network, size, isTest, suffixSize, showTooltip, rounded, className, }: NetworkIconProps): import("react").JSX.Element;

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

@@ -0,0 +1,23 @@
+import { ButtonProps } from '../buttons';
+import { NetworkIcons } from '../../utils/network-icons';
+type IndicatorSize = "sm" | "md" | "default" | "lg";
+export interface NetworkIndicatorProps extends Omit<ButtonProps, "size" | "children"> {
+    network: NetworkIcons | undefined;
+    chainId: number | undefined;
+    size?: IndicatorSize;
+    iconSize?: number;
+    chevronSize?: number;
+    showTitle?: boolean;
+    opened: boolean;
+    /**
+     * When true, button appears enabled and shows chevron even without onClick.
+     * Useful when the component is used as a dropdown trigger that handles clicks externally.
+     * Defaults to true when onClick is provided.
+     */
+    interactive?: boolean;
+}
+/**
+ * Network picker trigger: optional "Network:" label, icon, and chevron.
+ */
+export declare const NetworkIndicator: import('react').ForwardRefExoticComponent<NetworkIndicatorProps & import('react').RefAttributes<HTMLButtonElement>>;
+export {};