@3mo/dialog
Version:
A dialog component based on Material Web Components.
92 lines • 3.94 kB
TypeScript
import { Component } from '@a11d/lit';
import { type ApplicationTopLayer, DialogActionKey, type Dialog as IDialog } from '@a11d/lit-application';
import { SlotController } from '@3mo/slot-controller';
import '@3mo/localization';
export declare enum DialogSize {
Large = "large",
Medium = "medium",
Small = "small"
}
/**
* @element mo-dialog
*
* @attr open
* @attr heading
* @attr size
* @attr blocking
* @attr primaryOnEnter
* @attr manualClose
* @attr primaryButtonText
* @attr secondaryButtonText
*
* @slot - Content of the dialog
* @slot primaryAction - Primary action of the dialog
* @slot secondaryAction - Secondary action of the dialog
* @slot action - Additional actions of the dialog which are displayed in the header
* @slot footer - Footer of the dialog
*
* @csspart heading - Dialog heading
* @csspart header - Dialog footer
* @csspart content - Dialog content
* @csspart footer - Dialog footer
*
* @cssprop --mo-dialog-heading-color - Color of the dialog heading
* @cssprop --mo-dialog-content-color - Color of the dialog content
* @cssprop --mo-dialog-backdrop - Background of the dialog backdrop
* @cssprop --mo-dialog-divider-color - Color of the dialog divider
* @cssprop --mo-dialog-heading-line-height - Line height of the dialog heading
*
* @i18n "Close"
* @i18n "Open as Tab"
*
* @fires pageHeadingChange - Dispatched when the dialog heading changes
* @fires requestPopup - Dispatched when the dialog is requested to be popped up
*/
export declare class Dialog extends Component implements IDialog {
static disablePoppability: boolean;
static readonly executingActionAdaptersByComponent: Map<Constructor<HTMLElement>, (actionElement: HTMLElement, isExecuting: boolean) => void>;
readonly pageHeadingChange: EventDispatcher<string>;
readonly requestPopup: EventDispatcher;
open: boolean;
heading: string;
size?: DialogSize;
blocking: boolean;
primaryOnEnter: boolean;
manualClose: boolean;
primaryButtonText?: string;
secondaryButtonText?: string;
poppable: boolean;
boundToWindow: boolean;
executingAction?: DialogActionKey;
private showTopLayer;
get preventCancellationOnEscape(): boolean;
readonly topLayerElement: ApplicationTopLayer;
readonly primaryActionElement: HTMLElement;
readonly secondaryActionElement: HTMLElement;
readonly cancellationActionElement: HTMLElement;
handleAction: (key: DialogActionKey) => void | Promise<void>;
protected readonly slotController: SlotController;
static get styles(): import("@a11d/lit").CSSResult;
protected get dialogHeading(): string;
protected get template(): import("lit-html").HTMLTemplateResult;
protected get headerTemplate(): import("lit-html").HTMLTemplateResult;
protected get headingTemplate(): import("lit-html").HTMLTemplateResult;
protected get actionsTemplate(): import("lit-html").HTMLTemplateResult;
protected get contentTemplate(): import("lit-html").HTMLTemplateResult;
protected get topLayerTemplate(): import("lit-html").HTMLTemplateResult;
protected get contentDefaultTemplate(): import("lit-html").HTMLTemplateResult;
private get shallHideFooter();
protected get footerTemplate(): import("lit-html").HTMLTemplateResult;
protected get footerSlotTemplate(): import("lit-html").HTMLTemplateResult;
protected get footerDefaultTemplate(): import("lit-html").HTMLTemplateResult;
protected get primaryActionSlotTemplate(): import("lit-html").HTMLTemplateResult;
protected get primaryActionDefaultTemplate(): import("lit-html").HTMLTemplateResult;
protected get secondaryActionSlotTemplate(): import("lit-html").HTMLTemplateResult;
protected get secondaryActionDefaultTemplate(): import("lit-html").HTMLTemplateResult;
}
declare global {
interface HTMLElementTagNameMap {
'mo-dialog': Dialog;
}
}
//# sourceMappingURL=Dialog.d.ts.map