import { Subtype } from '@edgeandnode/common';
import { HTMLAttributes } from 'react';
import { ResponsiveStyleValue } from 'theme-ui';
import { FontSize } from '../../tokens';
type ListSize = Subtype<keyof typeof FontSize, '14px' | '16px' | '18px' | '20px' | '24px'>;
export type ListProps = {
    /** List variant. One of `numbers`, `arrows`, or `bullets`. */
    variant: 'numbers' | 'arrows' | 'bullets';
    /** Font size. One of `14px`, `16px`, `18px`, `20px`, or `24px`. Defaults to `18px`. */
    size?: ResponsiveStyleValue<ListSize>;
} & HTMLAttributes<HTMLOListElement | HTMLUListElement>;
type ListItemProps = Omit<HTMLAttributes<HTMLLIElement>, 'color'>;
/**
 * Vertical list of text items with 3 variants, representing the different types of item markers:
 * - `List.Numbers` (renders a `ol`)
 * - `List.Arrows` (renders a `ul`)
 * - `List.Bullets` (renders a `ul`)
 *
 * Child component: `List.Item`.
 */
export declare const List: import('react').ForwardRefExoticComponent<{
    /** List variant. One of `numbers`, `arrows`, or `bullets`. */
    variant: "numbers" | "arrows" | "bullets";
    /** Font size. One of `14px`, `16px`, `18px`, `20px`, or `24px`. Defaults to `18px`. */
    size?: ResponsiveStyleValue<ListSize>;
} & HTMLAttributes<HTMLOListElement | HTMLUListElement> & import('react').RefAttributes<HTMLOListElement | HTMLUListElement>> & {
    Numbers: import('react').ForwardRefExoticComponent<Omit<ListProps, "variant"> & import('react').RefAttributes<HTMLUListElement>>;
    Arrows: import('react').ForwardRefExoticComponent<Omit<ListProps, "variant"> & import('react').RefAttributes<HTMLOListElement>>;
    Bullets: import('react').ForwardRefExoticComponent<Omit<ListProps, "variant"> & import('react').RefAttributes<HTMLOListElement>>;
    Item: {
        ({ children, ...props }: ListItemProps): import("react").JSX.Element | null;
        displayName: string;
    };
};
export {};
//# sourceMappingURL=List.d.ts.map