import React from "react";
export interface SegmentedOption<T extends string> {
    key: T;
    label: string;
    /** When false the segment is shown but not selectable (e.g. "coming soon"). */
    disabled?: boolean;
    /**
     * Optional glyph shown left of the label.
     *
     * A render function rather than a node so the icon can take the segment's
     * current foreground colour — the same reason the label's colour is applied
     * inline. A fixed-colour node would go invisible against the indicator on
     * whichever of the two states it was not drawn for.
     */
    icon?: (color: string) => React.ReactNode;
}
export interface SegmentedToggleProps<T extends string> {
    value: T;
    options: SegmentedOption<T>[];
    onChange: (next: T) => void;
    /** Visual size — `sm` is used inside dialogs, `default` on the auth screen. */
    size?: "sm" | "default";
    className?: string;
}
/**
 * Themed segmented control with a sliding indicator (reanimated). Mirrors the
 * website/simple-finance "Sign In / Sign Up" pill, but palette-driven so it
 * tracks the active theme instead of hard-coded brand colors. Shared by the
 * consolidated AuthScreen mode switch and the ConnectionSettings run-mode pills.
 *
 * Colors are applied via inline `style` (not className) on the Text so Android's
 * NativeWind doesn't override the active/inactive foreground — see the
 * android-nativewind-styling note.
 */
export declare function SegmentedToggle<T extends string>({ value, options, onChange, size, className, }: SegmentedToggleProps<T>): React.JSX.Element;
export default SegmentedToggle;
//# sourceMappingURL=segmented-toggle.d.ts.map