import React from 'react';
import { StyleProp, ViewStyle, TextStyle } from 'react-native';
export type Ux4gJourneyStepState = 'completed' | 'current' | 'upcoming';
export type Ux4gJourneyOrientation = 'vertical' | 'horizontal';
export type Ux4gJourneyBadgePosition = 'bottom' | 'topRight';
export interface Ux4gJourneyStepStatus {
    /** Status text (e.g. "2 days remaining") */
    text: string;
    /** Color of the status dot */
    dotColor?: string;
    /** Optional badge/tag text (e.g. "Pending") */
    badgeText?: string;
    /** Badge background color */
    badgeColor?: string;
    /** Badge text color */
    badgeTextColor?: string;
    /** Position of the badge in the card (default: 'bottom') */
    badgePosition?: Ux4gJourneyBadgePosition;
}
export interface Ux4gJourneyStep {
    /** State of this step (completed, current, upcoming) */
    state?: Ux4gJourneyStepState;
    /** Date text shown at the top-left of the card */
    date?: string;
    /** Tag text shown at the top-right of the card */
    tag?: string;
    /** Title text */
    title: string;
    /** Optional helping/description text below the title */
    helpingText?: string;
    /** Optional icon below the title (e.g. link icon) */
    icon?: React.ReactNode;
    /** Optional icon color */
    iconColor?: string;
    /** Optional status indicator with dot + badge */
    status?: Ux4gJourneyStepStatus;
    /** Optional custom content widget below the title area */
    customContent?: React.ReactNode;
    /** Optional step number to show inside the indicator circle */
    stepNumber?: string;
    /** Optional background color override for this specific step card */
    cardColor?: string;
    /** Optional border color override for this specific step card */
    cardBorderColor?: string;
    /** Optional date text color override */
    dateColor?: string;
    /** Optional title text color override */
    titleColor?: string;
    /** Optional date text style override */
    dateStyle?: StyleProp<TextStyle>;
    /** Optional title text style override */
    titleStyle?: StyleProp<TextStyle>;
}
export interface Ux4gJourneyHeader {
    /** Title text */
    title: string;
    /** Description text below the title */
    description?: string;
    /** Optional trailing icon */
    icon?: React.ReactNode;
    /** Callback when trailing icon is tapped */
    onIconPressed?: () => void;
}
export interface Ux4gJourneyTimelineProps {
    /** List of journey steps */
    steps: Ux4gJourneyStep[];
    /** Optional header above the timeline */
    header?: Ux4gJourneyHeader;
    /** Current step index (0-based). Set to null to use each step's state */
    currentStep?: number | null;
    /** Timeline orientation (default: 'vertical') */
    orientation?: Ux4gJourneyOrientation;
    /** Size of the step indicator circle (default: 20) */
    indicatorSize?: number;
    /** Width of the connecting line (default: 3) */
    lineWidth?: number;
    /** Spacing between the indicator and the card (default: 12) */
    indicatorCardSpacing?: number;
    /** Vertical spacing between step cards (default: 12) */
    stepSpacing?: number;
    /** Color for completed/current indicators and lines */
    activeColor?: string;
    /** Color for upcoming indicators and lines */
    inactiveColor?: string;
    /** Card border radius (default: 8) */
    cardBorderRadius?: number;
    /** Card padding */
    cardPadding?: StyleProp<ViewStyle>;
    /** Card background color */
    cardColor?: string;
    /** Card border color */
    cardBorderColor?: string;
    /** Optional default date text style override for all steps */
    dateStyle?: StyleProp<TextStyle>;
    /** Optional default title text style override for all steps */
    titleStyle?: StyleProp<TextStyle>;
    /** Custom container style */
    style?: StyleProp<ViewStyle>;
}
export declare const Ux4gJourneyTimeline: React.FC<Ux4gJourneyTimelineProps>;
export default Ux4gJourneyTimeline;
//# sourceMappingURL=JourneyTimeline.d.ts.map