import { ComponentInterface, EventEmitter } from '../../stencil-public-runtime';
import type { Color } from '../../types/shared';
/**
 * Alerts are used to display important messages either inline, as toast notifications or as modals requiring action.
 * @status stable
 * @version 2.0.0
 *
 * @slot - The alert's body content.
 * @slot heading - a themed piece of text, normally used to quick flag to the user the type of alert (e.g. 'Error', 'Warning', 'Success')
 * @slot title - A title for the alert.
 * @slot icon - An icon to show in the alert.
 * @slot footer - Place items at the bottom of the alert. Best used with `button` elements - esp when used as with the `alert()` method.
 *
 * @part panel - the root, wrapper element
 * @part main - wrapper around the main content
 * @part icon - wrapper around the icon slot
 * @part content - wrapper around all text content
 * @part close - wrapper around the close button
 * @part footer - wrapper around the footer slot
 * @part overlay - present when the `alert()` method is called. The backdrop behind the modal.
 */
export declare class Alert implements ComponentInterface {
    private panel;
    private overlay;
    private modal;
    private originalTrigger;
    private goingToHide;
    private goingToShow;
    private autoHideTimeout;
    private remainingTimeInterval;
    private countdownAnimation?;
    private countdownElement;
    private slotCtrl;
    isModal: boolean;
    isToast: boolean;
    isShowing: boolean;
    label: string;
    noDismiss: boolean;
    host: HTMLNanoAlertElement;
    /** Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods. */
    open: boolean;
    handleOpenChange(): void;
    /** Set to true to make the alert closable. */
    closable: boolean;
    /**
     * The color to use from the application's color palette.
     * @deprecated Use `theme` instead.
     */
    color?: Color;
    /** The color to use from the application's color palette.  */
    theme?: Color;
    /**
     * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the
     * alert before it closes (e.g. moves the mouse over it), the timer will restart.
     */
    duration: number;
    remainingTime: number;
    handleDurationChange(): void;
    /**
     * Relocate the dialog to the root of the DOM.
     * Most useful in conjunction with `alert()` when parental elements
     * have css stacking constraints which don't allow for `position: fixed`
     */
    hoist: boolean;
    handleHoistChange(): void;
    /**
     * Enables a countdown that indicates the remaining time the alert will be displayed.
     * Typically used to indicate the remaining time before a whole app refresh.
     */
    countdown?: boolean;
    /** Emitted when the alert opens. Calling `event.preventDefault()` will prevent it from being opened. */
    nanoShow: EventEmitter;
    /** Emitted after the alert opens and all transitions are complete. */
    nanoAfterShow: EventEmitter;
    /** Emitted when the alert closes. Calling `event.preventDefault()` will prevent it from being closed. */
    nanoHide: EventEmitter;
    /** Emitted after the alert closes and all transitions are complete. */
    nanoAfterHide: EventEmitter;
    /**
     * Shows the alert.
     * @returns a promise that resolves after the alert is shown
     */
    show(): Promise<boolean>;
    /**
     * Hides the alert
     * @returns a promise that resolves after the alert is hidden
     */
    hide(): Promise<boolean>;
    /**
     * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when
     * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by
     * calling this method again. The returned promise will resolve after the alert is hidden.
     *
     * @param position options are tr (top-right - default), tl (top-left), br (bottom-right), bl (bottom-left)
     * @returns a promise which will resolve after the alert has hidden
     */
    toast(position?: 'tr' | 'tl' | 'bl' | 'br'): Promise<void>;
    /**
     * Displays the alert as a dialog / modal - more akin to a traditional js alert().
     * @param label a label for assistive technology
     */
    alert(label: string): Promise<void>;
    private handleCountdownChange;
    private restartAutoHide;
    private handleMouseEnter;
    private handleMouseLeave;
    private handleCloseClick;
    private handleTransitionEnd;
    private handleButtonClick;
    connectedCallback(): void;
    disconnectedCallback(): void;
    componentDidLoad(): void;
    private Panel;
    render(): any;
}
