@funkit/connect 0.0.0-20260710210119

package/dist/modals/CheckoutModal/TransferToken/useTransferTokenTracking.d.ts

@@ -0,0 +1,29 @@
+import type { NotificationStatus } from './CheckoutNotification';
+import type { NotificationItem } from './types';
+export declare const addressDisplayedAtMsByCheckoutKey: {
+    [key in string]?: number;
+};
+interface UseTransferTokenTrackingProps {
+    depositAddress: string | undefined;
+    fromChainId: string | undefined;
+    fromTokenSymbol: string | undefined;
+    toChainId: string | undefined;
+    toTokenAddress: string | undefined;
+}
+type UseTransferTokenTrackingResult = {
+    trackAddressCopied: () => void;
+    trackImpactExpanded: (estPriceImpactPct: number | undefined) => void;
+    trackSourceChainChange: (newChainId: string) => void;
+    trackSourceTokenChange: (newTokenSymbol: string) => void;
+};
+export declare function useTransferTokenTracking({ depositAddress, fromChainId, fromTokenSymbol, toChainId, toTokenAddress, }: UseTransferTokenTrackingProps): UseTransferTokenTrackingResult;
+interface UseNotificationTrackingProps {
+    item: NotificationItem | null;
+    status: NotificationStatus;
+}
+interface UseNotificationTrackingResult {
+    trackDismissal: () => void;
+    trackShowMore: () => void;
+}
+export declare function useNotificationTracking({ item, status, }: UseNotificationTrackingProps): UseNotificationTrackingResult;
+export {};

package/dist/modals/CheckoutModal/VirtualFiatAccount/BridgeCustomer.d.ts

@@ -0,0 +1,13 @@
+import type { PaymentMethodVirtualBankIncompleteInfo } from '../../../domains/paymentMethods';
+import { type CheckoutModalCommonState, FunCheckoutStep, type ModalStepInfo } from '../../../modals/CheckoutModal/stepTransition';
+export type BridgeCustomerNext = {
+    hasError?: false;
+    kycLink: string;
+} | {
+    hasError: true;
+    errorCode: string;
+};
+export type BridgeCustomerState = CheckoutModalCommonState & {
+    paymentMethodInfo: PaymentMethodVirtualBankIncompleteInfo;
+};
+export declare const BridgeCustomerInfo: ModalStepInfo<FunCheckoutStep.BRIDGE_CUSTOMER>;

package/dist/modals/CheckoutModal/VirtualFiatAccount/BridgeKyc.d.ts

@@ -0,0 +1,22 @@
+import { type BridgeCustomer, type BridgeVirtualBankAccount, type Guid } from '@funkit/api-base';
+import { type CheckoutModalCommonState, FunCheckoutStep, type ModalStepInfo } from '../../../modals/CheckoutModal/stepTransition';
+export declare enum NextStep {
+    ShowSource = "ShowSource",
+    ShowKyc = "ShowKyc",
+    ShowError = "ShowError"
+}
+export type BridgeKycNext = {
+    nextStep: NextStep.ShowSource;
+    bridgeCustomer: BridgeCustomer;
+    virtualFiatAccount: BridgeVirtualBankAccount;
+} | {
+    nextStep: NextStep.ShowError;
+} | {
+    nextStep: NextStep.ShowKyc;
+    guidForKyc: Guid;
+};
+export type BridgeKycState = CheckoutModalCommonState & {
+    kycLink?: string;
+    kycIframeCompleted?: boolean;
+};
+export declare const BridgeKycInfo: ModalStepInfo<FunCheckoutStep.BRIDGE_KYC>;

package/dist/modals/CheckoutModal/VirtualFiatAccount/ErrorScreen.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { CheckoutModalCommonState, FunCheckoutStep, ModalStepInfo } from '../../../modals/CheckoutModal/stepTransition';
+export type ErrorScreenState = CheckoutModalCommonState & {
+    errorCode: string;
+};
+export declare const ErrorScreen: () => React.JSX.Element;
+export declare const ErrorScreenInfo: ModalStepInfo<FunCheckoutStep.ERROR_SCREEN>;

package/dist/modals/CheckoutModal/VirtualFiatAccount/FiatAccountDetail.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { type PaymentMethodVirtualBankInfo } from '../../../domains/paymentMethods';
+import { type CheckoutModalCommonState, FunCheckoutStep, type ModalStepComponentProps, type ModalStepInfo } from '../stepTransition';
+export type FiatAccountDetailState = CheckoutModalCommonState & {
+    paymentMethodInfo: PaymentMethodVirtualBankInfo;
+};
+export type FiatAccountDetailNext = Record<string, never>;
+export declare const AccountDetailsScreen: ({ modalState, onNext, }: ModalStepComponentProps<FunCheckoutStep.FIAT_ACCOUNT_DETAIL>) => React.JSX.Element;
+export declare const FiatAccountDetail: ModalStepInfo<FunCheckoutStep.FIAT_ACCOUNT_DETAIL>;

