import { ComponentProps, ReactNode } from "react";
import { AccessibilityRole, Pressable } from "react-native";
import { WithTestID } from "../../utils/types";
import { Badge } from "../badge";
import { IOButtonLinkSpecificProps, IconButton } from "../buttons";
import { IOIcons } from "../icons";
import { IOLogoPaymentType } from "../logos";
type ButtonLinkActionProps = {
    type: "buttonLink";
    componentProps: Omit<IOButtonLinkSpecificProps, "variant">;
};
type IconButtonActionProps = {
    type: "iconButton";
    componentProps: ComponentProps<typeof IconButton>;
};
type BadgeProps = {
    type: "badge";
    componentProps: ComponentProps<typeof Badge>;
};
type EndElementProps = ButtonLinkActionProps | IconButtonActionProps | BadgeProps;
type GraphicProps = {
    paymentLogoIcon?: IOLogoPaymentType;
    icon?: never;
} | {
    paymentLogoIcon?: never;
    icon?: IOIcons;
};
type InteractiveProps = Pick<ComponentProps<typeof Pressable>, "onLongPress" | "accessibilityActions" | "onAccessibilityAction">;
export type ListItemInfo = WithTestID<{
    value: string | ReactNode;
    label?: string;
    numberOfLines?: number;
    endElement?: EndElementProps;
    topElement?: BadgeProps;
    accessibilityLabel?: string;
    accessibilityRole?: AccessibilityRole;
    reversed?: boolean;
}> & GraphicProps & InteractiveProps;
/**
 * ListItemInfo component displays information in a list item format with optional icons,
 * labels, values, and end elements (buttons, badges).
 *
 * @remarks
 * **Accessibility for Interactive Elements:**
 * When using interactive end elements (`buttonLink` or `iconButton`), you must provide
 * an appropriate `accessibilityLabel` directly to the interactive component props.
 * This ensures that screen reader users can understand the relationship between the
 * list item content and the action that the interactive element triggers.
 *
 * Example:
 * ```tsx
 * <ListItemInfo
 *   label="Email"
 *   value="user@example.com"
 *   endElement={{
 *     type: "buttonLink",
 *     componentProps: {
 *       label: "Edit",
 *       accessibilityLabel: "Edit email address"
 *     }
 *   }}
 * />
 * ```
 *
 * The design system cannot enforce this pattern automatically, so it's the responsibility
 * of the implementing software engineer to ensure proper accessibility labels are set.
 */
export declare const ListItemInfo: ({ value, label, numberOfLines, reversed, icon, paymentLogoIcon, endElement, topElement, accessibilityLabel, accessibilityRole, accessibilityActions, onAccessibilityAction, onLongPress, testID }: ListItemInfo) => import("react/jsx-runtime").JSX.Element;
export {};
//# sourceMappingURL=ListItemInfo.d.ts.map