import { IconButtonProps } from '../../Button/Iconbutton';
import React, { ReactNode } from 'react';
import { ToggleButtonProps } from '../../Toggles/ToggleButton';
import { DropdownButtonProps } from '../../Dropdown/DropdownButtonTypes';
import { TagVariants } from '../../Tag';
import { LinearProgressProps } from '../../LinearProgress/LinearProgress';
import { Testable } from '../../types';
export type HorizontalCardIconButton = Pick<IconButtonProps, 'action' | 'disabled' | 'tooltip'> & {
    componentType: 'icon';
    icon: React.ReactNode;
};
export type HorizontalCardToggleButton = Pick<ToggleButtonProps, 'active' | 'onChange' | 'disabled' | 'defaultState' | 'activeState'> & {
    componentType: 'toggle';
};
export interface CustomContentProps extends Testable {
    content: ReactNode;
}
export type HorizontalCardCustomContent = CustomContentProps & {
    componentType: 'custom';
};
export type HorizontalCardDropdownButton = Pick<DropdownButtonProps, 'items' | 'onClick' | 'disabled' | 'itemsType' | 'action' | 'actionIcon' | 'actionLabel' | 'actionLoading' | 'actionVariant' | 'multiSelect' | 'scrollable' | 'pinTopItem' | 'maxHeight'> & {
    componentType: 'dropdown';
    icon: React.ReactNode;
};
export interface HorizontalCardTag {
    label: string;
    icon?: React.ReactNode;
    variant?: TagVariants;
}
export type HorizontalCardLinearProgression = Pick<LinearProgressProps, 'max' | 'value'>;
export interface HorizontalCardProps extends Testable, Omit<React.HTMLAttributes<HTMLDivElement>, 'title' | 'description' | 'tabIndex' | 'onClick' | 'onKeyDown' | 'onMouseDown'> {
    /** 'Outline' or 'Elevated' style of container. */
    variant?: 'outline' | 'elevated';
    /** Action that will be triggered when user clicks on card. */
    action?: () => void;
    /** If disabled user will not be able to click on the card, also card will be greyed out. */
    disabled?: boolean;
    /** Title of the card */
    title: string | React.ReactNode;
    /** Description of the card */
    description?: string | React.ReactNode;
    /** Icon to be shown on the left side of the card. */
    icon?: React.ReactElement<any>;
    /** Properties of the image shown on the left side of the card. */
    image?: {
        src: string;
        fallbackSrc?: string;
        alt: string;
        height?: string;
        width?: string;
        loader?: boolean;
    };
    /** Array of tags to be shown under the description. */
    tags?: HorizontalCardTag[];
    /** Progress bar to be shown under the tags. */
    progress?: HorizontalCardLinearProgression;
    /** Array of actions to be shown on the right side of the card. Can use IconButtons, DropdownButtons, CustomContent and Toggles */
    actions?: (HorizontalCardIconButton | HorizontalCardToggleButton | HorizontalCardDropdownButton | HorizontalCardCustomContent)[];
}