@react-md/card/types/CardHeader.d.ts

Create interactable cards from the material design specifications.

import type { HTMLAttributes, ReactNode } from "react";
export interface CardHeaderProps extends HTMLAttributes<HTMLDivElement> {
    /**
     * This is how to align the items within the header component. It's really
     * just a simple pass-through to `align-items`.
     */
    align?: "top" | "center" | "bottom" | "none";
    /**
     * Optional children to render before the main `children` in the component.
     * This is a good place to add `Avatar`s or additional `Media` to display with
     * the card.
     *
     * This using the `TextIconSpacing` component behind the scenes, so some
     * additional margin will be added to separate the content.
     */
    beforeChildren?: ReactNode;
    /**
     * Optional children to render after the main `children` in the component.
     * This is a good place to add expander buttons or overflow menus.
     *
     * This using the `TextIconSpacing` component behind the scenes, so some
     * additional margin will be added to separate the content.
     */
    afterChildren?: ReactNode;
    /**
     * Since it's possible to add content before or after the main children, the
     * main content gets wrapped in a small `<span>` to help stack the `CardTitle`
     * and `CardSubtitle` components while still allowing content to be centered
     * vertically. If you need to add additional styles to this element for some
     * reason, you can use this class name to do so.
     */
    contentClassName?: string;
}
/**
 * The header for a `Card`. There should only be up to 1 `CardHeader` within a
 * card and normally contains the `CardTitle` and optionally `CardSubtitle`
 * components. There is also additional functionality built in to render items
 * before or after the main children with some additional spacing.
 */
export declare const CardHeader: import("react").ForwardRefExoticComponent<CardHeaderProps & import("react").RefAttributes<HTMLDivElement>>;