import { Color } from '../../../colors';
import { IconProps } from '../../Primitives/Icon';
import { LinkProps } from '../../Primitives/Link';
import { TooltipProps } from '../../Primitives/Tooltip';
type CardProps = React.PropsWithChildren<{
    /**
     * Props for the avatar wrapper
     */
    avatarProps: {
        backgroundColor: Color;
    };
    /**
     * Array of footer items to be rendered at the bottom of the card
     */
    footer?: {
        /**
         * Icon to display next to the label
         */
        icon?: IconProps['name'] | IconProps;
        /**
         * Text to display in the footer item
         */
        label?: string | {
            content: string;
            style?: React.CSSProperties;
        };
        /**
         * Tooltip text to show on hover
         */
        tooltip?: string | Omit<TooltipProps, 'children'>;
        /**
         * URL to navigate to when footer item is clicked
         */
        url?: LinkProps['to'] | Omit<LinkProps, 'style'>;
    }[];
    /**
     * Props for the header
     */
    headerProps?: {
        backgroundColor?: Color;
        borderBottomColor?: Color;
    };
    /**
     * Icon to display in the card
     */
    icon?: IconProps['name'] | IconProps;
    /**
     * Unique identifier for the card
     */
    id?: string;
    /**
     * Indicator to display in the card
     */
    indicator?: React.ReactNode;
    /**
     * Subtitle to display in the card
     */
    subtitle?: string;
    /**
     * Title to display in the card
     */
    title: string;
    /**
     * Props for the title
     */
    titleProps?: Pick<React.HTMLProps<HTMLSpanElement>, 'style'>;
    /**
     * URL to navigate to when card is clicked
     */
    url?: LinkProps['to'] | Omit<LinkProps, 'style'>;
}>;
/**
 * A flexible and customizable card component for displaying content
 * with a consistent, structured layout.
 *
 * @example
 * // Basic usage
 * <Card
 *   title="Environment"
 *   subtitle="Overview of current environments"
 *   avatarProps={{ backgroundColor: 'blue.500' }}
 *   icon="cubes"
 * />
 *
 * @example
 * // Card with footer and navigation
 * <Card
 *   title="Teams"
 *   url="/teams"
 *   footer={[
 *     {
 *       label: 'View All',
 *       url: '/teams'
 *     }
 *   ]}
 * />
 */
declare const Card: ({ children, ...props }: CardProps) => import("react/jsx-runtime").JSX.Element;
export type { CardProps };
export { Card };