import { HTMLAttributes, ReactNode } from 'react';
export type TimelineOrientation = "vertical" | "horizontal";
export type TimelineVariant = "default" | "dotted" | "none";
export interface TimelineItem {
    /** Icon rendered inside the timeline node. */
    icon?: ReactNode;
    /**
     * Content at the leading edge of the node.
     * - **Vertical:** rendered to the left of the connector track.
     * - **Horizontal:** rendered above the node.
     *
     * Typical use: timestamp, badge, short label.
     */
    leading?: ReactNode;
    /** Main event content rendered adjacent to the node (title, description…). */
    content: ReactNode;
}
export interface TimelineProps extends HTMLAttributes<HTMLDivElement> {
    /** Ordered list of timeline events. */
    items: TimelineItem[];
    /**
     * Axis direction of the connector line.
     * - `"vertical"` — events stack top-to-bottom (default).
     * - `"horizontal"` — events flow left-to-right (stepper / progress pattern).
     */
    orientation?: TimelineOrientation;
    /**
     * Visual style of the connector between nodes.
     * - `"default"` — solid thin line.
     * - `"dotted"` — dotted line; useful for future or pending events.
     * - `"none"` — no connector; each node stands alone.
     */
    variant?: TimelineVariant;
}
/**
 * Ordered sequence of events connected by a visual timeline.
 *
 * Supports two orientations — vertical (activity feed, history log) and
 * horizontal (stepper, progress indicator) — and three connector styles.
 *
 * ```tsx
 * <Timeline
 *   items={[
 *     {
 *       leading: <Text variant="caption" color="dim">10:32</Text>,
 *       icon: <Icon icon={Check} />,
 *       content: <Text variant="body">Approved</Text>,
 *     },
 *   ]}
 * />
 *
 * <Timeline orientation="horizontal" variant="dotted" items={steps} />
 * ```
 */
export declare function Timeline({ items, orientation, variant, className, ...props }: TimelineProps): import("react/jsx-runtime").JSX.Element;