package/dist/modals/CheckoutModal/VirtualFiatAccount/KycIframe.d.ts

@@ -0,0 +1,5 @@
+import { type KycLinkLoad } from '../../../hooks/useFrogAccount';
+import { type CheckoutModalCommonState, FunCheckoutStep, type ModalStepInfo } from '../../../modals/CheckoutModal/stepTransition';
+export type KycIframeState = CheckoutModalCommonState & KycLinkLoad;
+export type KycIframeNext = Record<string, never>;
+export declare const KycIframeInfo: ModalStepInfo<FunCheckoutStep.KYC_IFRAME>;

package/dist/modals/CheckoutModal/VirtualFiatAccount/VirtualFiatAccount.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { PaymentMethodVirtualBankIncompleteInfo } from '../../../domains/paymentMethods';
+import { type CheckoutModalCommonState, FunCheckoutStep, type ModalStepComponentProps, type ModalStepInfo } from '../../../modals/CheckoutModal/stepTransition';
+export type VirtualFiatAccountNext = Record<string, never>;
+export type VirtualFiatAccountState = CheckoutModalCommonState & {
+    paymentMethodInfo: PaymentMethodVirtualBankIncompleteInfo;
+};
+export declare const VirtualFiatAccountInfo: ModalStepInfo<FunCheckoutStep.CREATE_FIAT_ACCOUNT>;
+export declare function VirtualFiatAccount({ onNext, }: ModalStepComponentProps<FunCheckoutStep.CREATE_FIAT_ACCOUNT>): React.JSX.Element;

package/dist/modals/CheckoutModal/Withdrawal/WithdrawalComplete.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import type { Hex } from 'viem';
+import type { FunkitCheckoutQuoteResult } from '../../../domains/quote';
+import type { CustomWithdrawalConfig, WalletWithdrawalConfig } from '../../../providers/FunkitCheckoutContext';
+import { type CheckoutModalCommonState, FunCheckoutStep, type ModalStepComponentProps, type ModalStepInfo } from '../stepTransition';
+export type WithdrawalCompleteState = CheckoutModalCommonState & {
+    withdrawalConfig: WalletWithdrawalConfig | CustomWithdrawalConfig;
+    hash: Hex;
+    withdrawnAmount: string;
+    tokenSymbol: string;
+    quote?: FunkitCheckoutQuoteResult;
+};
+export type WithdrawalCompleteNext = Record<never, never>;
+export declare const WithdrawalCompleteInfo: ModalStepInfo<FunCheckoutStep.WITHDRAWAL_COMPLETE>;
+/**
+ * Cashier withdrawal completion screen. Mirrors the standalone `WithdrawalModal`
+ * success screens, adapted to the CheckoutModal step contract and its bottom-bar
+ * portal (`MODAL_BOTTOM_BAR_IDS.checkout`):
+ *
+ * - Wallet config → {@link WithdrawSuccess} (transaction detail keyed by tx hash).
+ * - Custom callback config → {@link WithdrawalCallbackSuccess} (pending screen).
+ *
+ * Lighter Secure (mainnet) is intentionally NOT branched here yet — its success
+ * component hard-codes the standalone `'withdrawal'` bottom-bar id, so wiring it
+ * into the cashier is deferred to a follow-up. A Lighter customer falls into the
+ * generic callback screen until then.
+ */
+export declare function WithdrawalComplete({ modalState, onClose, onNext, }: ModalStepComponentProps<FunCheckoutStep.WITHDRAWAL_COMPLETE>): React.JSX.Element;

package/dist/modals/CheckoutModal/Withdrawal/WithdrawalEnterAmount.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import type { Hex } from 'viem';
+import type { FunkitCheckoutQuoteResult } from '../../../domains/quote';
+import type { CustomWithdrawalConfig, WalletWithdrawalConfig } from '../../../providers/FunkitCheckoutContext';
+import { type CheckoutModalCommonState, FunCheckoutStep, type ModalStepComponentProps, type ModalStepInfo } from '../stepTransition';
+export type WithdrawalEnterAmountState = CheckoutModalCommonState & {
+    withdrawalConfig: WalletWithdrawalConfig | CustomWithdrawalConfig;
+};
+export type WithdrawalEnterAmountNext = {
+    hash: Hex;
+    withdrawnAmount: string;
+    tokenSymbol: string;
+    quote?: FunkitCheckoutQuoteResult;
+};
+export declare const WithdrawalEnterAmountInfo: ModalStepInfo<FunCheckoutStep.WITHDRAWAL_ENTER_AMOUNT>;
+/**
+ * Cashier withdrawal amount entry. Thin adapter that renders the shared
+ * {@link WithdrawContent} form against the resolved single-method config carried
+ * on the modal state, mirroring the standalone `WithdrawalModal` amount screen
+ * (free-USDC banner above the form).
+ *
+ * Submitting executes the real withdrawal: `WithdrawContent`'s CTA fires
+ * `useWithdrawal`, whose `onSuccess` maps `onContinue` → `onNext`, advancing to
+ * `WITHDRAWAL_COMPLETE`.
+ */
+export declare function WithdrawalEnterAmount({ modalState, onNext, }: ModalStepComponentProps<FunCheckoutStep.WITHDRAWAL_ENTER_AMOUNT>): React.JSX.Element;

