import { ComponentChildren } from 'preact';
import { CountryCode } from 'libphonenumber-js';
import { CSSProperties } from 'preact';
import { FC } from 'preact/compat';
import { FunctionalComponent } from 'preact';
import { HTMLAttributes } from 'preact';
import { HTMLAttributes as HTMLAttributes_2 } from 'preact/compat';
import { i18n } from 'i18next';
import { IdCaptureManager } from '@incodetech/core/id';
import { IdCaptureState } from '@incodetech/core/id';
import { InputHTMLAttributes } from 'preact';
import { JSX } from 'preact';
import { default as LightningIcon } from './lightningIcon.svg?react';
import { PermissionStatus as PermissionStatus_2 } from '@incodetech/core/camera';
import { PropsWithoutRef } from 'preact/compat';
import { Ref } from 'preact';
import { RefObject } from 'preact';
import { SelfieManager } from '@incodetech/core/selfie';
import { SelfieState } from '@incodetech/core/selfie';
import { TargetedEvent } from 'preact';
import { TFunction } from 'i18next';
import { VNode } from 'preact';

export declare const BaseTutorial: ({ className, animationData, title, titleId, subtitle, onContinue, buttonText, disclaimerText, isLoading, stopFramePosition, }: BaseTutorialProps) => JSX.Element;

declare type BaseTutorialProps = {
    className?: string;
    animationData: LottieAnimationData | null;
    title: string;
    titleId?: string;
    subtitle: string;
    onContinue: () => void;
    buttonText: string;
    disclaimerText: string;
    isLoading?: boolean;
    stopFramePosition?: 'first' | 'middle' | 'last';
};

export declare const BottomSheet: FC<BottomSheetProps>;

declare type BottomSheetProps = {
    isOpen?: boolean;
    onClose?: () => void;
    labelledById: string;
    children: ComponentChildren;
};

export declare const Button: FunctionalComponent<PropsWithoutRef<ButtonProps> & {
ref?: Ref<HTMLButtonElement> | undefined;
}>;

declare type ButtonProps = Omit<HTMLAttributes<HTMLButtonElement>, 'class' | 'type' | 'icon'> & {
    isLoading?: boolean;
    children?: ComponentChildren;
    class?: string;
    type?: 'button' | 'submit' | 'reset';
    variant?: 'primary' | 'secondary' | 'link';
    size?: ButtonSize;
    icon?: ComponentChildren;
    disabled?: boolean;
};

declare type ButtonSize = 'L' | 'M' | 'S';

export declare const CalendarIcon: FC<CalendarIconProps>;

declare type CalendarIconProps = {
    class?: string;
};

export declare const CameraFrame: FunctionalComponent<PropsWithoutRef<CameraFrameProps> & {
ref?: Ref<HTMLDivElement> | undefined;
}>;

declare type CameraFrameProps = {
    variant: CameraFrameVariant;
    aspectRatio?: string;
    orientation?: 'horizontal' | 'vertical';
    frameState?: CameraFrameState;
    className?: string;
    children?: ComponentChildren;
};

declare type CameraFrameState = 'idle' | 'capturing' | 'error' | 'focus' | 'success' | 'analyzing';

declare type CameraFrameVariant = 'fill' | 'locked';

export declare const CameraIcon: FC<CameraIconProps>;

declare type CameraIconProps = {
    size?: number | string;
};

/**
 * Absolute-positioned flex-column overlay that sits on top of the camera video.
 *
 * Expected child order:
 *  1. (optional) Module-specific header extras (e.g. CaptureNotification)
 *  2. CameraOverlayHeader
 *  3. CameraFrame
 *  4. CaptureFooter
 */
export declare const CameraOverlay: FC<CameraOverlayProps>;

export declare const CameraOverlayHeader: FC<CameraOverlayHeaderProps>;

declare type CameraOverlayHeaderProps = {
    title: string;
    subtitle?: string;
    visible?: boolean;
    className?: string;
    titleId?: string;
};

declare type CameraOverlayProps = {
    children: ComponentChildren;
    className?: string;
};

export declare const CameraView: FC<CameraViewProps>;

declare type CameraViewProps = {
    stream: MediaStream | undefined;
    children: ComponentChildren;
    videoRef?: Ref<HTMLVideoElement>;
    onPlaying?: () => void;
    className?: string;
    'data-testid'?: string;
};

