import type { CardProps, CardHeaderProps, CardTitleProps, CardDescriptionProps, CardActionProps, CardContentProps, CardFooterProps } from './Card.types';
/**
* Componente Card del sistema de diseño Siesa
*
* Contenedor versátil tipo tarjeta compuesto por 7 sub-componentes:
* `Card`, `CardHeader`, `CardTitle`, `CardDescription`, `CardAction`,
* `CardContent` y `CardFooter`.
*
* **Estructura típica:**
* ```
* Card
* ├── CardHeader
* │ ├── CardTitle
* │ ├── CardDescription
* │ └── CardAction (opcional)
* ├── CardContent
* └── CardFooter (opcional)
* ```
*
* **Tokens de color Siesa utilizados:**
* - Fondo: `bg-bg-primary` / `dark:bg-dark-bg-secondary`
* - Texto: `text-content-primary` / `dark:text-dark-content-primary`
* - Texto secundario: `text-content-secondary` / `dark:text-dark-content-secondary`
* - Borde: `border-border-primary` / `dark:border-dark-border-primary`
*
* **Dark Mode:**
* Soporte completo mediante las clases `dark:` del sistema de diseño Siesa.
* Activar añadiendo la clase `dark` al elemento ``.
*
* @example
* ```tsx
* // Tarjeta básica
*
*
* Título de la tarjeta
* Descripción opcional del contenido
*
*
*
Contenido principal de la tarjeta.
*
*
*
*
*
*
* // Tarjeta con acción en el header
*
*
* Resumen
*
* } ariaLabel="Editar" />
*
*
* Contenido
*
* ```
*/
export declare function Card({ className, ...props }: CardProps): import("react/jsx-runtime").JSX.Element;
/**
* Cabecera de la tarjeta con grid layout.
*
* Cuando contiene un `CardAction`, el grid cambia automáticamente a 2 columnas
* para posicionar la acción en la esquina superior derecha.
* Soporta container queries (`@container/card-header`).
*/
export declare function CardHeader({ className, ...props }: CardHeaderProps): import("react/jsx-runtime").JSX.Element;
/**
* Título principal de la tarjeta.
*
* Usa tipografía semibold con `leading-none` para alineación precisa.
*/
export declare function CardTitle({ className, ...props }: CardTitleProps): import("react/jsx-runtime").JSX.Element;
/**
* Descripción secundaria de la tarjeta.
*
* Renderizada con color de texto secundario del sistema de diseño Siesa.
*/
export declare function CardDescription({ className, ...props }: CardDescriptionProps): import("react/jsx-runtime").JSX.Element;
/**
* Acción posicionada en la esquina superior derecha del `CardHeader`.
*
* Debe ser hijo directo de `CardHeader` para que el posicionamiento grid funcione.
* Se ubica en la primera fila junto al título.
*/
export declare function CardAction({ className, ...props }: CardActionProps): import("react/jsx-runtime").JSX.Element;
/**
* Área de contenido principal de la tarjeta.
*
* Aplica padding horizontal estándar de 24px (px-6) consistente con el header.
*/
export declare function CardContent({ className, ...props }: CardContentProps): import("react/jsx-runtime").JSX.Element;
/**
* Pie de la tarjeta con layout flex horizontal.
*
* Cuando tiene borde superior (`border-t`), aplica padding vertical automático (pt-6).
* Ideal para agrupar acciones o información de estado.
*/
export declare function CardFooter({ className, ...props }: CardFooterProps): import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=Card.d.ts.map