package/dist/modals/CheckoutModal/selectSuccessScreenBackground.d.ts

@@ -0,0 +1,29 @@
+import { FunCheckoutStep } from './FunCheckoutStep';
+/**
+ * Decide whether the checkout-complete success background should paint.
+ *
+ * The post-checkout `CHECKOUT_COMPLETE` step is the *page*, which also covers
+ * pending and failed states — so step alone is not enough. We additionally
+ * require:
+ *  - the Statsig feature gate to be ON (kill-switch / per-customer rollout),
+ *  - and the underlying checkout/direct-execution to have actually settled.
+ *
+ * Pure function (no hooks) so the gating contract is easy to unit-test.
+ * The caller is responsible for deriving `isCompleted` from whichever hook
+ * is appropriate for the path (deposit-address checkout vs direct execution).
+ */
+export declare function selectSuccessScreenBackground({ step, isCompleted, isFeatureGateEnabled, themeBackgroundOverlay, }: {
+    step: FunCheckoutStep;
+    /** Whether the underlying checkout/direct-execution has reached COMPLETED. */
+    isCompleted: boolean;
+    /** Statsig gate (`enable-checkout-success-screen-background`). */
+    isFeatureGateEnabled: boolean;
+    /**
+     * The theme variable reference for the success-screen overlay
+     * (`themeVars.colors.modalBackgroundCheckoutComplete`). Resolves at runtime
+     * to whatever the active theme defines — Aave's translucent gradient
+     * stack, or by default the regular modal background (which renders as a
+     * no-op overlay).
+     */
+    themeBackgroundOverlay: string;
+}): string | undefined;

package/dist/modals/CheckoutModal/stepTransition.d.ts