export declare const CaptureButtonIcon: FC<CaptureButtonIconProps>;

declare type CaptureButtonIconProps = {
    className?: string;
};

export declare const CaptureFooter: FC<CaptureFooterProps>;

declare type CaptureFooterProps = {
    onOpenHelp: () => void;
    onCapture?: () => void;
    isManualCapture?: boolean;
    captureAriaLabel?: string;
    captureAriaDescribedBy?: string;
    helpAriaLabel?: string;
    helpButtonRef?: Ref<HTMLButtonElement>;
    captureButtonRef?: Ref<HTMLButtonElement>;
    encryptionLabel?: string;
    children?: ComponentChildren;
};

declare type CaptureProps = {
    manager: SelfieManager;
    state: CaptureState;
};

declare type CaptureProps_2 = {
    manager: IdCaptureManager;
    state: CaptureState_2;
    onFinish?: () => void;
};

declare type CaptureState = Extract<SelfieState, {
    status: 'capture';
}>;

declare type CaptureState_2 = Extract<IdCaptureState, {
    status: 'capture';
}>;

export declare const Checkbox: FunctionalComponent<PropsWithoutRef<CheckboxProps> & {
ref?: Ref<HTMLInputElement> | undefined;
}>;

declare type CheckboxProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'class' | 'type' | 'size'> & {
    id: string;
    label?: string | ComponentChildren;
    labelHint?: string;
    size?: 's' | 'm';
    error?: string;
    helper?: string;
    showErrorIcon?: boolean;
    class?: string;
};

export declare const CheckmarkCompactIcon: FC<CheckmarkCompactIconProps>;

declare type CheckmarkCompactIconProps = {
    size?: number | string;
    fillColor?: string;
};

export declare const CheckmarkIcon: FC<CheckmarkIconProps>;

declare type CheckmarkIconProps = {
    size?: number | string;
    fillColor?: string;
};

export declare const ChevronDown: FC<ChevronDownProps>;

declare type ChevronDownProps = {
    class?: string;
};

/**
 * ChevronLeftIcon component - mirror of ChevronRightIcon. Two different SVGs
 * for three variants. For "xs" variant - icon is bolder; for "s" and "m"
 * variants - icon is thinner.
 */
export declare const ChevronLeftIcon: ({ size, class: className, variant, }: ChevronLeftIconProps) => JSX.Element;

declare type ChevronLeftIconProps = {
    size?: number;
    class?: string;
    variant?: 'xs' | 's' | 'm';
};

/**
 * ChevronRightIcon component - there are two different SVGs for three variants. For "xs" variant - icon is bolder, and for "s" and "m" variants - icon is thinner.
 */
export declare const ChevronRightIcon: ({ size, class: className, variant, }: ChevronRightIconProps) => JSX.Element;

declare type ChevronRightIconProps = {
    size?: number;
    class?: string;
    variant?: 'xs' | 's' | 'm';
};

declare type ChooserProps = {
    manager: IdCaptureManager;
    state: Extract<IdCaptureState, {
        status: 'chooser';
    }>;
};

declare type CloseButtonOptions = {
    show?: boolean;
    onClose?: () => void;
    position?: 'left' | 'right';
    offset?: string;
    onCancel?: () => void;
    color?: string;
};

declare type CloseButtonOptions_2 = {
    show?: boolean;
    onClose?: () => void;
};

export declare const CloseIcon: FC<CloseIconProps>;

declare type CloseIconProps = {
    width?: number | string;
    height?: number | string;
    class?: string;
    fillColor?: string;
};

export declare const countries: CountryData[];

declare type CountryData = {
    code: CountryCode;
    emoji: string;
    name: string;
    callingCode: string;
};

export declare const DateInputComposed: FunctionalComponent<PropsWithoutRef<DateInputComposedProps> & {
ref?: Ref<HTMLInputElement> | undefined;
}>;

declare type DateInputComposedProps = Omit<InputComposedProps, 'type' | 'closeButton' | 'rightIcon'> & {
    value: string;
    onInput: (e: Event) => void;
    onBlur?: (e: FocusEvent) => void;
};

export declare const DropdownComposed: FC<DropdownComposedProps>;

