/**
 * RouteDiagram — a 2D SVG diagram of a staged journey: an ordered set of nodes
 * (points) joined by labelled legs (segments), each node and leg carrying a
 * generic progress status (`complete` / `current` / `upcoming`). It generalises
 * the "where is this in its route" markup — stage trackers, multi-leg route
 * maps, hop-by-hop progress — into one shared primitive. Callers map their own
 * domain state onto the three generic positions; the component knows no routes,
 * modes, or labels of its own.
 *
 * Rendering:
 *   - the visual is a single `<svg>` (marks + labels drawn as SVG geometry and
 *     `<text>`), marked `aria-hidden` — it is decorative-with-semantics.
 *   - the accessible + printable representation is a real ordered `<ol>` of legs
 *     ("Origin to Hub via Segment 1 — Complete"), visually hidden on screen and
 *     revealed in print. Screen readers and print get the route without the SVG.
 *
 * Status is never colour-only: node markers differ in shape (checked disc /
 * ringed target / hollow outline) and every node shows a text status caption,
 * while the legs summary spells each leg's status out in words.
 *
 * Responsive: the root is a `@container` scope. A vertical diagram is narrow-
 * friendly as-is; a horizontal diagram renders the horizontal SVG at `@md` and
 * up and swaps to a stacked vertical SVG below `@md`, where a row would overflow
 * (the horizontal SVG additionally scrolls in `overflow-x-auto` when very wide).
 *
 * Motion: legs draw in on mount via a CSS `stroke-dashoffset` transition. Under
 * `prefers-reduced-motion` (or `animate={false}`) the final drawn state renders
 * immediately with no transition — no motion library, no hidden intermediate.
 */
import { type ReactNode } from "react";
import { type RouteStatus } from "./variants.js";
export * from "./variants.js";
export type RouteNode = {
    id: string;
    label: ReactNode;
    sublabel?: ReactNode;
    status?: RouteStatus;
};
export type RouteLeg = {
    id: string;
    /** Node id this leg departs. */
    from: string;
    /** Node id this leg arrives. */
    to: string;
    /** Optional descriptor for the leg (e.g. a mode or a duration). */
    label?: ReactNode;
    status?: RouteStatus;
};
export type RouteDiagramProps = {
    nodes: readonly RouteNode[];
    legs: readonly RouteLeg[];
    orientation?: "horizontal" | "vertical";
    /** Draw legs in on mount. Defaults to `true`; ignored under reduced motion. */
    animate?: boolean;
    /** Accessible name for the legs summary list. */
    ariaLabel?: string;
    /** English by default; override to localize the status words. */
    statusLabels?: Partial<Record<RouteStatus, string>>;
};
export declare function RouteDiagram({ nodes, legs, orientation, animate, ariaLabel, statusLabels, }: RouteDiagramProps): import("react").JSX.Element;
//# sourceMappingURL=index.d.ts.map