@@ -0,0 +1,190 @@
+import { type ComponentType, type SetStateAction } from 'react';
+import { type BridgeCustomerNext, type BridgeCustomerState } from '../../modals/CheckoutModal/VirtualFiatAccount/BridgeCustomer';
+import { type BridgeKycNext, type BridgeKycState } from '../../modals/CheckoutModal/VirtualFiatAccount/BridgeKyc';
+import { type ErrorScreenState } from '../../modals/CheckoutModal/VirtualFiatAccount/ErrorScreen';
+import { type VirtualFiatAccountNext, type VirtualFiatAccountState } from '../../modals/CheckoutModal/VirtualFiatAccount/VirtualFiatAccount';
+import { type DynamicTargetAssetCandidate, FunCheckoutStartingStep, type FunkitActiveCheckoutItem } from '../../providers/FunkitCheckoutContext';
+import { type FunkitTextCustomizationsConfig } from '../../providers/FunkitConfigContext';
+import { type PerpsTransferNext, type PerpsTransferState } from '../PolymarketPerpsTransfer/PerpsTransferStep';
+import { type BrokerageSuccessState } from './Brokerage/BrokerageSuccessModal';
+import { type BrokerageTwoFANext, type BrokerageTwoFAState } from './Brokerage/BrokerageTwoFA';
+import { type ConnectExchangeNext, type ConnectExchangeState } from './Brokerage/ConnectExchange';
+import { type SelectBrokerageNext, type SelectBrokerageState } from './Brokerage/SelectBrokerage';
+import { type CheckoutCompleteNext, type CheckoutCompleteState } from './CheckoutComplete/CheckoutComplete';
+import { type ConfirmationStepNext, type ConfirmationStepState } from './ConfirmationStep/ConfirmationStep';
+import { FunCheckoutStep } from './FunCheckoutStep';
+import { type InputAmountNext, type InputAmountState } from './InputAmount/InputAmount';
+import { type LightningInvoiceNext, type LightningInvoiceState } from './LightningInvoice/LightningInvoice';
+import { type LoadingAccountNext, type LoadingAccountState } from './LoadingAccount';
+import { type MeldCurrencySelectNext, type MeldCurrencySelectState } from './MeldCurrencySelect/MeldCurrencySelect';
+import { type MeldQuotesNext, type MeldQuotesState } from './MeldQuotes/MeldQuotes';
+import { type MeldRedirectNext, type MeldRedirectState } from './MeldRedirect/MeldRedirect';
+import { type SelectAssetNext, type SelectAssetState } from './SelectAsset/SelectAsset';
+import { type SourceChangeNext, type SourceChangeState } from './SourceChange/SourceChange';
+import { type SwappedIframeNext, type SwappedIframeState } from './SwappedIframe';
+import { type TransferTokenNext, type TransferTokenState } from './TransferToken/TransferToken';
+import { type FiatAccountDetailNext, type FiatAccountDetailState } from './VirtualFiatAccount/FiatAccountDetail';
+import { type KycIframeNext, type KycIframeState } from './VirtualFiatAccount/KycIframe';
+import { type WithdrawalCompleteNext, type WithdrawalCompleteState } from './Withdrawal/WithdrawalComplete';
+import { type WithdrawalEnterAmountNext, type WithdrawalEnterAmountState } from './Withdrawal/WithdrawalEnterAmount';
+export { FunCheckoutStep };
+export interface CheckoutModalCommonState {
+    checkoutId: string;
+    /** Handles soft hiding of the dialog (without removing it from the DOM) */
+    isSoftHidden: boolean;
+    /** Whether checkout should not be allowed to continue due to security reasons*/
+    isBlocked?: boolean;
+    startingStep: FunCheckoutStartingStep;
+    targetChainId: string;
+    showWalletOptions?: boolean;
+    hideBottomDivider: boolean;
+}
+export interface ModalStepComponentProps<S extends FunCheckoutStep = FunCheckoutStep> {
+    modalState: CheckoutModalState<S>;
+    onBack(): void;
+    onClose(options?: {
+        isNewDeposit?: boolean;
+    }): void;
+    onAnimationComplete(callback: () => void): void;
+    onNext(payload: NextPayload<S>): void;
+    /** Navigate directly to an arbitrary step state (animates + pushes history). */
+    onStepChange(state: CheckoutModalState): void;
+    setModalState(state: SetStateAction<CheckoutModalState<S>>): void;
+}
+/**
+ * Props passed to a `sourceChangeScreen.customTopComponent` so it can navigate
+ * the checkout modal (e.g. jump to a different step).
+ */
+export interface SourceChangeTopComponentProps {
+    onStepChange: (state: CheckoutModalState) => void;
+    modalState: CheckoutModalState;
+    /**
+     * The active checkout's routing id. Passed in (rather than read via
+     * `useCheckoutContext`) because a custom top component may be bundled
+     * separately from `@funkit/connect` (e.g. `@funkit/connect/clients/*`), where
+     * the checkout context is a different instance and would read as empty.
+     */
+    dynamicRoutingId?: string;
+    /**
+     * Apply a destination candidate (target token + routing id + optional
+     * recipient) in one atomic update — the same selection path the
+     * SourceChange target-asset dropdown uses.
+     */
+    applyDynamicTargetAssetCandidate: (candidate: DynamicTargetAssetCandidate) => void;
+}
+export declare function extractCommonState(state: CheckoutModalState): CheckoutModalCommonState;
+interface ModalStepInput<S extends FunCheckoutStep> {
+    state: CheckoutModalState<S>;
+    apiKey: string;
+    isSourceNavWidgetEnabled: boolean;
+}
+export type ModalStepInfo<S extends FunCheckoutStep> = {
+    Component: ComponentType<ModalStepComponentProps<S>>;
+    disableBack?: (info: ModalStepInput<S>) => boolean;
+    /** Hides the bottom section (portal target for bottom bar content) */
+    hideBottomSection?: (state: CheckoutModalState<S>) => boolean;
+    /** Hides the close button in the Dialog Title element */
+    hideClose?: (startingStep?: FunCheckoutStartingStep) => boolean;
+    /** Hides the entire topbar including back button, close button, and title */
+    hideTopbar?: (state: CheckoutModalState<S>) => boolean;
+    onBack?(state: CheckoutModalState<S>, prevState: CheckoutModalState): CheckoutModalState;
+    onNext(state: CheckoutModalState<S>, payload: NextPayload<S>): CheckoutModalState;
+    showFullHeight?: boolean;
+    /** Defaults to checkoutItem.initSettings.config.modalTitle (returning undefined uses default) */
+    title?(textCustomizations: FunkitTextCustomizationsConfig, state: CheckoutModalState<S>): string | undefined;
+    /** If title is not defined in config nor with the title() function, this is used instead. Defaults to 'Checkout' */
+    fallbackTitle?: string;
+};
+export declare const CheckoutModalSteps: {
+    [S in FunCheckoutStep]: ModalStepInfo<S>;
+};
+export type CheckoutModalState<S extends FunCheckoutStep = FunCheckoutStep> = {
+    [T in S]: {
+        [FunCheckoutStep.CHECKOUT_COMPLETE]: CheckoutCompleteState;
+        [FunCheckoutStep.CONFIRMATION]: ConfirmationStepState;
+        [FunCheckoutStep.INPUT_AMOUNT]: InputAmountState;
+        [FunCheckoutStep.LOADING_ACCOUNT]: LoadingAccountState;
+        [FunCheckoutStep.SELECT_ASSET]: SelectAssetState;
+        [FunCheckoutStep.SOURCE_CHANGE]: SourceChangeState;
+        [FunCheckoutStep.TRANSFER_TOKEN]: TransferTokenState;
+        [FunCheckoutStep.LIGHTNING_INVOICE]: LightningInvoiceState;
+        [FunCheckoutStep.CREATE_FIAT_ACCOUNT]: VirtualFiatAccountState;
+        [FunCheckoutStep.BRIDGE_KYC]: BridgeKycState;
+        [FunCheckoutStep.KYC_IFRAME]: KycIframeState;
+        [FunCheckoutStep.BRIDGE_CUSTOMER]: BridgeCustomerState;
+        [FunCheckoutStep.FIAT_ACCOUNT_DETAIL]: FiatAccountDetailState;
+        [FunCheckoutStep.ERROR_SCREEN]: ErrorScreenState;
+        [FunCheckoutStep.MELD_QUOTES]: MeldQuotesState;
+        [FunCheckoutStep.MELD_REDIRECT]: MeldRedirectState;
+        [FunCheckoutStep.MELD_CURRENCY_SELECT]: MeldCurrencySelectState;
+        [FunCheckoutStep.SELECT_BROKERAGE]: SelectBrokerageState;
+        [FunCheckoutStep.CONNECT_EXCHANGE]: ConnectExchangeState;
+        [FunCheckoutStep.BROKERAGE_TWO_FA]: BrokerageTwoFAState;
+        [FunCheckoutStep.BROKERAGE_SUCCESS]: BrokerageSuccessState;
+        [FunCheckoutStep.SWAPPED_IFRAME]: SwappedIframeState;
+        [FunCheckoutStep.PERPS_TRANSFER]: PerpsTransferState;
+        [FunCheckoutStep.WITHDRAWAL_ENTER_AMOUNT]: WithdrawalEnterAmountState;
+        [FunCheckoutStep.WITHDRAWAL_COMPLETE]: WithdrawalCompleteState;
+    }[T] & {
+        step: T;
+        previousStep?: FunCheckoutStep | null;
+    };
+}[S];
+export type NextPayload<S extends FunCheckoutStep = FunCheckoutStep> = {
+    [FunCheckoutStep.CHECKOUT_COMPLETE]: CheckoutCompleteNext;
+    [FunCheckoutStep.CONFIRMATION]: ConfirmationStepNext;
+    [FunCheckoutStep.INPUT_AMOUNT]: InputAmountNext;
+    [FunCheckoutStep.LOADING_ACCOUNT]: LoadingAccountNext;
+    [FunCheckoutStep.SELECT_ASSET]: SelectAssetNext;
+    [FunCheckoutStep.SOURCE_CHANGE]: SourceChangeNext;
+    [FunCheckoutStep.TRANSFER_TOKEN]: TransferTokenNext;
+    [FunCheckoutStep.LIGHTNING_INVOICE]: LightningInvoiceNext;
+    [FunCheckoutStep.CREATE_FIAT_ACCOUNT]: VirtualFiatAccountNext;
+    [FunCheckoutStep.BRIDGE_KYC]: BridgeKycNext;
+    [FunCheckoutStep.KYC_IFRAME]: KycIframeNext;
+    [FunCheckoutStep.BRIDGE_CUSTOMER]: BridgeCustomerNext;
+    [FunCheckoutStep.FIAT_ACCOUNT_DETAIL]: FiatAccountDetailNext;
+    [FunCheckoutStep.ERROR_SCREEN]: null;
+    [FunCheckoutStep.MELD_QUOTES]: MeldQuotesNext;
+    [FunCheckoutStep.MELD_REDIRECT]: MeldRedirectNext;
+    [FunCheckoutStep.MELD_CURRENCY_SELECT]: MeldCurrencySelectNext;
+    [FunCheckoutStep.SELECT_BROKERAGE]: SelectBrokerageNext;
+    [FunCheckoutStep.CONNECT_EXCHANGE]: ConnectExchangeNext;
+    [FunCheckoutStep.BROKERAGE_TWO_FA]: BrokerageTwoFANext;
+    [FunCheckoutStep.BROKERAGE_SUCCESS]: null;
+    [FunCheckoutStep.SWAPPED_IFRAME]: SwappedIframeNext;
+    [FunCheckoutStep.PERPS_TRANSFER]: PerpsTransferNext;
+    [FunCheckoutStep.WITHDRAWAL_ENTER_AMOUNT]: WithdrawalEnterAmountNext;
+    [FunCheckoutStep.WITHDRAWAL_COMPLETE]: WithdrawalCompleteNext;
+}[S] & {
+    /** Whether screen transition should change direction to simulate back transition. Only applies if there is a history entry in the stack*/
+    reverseAnimation?: boolean;
+    skipAnimation?: boolean;
+    wipeHistory?: boolean;
+    /** When set, finds the closest matching step in history and rolls back to it instead of creating a new history entry */
+    navigateToHistoryStep?: boolean;
+    /** Whether the current step should be popped from the history stack, so it's skipped when going back */
+    popCurrentStep?: boolean;
+};
+export declare function useCheckoutModalTransition(checkoutItem: FunkitActiveCheckoutItem, onClose: () => void): {
+    animation: import("../../hooks/useAnimatedNavigation").AnimationState;
+    modalState: CheckoutModalState<FunCheckoutStep>;
+    onBack: () => void;
+    onCloseWrapper: (options?: {
+        isNewDeposit?: boolean;
+    }) => void;
+    onNext: (payload: NextPayload) => void;
+    /** Only use as a last resort. Prefer next/back for proper navigation */
+    onStepChange: (nextState: CheckoutModalState) => void;
+    setModalState: import("react").Dispatch<SetStateAction<CheckoutModalState<FunCheckoutStep>>>;
+    hasHistoryEntry: boolean;
+    isStepReady: boolean;
+};
+export declare function useTitleConfig<S extends FunCheckoutStep>(checkoutItem: FunkitActiveCheckoutItem, state: CheckoutModalState<S>): {
+    disableBack: boolean;
+    hideBottomSection: boolean;
+    hideClose: boolean;
+    hideTopbar: boolean;
+    showFullHeight: boolean;
+    title: string;
+};