declare type DropdownComposedProps = {
    id: string;
    label?: string;
    labelHint?: string;
    placeholder?: string;
    value: string;
    options: DropdownOption[];
    onChange: (value: string) => void;
    error?: string;
    helper?: string;
    showErrorIcon?: boolean;
    showHelperIcon?: boolean;
    suppressMessages?: boolean;
    disabled?: boolean;
    required?: boolean;
    searchable?: boolean;
    searchPlaceholder?: string;
    noResultsText?: string;
    name?: string;
    tabIndex?: number;
    onKeyDown?: (e: KeyboardEvent) => void;
    onBlur?: () => void;
    renderSelectedLabel?: (option: DropdownOption) => string;
    siblingElement?: ComponentChildren;
    enterKeyHint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
    class?: string;
    'aria-label'?: string;
    'data-testid'?: string;
};

declare type DropdownOption = {
    value: string;
    label: string;
    ariaLabel?: string;
};

export declare const ErrorContent: ({ title, description, attemptsRemaining, onButtonClick, "data-testid": testId, }: ErrorContentProps) => JSX.Element;

declare type ErrorContentProps = {
    title: string;
    description: string;
    attemptsRemaining: number;
    onButtonClick: () => void;
    'data-testid'?: string;
};

export declare const ErrorIcon: FC<ErrorIconProps>;

declare type ErrorIconProps = {
    size?: number | string;
};

export declare const FileIcon: FC<FileIconProps>;

declare type FileIconProps = {
    size?: number | string;
};

declare type FlipAnimationProps = {
    manager: IdCaptureManager;
    direction: 'toBack' | 'toFront';
};

export declare const FormField: FC<FormFieldProps>;

declare type FormFieldProps = {
    name: string;
    label: string;
    displayLabel?: string;
    value?: string;
    error?: string;
    errorParams?: Record<string, string | number>;
    type?: string;
    placeholder?: string;
    placeholderParams?: Record<string, string>;
    required?: boolean;
    readonly?: boolean;
    maxLength?: number;
    disabled?: boolean;
    /**
     * Pre-translated text rendered next to the label (e.g. "(optional)").
     * Forms derive this via the majority rule (`getRequiredHintMode` +
     * `getFieldHint`).
     */
    labelHint?: string;
    onChange: (name: string, value: string) => void;
    onBlur?: (name: string) => void;
};

export declare function getCountryByCallingCode(callingCode: string): CountryData | undefined;

export declare function getCountryByCode(code: string | undefined): CountryData | undefined;

export declare const HelpIcon: FC<HelpIconProps>;

declare type HelpIconProps = {
    className?: string;
};

export declare const IdCapture: FC<CaptureProps_2>;

export declare const IdChooser: FC<ChooserProps>;

export declare const IdError: FC<IdErrorProps>;

declare type IdErrorProps = {
    manager: IdCaptureManager;
    state: Extract<IdCaptureState, {
        status: 'error';
    }>;
    onError?: (error: string | undefined) => void;
    blurImage?: boolean;
} | {
    manager: IdCaptureManager;
    state: Extract<IdCaptureState, {
        status: 'capture';
    }>;
    blurImage?: boolean;
};

/**
 * Flow / SDK 1 UXv2 capture-side expired-document screen — thin wrapper that
 * wires `idCaptureManager.retryCapture()` and forwards the
 * `attemptsRemaining` counter into the shared `<ExpiredId>` primitive.
 *
 * Workflow's verify-side node uses its own wrapper in the `id-verification`
 * module that passes only `onContinue` (no attempts concept), matching the
 * legacy SDK 1 `Workflow.tsx → ProcessId.jsx → ExpiredId` one-shot Continue
 * behavior.
 */
export declare const IdExpired: FC<IdExpiredProps>;

declare type IdExpiredProps = {
    manager: IdCaptureManager;
    attemptsRemaining: number;
};

export declare const IdFlipAnimation: FC<FlipAnimationProps>;

export declare const IdTutorial: FC<TutorialProps_2>;

/**
 * Wraps UI modules with the standard container.
 * Shows a landscape blocker overlay on mobile (excluding iPad) when device is rotated to landscape.
 */
export declare function IncodeComponent({ children }: IncodeComponentProps): VNode;

declare type IncodeComponentProps = {
    children?: ComponentChildren;
};

