// Generated by dts-bundle-generator v7.2.0

import React from 'react';
import { HTMLAttributes, ReactNode } from 'react';

declare const card: {
	classnames: {
		container: string;
		container__footer: string;
	};
	subComponents: {
		header: {
			sprinkle: ((props: {
				padding?: "base" | "small" | "none" | undefined;
			}) => string) & {
				properties: Set<"padding">;
			};
			properties: {
				padding: {
					base: string;
					small: string;
					none: string;
				};
			};
		};
		body: {
			sprinkle: ((props: {
				padding?: "base" | "small" | "none" | undefined;
			}) => string) & {
				properties: Set<"padding">;
			};
			properties: {
				padding: {
					base: string;
					small: string;
					none: string;
				};
			};
		};
		footer: {
			sprinkle: ((props: {
				padding?: "base" | "small" | "none" | undefined;
			}) => string) & {
				properties: Set<"padding">;
			};
			properties: {
				padding: {
					base: string;
					small: string;
					none: string;
				};
			};
		};
	};
	sprinkle: ((props: {
		backgroundColor?: "primary-surface" | "primary-surfaceHighlight" | "success-surface" | "success-surfaceHighlight" | "warning-surface" | "warning-surfaceHighlight" | "danger-surface" | "danger-surfaceHighlight" | "neutral-background" | "neutral-surface" | "neutral-surfaceHighlight" | undefined;
		padding?: "base" | "small" | "none" | undefined;
	}) => string) & {
		properties: Set<"backgroundColor" | "padding">;
	};
	properties: {
		backgroundColor: {
			"primary-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"primary-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"success-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"success-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"danger-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"danger-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"warning-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"warning-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"neutral-background": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"neutral-surface": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			"neutral-surfaceHighlight": `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
		};
		padding: {
			base: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			small: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
			none: string;
		};
	};
};
export interface CardBodyProperties {
	/**
	 * The content of the card body.
	 * @TJS-type React.ReactNode
	 */
	children: ReactNode;
	/**
	 * The padding properties are used to generate space around an card's body content area.
	 * @default none
	 */
	padding?: keyof typeof card.subComponents.body.properties.padding;
}
export type CardBodyProps = CardBodyProperties & HTMLAttributes<HTMLElement>;
export declare const CardBody: React.FC<CardBodyProps>;
export interface CardFooterProperties {
	/**
	 * The content of the card footer.
	 * @TJS-type React.ReactNode
	 */
	children: ReactNode;
	/**
	 * The padding properties are used to generate space around an card's footer content area.
	 * @default none
	 */
	padding?: keyof typeof card.subComponents.footer.properties.padding;
}
export type CardFooterProps = CardFooterProperties & HTMLAttributes<HTMLElement>;
export declare const CardFooter: React.FC<CardFooterProps>;
export interface CardHeaderProperties {
	/**
	 * The content of the card header.
	 * @TJS-type React.ReactNode
	 */
	children?: ReactNode;
	/**
	 * The title to display in the card header.
	 */
	title?: string;
	/**
	 * The padding properties are used to generate space around an card's header content area.
	 * @default none
	 */
	padding?: keyof typeof card.subComponents.header.properties.padding;
}
export type CardHeaderProps = CardHeaderProperties & HTMLAttributes<HTMLElement>;
export declare const CardHeader: React.FC<CardHeaderProps>;
export interface CardComponents {
	Body: typeof CardBody;
	Footer: typeof CardFooter;
	Header: typeof CardHeader;
}
export interface CardProperties {
	/**
	 * The content of the card.
	 * @TJS-type React.ReactNode
	 */
	children: ReactNode;
	/**
	 * The padding properties are used to generate space around an card's content area.
	 * @default base
	 */
	padding?: keyof typeof card.properties.padding;
	/**
	 * The backgroundColor property sets the background color of the card.
	 * @default neutral-background
	 */
	backgroundColor?: keyof typeof card.properties.backgroundColor;
}
export type CardProps = CardProperties & HTMLAttributes<HTMLElement>;
export declare const Card: React.FC<CardProps> & CardComponents;

export {};