package/dist/modals/CheckoutModal/stepTransition.track.d.ts

@@ -0,0 +1,6 @@
+import { CheckoutModalEvent } from '../../hooks/track/CheckoutModalEvent';
+import type { TrackEventData } from '../../hooks/track/useTrack';
+import { FunCheckoutStep } from './FunCheckoutStep';
+import type { CheckoutModalState } from './stepTransition';
+export declare const CHECKOUT_STEP_TO_READY_EVENT: Partial<Record<FunCheckoutStep, CheckoutModalEvent>>;
+export declare const trackEventFromNextState: (nextState: CheckoutModalState<FunCheckoutStep>) => TrackEventData | null;

package/dist/modals/CheckoutModal/useCheckoutBlocked.d.ts

@@ -0,0 +1,18 @@
+import type { CheckoutBlockedReason } from './CheckoutBlockedReason';
+import { FunCheckoutStep } from './FunCheckoutStep';
+interface UseCheckoutBlockedParams {
+    isModalBlocked: boolean;
+    modalStep: FunCheckoutStep;
+    onCheckoutBlocked?: (params: {
+        blockedReason: CheckoutBlockedReason;
+    }) => void;
+}
+type CheckoutBlockedResult = {
+    blockedReason: CheckoutBlockedReason;
+    showBlockedUI: boolean;
+} | {
+    blockedReason: null;
+    showBlockedUI: false;
+};
+export declare function useCheckoutBlocked(params: UseCheckoutBlockedParams): CheckoutBlockedResult;
+export {};