export declare type IncodeModuleProps<TConfig, TResult = void, TManager = unknown> = {
    /**
     * Module configuration required to render the flow.
     * For Web Components, this is typically assigned via `element.config = ...`.
     */
    config?: TConfig;
    /**
     * Optional pre-built manager. When provided, the module does not create or manage the manager lifecycle.
     */
    manager?: TManager;
    /**
     * Callback invoked when the module completes successfully.
     * @param result - Optional result data from the module completion
     */
    onFinish?: (result?: TResult) => void;
    /**
     * Callback invoked when a fatal module error occurs.
     *
     * @param error - Human-readable error message.
     * @param errorCode - Optional numeric code (e.g. HTTP status). Populated by
     *   the workflow and flow modules on QR validation failures —
     *   `4026` (`expiredUUID`), `4081` (`invalidQRuuid`) or `4083` (`onboardingUrlAlreadyUsed`).
     * @param moduleErrorCode - Optional machine-readable error code (e.g. a
     *   `FaceErrorCode` such as `NONEXISTENT_CUSTOMER`). Lets an orchestrator
     *   branch on the specific terminal error without parsing the message string.
     */
    onError?: (error: string | undefined, errorCode?: number, moduleErrorCode?: string) => void;
};

declare type InferState<T> = T extends {
    getState: () => infer S;
} ? S : never;

export declare const Input: FunctionalComponent<PropsWithoutRef<InputProps> & {
ref?: Ref<HTMLInputElement> | undefined;
}>;

export declare const InputComposed: FunctionalComponent<PropsWithoutRef<InputComposedProps> & {
ref?: Ref<HTMLInputElement> | undefined;
}>;

declare type InputComposedProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'class'> & {
    id: string;
    label?: string;
    labelHint?: string;
    error?: string;
    helper?: string;
    showErrorIcon?: boolean;
    showHelperIcon?: boolean;
    closeButton?: CloseButtonOptions_2;
    rightIcon?: ComponentChildren;
    suppressMessages?: boolean;
    class?: string;
};

declare type InputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'class' | 'type'> & {
    class?: string;
    type?: string;
    'data-has-value'?: boolean;
};

export declare function LandscapeBlocker(): VNode | null;

export { LightningIcon }

export declare const LockIcon: FC<LockIconProps>;

declare type LockIconProps = {
    className?: string;
};

export declare function Lottie({ animationData, loop, autoplay, reverse, style, className, onComplete, autoStop, stopFramePosition, }: LottieProps): JSX.Element;

declare type LottieAnimationData = {
    fr: number;
    v: string;
    ip: number;
    op: number;
    w: number;
    h: number;
};

declare type LottieProps = {
    animationData: LottieAnimationData;
    loop?: boolean;
    autoplay?: boolean;
    reverse?: boolean;
    style?: CSSProperties;
    className?: string;
    onComplete?: () => void;
    /** Auto-stop the animation after 5s (WCAG 2.2 AA 2.2.2). */
    autoStop?: boolean;
    /**
     * Where to freeze the animation when `autoStop` fires. When omitted the
     * animation is paused at its current frame; otherwise it jumps to and stops
     * at the resolved frame (falling back to a full stop when the frame count is
     * unknown).
     */
    stopFramePosition?: LottieStopFramePosition;
};

declare type LottieStopFramePosition = 'first' | 'middle' | 'last';

export declare const ManualCapture: FC<ManualCaptureProps>;

declare type ManualCaptureProps = {
    stream: MediaStream;
    onCapture: (imageBase64: string) => void;
    disabled?: boolean;
};

export declare const Modal: {
    Root: typeof ModalRoot;
    Content: typeof ModalContent;
    Close: typeof ModalClose;
    Icon: typeof ModalIcon;
    TitleSection: typeof ModalTitleSection;
    Title: typeof ModalTitle;
    Subtitle: typeof ModalSubtitle;
    Actions: typeof ModalActions;
};

declare function ModalActions({ children, class: className, orientation, }: ModalActionsProps): JSX.Element;

declare type ModalActionsProps = {
    children: ComponentChildren;
    class?: string;
    orientation?: 'vertical' | 'horizontal';
};

declare function ModalClose({ 'aria-label': ariaLabel, title: titleAttr, class: className, onClick, }: ModalCloseProps): JSX.Element | null;

declare type ModalCloseProps = {
    'aria-label'?: string;
    title?: string;
    class?: string;
    onClick?: () => Promise<void> | void;
};

declare function ModalContent({ children, class: className }: ModalContentProps): JSX.Element;

declare type ModalContentProps = {
    children: ComponentChildren;
    class?: string;
};

declare function ModalIcon({ children, class: className }: ModalIconProps): JSX.Element;

