@ultraviolet/plus/dist/components/ContentCard/index.d.ts

Ultraviolet Plus

import type { MouseEventHandler, ReactNode } from 'react';
type ContentCardProps = {
    direction?: 'row' | 'column';
    /**
     * The image to display at the top of the card (if direction is column) or to the left of the card (if direction is row).
     * By default, the image will be cropped to fit the card.
     */
    image?: string;
    /**
     * The icon the second element of the card to be displayed after the image. We allow any ReactNode but recommend
     * using `<ProductIcon>` from `@ultraviolet/icons`.
     */
    icon?: ReactNode;
    subtitle?: string;
    title: string;
    headingTag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
    description?: string;
    children?: ReactNode;
    /**
     * The href to link the card to. If not provided, the card will not be clickable.
     */
    href?: HTMLAnchorElement['href'];
    target?: HTMLAnchorElement['target'];
    onClick?: MouseEventHandler<HTMLElement>;
    disabled?: boolean;
    loading?: boolean;
    className?: string;
};
/**
 * ContentCard is a component that displays a title, subtitle, description, image and icon in a card.
 * It can take different directions to display the image and the content. You can also add more content
 * by passing children.
 */
export declare const ContentCard: import("react").ForwardRefExoticComponent<ContentCardProps & import("react").RefAttributes<HTMLAnchorElement & HTMLButtonElement & HTMLDivElement>>;
export {};