@universal-material/web 3.0.140 → 3.0.142

package/datepicker/datepicker.d.ts

@@ -0,0 +1 @@
+//# sourceMappingURL=datepicker.d.ts.map

package/datepicker/datepicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datepicker.d.ts","sourceRoot":"","sources":["../../src/datepicker/datepicker.ts"],"names":[],"mappings":""}

package/datepicker/datepicker.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=datepicker.js.map

package/datepicker/datepicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datepicker.js","sourceRoot":"","sources":["../../src/datepicker/datepicker.ts"],"names":[],"mappings":"","sourcesContent":[""]}

package/datepicker/datepicker.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=datepicker.styles.d.ts.map

package/datepicker/datepicker.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datepicker.styles.d.ts","sourceRoot":"","sources":["../../src/datepicker/datepicker.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAElB,CAAC"}

package/datepicker/datepicker.styles.js

@@ -0,0 +1,5 @@
+import { css } from 'lit';
+export const styles = css `
+
+`;
+//# sourceMappingURL=datepicker.styles.js.map

package/datepicker/datepicker.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datepicker.styles.js","sourceRoot":"","sources":["../../src/datepicker/datepicker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAC;;CAEzB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css `\n\n`;\n"]}

package/dialog/confirm-dialog-builder.d.ts

@@ -0,0 +1,12 @@
+import { DialogBuilder } from './dialog-builder.js';
+import { DialogButtonDef } from './dialog-button-def.js';
+import { UmDialog } from './dialog.js';
+export declare class ConfirmDialogBuilder extends DialogBuilder<ConfirmDialogBuilder, Promise<boolean>> {
+    #private;
+    static create(message: string): ConfirmDialogBuilder;
+    confirmButton(confirmButtonDef: DialogButtonDef): ConfirmDialogBuilder;
+    cancelButton(cancelButtonDef: DialogButtonDef): ConfirmDialogBuilder;
+    addButtons(dialog: UmDialog): void;
+    protected innerShow(dialog: UmDialog): Promise<boolean>;
+}
+//# sourceMappingURL=confirm-dialog-builder.d.ts.map

package/dialog/confirm-dialog-builder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"confirm-dialog-builder.d.ts","sourceRoot":"","sources":["../../src/dialog/confirm-dialog-builder.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,qBAAa,oBAAqB,SAAQ,aAAa,CAAC,oBAAoB,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC;;IAC7F,MAAM,CAAC,MAAM,CAAC,OAAO,EAAE,MAAM,GAAG,oBAAoB;IAOpD,aAAa,CAAC,gBAAgB,EAAE,eAAe,GAAG,oBAAoB;IAKtE,YAAY,CAAC,eAAe,EAAE,eAAe,GAAG,oBAAoB;IAK3D,UAAU,CAAC,MAAM,EAAE,QAAQ,GAAG,IAAI;cAaxB,SAAS,CAAC,MAAM,EAAE,QAAQ,GAAG,OAAO,CAAC,OAAO,CAAC;CAMjE"}

package/dialog/confirm-dialog-builder.js