package/dist/modals/ConnectModal/ConnectModal.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface ConnectModalProps {
+    open: boolean;
+    onClose: () => void;
+}
+export declare function ConnectModal({ onClose, open }: ConnectModalProps): React.JSX.Element | null;

package/dist/modals/DevTest/DevEmbed.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare function DevEmbed(): React.JSX.Element;

package/dist/modals/PolymarketPerpsTransfer/DirectionSwapButton.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+export interface DirectionSwapButtonProps {
+    onClick: () => void;
+    testId?: string;
+}
+/**
+ * The control sitting between the two account rows. Pressing it swaps which
+ * account is the source: the top row is always the "From" account (the amount
+ * you send), so a swap just changes the labels on each row. The icon is a
+ * static downward arrow (matching the design) — it does not rotate on toggle.
+ *
+ * Styled per Figma as a 32px outlined circle: white surface with a 1px border
+ * (gray/100 → gray/200 on hover) and a faint hover/pressed fill. The Figma
+ * border vars map to the nearest funkit stroke tokens (mediumStroke ≈ #efefef,
+ * heavyStroke ≈ #ddd); the surface uses the icon-button background defaults.
+ */
+export declare function DirectionSwapButton({ onClick, testId, }: DirectionSwapButtonProps): React.JSX.Element;

