import { TemplateResult } from "lit-element";
import { IRadioBehaviorProperties, RadioBehavior } from "../behavior/radio/radio-behavior";
import { Ripple } from "../ripple/ripple";
/**
 * Properties of the expansion.
 */
export interface IExpansionProperties extends IRadioBehaviorProperties {
    duration: number;
    noRipple: boolean;
    icon?: string;
}
/**
 * Provide an expandable details-summary view.
 * @slot title - Title to the left on the header.
 * @slot description - Description to the left on the header.
 * @slot indicator - Content to the right on the header.
 * @slot - Default content.
 * @cssprop --expansion-transition - Transition
 * @cssprop --expansion-elevation - Box shadow
 * @cssprop --expansion-elevation-open - Box shadow when open
 * @cssprop --expansion-margin-open - Margin when open
 * @cssprop --expansion-bg - Default background
 * @cssprop --expansion-color - Default color
 * @cssprop --expansion-header-bg-hover - Background of the header when :hover
 * @cssprop --expansion-header-description-color - Color of the description slot in the header
 * @cssprop --expansion-header-padding - Padding of the header
 * @cssprop --expansion-header-title-margin - Margin of the title slot in the header
 * @cssprop --expansion-header-height - Height of the header
 * @cssprop --expansion-header-height-open - Height of the header when open
 * @cssprop --expansion-header-transition - Transition of the header
 * @cssprop --expansion-content-padding - Padding of the content
 * @cssprop --expansion-icon-transition - Transition of the icon
 */
export declare class Expansion extends RadioBehavior implements IExpansionProperties {
    static styles: import("lit-element").CSSResult[];
    /**
     * Opens the expansion.
     * @attr - open
     */
    checked: boolean;
    /**
     * Deactivates the ripple.
     * @attr
     */
    noRipple: boolean;
    /**
     * The duration of the animations.
     * @attr
     */
    duration: number;
    /**
     * Aria expanded attribute.
     * @attr - aria-expanded
     */
    ariaChecked: string;
    /**
     * Icon name.
     * @attr
     */
    icon?: string | undefined;
    /**
     * Reference to the header element.
     */
    protected $header: HTMLElement;
    /**
     * Reference to the content element.
     */
    protected $content: HTMLElement;
    /**
     * Reference to the content container element.
     */
    protected $contentContainer: HTMLElement;
    /**
     * Reference to the ripple element.
     */
    protected $ripple: Ripple;
    /**
     * Hooks up the element.
     * @param props
     */
    protected firstUpdated(props: Map<keyof IExpansionProperties, unknown>): void;
    /**
     * Responds to properties that changes and animates the element.
     * @param props
     */
    protected updated(props: Map<keyof IExpansionProperties, any>): void;
    /**
     * Handles the click on the content container by stopping the event from propagating.
     * This ensures that clicks on the body doesn't close the expansion.
     * It is required because we can't delegate focus to the header which would be the optimal soluation.
     * @param e
     */
    protected onContentContainerClick(e: MouseEvent): void;
    /**
     * Toggles the checked property.
     */
    protected toggle(): void;
    /**
     * Animates the content in or out.
     * @param duration
     */
    private animateContent;
    /**
     * Refreshes height of the content container to auto if the expansion is checked and 0px if not.
     */
    private refreshContentContainerHeight;
    /**
     * Returns the template of the element.
     */
    protected render(): TemplateResult;
}
declare global {
    interface HTMLElementTagNameMap {
        "wl-expansion": Expansion;
    }
}