@@ -0,0 +1,26 @@
+import { config } from '../config.js';
+import { DialogBuilder } from './dialog-builder.js';
+export class ConfirmDialogBuilder extends DialogBuilder {
+    static create(message) {
+        return new ConfirmDialogBuilder(message);
+    }
+    #confirmButtonDef;
+    #cancelButtonDef;
+    confirmButton(confirmButtonDef) {
+        this.#confirmButtonDef = confirmButtonDef;
+        return this;
+    }
+    cancelButton(cancelButtonDef) {
+        this.#cancelButtonDef = cancelButtonDef;
+        return this;
+    }
+    addButtons(dialog) {
+        this.addButton(dialog, { ...config.dialog.confirmDefaults.confirmButton, ...this.#confirmButtonDef }, () => dialog.close('ok'));
+        this.addButton(dialog, { ...config.dialog.confirmDefaults.cancelButton, ...this.#cancelButtonDef }, () => dialog.close('cancel'));
+    }
+    innerShow(dialog) {
+        super.innerShow(dialog);
+        return new Promise(resolve => dialog.addEventListener('closed', () => resolve(dialog.returnValue === 'ok')));
+    }
+}
+//# sourceMappingURL=confirm-dialog-builder.js.map

package/dialog/confirm-dialog-builder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"confirm-dialog-builder.js","sourceRoot":"","sources":["../../src/dialog/confirm-dialog-builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAIpD,MAAM,OAAO,oBAAqB,SAAQ,aAAqD;IAC7F,MAAM,CAAC,MAAM,CAAC,OAAe;QAC3B,OAAO,IAAI,oBAAoB,CAAC,OAAO,CAAC,CAAC;IAC3C,CAAC;IAED,iBAAiB,CAAmB;IACpC,gBAAgB,CAAmB;IAEnC,aAAa,CAAC,gBAAiC;QAC7C,IAAI,CAAC,iBAAiB,GAAG,gBAAgB,CAAC;QAC1C,OAAO,IAAI,CAAC;IACd,CAAC;IAED,YAAY,CAAC,eAAgC;QAC3C,IAAI,CAAC,gBAAgB,GAAG,eAAe,CAAC;QACxC,OAAO,IAAI,CAAC;IACd,CAAC;IAEQ,UAAU,CAAC,MAAgB;QAElC,IAAI,CAAC,SAAS,CACZ,MAAM,EACN,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,CAAC,aAAa,EAAE,GAAG,IAAI,CAAC,iBAAiB,EAAE,EAC7E,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC;QAE5B,IAAI,CAAC,SAAS,CACZ,MAAM,EACN,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,CAAC,YAAY,EAAE,GAAG,IAAI,CAAC,gBAAgB,EAAE,EAC3E,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IAClC,CAAC;IAEkB,SAAS,CAAC,MAAgB;QAC3C,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;QAExB,OAAO,IAAI,OAAO,CAAU,OAAO,CAAC,EAAE,CACpC,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,WAAW,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC;IACnF,CAAC;CACF","sourcesContent":["import { config } from '../config.js';\nimport { DialogBuilder } from './dialog-builder.js';\nimport { DialogButtonDef } from './dialog-button-def.js';\nimport { UmDialog } from './dialog.js';\n\nexport class ConfirmDialogBuilder extends DialogBuilder<ConfirmDialogBuilder, Promise<boolean>> {\n  static create(message: string): ConfirmDialogBuilder {\n    return new ConfirmDialogBuilder(message);\n  }\n\n  #confirmButtonDef?: DialogButtonDef;\n  #cancelButtonDef?: DialogButtonDef;\n\n  confirmButton(confirmButtonDef: DialogButtonDef): ConfirmDialogBuilder {\n    this.#confirmButtonDef = confirmButtonDef;\n    return this;\n  }\n\n  cancelButton(cancelButtonDef: DialogButtonDef): ConfirmDialogBuilder {\n    this.#cancelButtonDef = cancelButtonDef;\n    return this;\n  }\n\n  override addButtons(dialog: UmDialog): void {\n\n    this.addButton(\n      dialog,\n      { ...config.dialog.confirmDefaults.confirmButton, ...this.#confirmButtonDef },\n      () => dialog.close('ok'));\n\n    this.addButton(\n      dialog,\n      { ...config.dialog.confirmDefaults.cancelButton, ...this.#cancelButtonDef },\n      () => dialog.close('cancel'));\n  }\n\n  protected override innerShow(dialog: UmDialog): Promise<boolean> {\n    super.innerShow(dialog);\n\n    return new Promise<boolean>(resolve =>\n      dialog.addEventListener('closed', () => resolve(dialog.returnValue === 'ok')));\n  }\n}\n"]}

package/dialog/dialog-builder.d.ts

@@ -0,0 +1,15 @@
+import { DialogButtonDef } from './dialog-button-def.js';
+import { UmDialog } from './dialog.js';
+import './dialog.js';
+export declare abstract class DialogBuilder<TBuilder extends DialogBuilder<any, any>, TReturn> {
+    #private;
+    private readonly message;
+    constructor(message: string);
+    headline(headline: string): TBuilder;
+    show(): TReturn;
+    protected innerShow(dialog: UmDialog): TReturn | void;
+    protected abstract addButtons(dialog: UmDialog): void;
+    private addHeadline;
+    protected addButton(dialog: UmDialog, buttonDef: DialogButtonDef, click: () => void): void;
+}
+//# sourceMappingURL=dialog-builder.d.ts.map

package/dialog/dialog-builder.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-builder.d.ts","sourceRoot":"","sources":["../../src/dialog/dialog-builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,OAAO,aAAa,CAAC;AAErB,8BAAsB,aAAa,CAAC,QAAQ,SAAS,aAAa,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,OAAO;;IAGvE,OAAO,CAAC,QAAQ,CAAC,OAAO;gBAAP,OAAO,EAAE,MAAM;IAI5C,QAAQ,CAAC,QAAQ,EAAE,MAAM,GAAG,QAAQ;IAKpC,IAAI,IAAI,OAAO;IAUf,SAAS,CAAC,SAAS,CAAC,MAAM,EAAE,QAAQ,GAAG,OAAO,GAAG,IAAI;IAQrD,SAAS,CAAC,QAAQ,CAAC,UAAU,CAAC,MAAM,EAAE,QAAQ,GAAG,IAAI;IAErD,OAAO,CAAC,WAAW;IAWnB,SAAS,CAAC,SAAS,CAAC,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,eAAe,EAAE,KAAK,EAAE,MAAM,IAAI;CAQpF"}

package/dialog/dialog-builder.js

@@ -0,0 +1,42 @@
+import './dialog.js';
+export class DialogBuilder {
+    #headline;
+    constructor(message) {
+        this.message = message;
+    }
+    headline(headline) {
+        this.#headline = headline;
+        return this;
+    }
+    show() {
+        const dialog = document.createElement('u-dialog');
+        dialog.innerText = this.message;
+        this.addHeadline(dialog);
+        this.addButtons(dialog);
+        return this.innerShow(dialog);
+    }
+    innerShow(dialog) {
+        dialog.addEventListener('closed', () => dialog.remove());
+        document.body.appendChild(dialog);
+        dialog.show();
+        return;
+    }
+    addHeadline(dialog) {
+        if (!this.#headline) {
+            return;
+        }
+        const headlineElement = document.createElement('span');
+        headlineElement.slot = 'headline';
+        headlineElement.textContent = this.#headline;
+        dialog.appendChild(headlineElement);
+    }
+    addButton(dialog, buttonDef, click) {
+        const button = document.createElement('u-button');
+        button.variant = buttonDef.variant;
+        button.textContent = buttonDef.label;
+        button.slot = 'actions';
+        button.addEventListener('click', click);
+        dialog.appendChild(button);
+    }
+}
+//# sourceMappingURL=dialog-builder.js.map

package/dialog/dialog-builder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-builder.js","sourceRoot":"","sources":["../../src/dialog/dialog-builder.ts"],"names":[],"mappings":"AAGA,OAAO,aAAa,CAAC;AAErB,MAAM,OAAgB,aAAa;IACjC,SAAS,CAAU;IAEnB,YAA6B,OAAe;QAAf,YAAO,GAAP,OAAO,CAAQ;IAE5C,CAAC;IAED,QAAQ,CAAC,QAAgB;QACvB,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC;QAC1B,OAAO,IAA2B,CAAC;IACrC,CAAC;IAED,IAAI;QACF,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;QAClD,MAAM,CAAC,SAAS,GAAG,IAAI,CAAC,OAAO,CAAC;QAEhC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;QACzB,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC;QAExB,OAAO,IAAI,CAAC,SAAS,CAAC,MAAM,CAAY,CAAC;IAC3C,CAAC;IAES,SAAS,CAAC,MAAgB;QAClC,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC;QACzD,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;QAClC,MAAM,CAAC,IAAI,EAAE,CAAC;QAEd,OAAO;IACT,CAAC;IAIO,WAAW,CAAC,MAAmB;QACrC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC;YACpB,OAAO;QACT,CAAC;QAED,MAAM,eAAe,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QACvD,eAAe,CAAC,IAAI,GAAG,UAAU,CAAC;QAClC,eAAe,CAAC,WAAW,GAAG,IAAI,CAAC,SAAS,CAAC;QAC7C,MAAM,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC;IACtC,CAAC;IAES,SAAS,CAAC,MAAgB,EAAE,SAA0B,EAAE,KAAiB;QACjF,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;QAClD,MAAM,CAAC,OAAO,GAAG,SAAS,CAAC,OAAQ,CAAC;QACpC,MAAM,CAAC,WAAW,GAAG,SAAS,CAAC,KAAM,CAAC;QACtC,MAAM,CAAC,IAAI,GAAG,SAAS,CAAC;QACxB,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;QACxC,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IAC7B,CAAC;CACF","sourcesContent":["import { DialogButtonDef } from './dialog-button-def.js';\nimport { UmDialog } from './dialog.js';\n\nimport './dialog.js';\n\nexport abstract class DialogBuilder<TBuilder extends DialogBuilder<any, any>, TReturn> {\n  #headline?: string;\n\n  constructor(private readonly message: string) {\n\n  }\n\n  headline(headline: string): TBuilder {\n    this.#headline = headline;\n    return this as unknown as TBuilder;\n  }\n\n  show(): TReturn {\n    const dialog = document.createElement('u-dialog');\n    dialog.innerText = this.message;\n\n    this.addHeadline(dialog);\n    this.addButtons(dialog);\n\n    return this.innerShow(dialog) as TReturn;\n  }\n\n  protected innerShow(dialog: UmDialog): TReturn | void {\n    dialog.addEventListener('closed', () => dialog.remove());\n    document.body.appendChild(dialog);\n    dialog.show();\n\n    return;\n  }\n\n  protected abstract addButtons(dialog: UmDialog): void;\n\n  private addHeadline(dialog: HTMLElement) {\n    if (!this.#headline) {\n      return;\n    }\n\n    const headlineElement = document.createElement('span');\n    headlineElement.slot = 'headline';\n    headlineElement.textContent = this.#headline;\n    dialog.appendChild(headlineElement);\n  }\n\n  protected addButton(dialog: UmDialog, buttonDef: DialogButtonDef, click: () => void) {\n    const button = document.createElement('u-button');\n    button.variant = buttonDef.variant!;\n    button.textContent = buttonDef.label!;\n    button.slot = 'actions';\n    button.addEventListener('click', click);\n    dialog.appendChild(button);\n  }\n}\n"]}

package/dialog/dialog-button-def.d.ts

@@ -0,0 +1,6 @@
+import { UmButtonVariant } from '../button/button.js';
+export interface DialogButtonDef {
+    variant?: UmButtonVariant;
+    label?: string;
+}
+//# sourceMappingURL=dialog-button-def.d.ts.map

package/dialog/dialog-button-def.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-button-def.d.ts","sourceRoot":"","sources":["../../src/dialog/dialog-button-def.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAEtD,MAAM,WAAW,eAAe;IAC9B,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB"}

package/dialog/dialog-button-def.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=dialog-button-def.js.map

package/dialog/dialog-button-def.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog-button-def.js","sourceRoot":"","sources":["../../src/dialog/dialog-button-def.ts"],"names":[],"mappings":"","sourcesContent":["import { UmButtonVariant } from '../button/button.js';\n\nexport interface DialogButtonDef {\n  variant?: UmButtonVariant;\n  label?: string;\n}\n"]}

package/dialog/dialog.d.ts

@@ -0,0 +1,44 @@
+import { PropertyValues } from '@lit/reactive-element';
+import { HTMLTemplateResult, LitElement } from 'lit';
+import { ConfirmDialogBuilder } from './confirm-dialog-builder.js';
+import { MessageDialogBuilder } from './message-dialog-builder.js';
+import '../elevation/elevation.js';
+export declare class UmDialog extends LitElement {
+    #private;
+    static styles: import("lit").CSSResult[];
+    get open(): boolean;
+    set open(open: boolean);
+    get returnValue(): string;
+    /**
+     * Whether dialog has headline or not
+     *
+     * _Note:_ Readonly
+     */
+    hasHeadline: boolean;
+    /**
+     * Whether dialog has icon
+     *
+     * _Note:_ Readonly
+     */
+    hasIcon: boolean;
+    dialog: HTMLDialogElement;
+    scrim: HTMLElement;
+    content: HTMLElement;
+    container: HTMLElement;
+    private readonly assignedHeadlines;
+    private readonly assignedIcons;
+    static message(message: string): MessageDialogBuilder;
+    static confirm(message: string): ConfirmDialogBuilder;
+    render(): HTMLTemplateResult;
+    firstUpdated(changedProperties: PropertyValues): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    show(): Promise<void>;
+    close(returnValue?: string): Promise<void>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'u-dialog': UmDialog;
+    }
+}
+//# sourceMappingURL=dialog.d.ts.map

package/dialog/dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.d.ts","sourceRoot":"","sources":["../../src/dialog/dialog.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAEvD,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAI3D,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAEnE,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAEnE,OAAO,2BAA2B,CAAC;AAKnC,qBACa,QAAS,SAAQ,UAAU;;IACtC,OAAgB,MAAM,4BAAwB;IAK9C,IACI,IAAI,IAAI,OAAO,CAElB;IAED,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,EAWrB;IAED,IAAI,WAAW,WAEd;IAED;;;;OAIG;IACoE,WAAW,UAAS;IAE3F;;;;OAIG;IACgE,OAAO,UAAS;IAElE,MAAM,EAAG,iBAAiB,CAAC;IAC3B,KAAK,EAAG,WAAW,CAAC;IAClB,OAAO,EAAG,WAAW,CAAC;IACpB,SAAS,EAAG,WAAW,CAAC;IAG7C,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAAiB;IAGnD,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAiB;IAE/C,MAAM,CAAC,OAAO,CAAC,OAAO,EAAE,MAAM,GAAG,oBAAoB;IAIrD,MAAM,CAAC,OAAO,CAAC,OAAO,EAAE,MAAM,GAAG,oBAAoB;IAI5C,MAAM,IAAI,kBAAkB;IA+B5B,YAAY,CAAC,iBAAiB,EAAE,cAAc;IAM9C,iBAAiB;IAUjB,oBAAoB;IAoEvB,IAAI;IAWJ,KAAK,CAAC,WAAW,GAAE,MAAyB;CA6CnD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,QAAQ,CAAC;KACtB;CACF"}

package/dialog/dialog.js

@@ -0,0 +1,216 @@
+import { __decorate } from "tslib";
+import { html, LitElement } from 'lit';
+import { customElement, property, query, queryAssignedElements } from 'lit/decorators.js';
+import { styles as baseStyles } from '../shared/base.styles.js';
+import { ConfirmDialogBuilder } from './confirm-dialog-builder.js';
+import { styles } from './dialog.styles.js';
+import { MessageDialogBuilder } from './message-dialog-builder.js';
+import '../elevation/elevation.js';
+const topDividerClass = 'top-divider';
+const bottomDividerClass = 'bottom-divider';
+let UmDialog = class UmDialog extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.#open = false;
+        /**
+         * Whether dialog has headline or not
+         *
+         * _Note:_ Readonly
+         */
+        this.hasHeadline = false;
+        /**
+         * Whether dialog has icon
+         *
+         * _Note:_ Readonly
+         */
+        this.hasIcon = false;
+        this.#handleCancel = (e) => {
+            e.preventDefault();
+            const cancelPrevented = !this.dispatchEvent(new Event('cancel', { cancelable: true }));
+            if (cancelPrevented) {
+                return;
+            }
+            this.close();
+        };
+    }
+    static { this.styles = [baseStyles, styles]; }
+    #open;
+    #contentResizeObserver;
+    get open() {
+        return this.#open;
+    }
+    set open(open) {
+        if (this.#open === open) {
+            return;
+        }
+        if (!open) {
+            this.close();
+            return;
+        }
+        this.show();
+    }
+    get returnValue() {
+        return this.dialog.returnValue;
+    }
+    static message(message) {
+        return MessageDialogBuilder.create(message);
+    }
+    static confirm(message) {
+        return ConfirmDialogBuilder.create(message);
+    }
+    render() {
+        return html `
+      <dialog>
+        <div class="scrim" @click=${this.#handleScrimClick}></div>
+        <div class="container" part="container">
+          <u-elevation></u-elevation>
+          <div class="icon" part="icon">
+            <slot
+              name="icon"
+              @slotchange=${this.#handleIconSlotChange}>
+            </slot>
+          </div>
+          <div class="headline" part="headline">
+            <slot
+              name="headline"
+              @slotchange=${this.#handleHeadlineSlotChange}>
+            </slot>
+          </div>
+          <div
+            class="content"
+            part="content"
+            @scroll=${this.#handleScroll}>
+            <slot></slot>
+          </div>
+          <div class="actions" part="actions">
+            <slot name="actions"></slot>
+          </div>
+        </div>
+      </dialog>`;
+    }
+    firstUpdated(changedProperties) {
+        super.firstUpdated(changedProperties);
+        this.dialog.addEventListener('cancel', this.#handleCancel);
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.addEventListener('submit', this.#handleSubmit);
+        setTimeout(() => {
+            this.#contentResizeObserver = new ResizeObserver(() => this.#setScrollDividers());
+            this.#contentResizeObserver.observe(this.content);
+        });
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.removeEventListener('submit', this.#handleSubmit);
+        this.#contentResizeObserver.disconnect();
+        this.#contentResizeObserver = null;
+    }
+    #handleSubmit(event) {
+        const form = event.target;
+        const { submitter } = event;
+        if (form.method !== 'dialog' || !submitter) {
+            return;
+        }
+        this.close(submitter.getAttribute('value') ?? this.returnValue);
+    }
+    #handleCancel;
+    #handleIconSlotChange() {
+        this.hasIcon = this.assignedIcons.length > 0;
+    }
+    #handleHeadlineSlotChange() {
+        this.hasHeadline = this.assignedHeadlines.length > 0;
+    }
+    #handleScroll() {
+        this.#setScrollDividers();
+    }
+    #setScrollDividers() {
+        this.#setTopScrollDivider();
+        this.#setBottomScrollDivider();
+    }
+    #setBottomScrollDivider() {
+        const scrollBottom = this.content.scrollTop + this.content.offsetHeight;
+        if (scrollBottom >= this.content.scrollHeight) {
+            this.content.classList.remove(bottomDividerClass);
+            return;
+        }
+        this.content.classList.add(bottomDividerClass);
+    }
+    #setTopScrollDivider() {
+        if (this.content.scrollTop) {
+            this.content.classList.add(topDividerClass);
+            return;
+        }
+        this.content.classList.remove(topDividerClass);
+    }
+    async show() {
+        this.#open = true;
+        this.setAttribute('open', '');
+        await this.updateComplete;
+        this.dialog.showModal();
+        const autoFocusElement = this.querySelector('[autofocus]');
+        autoFocusElement?.focus();
+        this.content.scrollTop = 0;
+    }
+    async close(returnValue = this.returnValue) {
+        this.#open = false;
+        this.removeAttribute('open');
+        await this.updateComplete;
+        if (!this.dialog.open || this.open) {
+            return;
+        }
+        const preventClose = !this.dispatchEvent(new Event('close', { cancelable: true }));
+        if (preventClose) {
+            this.#open = true;
+            return;
+        }
+        this.open = false;
+        const closed = new Promise(resolve => this.container.addEventListener('animationend', () => {
+            resolve();
+            this.classList.remove('closing');
+            this.dialog.close(returnValue);
+            this.dispatchEvent(new Event('closed'));
+        }, { capture: true, once: true }));
+        this.classList.add('closing');
+        await closed;
+    }
+    #handleScrimClick() {
+        const cancelPrevented = !this.dispatchEvent(new Event('cancel', { cancelable: true }));
+        if (cancelPrevented) {
+            return;
+        }
+        this.close();
+    }
+};
+__decorate([
+    property({ type: Boolean })
+], UmDialog.prototype, "open", null);
+__decorate([
+    property({ type: Boolean, attribute: 'has-headline', reflect: true })
+], UmDialog.prototype, "hasHeadline", void 0);
+__decorate([
+    property({ type: Boolean, attribute: 'has-icon', reflect: true })
+], UmDialog.prototype, "hasIcon", void 0);
+__decorate([
+    query('dialog')
+], UmDialog.prototype, "dialog", void 0);
+__decorate([
+    query('.scrim')
+], UmDialog.prototype, "scrim", void 0);
+__decorate([
+    query('.content')
+], UmDialog.prototype, "content", void 0);
+__decorate([
+    query('.container')
+], UmDialog.prototype, "container", void 0);
+__decorate([
+    queryAssignedElements({ slot: 'headline', flatten: true })
+], UmDialog.prototype, "assignedHeadlines", void 0);
+__decorate([
+    queryAssignedElements({ slot: 'icon', flatten: true })
+], UmDialog.prototype, "assignedIcons", void 0);
+UmDialog = __decorate([
+    customElement('u-dialog')
+], UmDialog);
+export { UmDialog };
+//# sourceMappingURL=dialog.js.map