package/dist/modals/PolymarketPerpsTransfer/PerpsTransferBottomBar.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { PerpsTransferForm } from './usePerpsTransferForm';
+/**
+ * The notice line + Transfer button under the transfer rows, rendered from
+ * {@link usePerpsTransferForm} state. The in-modal `PerpsTransferStep` portals
+ * this into the modal's bottom section; the standalone screen renders it in
+ * its `Dialog.BottomSection`.
+ */
+export declare function PerpsTransferBottomBar({ form }: {
+    form: PerpsTransferForm;
+}): React.JSX.Element;

package/dist/modals/PolymarketPerpsTransfer/PerpsTransferRows.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { PerpsTransferForm } from './usePerpsTransferForm';
+/**
+ * The From/To account rows with the direction-swap button between them —
+ * the body of the Perps ⇄ Predictions transfer screen, rendered from
+ * {@link usePerpsTransferForm} state.
+ */
+export declare function PerpsTransferRows({ form }: {
+    form: PerpsTransferForm;
+}): React.JSX.Element;

package/dist/modals/PolymarketPerpsTransfer/PerpsTransferStep.d.ts

@@ -0,0 +1,11 @@
+import type { FunCheckoutStep } from '../CheckoutModal/FunCheckoutStep';
+import type { CheckoutModalCommonState, ModalStepInfo } from '../CheckoutModal/stepTransition';
+/**
+ * Per-step state for the perps transfer screen. Balances are not carried in on
+ * navigation — the step reads them from the shared balance cache (see
+ * {@link usePolymarketAccountBalances}), the same cache the deposit picker
+ * populates, so there's no reload flash on entry.
+ */
+export type PerpsTransferState = CheckoutModalCommonState;
+export type PerpsTransferNext = null;
+export declare const PerpsTransferStepInfo: ModalStepInfo<FunCheckoutStep.PERPS_TRANSFER>;

package/dist/modals/PolymarketPerpsTransfer/PolymarketPerpsTransferScreen.d.ts

@@ -0,0 +1,52 @@
+import React from 'react';
+export type PerpsTransferDirection = 'toPerps' | 'toPredictions';
+export type PerpsTransferStatus = 'idle' | 'processing' | 'success' | 'error';
+export interface PolymarketPerpsTransferScreenProps {
+    /** Whether the modal is open. Defaults to true (the screen owns its Dialog). */
+    open?: boolean;
+    /** Modal title. Defaults to the localized "Transfer". */
+    title?: string;
+    /** Predictions account balance in USD. */
+    predictionsBalanceUsd: number;
+    /** Perps account balance in USD. */
+    perpsBalanceUsd: number;
+    /** Minimum pUSD to transfer *into* predictions (USD). Drives the
+     * below-minimum notice when the destination is Predictions. */
+    predictionsMinTransferUsd?: number;
+    /** Minimum pUSD to transfer *into* perps (USD). Drives the below-minimum
+     * notice when the destination is Perps (e.g. perps' 5 pUSD minimum). */
+    perpsMinTransferUsd?: number;
+    /** Initial transfer direction. Defaults to Predictions → Perps. */
+    initialDirection?: PerpsTransferDirection;
+    /** Initial amount input string (pUSD). */
+    initialAmountUsd?: string;
+    /**
+     * Visual status, controlled by the host so the same screen renders the
+     * idle / processing / success / error frames. `error` shows a retry-able
+     * Transfer button with an error notice. No transfer logic is wired here — the
+     * Transfer button simply reports clicks via {@link onTransfer}.
+     */
+    status?: PerpsTransferStatus;
+    /**
+     * Fired when the (enabled) Transfer button is pressed, with the entered
+     * amount and direction — mirrors {@link usePerpsTransferForm}'s callback
+     * so a host receives everything it needs to perform the transfer.
+     */
+    onTransfer: (params: {
+        amountUsd: string;
+        direction: PerpsTransferDirection;
+    }) => void;
+    onClose?: () => void;
+    onBack?: () => void;
+}
+/**
+ * Polymarket "Transfer" screen — moves a balance between the Predictions and
+ * Perps accounts. Self-contained: it renders its own Dialog so it can be used
+ * standalone or in a Storybook story. The in-checkout-modal variant is the
+ * `PerpsTransferStep` (which renders the same UI via {@link usePerpsTransferForm}
+ * as a registered step instead of a Dialog).
+ *
+ * UI only: balances are props, and the Transfer button's processing/success
+ * states are driven by the {@link status} prop rather than any real transfer.
+ */
+export declare function PolymarketPerpsTransferScreen({ open, title, predictionsBalanceUsd, perpsBalanceUsd, predictionsMinTransferUsd, perpsMinTransferUsd, initialDirection, initialAmountUsd, status, onTransfer, onClose, onBack, }: PolymarketPerpsTransferScreenProps): React.JSX.Element;

