import { default as React, ReactNode } from 'react';
import { ButtonProps, ButtonStyleType } from '../button/button.types.js';
import { HtmlProps, SlotClassNames, SlotStyles } from '../types/slots.types.js';
import { IconAction } from '../types/actions.types.js';
import { ColorValue } from '../themeProvider/color.types.js';
import { ImageProps } from '../image/image.types.js';
/**
 * The card's surface. `Outlined` and `Light` mean what they do on Button, Badge and Chip; `Elevated`
 * is a card's own. There is no `Filled`: body text on a solid colour reads badly.
 */
export declare enum CardStyleType {
    /** A raised surface with a shadow, always neutral. The default. */
    Elevated = "elevated",
    /** A border in the colour, no fill. */
    Outlined = "outlined",
    /** A flat tint of the colour, no border. */
    Light = "light"
}
export type CardSlots = 'root' | 'content';
export interface CardProps extends Omit<HtmlProps, 'tabIndex'> {
    className?: string | undefined;
    children?: ReactNode;
    styleType?: CardStyleType;
    /**
     * The border of an `Outlined` card and the tint of a `Light` one: a `ThemeColor` (default
     * `Neutral`) or any CSS colour. An `Elevated` card stays neutral.
     */
    color?: ColorValue;
    onClick?: () => void;
    tabIndex?: number | null;
    hoverEffect?: boolean;
    style?: React.CSSProperties;
    autoGap?: boolean;
    clip?: boolean;
    /** Ref to the root element. */
    ref?: React.Ref<HTMLDivElement>;
    /** Classes for the inner elements. See `CardSlots`. */
    classNames?: SlotClassNames<CardSlots>;
    /** Inline styles for the inner elements. See `CardSlots`. */
    styles?: SlotStyles<CardSlots>;
}
export type CardHeaderAction = IconAction;
export interface CardHeaderProps {
    className?: string;
    title?: ReactNode;
    subTitle?: ReactNode;
    /** URL string → rendered as background-image. Any other ReactNode → rendered inside the thumbnail div. */
    thumbnail?: string | ReactNode;
    actions?: CardHeaderAction[] | ReactNode;
}
/** An `Image`, bled to the card's edges: a skeleton while it loads, a fallback if it fails. */
export interface CardMediaProps extends Omit<ImageProps, 'src' | 'alt'> {
    src?: string;
    alt?: string;
}
export interface CardContentProps {
    children?: ReactNode;
}
export interface CardAction {
    id?: string;
    label?: string;
    styleType?: ButtonStyleType;
    color?: ButtonProps['color'];
    onClick?: () => void;
}
export interface CardActionsProps {
    className?: string;
    /** Renders a Button for each action object. Pass `children` for custom content instead. */
    actions?: CardAction[];
    children?: ReactNode;
}