package/dialog/dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../src/dialog/dialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { PropertyValues } from '@lit/reactive-element';\n\nimport { html, HTMLTemplateResult, LitElement } from 'lit';\nimport { customElement, property, query, queryAssignedElements } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from '../shared/base.styles.js';\nimport { ConfirmDialogBuilder } from './confirm-dialog-builder.js';\nimport { styles } from './dialog.styles.js';\nimport { MessageDialogBuilder } from './message-dialog-builder.js';\n\nimport '../elevation/elevation.js';\n\nconst topDividerClass = 'top-divider';\nconst bottomDividerClass = 'bottom-divider';\n\n@customElement('u-dialog')\nexport class UmDialog extends LitElement {\n  static override styles = [baseStyles, styles];\n\n  #open = false;\n  #contentResizeObserver!: ResizeObserver | null;\n\n  @property({ type: Boolean })\n  get open(): boolean {\n    return this.#open;\n  }\n\n  set open(open: boolean) {\n    if (this.#open === open) {\n      return;\n    }\n\n    if (!open) {\n      this.close();\n      return;\n    }\n\n    this.show();\n  }\n\n  get returnValue() {\n    return this.dialog.returnValue;\n  }\n\n  /**\n   * Whether dialog has headline or not\n   *\n   * _Note:_ Readonly\n   */\n  @property({ type: Boolean, attribute: 'has-headline', reflect: true }) hasHeadline = false;\n\n  /**\n   * Whether dialog has icon\n   *\n   * _Note:_ Readonly\n   */\n  @property({ type: Boolean, attribute: 'has-icon', reflect: true }) hasIcon = false;\n\n  @query('dialog') dialog!: HTMLDialogElement;\n  @query('.scrim') scrim!: HTMLElement;\n  @query('.content') content!: HTMLElement;\n  @query('.container') container!: HTMLElement;\n\n  @queryAssignedElements({ slot: 'headline', flatten: true })\n  private readonly assignedHeadlines!: HTMLElement[];\n\n  @queryAssignedElements({ slot: 'icon', flatten: true })\n  private readonly assignedIcons!: HTMLElement[];\n\n  static message(message: string): MessageDialogBuilder {\n    return MessageDialogBuilder.create(message);\n  }\n\n  static confirm(message: string): ConfirmDialogBuilder {\n    return ConfirmDialogBuilder.create(message);\n  }\n\n  override render(): HTMLTemplateResult {\n    return html`\n      <dialog>\n        <div class=\"scrim\" @click=${this.#handleScrimClick}></div>\n        <div class=\"container\" part=\"container\">\n          <u-elevation></u-elevation>\n          <div class=\"icon\" part=\"icon\">\n            <slot\n              name=\"icon\"\n              @slotchange=${this.#handleIconSlotChange}>\n            </slot>\n          </div>\n          <div class=\"headline\" part=\"headline\">\n            <slot\n              name=\"headline\"\n              @slotchange=${this.#handleHeadlineSlotChange}>\n            </slot>\n          </div>\n          <div\n            class=\"content\"\n            part=\"content\"\n            @scroll=${this.#handleScroll}>\n            <slot></slot>\n          </div>\n          <div class=\"actions\" part=\"actions\">\n            <slot name=\"actions\"></slot>\n          </div>\n        </div>\n      </dialog>`;\n  }\n\n  override firstUpdated(changedProperties: PropertyValues) {\n    super.firstUpdated(changedProperties);\n\n    this.dialog.addEventListener('cancel', this.#handleCancel);\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('submit', this.#handleSubmit);\n\n    setTimeout(() => {\n      this.#contentResizeObserver = new ResizeObserver(() => this.#setScrollDividers());\n      this.#contentResizeObserver.observe(this.content);\n    });\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('submit', this.#handleSubmit);\n\n    this.#contentResizeObserver!.disconnect();\n    this.#contentResizeObserver = null;\n  }\n\n  #handleSubmit(event: SubmitEvent) {\n    const form = event.target as HTMLFormElement;\n    const { submitter } = event;\n\n    if (form.method !== 'dialog' || !submitter) {\n      return;\n    }\n\n    this.close(submitter.getAttribute('value') ?? this.returnValue);\n  }\n\n  readonly #handleCancel = (e: Event) => {\n    e.preventDefault();\n\n    const cancelPrevented = !this.dispatchEvent(new Event('cancel', { cancelable: true }));\n\n    if (cancelPrevented) {\n      return;\n    }\n\n    this.close();\n  };\n\n  #handleIconSlotChange() {\n    this.hasIcon = this.assignedIcons.length > 0;\n  }\n\n  #handleHeadlineSlotChange() {\n    this.hasHeadline = this.assignedHeadlines.length > 0;\n  }\n\n  #handleScroll() {\n    this.#setScrollDividers();\n  }\n\n  #setScrollDividers() {\n    this.#setTopScrollDivider();\n    this.#setBottomScrollDivider();\n  }\n\n  #setBottomScrollDivider() {\n    const scrollBottom = this.content.scrollTop + this.content.offsetHeight;\n\n    if (scrollBottom >= this.content.scrollHeight) {\n      this.content.classList.remove(bottomDividerClass);\n      return;\n    }\n\n    this.content.classList.add(bottomDividerClass);\n  }\n\n  #setTopScrollDivider() {\n    if (this.content.scrollTop) {\n      this.content.classList.add(topDividerClass);\n      return;\n    }\n\n    this.content.classList.remove(topDividerClass);\n  }\n\n  async show() {\n    this.#open = true;\n    this.setAttribute('open', '');\n\n    await this.updateComplete;\n    this.dialog.showModal();\n    const autoFocusElement = this.querySelector<HTMLElement>('[autofocus]');\n    autoFocusElement?.focus();\n    this.content.scrollTop = 0;\n  }\n\n  async close(returnValue: string = this.returnValue) {\n    this.#open = false;\n    this.removeAttribute('open');\n\n    await this.updateComplete;\n\n    if (!this.dialog.open || this.open) {\n      return;\n    }\n\n    const preventClose = !this.dispatchEvent(new Event('close', { cancelable: true }));\n\n    if (preventClose) {\n      this.#open = true;\n      return;\n    }\n\n    this.open = false;\n\n    const closed = new Promise<void>(resolve =>\n      this.container.addEventListener(\n        'animationend',\n        () => {\n          resolve();\n          this.classList.remove('closing');\n          this.dialog.close(returnValue);\n          this.dispatchEvent(new Event('closed'));\n        },\n        { capture: true, once: true },\n      )\n    );\n\n    this.classList.add('closing');\n    await closed;\n  }\n\n  #handleScrimClick() {\n    const cancelPrevented = !this.dispatchEvent(new Event('cancel', { cancelable: true }));\n\n    if (cancelPrevented) {\n      return;\n    }\n\n    this.close();\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'u-dialog': UmDialog;\n  }\n}\n"]}

package/dialog/dialog.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=dialog.styles.d.ts.map

package/dialog/dialog.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.styles.d.ts","sourceRoot":"","sources":["../../src/dialog/dialog.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAkKlB,CAAC"}

package/dialog/dialog.styles.js

@@ -0,0 +1,165 @@
+import { css } from 'lit';
+export const styles = css `
+  :host {
+    --u-elevation-level: var(--u-dialog-elevation, 3);
+    --_icon-size: var(--u-dialog-icon-size, 24px);
+    --_divider-color: var(--u-dialog-divider-color, var(--u-color-outline-variant, rgb(202, 196, 208)));
+    --_scrim-opacity: var(--u-dialog-scrim-opacity, .32);
+    --_padding: var(--u-dialog-padding, 24px);
+  }
+
+  :host(:not([has-headline])) .headline {
+    display: none;
+  }
+
+  :host([has-icon]) .icon {
+    display: flex;
+  }
+  :host([has-icon]) .headline {
+    padding-top: 0;
+  }
+  :host([has-icon]) .headline,
+  :host([has-icon]) .container {
+    text-align: center;
+  }
+
+  :host([has-headline]) .content.top-divider,
+  :host([has-icon]) .content.top-divider {
+    border-top: 1px solid var(--_divider-color);
+    margin-top: -1px;
+  }
+
+  .scrim {
+    position: fixed;
+    inset: 0;
+    background-color: var(--u-dialog-scrim-color, var(--u-color-scrim, rgb(0, 0, 0)));
+    animation: scrim-show-animation 300ms;
+    animation-fill-mode: forwards;
+    z-index: -1;
+  }
+
+  dialog {
+    align-items: center;
+    background: none;
+    border: none;
+    overflow: visible;
+    padding: var(--_padding);
+    max-width: none;
+    max-height: none;
+    width: 100%;
+    height: 100%;
+  }
+  dialog[open] {
+    display: flex;
+  }
+  dialog::backdrop {
+    background: none;
+  }
+
+  .container {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    margin-inline: auto;
+    background-color: var(--u-dialog-container-bg-color, var(--u-color-surface-container-high, rgb(236, 230, 240)));
+    border-radius: var(--u-dialog-border-radius, var(--u-shape-corner-extra-large, 28px));
+    min-width: min(var(--u-dialog-min-width, 280px), 100%);
+    max-width: var(--u-dialog-max-width, 560px);
+    max-height: min(var(--u-dialog-max-height, 560px), 100%);
+    animation: show 250ms cubic-bezier(0.19, 1, 0.22, 1);
+    z-index: 1;
+  }
+
+  .headline,
+  .icon,
+  .content,
+  .actions {
+    padding: var(--_padding);
+  }
+
+  .headline {
+    font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"));
+    line-height: var(--u-dialog-headline-line-height, var(--u-headline-s-line-height, 2rem));
+    font-size: var(--u-dialog-headline-font-size, var(--u-headline-s-font-size, 1.5rem));
+    letter-spacing: var(--u-dialog-headline-letter-spacing, var(--u-headline-s-letter-spacing, 0rem));
+    font-weight: var(--u-dialog-headline-font-weight, var(--u-headline-s-font-weight, var(--u-font-weight-regular, 400)));
+    padding-bottom: var(--u-headline-padding, 16px);
+  }
+
+  .icon {
+    display: none;
+    justify-content: center;
+    align-items: center;
+    font-size: var(--_icon-size);
+    line-height: var(--_icon-size);
+    color: var(--u-dialog-icon-color, var(--u-color-secondary, rgb(98, 91, 113)));
+    padding-bottom: var(--u-icon-padding, 16px);
+  }
+
+  .content {
+    font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"));
+    line-height: var(--u-dialog-content-line-height, var(--u-body-m-line-height, 1.25rem));
+    font-size: var(--u-dialog-content-font-size, var(--u-body-m-font-size, 0.875rem));
+    letter-spacing: var(--u-dialog-content-letter-spacing, var(--u-body-m-letter-spacing, 0.0178571429rem));
+    font-weight: var(--u-dialog-content-font-weight, var(--u-body-m-font-weight, var(--u-font-weight-regular, 400)));
+    color: var(--u-dialog-content-text-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));
+    padding-block: 0;
+    overflow: auto;
+  }
+  .content.bottom-divider {
+    border-bottom: 1px solid var(--_divider-color);
+    margin-bottom: -1px;
+  }
+
+  :host(:not([has-headline]):not([has-icon])) .content {
+    padding-top: var(--_padding);
+  }
+
+  .actions {
+    display: flex;
+    flex-direction: row-reverse;
+    flex-wrap: wrap-reverse;
+    gap: var(--u-dialog-actions-gap, 8px);
+  }
+
+  :host(.closing) .container {
+    animation-name: close;
+  }
+  :host(.closing) .scrim {
+    animation-name: scrim-close-animation;
+  }
+
+  @keyframes scrim-show-animation {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: var(--_scrim-opacity);
+    }
+  }
+  @keyframes scrim-close-animation {
+    from {
+      opacity: var(--_scrim-opacity);
+    }
+    to {
+      opacity: 0;
+    }
+  }
+  @keyframes show {
+    from {
+      transform: scale3d(0, 0, 1);
+    }
+    to {
+      transform: scale3d(1, 1, 1);
+    }
+  }
+  @keyframes close {
+    from {
+      transform: scale3d(1, 1, 1);
+    }
+    to {
+      transform: scale3d(0, 0, 1);
+    }
+  }
+`;
+//# sourceMappingURL=dialog.styles.js.map