package/dist/modals/PolymarketPerpsTransfer/TransferActionButton.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import type { PerpsTransferStatus } from './PolymarketPerpsTransferScreen';
+export interface TransferActionButtonProps {
+    /** Drives the visual state and the label/icon swap. */
+    status: PerpsTransferStatus;
+    /** Label shown in the idle state (already translated). */
+    idleLabel: string;
+    /** Label shown while processing (already translated). */
+    processingLabel: string;
+    /** Label shown on success (already translated). */
+    successLabel: string;
+    /** Greys out / blocks the idle button until an amount is entered. */
+    isDisabled?: boolean;
+    onClick?: () => void;
+    testId?: string;
+}
+/**
+ * The bottom-bar transfer button. It morphs across the three flow states:
+ *
+ * - **idle**: primary (blue) "Transfer".
+ * - **processing**: dimmed blue, spinner + "Processing", inert.
+ * - **success**: secondary (grey) surface, green check + success label, inert.
+ *
+ * Two details keep the morph smooth:
+ *
+ * 1. Each state's content (icon + label) is a single absolutely-positioned,
+ *    centered layer, and we swap whole layers. Because every layer centres
+ *    itself, the label never shifts horizontally when the icon appears — the
+ *    transition is a pure vertical blur/fade (matching the From/To row swap).
+ * 2. The grey surface is the always-present base; the blue sits on top as an
+ *    overlay whose opacity only ever fades *out* toward success. Nothing
+ *    brightens mid-transition, so there's no blue "flush" as it turns grey.
+ */
+export declare function TransferActionButton({ status, idleLabel, processingLabel, successLabel, isDisabled, onClick, testId, }: TransferActionButtonProps): React.JSX.Element;

package/dist/modals/PolymarketPerpsTransfer/TransferAmountPill.css.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Borderless big-number amount field used inside the editable (source) pill.
+ * The pill's outer Box owns the border/background; this input is transparent so
+ * it reads as inline editable text.
+ *
+ * The 32px size matches the Figma amount type — there is no 32px token in the
+ * font scale, so it is set here. The family is the theme `body` font (same as
+ * the rest of the modal) — note the customer `header`/`inputAmount` tokens can
+ * resolve to `inherit`, so they must not be used here. The placeholder uses
+ * `secondaryText` to mirror the greyed-out empty "0.00" treatment in the design.
+ */
+export declare const amountInput: string;
+export declare const transferAmountPillContainer: string;

package/dist/modals/PolymarketPerpsTransfer/TransferAmountPill.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+export interface TransferAmountPillProps {
+    /** "From" / "To" prefix (already translated). */
+    relationLabel: string;
+    /** Account name, e.g. "Predictions" / "Perps". */
+    accountLabel: string;
+    /** Account balance in USD; rendered floored to the cent as "$X,XXX.XX". */
+    balanceUsd: number;
+    /**
+     * The source pill is the editable side: it owns the input + Max button and
+     * gets the active border. The destination pill mirrors the amount read-only
+     * and has no Max button.
+     */
+    isSource: boolean;
+    /** Controlled amount string (raw user input; may contain separators). */
+    amount: string;
+    onAmountChange?: (next: string) => void;
+    onMax?: () => void;
+    testId?: string;
+}
+/**
+ * A single From/To account row in the Perps ⇄ Predictions transfer screen.
+ * Top line shows the relation + account name, the account balance, and — on the
+ * source pill — a Max button; the bottom line shows the (large) amount and, on
+ * the source pill, the `pUSD` denomination.
+ */
+export declare function TransferAmountPill({ relationLabel, accountLabel, balanceUsd, isSource, amount, onAmountChange, onMax, testId, }: TransferAmountPillProps): React.JSX.Element;

package/dist/modals/PolymarketPerpsTransfer/TransferAmountRow.css.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Borderless big-number amount field used inside the editable (source) row.
+ * The row's outer Box owns the border/background; this input is transparent so
+ * it reads as inline editable text.
+ *
+ * The 32px size matches the Figma amount type — there is no 32px token in the
+ * font scale, so it is set here. The family is the theme `body` font (same as
+ * the rest of the modal) — note the customer `header`/`inputAmount` tokens can
+ * resolve to `inherit`, so they must not be used here. The placeholder uses
+ * `secondaryText` to mirror the greyed-out empty "0.00" treatment in the design.
+ */
+export declare const amountInput: string;
+export declare const transferAmountRowContainer: string;