declare type ModalIconProps = {
    children: ComponentChildren;
    class?: string;
};

declare function ModalRoot({ open, children, onOpenChange, dismissible, portalContainer, class: className, hasBackdrop, manageInitialFocus, returnFocusRef, }: ModalRootProps): VNode<any> | null;

declare type ModalRootProps = {
    open: boolean;
    children: ComponentChildren;
    onOpenChange?: (open: boolean) => void;
    /** When false, Escape, overlay click, and Close do not dismiss. */
    dismissible?: boolean;
    /** Mount portal here instead of a dedicated node under document.body. */
    portalContainer?: HTMLElement | null;
    class?: string;
    hasBackdrop?: boolean;
    /** When false, Modal won't move focus to the title (or dialog) on open. Defaults to true. */
    manageInitialFocus?: boolean;
    returnFocusRef?: RefObject<HTMLElement | null>;
};

declare function ModalSubtitle({ children, class: className }: ModalSubtitleProps): JSX.Element;

declare type ModalSubtitleProps = {
    children: ComponentChildren;
    class?: string;
};

declare function ModalTitle({ children, ref, class: className }: ModalTitleProps): JSX.Element;

declare type ModalTitleProps = {
    children: ComponentChildren;
    class?: string;
    ref?: Ref<HTMLHeadingElement>;
};

declare function ModalTitleSection({ children, align, }: ModalTitleSectionProps): JSX.Element;

/** Wrap Modal.Title and Modal.Subtitle for 12px between them and 24px above actions. */
declare type ModalTitleSectionProps = {
    children: ComponentChildren;
    align?: 'center' | 'left';
};

export declare const OtpInput: FC<OtpInputProps>;

declare type OtpInputProps = {
    value: string;
    otpLength: number;
    resendTimer: number;
    canResend: boolean;
    error?: string;
    validationError?: string;
    isValid?: boolean;
    onSubmit: (code: string) => void;
    onChange: (code: string) => void;
    onValidate?: () => void;
    onResend: () => void;
    onBack: () => void;
    /**
     * Custom text for the back link (e.g., "change email address").
     * Defaults to "change phone number" if not provided.
     */
    backLinkText?: string;
    /** Whether the inputs and buttons should be disabled */
    disabled?: boolean;
    /** Whether the submit button should show loading state */
    isLoading?: boolean;
};

export declare const Overlay: FC<OverlayProps>;

declare type OverlayProps = {
    children: ComponentChildren;
    'aria-labelledby'?: string;
    class?: string;
};

export declare const Page: ({ title, titleId, subtitle, titleTopSlot, className, logo, children, hideHeader, hideFooterBranding, footerBrandingSlot, "data-testid": dataTestId, "data-permission-status": dataPermissionStatus, }: PageProps) => JSX.Element;

declare type PageProps = {
    children?: ComponentChildren;
    title?: string;
    titleId?: string;
    subtitle?: string;
    /** Optional content rendered above the title (e.g. a status icon). */
    titleTopSlot?: ComponentChildren;
    className?: string;
    logo?: {
        src?: string;
        height?: string;
    };
    hideFooterBranding?: boolean;
    hideHeader?: boolean;
    closeButton?: CloseButtonOptions;
    footerBrandingSlot?: ComponentChildren;
    'data-testid'?: string;
    'data-permission-status'?: string;
};

declare const Permissions_2: FC<PermissionsProps>;
export { Permissions_2 as Permissions }

declare type PermissionsManager = {
    requestPermission: () => void;
    goToLearnMore: () => void;
    close: () => void;
};

declare type PermissionsProps = {
    manager: PermissionsManager;
    permissionStatus: PermissionStatus_2;
};

export declare const PhoneInputComposed: FunctionalComponent<PropsWithoutRef<PhoneInputComposedProps> & {
ref?: Ref<HTMLInputElement> | undefined;
}>;

declare type PhoneInputComposedProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'onChange' | 'class'> & PhoneInputOwnProps;

