pyro/dist/toast/toast.d.ts

Pyro custom elements

import { LitElement } from 'lit';
/**
 * Toast stack, used to show multiple notifications in screen corners
 *
 * ```html
 * <pyro-toast id="toastElement" center></pyro-toast>
 * ```
 *
 * @tag pyro-toast
 * [docs](https://pyrojs.com/el/toast)
 *
 * @cssprop [--pyro-toast-spacing=var(--pyro-spacing)] - size of toast
 * @cssprop [--pyro-toast-border=var(--pyro-border)] - `border`
 * @cssprop [--pyro-toast-border-radius=var(--pyro-border-radius)] - `border-radius`
 * @cssprop [--pyro-toast-text-color=var(--pyro-text-color)] - text `color`
 *
 * Severity
 * @cssprop [--pyro-toast-info-color-lighter=var(--pyro-info-color-lighter)] - default `background`
 * @cssprop [--pyro-toast-success-color-lighter=var(--pyro-success-color-lighter)] - `background`
 * @cssprop [--pyro-toast-warning-color-lighter=var(--pyro-warning-color-lighter)] - `background`
 * @cssprop [--pyro-toast-error-color-lighter=var(--pyro-error-color-lighter)] - `background`
 * @cssprop [--pyro-toast-info-color=var(--pyro-info-color)] - default `border-color`
 * @cssprop [--pyro-toast-success-color=var(--pyro-success-color)] - `border-color`
 * @cssprop [--pyro-toast-warning-color=var(--pyro-warning-color)] - `border-color`
 * @cssprop [--pyro-toast-error-color=var(--pyro-error-color)] - `border-color`
 */
export declare class PyroToast extends LitElement {
    static styles: import('lit').CSSResult;
    /** Message to display */
    message?: string;
    /** Duration in ms */
    duration?: number;
    /** Toast severity, determines colors */
    severity?: 'info' | 'success' | 'warning' | 'error' | '';
    /** Vertical position on top, default false */
    top?: boolean;
    /** Vertical position on left, default false */
    left?: boolean;
    /** Horizontal position in center, default false */
    center?: boolean;
    _stacked: string[];
    popMessage(): void;
    update(changedProperties: any): void;
    render(): import('lit-html').TemplateResult<1>;
}
declare global {
    interface HTMLElementTagNameMap {
        'pyro-toast': PyroToast;
    }
}
export declare const showToast: (message: string, options?: {
    duration?: number;
    selector: string;
}) => void;