Card

Exports

Import these components from @mbsw/ui.

Card
CardContent
CardDescription
CardFooter
CardHeader
CardLabel
CardTitle

Props

The tables list common props for each component. See the full types for supported prop combinations and inherited HTML and Radix props.

See the full types for this component's shared props.

Type reference

Show full types

Full TypeScript definitions, including prop combinations and inherited props.

import { type HTMLAttributes } from 'react';

type DataAttributes = {
    [key: `data-${string}`]: boolean | number | string | undefined;
};

type DivProps = HTMLAttributes<HTMLDivElement> & DataAttributes;

type ParagraphProps = HTMLAttributes<HTMLParagraphElement> & DataAttributes;

export type CardProps = DivProps;

export type CardHeaderProps = DivProps;

export type CardLogoProps = DivProps;

export type CardLabelProps = DivProps;

export type CardTitleProps = DivProps;

export type CardDescriptionProps = ParagraphProps;

export type CardContentProps = DivProps;

export type CardFooterProps = DivProps;

export declare const Card: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & DataAttributes & import("react").RefAttributes<HTMLDivElement>>;

export declare const CardHeader: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & DataAttributes & import("react").RefAttributes<HTMLDivElement>>;

export declare const CardLogo: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & DataAttributes & import("react").RefAttributes<HTMLDivElement>>;

export declare const CardLabel: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & DataAttributes & import("react").RefAttributes<HTMLDivElement>>;

export declare const CardTitle: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & DataAttributes & import("react").RefAttributes<HTMLDivElement>>;

export declare const CardDescription: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & DataAttributes & import("react").RefAttributes<HTMLParagraphElement>>;

export declare const CardContent: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & DataAttributes & import("react").RefAttributes<HTMLDivElement>>;

export declare const CardFooter: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & DataAttributes & import("react").RefAttributes<HTMLDivElement>>;