import { type ReactNode, type MouseEvent, type KeyboardEvent } from 'react';
import { TooltipCommonProps } from '../common';
export type ThumbnailSize = 'tiny' | 'small' | 'medium';
export type ThumbnailContentAlignment = 'top' | 'center';
export type ThumbnailTextPosition = 'inside' | 'outside';
export type ThumbnailSkin = 'primary' | 'secondary';
export interface ThumbnailProps {
    /** Applies a data-hook HTML attribute that can be used in the tests. */
    dataHook?: string;
    /** Specifies a CSS class name to be appended to the component's root element.
     * @internal
     */
    className?: string;
    /** Sets the aria-label attribute for accessibility. */
    ariaLabel?: string;
    /** Adds a border and corner radius
     * @default true
     */
    border?: boolean;
    /** Renders specified children items inside of the thumbnail. Accepts any kind of content. When passed, title will be rendered below a thumbnail. */
    children?: ReactNode;
    /** Sets the title of a thumbnail. */
    title?: ReactNode;
    /** Sets thumbnail description. */
    description?: ReactNode;
    /** Specifies an image to be displayed inside of a thumbnail.
     * If given as string, it will be used within `<img/>`.
     * Otherwise can be given as React.Node
     */
    image?: ReactNode;
    /** Controls the size of a thumbnail.
     * @default medium
     */
    size?: ThumbnailSize;
    /** Specifies whether a thumbnail is selected.
     * @default false
     */
    selected?: boolean;
    /** Specifies whether thumbnail interactions are disabled.
     * @default false
     */
    disabled?: boolean;
    /** Hides a checkmark icon that indicates selected thumbnail. Selected option will be highlighted with border only. */
    hideSelectedIcon?: boolean;
    /** Render image as a background of a thumbnail. As a result, title is rendered below the image thumbnail. */
    backgroundImage?: string | ReactNode;
    /** Defines a callback function which is called every time a thumbnail is clicked. */
    onClick?: (event: MouseEvent<HTMLElement> | KeyboardEvent<HTMLElement>) => void;
    /** Defines a callback function which is called every time mouse is over a thumbnail. */
    onMouseOver?: (event: MouseEvent<HTMLElement>) => void;
    /** Controls the width of a thumbnail. */
    width?: string | number;
    /** Controls the height of a thumbnail. */
    height?: string | number;
    /** Controls vertical alignment of content.
     * @default center
     */
    contentAlignment?: ThumbnailContentAlignment;
    /** Enables ellipsis text truncation.
     * @default false
     */
    ellipsis?: boolean;
    /** Controls maximum lines that is allowed before ellipsis text truncation is applied */
    maxLines?: number;
    /** Controls text position whether it is outside or inside of a thumbnail
     * @default inside
     */
    textPosition?: ThumbnailTextPosition;
    /** Turns off padding for thumbnail with textPosition='inside'
     * @default false
     */
    noPadding?: boolean;
    /** Allows to pass tooltip common props.
     * @linkTypeTo components-overlays--tooltip
     * @setTypeName TooltipCommonProps
     */
    tooltipProps?: TooltipCommonProps;
    /** Controls the skin (visual style) of a thumbnail.
     * @default primary
     */
    skin?: ThumbnailSkin;
}
//# sourceMappingURL=Thumbnail.types.d.ts.map