declare type PhoneInputOwnProps = {
    id: string;
    label?: string;
    labelHint?: string;
    countryCode?: string;
    value?: string;
    placeholder?: string;
    error?: string;
    /**
     * When `true` and an `error` is present, the country-specific format example
     * is appended to the error (unspaced for sighted users, digit-spaced for
     * screen readers) so the `role="alert"` suggests the expected format
     * (WCAG 2.2 SC 3.3.3). Requires `formatHintBuilder` to be set.
     */
    showFormatHintInError?: boolean;
    helper?: string;
    showErrorIcon?: boolean;
    showHelperIcon?: boolean;
    disabled?: boolean;
    disableCountrySelector?: boolean;
    required?: boolean;
    onChange?: (fullNumber: string, isValid: boolean) => void;
    formatHintBuilder?: (example: string) => string | undefined;
    countryAriaLabelBuilder?: (args: {
        callingCode: string;
        countryName: string;
    }) => string | undefined;
    'aria-labelledby'?: string;
    'data-testid'?: string;
};

export declare const Processing: FC;

export declare const ProgressBar: FC<ProgressBarProps>;

declare type ProgressBarProps = {
    progress: number;
    label?: string;
    className?: string;
    labelledById?: string;
};

export declare const RadioButtonComposed: FunctionalComponent<PropsWithoutRef<RadioButtonComposedProps> & {
ref?: Ref<HTMLInputElement> | undefined;
}>;

declare type RadioButtonComposedProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'id' | 'class' | 'type' | 'size'> & {
    id: string;
    label?: string;
    labelHint?: string;
    checked?: boolean;
    defaultChecked?: boolean;
    disabled?: boolean;
    required?: boolean;
    name?: string;
    value?: string;
    onChange?: (event: TargetedEvent<HTMLInputElement, Event>) => void;
    error?: string;
    helper?: string;
    showErrorIcon?: boolean;
    class?: string;
    'aria-label'?: string;
    'aria-labelledby'?: string;
    'aria-describedby'?: string;
    'aria-invalid'?: boolean;
};

export declare const RadioGroupComposed: FunctionalComponent<PropsWithoutRef<RadioGroupComposedProps> & {
ref?: Ref<HTMLDivElement> | undefined;
}>;

declare type RadioGroupComposedProps = {
    id: string;
    label: string;
    labelHint?: string;
    options: RadioGroupOption[];
    value?: string;
    defaultValue?: string;
    error?: string;
    helper?: string;
    required?: boolean;
    disabled?: boolean;
    name?: string;
    orientation?: 'row' | 'column';
    onChange?: (value: string, event: TargetedEvent<HTMLInputElement, Event>) => void;
    onBlur?: (event: FocusEvent) => void;
    class?: string;
    'data-testid'?: string;
};

declare type RadioGroupOption = {
    value: string;
    label: string;
    disabled?: boolean;
};

export declare const SearchIcon: FC<SearchIconProps>;

declare type SearchIconProps = {
    size?: number | string;
};

/**
 * ⚠️ Experimental — do not use in forms.
 *
 * Use `DateInputComposed` instead. See the file-level note at the top of this
 * module for context.
 *
 * @experimental
 */
export declare const SegmentedDateInput: FunctionalComponent<PropsWithoutRef<SegmentedDateInputProps> & {
ref?: Ref<HTMLInputElement> | undefined;
}>;

export declare type SegmentedDateInputProps = Omit<InputComposedProps, 'type' | 'closeButton' | 'rightIcon'> & {
    value: string;
    onInput: (e: Event) => void;
};

export declare const SelfieCapture: FC<CaptureProps>;

export declare const SelfieTutorial: ({ manager, ageAssurance }: TutorialProps) => JSX.Element;

/**
 * Sets global UI configuration defaults for `@incodetech/ui`.
 */
export declare function setUiConfig(next: UiConfig): void;

export declare const Spacer: ({ size, className, direction, }: SpacerProps) => JSX.Element;

declare type SpacerProps = {
    size?: number | string;
    direction?: 'horizontal' | 'vertical';
    className?: string;
};

export declare const Spinner: FC<SpinnerProps>;

declare type SpinnerProps = {
    /** Title text to display below the spinner */
    title?: string;
    /** Subtitle text to display below the title */
    subtitle?: string;
    /** Size of the spinner icon */
    size?: SpinnerSize;
    /** Whether to fill the SDK container */
    fullScreen?: boolean;
    /** Additional CSS class name */
    className?: string;
};

export declare type SpinnerSize = 'small' | 'medium' | 'large';

export declare const SuccessIcon: FC<SuccessIconProps>;

declare type SuccessIconProps = {
    size?: number | string;
};

export declare const TextArea: FunctionalComponent<PropsWithoutRef<TextAreaProps> & {
ref?: Ref<HTMLTextAreaElement> | undefined;
}>;

