import type { ElevationStep, SurfaceRole } from "@charcuterie/tokens";
import type { ComponentPropsWithRef, ReactNode } from "react";
import type { CardAccentEdge } from "./cardAccentEdge.ts";
export type CardSurface = Extract<SurfaceRole, "base" | "raised" | "sunken">;
export type CardPadding = "lg" | "md" | "none" | "sm";
export type CardProps = ComponentPropsWithRef<"section"> & {
    /**
     * A coloured bar down the leading edge, following the card's own
     * corners.
     *
     * `{ categorical: 3 }` for a colour a user picked; `{ color }`
     * for one an app computed — a hue hashed from a repo's name, say,
     * where ten indices are not enough. See `cardAccentEdge.ts` for
     * why it is a pseudo-element and not a border.
     */
    accentEdge?: CardAccentEdge;
    /** Buttons or a badge, laid out beside the heading. */
    actions?: ReactNode;
    elevation?: ElevationStep;
    footer?: ReactNode;
    heading?: string;
    headingLevel?: 2 | 3 | 4;
    padding?: CardPadding;
    surface?: CardSurface;
};
/**
 * Exported only so the story can derive its `elevation` control from
 * the same map the component indexes — `ElevationStep` comes from
 * `@charcuterie/tokens`, which react-docgen will not follow, so the
 * options have to be stated and this is the one statement of them
 * that cannot drift.
 */
export declare const ELEVATION_CLASS: Record<ElevationStep, string>;
/**
 * Five repos, and the reason this is a P0 rather than a nicety is
 * the `<section>`: give a card a heading and it becomes a landmark,
 * so `getByRole("region", { name: "Bay 3" })` scopes every
 * subsequent query to that card. Without it, an agent driving a
 * 16-bay tower has sixteen identical "Start" buttons and no way to
 * say which one it means.
 *
 * `aria-labelledby` rather than `aria-label`, because the heading is
 * on screen already and stating the name twice is how the two drift
 * apart. A card with **no** `heading` keeps the `aria-labelledby`
 * the call site passed, for the app that draws its own title row
 * inside the card — the name still points at text on screen, which
 * is the same rule one level out.
 *
 * **Density is not a prop here.** mux-magic's inventory turned up a
 * `CardDensityProvider` in the withdrawn bambuddy evidence, and it
 * is the wrong shape for this fleet: density is a global axis on
 * `<html>`, so a compact bay list is `data-density="compact"` on the
 * page, not a context around the cards. `padding` remains a prop
 * because a card wrapping a poster grid genuinely has none, which is
 * a layout fact rather than a density one.
 */
export declare const Card: ({ "aria-labelledby": ariaLabelledBy, accentEdge, actions, children, className, elevation, footer, heading, headingLevel, padding, style, surface, ...sectionProps }: CardProps) => ReactNode;
//# sourceMappingURL=Card.d.ts.map