import { JSX } from './preact/compat';
import { LoginFlow, RecoveryFlow, RegistrationFlow, VerificationFlow } from "@ory/client";
import type { CustomHref } from "../button-link";
import { UserAuthFormAdditionalProps } from "./helpers/user-auth-form";
export interface LoginSectionAdditionalProps {
    forgotPasswordURL?: CustomHref | string;
    signupURL?: CustomHref | string;
    logoutURL?: CustomHref | string;
}
export interface RegistrationSectionAdditionalProps {
    loginURL?: CustomHref | string;
}
export interface VerificationSectionAdditionalProps {
    signupURL?: CustomHref | string;
}
export interface RecoverySectionAdditionalProps {
    loginURL?: CustomHref | string;
}
/**
 * UserAuthCardProps used by the UserAuthCard
 * @param title - title of the user auth card
 * @param subtitle - subtitle of the user auth card, usually used to display additional information
 * @param cardImage - an image to display on the card header (usually a logo)
 * @param includeScripts - include webauthn scripts in the card (optional)
 * @param className - className to pass to the card component
 * @param additionalProps - additional props to pass to the form (optional)
 */
export type UserAuthCardProps = {
    title?: string;
    subtitle?: string;
    cardImage?: string | React.ReactElement | React.FunctionComponent;
    includeScripts?: boolean;
    className?: string;
} & UserAuthFormAdditionalProps & ({
    flow: LoginFlow;
    flowType: "login";
    additionalProps?: LoginSectionAdditionalProps;
} | {
    flow: RegistrationFlow;
    flowType: "registration";
    additionalProps?: RegistrationSectionAdditionalProps;
} | {
    flow: RecoveryFlow;
    flowType: "recovery";
    additionalProps?: RecoverySectionAdditionalProps;
} | {
    flow: VerificationFlow;
    flowType: "verification";
    additionalProps?: VerificationSectionAdditionalProps;
});
/**
 * UserAuthCard renders a login, registration, verification or recovery flow
 * it can also handle multi factor authentication on login flows
 * @param UserAuthCardProps - a card that renders a login, registration, verification or recovery flow
 * @returns JSX.Element
 */
export declare const UserAuthCard: ({ flow, title, subtitle, flowType, additionalProps, cardImage, onSubmit, includeScripts, className, }: UserAuthCardProps) => JSX.Element;
