import { type PropertyValues } from 'lit';
import WebAwesomeElement from '../../internal/webawesome-element.js';
/**
 * @summary Cards group related content and actions inside a bordered container. Use them to present products, articles,
 *  user profiles, or any self-contained unit of information.
 * @documentation https://webawesome.com/docs/components/card
 * @status stable
 * @since 2.0
 *
 * @slot - The card's main content.
 * @slot header - An optional header for the card.
 * @slot footer - An optional footer for the card.
 * @slot media - An optional media section to render at the start of the card.
 * @slot actions - An optional actions section to render at the end for the horizontal card.
 * @slot header-actions - An optional actions section to render in the header of the vertical card.
 * @slot footer-actions - An optional actions section to render in the footer of the vertical card.
 *
 * @csspart media - The container that wraps the card's media.
 * @csspart header - The container that wraps the card's header.
 * @csspart body - The container that wraps the card's main content.
 * @csspart footer - The container that wraps the card's footer.
 * @csspart actions - The container that wraps the card's actions.
 *
 * @cssproperty [--spacing=var(--wa-space-l)] - The amount of space around and between sections of the card. Expects a single value.
 *
 * @ssr - If you use the header, media, or footer slots, set the matching `with-header`, `with-media`, or `with-footer` attribute — otherwise only the card's body will render during SSR. This works around the lack of a `:has-slotted` CSS pseudo-class, which would normally let us style borders based on slotted content.
 */
export default class WaCard extends WebAwesomeElement {
    static css: import("lit").CSSResult[];
    private readonly hasSlotController;
    /** The card's visual appearance. */
    appearance: 'accent' | 'filled' | 'outlined' | 'filled-outlined' | 'plain';
    /**
     * Only required for SSR. Set to `true` if you're slotting in a `header` element so the server-rendered markup
     * includes the header before the component hydrates on the client.
     */
    withHeader: boolean;
    /**
     * Only required for SSR. Set to `true` if you're slotting in a `media` element so the server-rendered markup
     * includes the media before the component hydrates on the client.
     */
    withMedia: boolean;
    /**
     * Only required for SSR. Set to `true` if you're slotting in a `footer` element so the server-rendered markup
     * includes the footer before the component hydrates on the client.
     */
    withFooter: boolean;
    /**
     * Only required for SSR. Set to `true` if you're slotting in a `header-actions` element so the server-rendered markup
     * includes the media before the component hydrates on the client.
     */
    withHeaderActions: boolean;
    /**
     * Only required for SSR. Set to `true` if you're slotting in a `footer-actions` element so the server-rendered markup
     * includes the media before the component hydrates on the client.
     */
    withFooterActions: boolean;
    /** Renders the card's orientation **/
    orientation: 'horizontal' | 'vertical';
    willUpdate(changedProperties: PropertyValues<this>): void;
    render(): import("lit-html").TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'wa-card': WaCard;
    }
}