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

package/dist/types/components/composites/tx-preview/components/AddressAvatar.d.ts

@@ -0,0 +1,12 @@
+import { Address } from 'viem';
+import { AddressRole } from './addressLabel';
+export interface AddressAvatarProps {
+    address: Address;
+    role?: AddressRole;
+}
+/**
+ * Small round avatar for an operation party. Picks an icon based on `role`:
+ * wallet / credit-account get a Font Awesome glyph, pools get the Gearbox brand
+ * logo, and everything else falls back to an address-derived {@link Identicon}.
+ */
+export declare function AddressAvatar({ address, role, }: AddressAvatarProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/components/AddressParty.d.ts

@@ -0,0 +1,14 @@
+import { Address } from 'viem';
+import { AddressLabel } from './addressLabel';
+export interface AddressPartyProps {
+    address: Address;
+    /** Optional resolved label; controls the displayed name and avatar. */
+    label?: AddressLabel;
+}
+/**
+ * One side of a transfer: an avatar plus a name (the resolved label, when
+ * present) and the shortened, copyable address. The copy affordance sits on the
+ * address line itself (not centered against the whole block). Purely
+ * presentational; labels are resolved by the caller.
+ */
+export declare function AddressParty({ address, label }: AddressPartyProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/components/AddressRow.d.ts

@@ -0,0 +1,7 @@
+import { Address } from 'viem';
+export interface AddressRowProps {
+    label: string;
+    address: Address;
+}
+/** A labeled row showing a shortened, copyable address. */
+export declare function AddressRow({ label, address }: AddressRowProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/components/AmountRow.d.ts

@@ -0,0 +1,15 @@
+export interface AmountRowToken {
+    symbol: string;
+    decimals: number;
+}
+export interface AmountRowProps {
+    value: bigint | string | number;
+    token: AmountRowToken;
+    /** Row label shown on the left. */
+    label?: string;
+}
+/**
+ * A two-column row: a label on the left and a token amount (icon + formatted
+ * value + symbol) on the right.
+ */
+export declare function AmountRow({ value, token, label }: AmountRowProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/components/CollapsibleCard.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+export interface CollapsibleCardProps {
+    /** Unique value identifying the accordion item within the card. */
+    value: string;
+    /** Header title, rendered inside a `CardTitle`. */
+    title: ReactNode;
+    /**
+     * Whether the card is expanded by default.
+     * @default true
+     */
+    defaultOpen?: boolean;
+    /** Extra classes merged into the content wrapper (default `flex flex-col gap-3 pt-0`). */
+    contentClassName?: string;
+    children: ReactNode;
+}
+/**
+ * Collapsible card shell: a `Card` wrapping a single-item `SimpleAccordion`
+ * whose header is the `title` and whose body is `children`. Encapsulates the
+ * repeated `Card -> SimpleAccordion -> SimpleAccordionItem` pattern used across
+ * the decode feature cards.
+ */
+export declare function CollapsibleCard({ value, title, defaultOpen, contentClassName, children, }: CollapsibleCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/components/SectionDivider.d.ts

@@ -0,0 +1,10 @@
+export interface SectionDividerProps {
+    /** Section heading rendered between the two separator rules. */
+    title: string;
+}
+/**
+ * A labeled divider: a centered, uppercase heading flanked by horizontal rules.
+ * Used to introduce a section inside an operation card (e.g. "Transfers" or the
+ * per-address balance groups in the state-changes card).
+ */
+export declare function SectionDivider({ title }: SectionDividerProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/components/TransferList.d.ts

@@ -0,0 +1,19 @@
+import { Address } from 'viem';
+import { AddressLabels } from './addressLabel';
+import { Transfer, TransferListToken } from './TransferRow';
+export interface TransferListProps {
+    transfers: Transfer[];
+    /** Resolved labels for the involved addresses (drives names, avatars, color). */
+    labels: AddressLabels;
+    /** Resolves token metadata (symbol/decimals) for a token address. */
+    resolveToken: (token: Address) => TransferListToken;
+    /** Section heading shown in the divider; pass `null` to omit it. */
+    title?: string | null;
+}
+/**
+ * Renders a list of {@link TransferRow}s, separated from the rest of the card by
+ * a labeled divider. All rows share one symmetric five-column grid so the
+ * arrows, amounts and avatars align across rows. Renders nothing when there are
+ * no transfers.
+ */
+export declare function TransferList({ transfers, labels, resolveToken, title, }: TransferListProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/types/components/composites/tx-preview/components/TransferRow.d.ts

@@ -0,0 +1,30 @@
+import { Address } from 'viem';
+import { AddressLabels } from './addressLabel';
+export interface TransferListToken {
+    symbol: string;
+    decimals: number;
+}
+export interface Transfer {
+    token: Address;
+    amount: bigint;
+    from: Address;
+    to: Address;
+}
+export interface TransferRowProps {
+    transfer: Transfer;
+    /** Resolved labels for the involved addresses (drives names, avatars, color). */
+    labels: AddressLabels;
+    token: TransferListToken;
+}
+/**
+ * One transfer as five grid cells (the parent `TransferList` owns the shared,
+ * left-right symmetric grid template so columns line up across rows): sender,
+ * arrow, token amount, arrow, receiver. Sender/receiver are left-aligned in the
+ * flexible outer columns; the centered amount sits at the row's horizontal
+ * center with the two arrows symmetric around it. The arrows and amount are
+ * colored by direction relative to "our" addresses: red when an owned address
+ * is the sender (outgoing), green when it is the receiver (incoming), muted
+ * otherwise. Purely presentational; labels/token metadata are resolved by the
+ * caller.
+ */
+export declare function TransferRow({ transfer, labels, token }: TransferRowProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/components/addressLabel.d.ts

@@ -0,0 +1,27 @@
+import { Address } from 'viem';
+/**
+ * Visual category for a labeled address; drives the avatar rendering.
+ * `external` is the fallback for addresses we do not specifically recognize.
+ */
+export type AddressRole = "wallet" | "creditAccount" | "pool" | "external";
+/**
+ * UI-only description of an address involved in an operation.
+ *
+ * `ours` is a presentation-layer concept (it colors transfers red/green) and is
+ * derived by the feature that builds the labels; it is intentionally decoupled
+ * from the simulation watch set in `src/simulate`.
+ */
+export interface AddressLabel {
+    /** Label shown in transfer rows, e.g. "Your wallet", "LP shares receiver", "Pool XYZ". */
+    transferLabel?: string;
+    /** Label shown as the state-changes divider, e.g. "Wallet balances", "Receiver balances". */
+    balancesLabel?: string;
+    /** Visual category, drives the avatar. */
+    role: AddressRole;
+    /** Whether this is one of "our" addresses; drives transfer color (red/green). */
+    ours: boolean;
+}
+/** Address -> label lookup, keyed by checksummed address. */
+export type AddressLabels = ReadonlyMap<Address, AddressLabel>;
+/** Resolves an address's label, normalizing the key to checksummed form. */
+export declare function getAddressLabel(labels: AddressLabels, address: Address): AddressLabel | undefined;

package/dist/types/components/composites/tx-preview/components/index.d.ts

@@ -0,0 +1,9 @@
+export * from './AddressAvatar';
+export * from './AddressParty';
+export * from './AddressRow';
+export * from './AmountRow';
+export * from './addressLabel';
+export * from './CollapsibleCard';
+export * from './SectionDivider';
+export * from './TransferList';
+export * from './TransferRow';

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

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+import { TransactionExecutionStepLabelKey, TransactionExecutionStepView } from '../stepper';
+export interface TransactionConfirmDialogViewProps {
+    readonly open: boolean;
+    readonly onClose: () => void;
+    readonly title: React.ReactNode;
+    readonly preview: React.ReactNode;
+    readonly previewLoading?: boolean;
+    readonly previewError?: Error | null;
+    readonly previewErrorTitle?: string;
+    readonly execution: React.ReactNode;
+    readonly steps: ReadonlyArray<TransactionExecutionStepView>;
+    readonly renderStepLabel: (labelKey: TransactionExecutionStepLabelKey) => React.ReactNode;
+}
+export declare function TransactionConfirmDialogView({ open, onClose, title, preview, previewLoading, previewError, previewErrorTitle, execution, steps, renderStepLabel, }: TransactionConfirmDialogViewProps): React.ReactElement | null;

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

@@ -0,0 +1,4 @@
+export declare class TransactionConfirmDialogTest {
+    static root: string;
+    static execution: string;
+}

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

@@ -0,0 +1,3 @@
+export * from './constants';
+export * from './TransactionConfirmDialogView';
+export * from './useTransactionConfirmDialog';

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

@@ -0,0 +1,8 @@
+export interface UseTransactionConfirmDialogReturn {
+    open: boolean;
+    openDialog: () => void;
+    closeDialog: () => void;
+    refreshNonce: number;
+    bumpRefreshNonce: () => void;
+}
+export declare function useTransactionConfirmDialog(): UseTransactionConfirmDialogReturn;

package/dist/types/components/composites/tx-preview/confirm/hooks/index.d.ts

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

package/dist/types/components/composites/tx-preview/confirm/hooks/useCalldataOperationPreview.d.ts

@@ -0,0 +1,19 @@
+import { Operation, PoolSimulationResult } from '@gearbox-protocol/sdk/preview';
+import { Address, Hex } from 'viem';
+import { GearboxSDKLike } from '../../types';
+export interface UseCalldataOperationPreviewInput {
+    enabled: boolean;
+    sdk: GearboxSDKLike | undefined;
+    to: Address | undefined;
+    calldata: Hex | undefined;
+    wallet: Address | undefined;
+    refreshNonce: number;
+}
+export interface UseCalldataOperationPreviewResult {
+    operation: Operation | undefined;
+    simulation: PoolSimulationResult | undefined;
+    isSimulating: boolean;
+    parseError: Error | null;
+    isReady: boolean;
+}
+export declare function useCalldataOperationPreview({ enabled, sdk, to, calldata, wallet, refreshNonce, }: UseCalldataOperationPreviewInput): UseCalldataOperationPreviewResult;

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

@@ -0,0 +1,4 @@
+export * from './dialog';
+export * from './hooks';
+export * from './preview';
+export * from './stepper';

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

@@ -0,0 +1,13 @@
+import { Operation, PoolSimulationResult } from '@gearbox-protocol/sdk/preview';
+import { default as React } from 'react';
+import { Address } from 'viem';
+import { GearboxSDKLike } from '../../types';
+export interface OperationPreviewContentProps {
+    sdk: GearboxSDKLike;
+    operation: Operation;
+    simulation: PoolSimulationResult | undefined;
+    isSimulating: boolean;
+    wallet: Address;
+    refreshNonce: number;
+}
+export declare function OperationPreviewContent({ sdk, operation, simulation, isSimulating, wallet, refreshNonce, }: OperationPreviewContentProps): React.ReactElement;

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

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

package/dist/types/components/composites/tx-preview/confirm/stepper/HorizontalTransactionStepper.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { TransactionExecutionStepLabelKey, TransactionExecutionStepView } from './computeTransactionExecutionSteps';
+export interface HorizontalTransactionStepperProps {
+    readonly steps: ReadonlyArray<TransactionExecutionStepView>;
+    readonly renderLabel: (labelKey: TransactionExecutionStepLabelKey) => React.ReactNode;
+}
+export declare function HorizontalTransactionStepper({ steps, renderLabel, }: HorizontalTransactionStepperProps): React.ReactElement;

package/dist/types/components/composites/tx-preview/confirm/stepper/computeTransactionExecutionSteps.d.ts

@@ -0,0 +1,21 @@
+export type TransactionExecutionStepId = "connect" | "network" | "approve" | "execute";
+export type StepStatus = "completed" | "active" | "upcoming";
+export type TransactionExecutionStepLabelKey = "connect" | "network" | "approve" | "approveBatch" | "execute";
+export interface TransactionExecutionStepInput {
+    isConnected: boolean;
+    isCorrectChain: boolean;
+    isAuthReady: boolean;
+    needsApproval: boolean;
+    isApprovalPending: boolean;
+    allowWalletBatching: boolean;
+    isExecuting?: boolean;
+}
+export interface TransactionExecutionStepView {
+    id: TransactionExecutionStepId;
+    labelKey: TransactionExecutionStepLabelKey;
+    status: StepStatus;
+}
+export declare function computeTransactionExecutionSteps(input: TransactionExecutionStepInput): {
+    steps: TransactionExecutionStepView[];
+    activeStepId: TransactionExecutionStepId;
+};

package/dist/types/components/composites/tx-preview/confirm/stepper/constants.d.ts

@@ -0,0 +1,3 @@
+export declare class TransactionStepperTest {
+    static root: string;
+}

package/dist/types/components/composites/tx-preview/confirm/stepper/index.d.ts

@@ -0,0 +1,3 @@
+export * from './computeTransactionExecutionSteps';
+export * from './constants';
+export * from './HorizontalTransactionStepper';

package/dist/types/components/composites/tx-preview/hooks/useParsedTransaction.d.ts

@@ -0,0 +1,40 @@
+import { Operation, PoolSimulationResult } from '@gearbox-protocol/sdk/preview';
+import { Address, Hex } from 'viem';
+import { GearboxSDKLike } from '../types';
+export interface ParsedTransactionInput {
+    enabled?: boolean;
+    sdk: GearboxSDKLike;
+    to: Address;
+    calldata: Hex;
+    sender: Address;
+    refreshNonce?: number;
+}
+export interface UseParsedTransactionResult {
+    /**
+     * Parsed operation. For pool operations it is enriched with wallet transfers
+     * once the simulation stage succeeds, triggering a re-render.
+     */
+    data: Operation | undefined;
+    /** Stage-1 (parse) error, if decoding the calldata threw. */
+    error: Error | null;
+    /**
+     * Stage-2 simulation outcome. `undefined` while it is loading or for
+     * operations that are not simulated (currently anything but pool ops).
+     */
+    simulation: PoolSimulationResult | undefined;
+    /** Stage-2 (simulation) loading flag. */
+    isSimulating: boolean;
+}
+/**
+ * Resolves the {@link Operation} for the given input in two stages:
+ *
+ * 1. Parse the raw calldata (synchronous decode, no chain reads).
+ * 2. For pool operations, simulate the call to recover wallet transfers and
+ *    balance changes. On success the transfers are merged back into the parsed
+ *    operation; on revert the decoded reason is exposed via `simulation`.
+ *
+ * Stage 1 is a pure synchronous decode, so it runs in a `useMemo`; only the
+ * simulation (stage 2) is a real async operation backed by React Query (keyed
+ * so results cache per decoded call and wallet).
+ */
+export declare function useParsedTransaction(input: ParsedTransactionInput): UseParsedTransactionResult;

package/dist/types/components/composites/tx-preview/index.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Transaction preview + confirm flow (WIP).
+ *
+ * Intentionally NOT re-exported from the main `@gearbox-protocol/ui-kit` entry or
+ * `components/composites/index.ts`. The module is still in development; its final
+ * scope, API shape, and completion timeline are not settled yet.
+ *
+ * Consumers should import only via `@gearbox-protocol/ui-kit/tx-preview` (and documented
+ * deep subpaths). Merging into the root ui-kit barrel is a separate decision once
+ * the module is stable.
+ */
+export * from './components';
+export * from './confirm';
+export * from './hooks/useParsedTransaction';
+export * from './operations';
+export * from './prerequisites';
+export * from './state-change';
+export * from './types';
+export * from './utils';

package/dist/types/components/composites/tx-preview/operations/OperationBody.d.ts

@@ -0,0 +1,15 @@
+import { Operation } from '@gearbox-protocol/sdk/preview';
+import { Address } from 'viem';
+import { GearboxSDKLike } from '../types';
+export interface OperationBodyProps {
+    sdk: GearboxSDKLike;
+    operation: Operation;
+    /** Wallet whose transfers are highlighted; populated after simulation. */
+    wallet: Address;
+}
+/**
+ * Renders the body of the outer operation (rows only, no card chrome).
+ * Currently handles pool deposit/redeem; credit-facade operations
+ * ({@link OuterFacadeOperation}) are a future branch.
+ */
+export declare function OperationBody({ sdk, operation, wallet }: OperationBodyProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/types/components/composites/tx-preview/operations/OperationsCard.d.ts

@@ -0,0 +1,21 @@
+import { Operation } from '@gearbox-protocol/sdk/preview';
+import { Address } from 'viem';
+import { GearboxSDKLike } from '../types';
+export interface OperationsCardProps {
+    sdk: GearboxSDKLike;
+    transaction: Operation;
+    wallet: Address;
+}
+/**
+ * Whether a dedicated custom operation view exists for the parsed transaction.
+ * Drives both whether {@link OperationsCard} renders and whether the raw
+ * transaction card starts expanded. Currently only pool operations have a view.
+ */
+export declare function hasOperationView(tx: Operation): boolean;
+/**
+ * Collapsible card (open by default) for a decoded transaction. Renders the
+ * outer operation in its content. Pool operations have no inner operations, so
+ * the card body is just the operation rows; credit-facade operations will later
+ * render their {@link InnerOperation}s as nested non-collapsible cards here.
+ */
+export declare function OperationsCard({ sdk, transaction, wallet, }: OperationsCardProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/types/components/composites/tx-preview/operations/PoolDepositView.d.ts

@@ -0,0 +1,11 @@
+import { PoolDepositOperation } from '@gearbox-protocol/sdk/preview';
+import { Address } from 'viem';
+import { GearboxSDKLike } from '../types';
+export interface PoolDepositViewProps {
+    sdk: GearboxSDKLike;
+    operation: PoolDepositOperation;
+    /** Wallet whose transfers are highlighted; populated after simulation. */
+    wallet: Address;
+}
+/** Human-readable body of a Gearbox pool deposit operation (rows only). */
+export declare function PoolDepositView({ sdk, operation, wallet, }: PoolDepositViewProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/operations/PoolRow.d.ts

@@ -0,0 +1,8 @@
+import { Address } from 'viem';
+import { TokenInfo } from '../utils';
+export interface PoolRowProps {
+    pool: TokenInfo;
+    address: Address;
+}
+/** Pool row: shows the pool's human label plus the copyable pool address. */
+export declare function PoolRow({ pool, address }: PoolRowProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/operations/PoolWithdrawView.d.ts

@@ -0,0 +1,11 @@
+import { PoolRedeemOperation } from '@gearbox-protocol/sdk/preview';
+import { Address } from 'viem';
+import { GearboxSDKLike } from '../types';
+export interface PoolWithdrawViewProps {
+    sdk: GearboxSDKLike;
+    operation: PoolRedeemOperation;
+    /** Wallet whose transfers are highlighted; populated after simulation. */
+    wallet: Address;
+}
+/** Human-readable body of a Gearbox pool withdraw (redeem) operation (rows only). */
+export declare function PoolWithdrawView({ sdk, operation, wallet, }: PoolWithdrawViewProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/operations/index.d.ts

@@ -0,0 +1,5 @@
+export * from './OperationBody';
+export * from './OperationsCard';
+export * from './PoolDepositView';
+export * from './PoolRow';
+export * from './PoolWithdrawView';

package/dist/types/components/composites/tx-preview/prerequisites/PrerequisiteRow.d.ts

@@ -0,0 +1,11 @@
+import { AnyPrerequisiteResult } from '@gearbox-protocol/sdk/preview';
+import { GearboxSDKLike } from '../types';
+export interface PrerequisiteRowProps {
+    result: AnyPrerequisiteResult;
+    sdk: GearboxSDKLike;
+}
+/**
+ * One prerequisite as a labeled row: a status icon + title on the left and the
+ * kind-specific detail (or the revert reason on error) on the right.
+ */
+export declare function PrerequisiteRow({ result, sdk }: PrerequisiteRowProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/prerequisites/PrerequisitesCard.d.ts

@@ -0,0 +1,17 @@
+import { Operation } from '@gearbox-protocol/sdk/preview';
+import { Address } from 'viem';
+import { GearboxSDKLike } from '../types';
+export interface PrerequisitesCardProps {
+    sdk: GearboxSDKLike;
+    operation: Operation;
+    /** Transaction sender whose balances/allowances are verified. */
+    wallet: Address;
+    blockNumber?: bigint;
+    /** Shared re-evaluation trigger; forwarded to keep one cache key. */
+    refreshNonce?: number;
+}
+/**
+ * Verifies and lists the on-chain prerequisites for an operation, one status
+ * row per check. Renders nothing when the operation has no prerequisites.
+ */
+export declare function PrerequisitesCard({ sdk, operation, wallet, blockNumber, refreshNonce, }: PrerequisitesCardProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/types/components/composites/tx-preview/prerequisites/index.d.ts

@@ -0,0 +1,4 @@
+export * from './PrerequisiteRow';
+export * from './PrerequisitesCard';
+export * from './prerequisiteDetails';
+export * from './usePrerequisites';

package/dist/types/components/composites/tx-preview/prerequisites/prerequisiteDetails.d.ts

@@ -0,0 +1,17 @@
+import { AnyPrerequisiteResult, PrerequisiteDetail, PrerequisiteKind } from '@gearbox-protocol/sdk/preview';
+import { ReactNode } from 'react';
+import { GearboxSDKLike } from '../types';
+/**
+ * Renderer per {@link PrerequisiteKind}. The mapped-type signature forces an
+ * entry for every kind, so adding a new prerequisite kind fails to compile
+ * until its detail renderer is provided here.
+ */
+export declare const prerequisiteDetailRenderers: {
+    [K in PrerequisiteKind]: (detail: PrerequisiteDetail<K>, sdk: GearboxSDKLike) => ReactNode;
+};
+/**
+ * Renders the kind-specific detail for a prerequisite result. The cast bridges
+ * the correlated `kind`/`detail` pair to the registry's per-kind signature;
+ * the runtime pairing is guaranteed by how results are constructed.
+ */
+export declare function renderPrerequisiteDetail(result: AnyPrerequisiteResult, sdk: GearboxSDKLike): ReactNode;

package/dist/types/components/composites/tx-preview/prerequisites/usePrerequisites.d.ts

@@ -0,0 +1,25 @@
+import { Operation } from '@gearbox-protocol/sdk/preview';
+import { Address } from 'viem';
+import { GearboxSDKLike } from '../types';
+export interface UsePrerequisitesInput {
+    sdk: GearboxSDKLike;
+    operation: Operation;
+    /** Transaction sender whose balances/allowances are verified. */
+    wallet: Address;
+    /** Block to read at; defaults to latest. Only set for testnet forks. */
+    blockNumber?: bigint;
+    /**
+     * Bumped by the submit flow after each on-chain action (e.g. an approval
+     * confirms) to force an immediate re-verification. Included in the query key
+     * so all consumers sharing the same key re-evaluate together.
+     */
+    refreshNonce?: number;
+}
+/**
+ * Builds and verifies the on-chain prerequisites for a parsed operation.
+ *
+ * Keyed on the serialized operation, wallet and block so results are cached per
+ * decoded call. Mirrors {@link import("./useParsedTransaction")} conventions:
+ * results never go stale and failed runs are not retried.
+ */
+export declare function usePrerequisites({ sdk, operation, wallet, blockNumber, refreshNonce, }: UsePrerequisitesInput): import('@tanstack/react-query').UseQueryResult<import('@gearbox-protocol/sdk/preview').AnyPrerequisiteResult[], Error>;

package/dist/types/components/composites/tx-preview/state-change/BalanceChangeGroup.d.ts

@@ -0,0 +1,11 @@
+import { AddressBalanceChanges } from '@gearbox-protocol/sdk/preview';
+import { AddressLabels } from '../components';
+import { GearboxSDKLike } from '../types';
+export interface BalanceChangeGroupProps {
+    sdk: GearboxSDKLike;
+    group: AddressBalanceChanges;
+    /** Resolved labels for the involved addresses (drives the group divider). */
+    labels: AddressLabels;
+}
+/** One labeled section of balance changes for a single address. */
+export declare function BalanceChangeGroup({ sdk, group, labels, }: BalanceChangeGroupProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/state-change/BalanceChangeRow.d.ts

@@ -0,0 +1,14 @@
+import { TokenBalanceChange } from '@gearbox-protocol/sdk/preview';
+import { GearboxSDKLike } from '../types';
+export interface BalanceChangeRowProps {
+    sdk: GearboxSDKLike;
+    change: TokenBalanceChange;
+}
+/**
+ * One token balance change as three grid cells (the parent group owns the shared
+ * grid template so columns line up across rows): the token (symbol + name,
+ * left-aligned and flexible), the struck-through before value with an arrow to
+ * the after value, and the signed diff in brackets. The whole row is colored
+ * green for a positive delta and red for a negative one.
+ */
+export declare function BalanceChangeRow({ sdk, change }: BalanceChangeRowProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/state-change/PoolStateChangeCard.d.ts

@@ -0,0 +1,18 @@
+import { AddressBalanceChanges, PoolOperation } from '@gearbox-protocol/sdk/preview';
+import { Address } from 'viem';
+import { GearboxSDKLike } from '../types';
+export interface PoolStateChangeCardProps {
+    sdk: GearboxSDKLike;
+    /** The decoded pool deposit/redeem operation. */
+    operation: PoolOperation;
+    /** Balance changes grouped by watched address (from a successful simulation). */
+    balanceChanges: AddressBalanceChanges[];
+    /** Wallet whose balances are highlighted. */
+    wallet: Address;
+}
+/**
+ * Pool-specific state-change content: balance changes grouped by address (wallet
+ * and, when distinct, the recipient). Renders content only; the surrounding card
+ * chrome, loading, and error handling live in {@link StateChangeCard}.
+ */
+export declare function PoolStateChangeCard({ sdk, operation, balanceChanges, wallet, }: PoolStateChangeCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/composites/tx-preview/state-change/StateChangeCard.d.ts

@@ -0,0 +1,21 @@
+import { Operation, PoolSimulationResult } from '@gearbox-protocol/sdk/preview';
+import { Address } from 'viem';
+import { GearboxSDKLike } from '../types';
+export interface StateChangeCardProps {
+    sdk: GearboxSDKLike;
+    /** Parsed operation that drives which specific state-change card is shown. */
+    data: Operation;
+    /** Stage-2 simulation outcome; `undefined` while it is loading. */
+    simulation: PoolSimulationResult | undefined;
+    /** Whether the simulation is still running. */
+    isLoading: boolean;
+    /** Wallet whose balances/transfers are highlighted. */
+    wallet: Address;
+}
+/**
+ * Parent card for transaction state changes. Owns the common logic (collapsible
+ * card shell, loading skeleton, card-styled error, and no-data handling) and
+ * decides which specific state-change card to render: pool balance changes,
+ * credit account changes (not yet supported), or the decoded revert reason.
+ */
+export declare function StateChangeCard({ sdk, data, simulation, isLoading, wallet, }: StateChangeCardProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/types/components/composites/tx-preview/state-change/index.d.ts

@@ -0,0 +1,4 @@
+export * from './BalanceChangeGroup';
+export * from './BalanceChangeRow';
+export * from './PoolStateChangeCard';
+export * from './StateChangeCard';

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

@@ -0,0 +1,19 @@
+import { Address } from 'viem';
+/**
+ * Minimal SDK surface for tx-preview UI + hooks.
+ * Satisfied by verify OnchainSDK and client preview SDK instances.
+ */
+export interface GearboxSDKLike {
+    chainId: number;
+    tokensMeta: {
+        get(address: Address): {
+            symbol?: string;
+            decimals?: number;
+            name?: string;
+        } | undefined;
+    };
+    readonly plugins: {
+        adapters: unknown;
+    };
+    client: unknown;
+}