import { type ReactNode } from "react";
export interface ErrorDetail {
    label: string;
    value: string;
    /** Render mono with a Copy button (references, IDs). */
    copyable?: boolean | undefined;
}
export interface ErrorMessageProps {
    /** What happened, in product words: "Couldn't load this connection's tools." */
    title: ReactNode;
    /** What to do next, when it isn't just "Try again". */
    children?: ReactNode | undefined;
    /** Usually a small "Try again" button; for inline, a link-style button. */
    action?: ReactNode | undefined;
    /** The request reference. Goes into Technical details with Copy. */
    reference?: string | undefined;
    /** Other system facts for Technical details: status code, endpoint. */
    details?: ErrorDetail[] | undefined;
    /** Start with Technical details open. */
    defaultDetailsOpen?: boolean | undefined;
    variant?: "inline" | "block" | undefined;
    /** "center" for a failed list or page area, "start" inside a section. */
    align?: "start" | "center" | undefined;
    /**
     * Announce it to screen readers as it appears. Use for errors caused by
     * something the person just did; leave off for errors present on load.
     */
    announce?: boolean | undefined;
    className?: string | undefined;
}
export declare function ErrorMessage({ title, children, action, reference, details, defaultDetailsOpen, variant, align, announce, className, }: ErrorMessageProps): import("react").JSX.Element;
/** The one collapsed "Technical details" line, with Copy on references. */
export declare function TechnicalDetails({ facts, align, defaultOpen, }: {
    facts: ErrorDetail[];
    align?: "start" | "center" | undefined;
    defaultOpen?: boolean | undefined;
}): import("react").JSX.Element;