export declare const TextAreaComposed: FunctionalComponent<PropsWithoutRef<TextAreaComposedProps> & {
ref?: Ref<HTMLTextAreaElement> | undefined;
}>;

declare type TextAreaComposedProps = Omit<JSX.IntrinsicElements['textarea'], 'id' | 'class'> & {
    id: string;
    label?: string;
    labelHint?: string;
    error?: string;
    helper?: string;
    showErrorIcon?: boolean;
    showHelperIcon?: boolean;
    rows?: number;
    class?: string;
};

declare type TextAreaProps = Omit<JSX.IntrinsicElements['textarea'], 'class'> & {
    class?: string;
};

export declare const Title: FunctionalComponent<PropsWithoutRef<TitleProps> & {
ref?: Ref<HTMLHeadingElement> | undefined;
}>;

declare type TitleProps = HTMLAttributes_2<HTMLHeadingElement> & {
    children: ComponentChildren;
    className?: string;
};

declare type TutorialProps = {
    manager: SelfieManager;
    ageAssurance?: boolean;
};

/**
 * ID capture tutorial (front, back, or passport).
 * Translation keys used: idv2.capture.passport.*, idv2.tutorial.*, idv2.tutorial.v2.*,
 * and for back-only / US Smart ID: idv2.backTutorial.title, idv2.backTutorial.subtitle, idv2.backTutorial.disclaimer.
 */
declare type TutorialProps_2 = {
    manager: IdCaptureManager;
    state: Extract<IdCaptureState, {
        status: 'tutorial';
    }>;
};

export declare const TypographyH1: FunctionalComponent<PropsWithoutRef<TitleProps> & {
ref?: Ref<HTMLHeadingElement> | undefined;
}>;

export declare const TypographyH3: FC<TitleProps>;

export declare const TypographyH4: FC<TitleProps>;

export declare const TypographyH5: FC<TitleProps>;

export declare const TypographyP: FC<TitleProps>;

export declare type UiConfig = {
    logoSrc?: string;
    logoHeight?: string;
    subtitle?: string;
    hideHeader?: boolean;
    hideFooterBranding?: boolean;
};

/**
 * Hook for subscribing to manager state updates
 * @param factory - Factory function that creates the manager instance
 * @param options - Configuration options
 * @returns Tuple of [state, manager]
 */
export declare function useManager<TManager extends {
    getState: () => TState;
    subscribe: (listener: (state: TState) => void) => () => void;
    load?: () => void;
    stop?: () => void;
}, TState = InferState<TManager>>(factory: () => TManager, options?: UseManagerOptions): [TState, TManager];

declare type UseManagerOptions = {
    autoLoad?: boolean;
    manageLifecycle?: boolean;
};

/**
 * Hook that returns whether the device is in landscape mode on mobile (excluding iPad and desktop).
 * Use this to show a landscape blocker overlay when true.
 */
export declare function useScreenOrientation(): {
    isLandscapeMobile: boolean;
};

export declare function useTranslation(): UseTranslationReturn;

declare type UseTranslationReturn = {
    t: TFunction;
    ready: boolean;
    i18n: i18n;
};

export declare function VerificationOptionCard({ icon: Icon, title, testId, onClick, tag, }: Readonly<VerificationOptionCardProps>): JSX.Element;

export declare function VerificationOptionCardList({ children, }: Readonly<VerificationOptionCardListProps>): JSX.Element;

declare type VerificationOptionCardListProps = {
    children: ComponentChildren;
};

declare type VerificationOptionCardProps = {
    icon: FC<{
        className?: string;
    }>;
    title: string;
    testId: string;
    onClick: () => void;
    tag?: string;
};

export declare const VerificationResult: FC<VerificationResultProps>;

declare type VerificationResultProps = {
    status: 'submitting' | 'success' | 'failure' | 'warning';
    submittingTitle?: string;
    submittingSubtitle?: string;
    successTitle?: string;
    failureTitle?: string;
    warningTitle?: string;
    errorMessage?: string;
    onRetry?: () => void;
    onSkip?: () => void;
    retryLabel?: string;
    skipLabel?: string;
    hideFooterBranding?: boolean;
    footerBrandingSlot?: ComponentChildren;
};

export declare const WarningIcon: FC<WarningIconProps>;

declare type WarningIconProps = {
    size?: number | string;
};

export { }
