/*!
 * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
 * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
 *
 * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *
 * See the License for the specific language governing permissions and limitations under the License.
 */
import { AriaRole, MouseEventHandler, ReactElement, ReactNode } from "react";
import { Button } from "./Buttons/Button.js";
import { MenuButtonProps } from "./Buttons/MenuButton.js";
export declare const cardVariantValues: readonly ["tile", "stack", "compact"];
export declare const CARD_IMAGE_SIZE = "64px";
export declare const CARD_IMAGE_SIZE_COMPACT = "48px";
export type CardProps = {
    /** @experimental: Temporary internal property, do not use. */
    __role?: AriaRole;
    /** Additional content rendered inside the card body, below the description. */
    children?: ReactNode;
    /** Secondary text displayed below the title. */
    description?: string;
    /** Expandable or supplementary panel rendered below the main card content. */
    detailPanel?: ReactNode;
    /** Image element displayed in the card, sized according to the variant. */
    image?: ReactElement;
    /** If `true`, renders skeleton placeholders in place of card content. */
    isLoading?: boolean;
    /** Small label rendered above the title, typically used for categorization. */
    overline?: string;
    /** Primary heading text of the card. */
    title?: string;
    /** HTML id applied to the title element, useful for aria-labelledby references. */
    titleId?: string;
    /**
     * Controls the visual layout of the card.
     * - If `'tile'`, standard card with consistent padding and a visible border.
     * - If `'stack'`, full-bleed layout, stacking an image above the content area.
     * - If `'compact'`, reduced padding for denser layouts.
     * @default "tile"
     */
    variant?: (typeof cardVariantValues)[number];
} & ({
    /**
     * Slot for an accessory element (e.g., an icon or badge) shown alongside the card content.
     */
    accessory?: ReactNode;
    button?: never;
    menuButtonChildren?: never;
    /** Click handler that makes the entire card surface interactive. */
    onClick: MouseEventHandler;
} | {
    /**
     * Slot for an accessory element (e.g., an icon or badge) shown alongside the card content.
     */
    accessory?: ReactNode;
    /** Primary action button rendered in the card footer. */
    button?: ReactElement<typeof Button>;
    /** Items rendered inside the overflow menu button in the card corner. */
    menuButtonChildren?: MenuButtonProps["children"];
    onClick?: never;
});
declare const MemoizedCard: import("react").MemoExoticComponent<({ children, description, detailPanel, image, isLoading, overline, title, titleId, variant, accessory, button, menuButtonChildren, onClick, __role: role, }: CardProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
export { MemoizedCard as Card };
//# sourceMappingURL=Card.d.ts.map