@digital-realty/ix-dialog 1.2.1 → 1.2.3

package/dist/IxDialog.d.ts

@@ -1,8 +1,8 @@
-import { LitElement } from 'lit';
-import './md-dialog.js';
+import { CSSResultGroup, LitElement } from 'lit';
 import { Dialog } from './internal/dialog.js';
+import './md-dialog.js';
 export declare class IxDialog extends LitElement {
-    /** @nocollapse */
+    static styles: CSSResultGroup;
     static shadowRootOptions: {
         delegatesFocus: boolean;
         mode: ShadowRootMode;
@@ -15,13 +15,46 @@ export declare class IxDialog extends LitElement {
     preventCancel: boolean;
     preventCloseOnScrimClick: boolean;
     disableNextClickIsFromContent: boolean;
-    private scrollPosition;
+    useNativeDialog: boolean;
+    allowOverflow: boolean;
+    private nativeClosing;
+    private dialogRef;
+    private containerRef;
+    private portalHost?;
+    private portalRoot?;
+    private portalStyleEl?;
+    private pointerDownInside;
+    private isScrollLocked;
+    private scrollYBackup;
+    private removeScrollHandlers?;
+    private nativeOnEnd?;
+    private mo?;
+    private get nativeDialog();
+    private get nativeDialogContainer();
+    connectedCallback(): void;
     disconnectedCallback(): void;
-    resetBodyStyles(): void;
+    updated(changed: Map<string, unknown>): void;
+    dismiss(): void;
+    private startNativeCloseAnimation;
+    private ensurePortal;
+    private attachPortalStyles;
+    private teardownPortal;
+    private moveNodesToPortal;
+    private moveNodesBackFromPortal;
+    private populatePortal;
+    private onKeydown;
+    private onNativeCancel;
+    private requestClose;
+    private onScrimClick;
+    private lockScroll;
+    private unlockScroll;
     onOpen(): void;
     onOpened(): void;
     onClose(): void;
     onClosed(): void;
-    onCancel(e: any): void;
-    render(): import("lit-html").TemplateResult<1>;
+    onCancel(e: Event): void;
+    private portalTemplate;
+    private renderMdDialog;
+    private renderNativeDialog;
+    render(): symbol | import("lit-html").TemplateResult<1>;
 }

package/dist/IxDialog.js

@@ -1,8 +1,10 @@
 import { __decorate } from "tslib";
-import { html, LitElement } from 'lit';
+import { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';
+import { css, html, LitElement, nothing, render } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
+import { createRef, ref } from 'lit/directives/ref.js';
+import { IxDialogStyles } from './ix-dialog-styles.js';
 import './md-dialog.js';
-import { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';
 export class IxDialog extends LitElement {
     constructor() {
         super(...arguments);
@@ -10,38 +12,333 @@ export class IxDialog extends LitElement {
         this.preventCancel = false;
         this.preventCloseOnScrimClick = false;
         this.disableNextClickIsFromContent = false;
-        this.scrollPosition = 0;
+        this.useNativeDialog = false;
+        this.allowOverflow = false;
+        this.nativeClosing = false;
+        this.dialogRef = createRef();
+        this.containerRef = createRef();
+        this.pointerDownInside = false;
+        this.isScrollLocked = false;
+        this.scrollYBackup = 0;
+        this.onKeydown = (e) => {
+            if (e.key !== 'Escape')
+                return;
+            if (this.preventCancel) {
+                e.preventDefault();
+                return;
+            }
+            const cancelEvt = new Event('cancel', {
+                bubbles: true,
+                composed: true,
+                cancelable: true,
+            });
+            const prevented = !this.dispatchEvent(cancelEvt);
+            if (prevented) {
+                e.preventDefault();
+                return;
+            }
+            this.requestClose();
+        };
+        this.onNativeCancel = (e) => {
+            const forwarded = new Event('cancel', {
+                bubbles: true,
+                composed: true,
+                cancelable: true,
+            });
+            const prevented = !this.dispatchEvent(forwarded);
+            if (prevented) {
+                e.preventDefault();
+                return;
+            }
+            this.requestClose();
+        };
+        this.onScrimClick = () => {
+            if (!this.preventCloseOnScrimClick)
+                this.requestClose();
+        };
+    }
+    get nativeDialog() {
+        var _a;
+        return (_a = this.dialogRef.value) !== null && _a !== void 0 ? _a : null;
+    }
+    get nativeDialogContainer() {
+        var _a;
+        return (_a = this.containerRef.value) !== null && _a !== void 0 ? _a : null;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.mo = new MutationObserver(() => {
+            if (this.useNativeDialog && this.open)
+                this.populatePortal();
+        });
+        this.mo.observe(this, {
+            childList: true,
+            subtree: true,
+            attributes: true,
+            characterData: true,
+        });
     }
     disconnectedCallback() {
+        var _a;
         super.disconnectedCallback();
-        this.resetBodyStyles();
-    }
-    resetBodyStyles() {
-        const page = document.body;
-        page.style.paddingRight = '0';
-        page.style.position = '';
-        page.style.top = '';
-        page.style.left = '';
-        page.style.right = '';
-        page.style.overflow = '';
-        page.style.width = '';
-        window.scrollTo(0, this.scrollPosition);
+        (_a = this.mo) === null || _a === void 0 ? void 0 : _a.disconnect();
+        this.unlockScroll();
+        this.teardownPortal();
+    }
+    updated(changed) {
+        var _a;
+        if (!this.useNativeDialog)
+            return;
+        if (changed.has('open')) {
+            if (this.open) {
+                this.ensurePortal();
+                if (this.portalRoot) {
+                    this.attachPortalStyles();
+                    render(this.portalTemplate(), this.portalRoot);
+                    this.populatePortal();
+                }
+                if (this.nativeClosing) {
+                    this.nativeClosing = false;
+                    (_a = this.nativeDialogContainer) === null || _a === void 0 ? void 0 : _a.classList.remove('closing');
+                    if (this.nativeOnEnd && this.nativeDialogContainer) {
+                        this.nativeDialogContainer.removeEventListener('animationend', this.nativeOnEnd);
+                    }
+                    this.nativeOnEnd = undefined;
+                }
+                this.dispatchEvent(new Event('open', { bubbles: true, composed: true }));
+                this.lockScroll();
+                requestAnimationFrame(() => {
+                    var _a;
+                    (_a = this.nativeDialog) === null || _a === void 0 ? void 0 : _a.show();
+                    requestAnimationFrame(() => {
+                        this.dispatchEvent(new Event('opened', { bubbles: true, composed: true }));
+                    });
+                });
+            }
+            else {
+                this.startNativeCloseAnimation();
+            }
+        }
+    }
+    dismiss() {
+        if (!this.open)
+            return;
+        Promise.resolve().then(() => {
+            this.requestClose();
+        });
+    }
+    startNativeCloseAnimation() {
+        if (this.nativeClosing)
+            return;
+        this.nativeClosing = true;
+        this.dispatchEvent(new Event('close', { bubbles: true, composed: true }));
+        const finish = () => {
+            var _a, _b;
+            (_a = this.nativeDialogContainer) === null || _a === void 0 ? void 0 : _a.classList.remove('closing');
+            this.nativeClosing = false;
+            (_b = this.nativeDialog) === null || _b === void 0 ? void 0 : _b.close();
+            this.unlockScroll();
+            this.dispatchEvent(new Event('closed', { bubbles: true, composed: true }));
+            this.moveNodesBackFromPortal();
+            this.teardownPortal();
+        };
+        const container = this.nativeDialogContainer;
+        if (!container) {
+            finish();
+            return;
+        }
+        container.classList.add('closing');
+        let done = false;
+        const onEnd = () => {
+            if (done)
+                return;
+            done = true;
+            container.removeEventListener('animationend', onEnd);
+            finish();
+        };
+        this.nativeOnEnd = onEnd;
+        container.addEventListener('animationend', onEnd, { once: true });
+        window.setTimeout(onEnd, 1);
+    }
+    ensurePortal() {
+        if (this.portalRoot)
+            return;
+        const host = document.createElement('ix-dialog-portal-host');
+        const root = host.attachShadow({ mode: 'open' });
+        if (this.shadowRoot && 'adoptedStyleSheets' in this.shadowRoot) {
+            root.adoptedStyleSheets = this.shadowRoot.adoptedStyleSheets;
+        }
+        document.body.appendChild(host);
+        this.portalHost = host;
+        this.portalRoot = root;
+    }
+    attachPortalStyles() {
+        if (!this.portalRoot || this.portalStyleEl)
+            return;
+        const style = document.createElement('style');
+        style.textContent = `
+  dialog {
+    position: fixed;
+    inset: 0;
+    margin: 0;
+    padding: 0;
+    border: 0;
+    top: 30%;
+    left: 5%;
+    background: transparent;
+    display: grid;
+    place-items: center;
+    pointer-events: none;
+    z-index: 1000;
+    max-width: none !important;
+    max-height: none !important;
+  }
+  .scrim {
+    position: fixed;
+    inset: 0;
+    background: var(--ix-dialog-scrim, rgba(0,0,0,0.32));
+    pointer-events: auto;
+    z-index: 1000;
+    touch-action: none;
+    border: 0;
+    padding: 0;
+    appearance: none;
+  }
+  .container {
+    position: relative;
+    border-radius: 0.75rem;
+    background: var(--ix-dialog-bg, #fff);
+    box-shadow: var(--ix-dialog-shadow, 0 10px 30px rgba(0,0,0,0.25));
+    display: grid;
+    grid-template-rows: auto 1fr auto;
+    overflow: visible;
+    pointer-events: auto;
+    z-index: 1001;
+    max-width: none!important;
+  }
+  .container .content {
+    overflow: visible;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    dialog > .container { animation: none !important; }
+  }
+`;
+        this.portalRoot.append(style);
+        this.portalStyleEl = style;
+    }
+    teardownPortal() {
+        var _a;
+        if (!this.portalHost)
+            return;
+        if (this.portalRoot)
+            render(nothing, this.portalRoot);
+        (_a = this.portalStyleEl) === null || _a === void 0 ? void 0 : _a.remove();
+        this.portalStyleEl = undefined;
+        this.portalHost.remove();
+        this.portalRoot = undefined;
+        this.portalHost = undefined;
+    }
+    moveNodesToPortal(slotName, targetSelector) {
+        if (!this.nativeDialogContainer)
+            return;
+        const target = this.nativeDialogContainer.querySelector(targetSelector);
+        if (!target)
+            return;
+        const nodes = Array.from(this.children).filter(el => el instanceof HTMLElement && el.slot === slotName);
+        nodes.forEach(n => target.appendChild(n));
+    }
+    moveNodesBackFromPortal() {
+        if (!this.nativeDialogContainer)
+            return;
+        const h = this.nativeDialogContainer.querySelector('.headline');
+        const b = this.nativeDialogContainer.querySelector('.content');
+        const a = this.nativeDialogContainer.querySelector('.actions');
+        [h, b, a].forEach(container => {
+            if (!container)
+                return;
+            const children = Array.from(container.childNodes);
+            children.forEach(n => this.appendChild(n));
+        });
+    }
+    populatePortal() {
+        this.moveNodesToPortal('headline', '.headline');
+        this.moveNodesToPortal('content', '.content');
+        this.moveNodesToPortal('actions', '.actions');
+    }
+    requestClose() {
+        this.open = false;
+    }
+    lockScroll() {
+        if (this.isScrollLocked)
+            return;
+        this.isScrollLocked = true;
+        this.scrollYBackup =
+            window.scrollY || document.documentElement.scrollTop || 0;
+        const { body } = document;
+        const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;
+        if (scrollbarWidth > 0) {
+            body.style.paddingRight = `${scrollbarWidth}px`;
+        }
+        body.style.overflow = 'hidden';
+        body.style.position = 'fixed';
+        body.style.top = `-${this.scrollYBackup}px`;
+        body.style.left = '0';
+        body.style.right = '0';
+        body.style.width = '100%';
+        const stopIfOutside = (ev) => {
+            const t = ev.target;
+            if (!this.nativeDialogContainer || !t)
+                return;
+            if (!this.nativeDialogContainer.contains(t))
+                ev.preventDefault();
+        };
+        const onTouchMove = (e) => stopIfOutside(e);
+        const onKeyDown = (e) => {
+            const keys = [
+                'PageUp',
+                'PageDown',
+                'Home',
+                'End',
+                'ArrowUp',
+                'ArrowDown',
+                ' ',
+            ];
+            if (!keys.includes(e.key))
+                return;
+            const t = e.target;
+            if (!this.nativeDialogContainer || !t)
+                return;
+            if (!this.nativeDialogContainer.contains(t))
+                e.preventDefault();
+        };
+        window.addEventListener('touchmove', onTouchMove, { passive: false });
+        window.addEventListener('keydown', onKeyDown, { passive: false });
+        this.removeScrollHandlers = () => {
+            window.removeEventListener('touchmove', onTouchMove);
+            window.removeEventListener('keydown', onKeyDown);
+        };
+    }
+    unlockScroll() {
+        if (!this.isScrollLocked)
+            return;
+        this.isScrollLocked = false;
+        if (this.removeScrollHandlers) {
+            this.removeScrollHandlers();
+            this.removeScrollHandlers = undefined;
+        }
+        const { body } = document;
+        body.style.paddingRight = '';
+        body.style.position = '';
+        body.style.top = '';
+        body.style.left = '';
+        body.style.right = '';
+        body.style.overflow = '';
+        body.style.width = '';
+        window.scrollTo(0, this.scrollYBackup || 0);
     }
     onOpen() {
         this.dispatchEvent(new Event('open'));
-        // IXUAT-9997 prevent page scroll on dialog open
-        const page = document.body;
-        const clientWidthBefore = page.clientWidth;
-        this.scrollPosition = window.scrollY;
-        page.style.overflow = 'hidden';
-        const clientWidthAfter = page.clientWidth;
-        const scrollbarWidth = clientWidthAfter - clientWidthBefore;
-        page.style.paddingRight = `${scrollbarWidth}px`;
-        page.style.position = 'fixed';
-        page.style.top = `-${this.scrollPosition}px`;
-        page.style.left = '0';
-        page.style.right = '0';
-        page.style.width = '100%';
+        this.lockScroll();
     }
     onOpened() {
         this.dispatchEvent(new Event('opened'));
@@ -51,38 +348,194 @@ export class IxDialog extends LitElement {
     }
     onClosed() {
         this.dispatchEvent(new Event('closed'));
-        this.resetBodyStyles();
+        this.unlockScroll();
     }
     onCancel(e) {
-        if (this.preventCancel) {
+        if (this.preventCancel)
             e.preventDefault();
-        }
-        this.dispatchEvent(new Event('cancel'));
+        this.dispatchEvent(new Event('cancel', { bubbles: true, composed: true }));
     }
-    render() {
+    portalTemplate() {
         return html `
-      <md-dialog
-        ?open=${this.open}
-        class="dialog"
-        ?preventCloseOnScrimClick=${this.preventCloseOnScrimClick}
-        ?disableNextClickIsFromContent=${this.disableNextClickIsFromContent}
-        @open=${this.onOpen}
-        @opened=${this.onOpened}
-        @close=${this.onClose}
-        @closed=${this.onClosed}
-        @cancel=${this.onCancel}
+      <dialog
+        ${ref(this.dialogRef)}
+        @cancel=${this.onNativeCancel}
+        @keydown=${this.onKeydown}
       >
-        <slot slot="headline" name="headline"></slot>
-        <slot slot="content" name="content"></slot>
-        <slot slot="actions" name="actions"></slot>
-      </md-dialog>
+        <button
+          class="scrim"
+          type="button"
+          aria-label="Close dialog"
+          @click=${this.onScrimClick}
+        ></button>
+        <div
+          class="container"
+          ${ref(this.containerRef)}
+          role="dialog"
+          aria-modal="true"
+        >
+          <div class="headline"></div>
+          <div class="content"></div>
+          <div class="actions"></div>
+        </div>
+      </dialog>
     `;
     }
+    renderMdDialog() {
+        if (this.portalHost) {
+            this.moveNodesBackFromPortal();
+            this.teardownPortal();
+        }
+        return html `<md-dialog
+      ?open=${this.open}
+      class="dialog"
+      ?preventCloseOnScrimClick=${this.preventCloseOnScrimClick}
+      ?disableNextClickIsFromContent=${this.disableNextClickIsFromContent}
+      ?allowOverflow=${this.allowOverflow}
+      @open=${this.onOpen}
+      @opened=${this.onOpened}
+      @close=${this.onClose}
+      @closed=${this.onClosed}
+      @cancel=${this.onCancel}
+    >
+      <slot slot="headline" name="headline"></slot>
+      <slot slot="content" name="content"></slot>
+      <slot slot="actions" name="actions"></slot>
+    </md-dialog>`;
+    }
+    renderNativeDialog() {
+        if (this.portalRoot) {
+            render(this.portalTemplate(), this.portalRoot);
+            this.populatePortal();
+        }
+        return nothing;
+    }
+    render() {
+        return this.useNativeDialog
+            ? this.renderNativeDialog()
+            : this.renderMdDialog();
+    }
 }
 (() => {
     requestUpdateOnAriaChange(IxDialog);
 })();
-/** @nocollapse */
+IxDialog.styles = [
+    IxDialogStyles,
+    css `
+      :host([use-native-dialog]) dialog[open],
+      :host([use-native-dialog][closing]) dialog {
+        position: fixed;
+        inset: 0;
+        margin: 0;
+        padding: 0;
+        border: 0;
+        background: transparent;
+        display: block;
+        inline-size: 100vw;
+        block-size: 100dvh;
+        pointer-events: none;
+        z-index: 99;
+        overscroll-behavior: contain;
+      }
+
+      :host([use-native-dialog]) dialog[open] .scrim,
+      :host([use-native-dialog][closing]) .scrim,
+      :host([use-native-dialog]) dialog[open] > .container,
+      :host([use-native-dialog][closing]) dialog > .container {
+        pointer-events: auto;
+      }
+
+      :host([use-native-dialog]) dialog[open] .scrim,
+      :host([use-native-dialog][closing]) .scrim {
+        position: fixed;
+        inset: 0;
+        background: var(--ix-dialog-scrim, rgba(0, 0, 0, 0.32));
+      }
+
+      :host([use-native-dialog]) dialog[open] .scrim {
+        overscroll-behavior: contain;
+        touch-action: none;
+      }
+
+      :host([use-native-dialog]) dialog[open] > .container,
+      :host([use-native-dialog][closing]) dialog > .container {
+        transform: translate(-50%, -50%);
+        width: auto;
+        height: auto;
+        max-block-size: var(--ix-dialog-max-height, 90dvh);
+        border-radius: 0.75rem;
+        background: var(--ix-dialog-bg, #fff);
+        box-shadow: var(
+          --ix-dialog-shadow,
+          0 0.625rem 1.875rem rgba(0, 0, 0, 0.25)
+        );
+        display: grid;
+        grid-template-rows: auto 1fr auto;
+        overflow: hidden;
+        z-index: 9;
+        transform-origin: top center;
+        will-change: transform, opacity;
+      }
+
+      :host([use-native-dialog]) .headline,
+      :host([use-native-dialog]) .content,
+      :host([use-native-dialog]) .actions {
+        padding: var(--ix-dialog-section-padding, 1rem);
+      }
+
+      :host([use-native-dialog]) .content {
+        overflow: auto;
+      }
+
+      :host([use-native-dialog]) .actions {
+        display: inline-flex;
+        gap: var(--ix-dialog-actions-gap, 0.5rem);
+        justify-content: flex-end;
+        align-items: center;
+        padding-block: var(--ix-dialog-actions-padding-block, 0.75rem);
+        border-top: var(
+          --ix-dialog-actions-border,
+          1px solid rgba(0, 0, 0, 0.08)
+        );
+      }
+
+      @keyframes ix-fold-in {
+        from {
+          transform: translate(-50%, -50%) translateY(-0.5rem) scaleY(0.92);
+          opacity: 0;
+        }
+        to {
+          transform: translate(-50%, -50%) translateY(0) scaleY(1);
+          opacity: 1;
+        }
+      }
+      @keyframes ix-fold-out {
+        from {
+          transform: translate(-50%, -50%) translateY(0) scaleY(1);
+          opacity: 1;
+        }
+        to {
+          transform: translate(-50%, -50%) translateY(-0.5rem) scaleY(0.98);
+          opacity: 0;
+        }
+      }
+
+      :host([use-native-dialog]:not([closing])) dialog[open] > .container {
+        animation: ix-fold-in var(--ix-dialog-in-dur, 1000ms)
+          cubic-bezier(0.2, 0.7, 0.3, 1) both;
+      }
+      :host([use-native-dialog][closing]) dialog > .container {
+        animation: ix-fold-out var(--ix-dialog-out-dur, 250ms)
+          cubic-bezier(0.2, 0.7, 0.3, 1) both;
+      }
+
+      @media (prefers-reduced-motion: reduce) {
+        :host([use-native-dialog]) dialog > .container {
+          animation: none !important;
+        }
+      }
+    `,
+];
 IxDialog.shadowRootOptions = {
     ...LitElement.shadowRootOptions,
     delegatesFocus: true,
@@ -102,7 +555,13 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], IxDialog.prototype, "disableNextClickIsFromContent", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: 'use-native-dialog' })
+], IxDialog.prototype, "useNativeDialog", void 0);
+__decorate([
+    property({ type: Boolean })
+], IxDialog.prototype, "allowOverflow", void 0);
 __decorate([
     state()
-], IxDialog.prototype, "scrollPosition", void 0);
+], IxDialog.prototype, "nativeClosing", void 0);
 //# sourceMappingURL=IxDialog.js.map

package/dist/IxDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"IxDialog.js","sourceRoot":"","sources":["../src/IxDialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport './md-dialog.js';\nimport { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';\nimport { Dialog } from './internal/dialog.js';\n\nexport class IxDialog extends LitElement {\n  static {\n    requestUpdateOnAriaChange(IxDialog);\n  }\n\n  /** @nocollapse */\n  static override shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  @query('.dialog')\n  readonly component!: Dialog;\n\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  @property({ type: Boolean, attribute: 'prevent-cancel' }) preventCancel =\n    false;\n\n  @property({ type: Boolean }) preventCloseOnScrimClick = false;\n\n  @property({ type: Boolean }) disableNextClickIsFromContent = false;\n\n  @state() private scrollPosition = 0;\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.resetBodyStyles();\n  }\n\n  resetBodyStyles() {\n    const page = document.body;\n    page.style.paddingRight = '0';\n    page.style.position = '';\n    page.style.top = '';\n    page.style.left = '';\n    page.style.right = '';\n    page.style.overflow = '';\n    page.style.width = '';\n    window.scrollTo(0, this.scrollPosition);\n  }\n\n  onOpen() {\n    this.dispatchEvent(new Event('open'));\n    // IXUAT-9997 prevent page scroll on dialog open\n    const page = document.body;\n    const clientWidthBefore = page.clientWidth;\n    this.scrollPosition = window.scrollY;\n    page.style.overflow = 'hidden';\n    const clientWidthAfter = page.clientWidth;\n    const scrollbarWidth = clientWidthAfter - clientWidthBefore;\n    page.style.paddingRight = `${scrollbarWidth}px`;\n    page.style.position = 'fixed';\n    page.style.top = `-${this.scrollPosition}px`;\n    page.style.left = '0';\n    page.style.right = '0';\n    page.style.width = '100%';\n  }\n\n  onOpened() {\n    this.dispatchEvent(new Event('opened'));\n  }\n\n  onClose() {\n    this.dispatchEvent(new Event('close'));\n  }\n\n  onClosed() {\n    this.dispatchEvent(new Event('closed'));\n    this.resetBodyStyles();\n  }\n\n  onCancel(e: any) {\n    if (this.preventCancel) {\n      e.preventDefault();\n    }\n    this.dispatchEvent(new Event('cancel'));\n  }\n\n  render() {\n    return html`\n      <md-dialog\n        ?open=${this.open}\n        class=\"dialog\"\n        ?preventCloseOnScrimClick=${this.preventCloseOnScrimClick}\n        ?disableNextClickIsFromContent=${this.disableNextClickIsFromContent}\n        @open=${this.onOpen}\n        @opened=${this.onOpened}\n        @close=${this.onClose}\n        @closed=${this.onClosed}\n        @cancel=${this.onCancel}\n      >\n        <slot slot=\"headline\" name=\"headline\"></slot>\n        <slot slot=\"content\" name=\"content\"></slot>\n        <slot slot=\"actions\" name=\"actions\"></slot>\n      </md-dialog>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"IxDialog.js","sourceRoot":"","sources":["../src/IxDialog.ts"],"names":[],"mappings":"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","sourcesContent":["import { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';\nimport { css, CSSResultGroup, html, LitElement, nothing, render } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { createRef, ref, Ref } from 'lit/directives/ref.js';\nimport { Dialog } from './internal/dialog.js';\nimport { IxDialogStyles } from './ix-dialog-styles.js';\nimport './md-dialog.js';\n\nexport class IxDialog extends LitElement {\n  static {\n    requestUpdateOnAriaChange(IxDialog);\n  }\n\n  static styles: CSSResultGroup = [\n    IxDialogStyles,\n    css`\n      :host([use-native-dialog]) dialog[open],\n      :host([use-native-dialog][closing]) dialog {\n        position: fixed;\n        inset: 0;\n        margin: 0;\n        padding: 0;\n        border: 0;\n        background: transparent;\n        display: block;\n        inline-size: 100vw;\n        block-size: 100dvh;\n        pointer-events: none;\n        z-index: 99;\n        overscroll-behavior: contain;\n      }\n\n      :host([use-native-dialog]) dialog[open] .scrim,\n      :host([use-native-dialog][closing]) .scrim,\n      :host([use-native-dialog]) dialog[open] > .container,\n      :host([use-native-dialog][closing]) dialog > .container {\n        pointer-events: auto;\n      }\n\n      :host([use-native-dialog]) dialog[open] .scrim,\n      :host([use-native-dialog][closing]) .scrim {\n        position: fixed;\n        inset: 0;\n        background: var(--ix-dialog-scrim, rgba(0, 0, 0, 0.32));\n      }\n\n      :host([use-native-dialog]) dialog[open] .scrim {\n        overscroll-behavior: contain;\n        touch-action: none;\n      }\n\n      :host([use-native-dialog]) dialog[open] > .container,\n      :host([use-native-dialog][closing]) dialog > .container {\n        transform: translate(-50%, -50%);\n        width: auto;\n        height: auto;\n        max-block-size: var(--ix-dialog-max-height, 90dvh);\n        border-radius: 0.75rem;\n        background: var(--ix-dialog-bg, #fff);\n        box-shadow: var(\n          --ix-dialog-shadow,\n          0 0.625rem 1.875rem rgba(0, 0, 0, 0.25)\n        );\n        display: grid;\n        grid-template-rows: auto 1fr auto;\n        overflow: hidden;\n        z-index: 9;\n        transform-origin: top center;\n        will-change: transform, opacity;\n      }\n\n      :host([use-native-dialog]) .headline,\n      :host([use-native-dialog]) .content,\n      :host([use-native-dialog]) .actions {\n        padding: var(--ix-dialog-section-padding, 1rem);\n      }\n\n      :host([use-native-dialog]) .content {\n        overflow: auto;\n      }\n\n      :host([use-native-dialog]) .actions {\n        display: inline-flex;\n        gap: var(--ix-dialog-actions-gap, 0.5rem);\n        justify-content: flex-end;\n        align-items: center;\n        padding-block: var(--ix-dialog-actions-padding-block, 0.75rem);\n        border-top: var(\n          --ix-dialog-actions-border,\n          1px solid rgba(0, 0, 0, 0.08)\n        );\n      }\n\n      @keyframes ix-fold-in {\n        from {\n          transform: translate(-50%, -50%) translateY(-0.5rem) scaleY(0.92);\n          opacity: 0;\n        }\n        to {\n          transform: translate(-50%, -50%) translateY(0) scaleY(1);\n          opacity: 1;\n        }\n      }\n      @keyframes ix-fold-out {\n        from {\n          transform: translate(-50%, -50%) translateY(0) scaleY(1);\n          opacity: 1;\n        }\n        to {\n          transform: translate(-50%, -50%) translateY(-0.5rem) scaleY(0.98);\n          opacity: 0;\n        }\n      }\n\n      :host([use-native-dialog]:not([closing])) dialog[open] > .container {\n        animation: ix-fold-in var(--ix-dialog-in-dur, 1000ms)\n          cubic-bezier(0.2, 0.7, 0.3, 1) both;\n      }\n      :host([use-native-dialog][closing]) dialog > .container {\n        animation: ix-fold-out var(--ix-dialog-out-dur, 250ms)\n          cubic-bezier(0.2, 0.7, 0.3, 1) both;\n      }\n\n      @media (prefers-reduced-motion: reduce) {\n        :host([use-native-dialog]) dialog > .container {\n          animation: none !important;\n        }\n      }\n    `,\n  ];\n\n  static override shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  @query('.dialog') readonly component!: Dialog;\n\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  @property({ type: Boolean, attribute: 'prevent-cancel' }) preventCancel =\n    false;\n\n  @property({ type: Boolean }) preventCloseOnScrimClick = false;\n\n  @property({ type: Boolean }) disableNextClickIsFromContent = false;\n\n  @property({ type: Boolean, reflect: true, attribute: 'use-native-dialog' })\n  useNativeDialog = false;\n\n  @property({ type: Boolean }) allowOverflow = false;\n\n  @state() private nativeClosing = false;\n\n  private dialogRef: Ref<HTMLDialogElement> = createRef();\n\n  private containerRef: Ref<HTMLDivElement> = createRef();\n\n  private portalHost?: HTMLElement;\n\n  private portalRoot?: ShadowRoot;\n\n  private portalStyleEl?: HTMLStyleElement;\n\n  private pointerDownInside = false;\n\n  private isScrollLocked = false;\n\n  private scrollYBackup = 0;\n\n  private removeScrollHandlers?: () => void;\n\n  private nativeOnEnd?: () => void;\n\n  private mo?: MutationObserver;\n\n  private get nativeDialog(): HTMLDialogElement | null {\n    return this.dialogRef.value ?? null;\n  }\n\n  private get nativeDialogContainer(): HTMLDivElement | null {\n    return this.containerRef.value ?? null;\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    this.mo = new MutationObserver(() => {\n      if (this.useNativeDialog && this.open) this.populatePortal();\n    });\n    this.mo.observe(this, {\n      childList: true,\n      subtree: true,\n      attributes: true,\n      characterData: true,\n    });\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.mo?.disconnect();\n    this.unlockScroll();\n    this.teardownPortal();\n  }\n\n  updated(changed: Map<string, unknown>) {\n    if (!this.useNativeDialog) return;\n    if (changed.has('open')) {\n      if (this.open) {\n        this.ensurePortal();\n        if (this.portalRoot) {\n          this.attachPortalStyles();\n          render(this.portalTemplate(), this.portalRoot);\n          this.populatePortal();\n        }\n        if (this.nativeClosing) {\n          this.nativeClosing = false;\n          this.nativeDialogContainer?.classList.remove('closing');\n          if (this.nativeOnEnd && this.nativeDialogContainer) {\n            this.nativeDialogContainer.removeEventListener(\n              'animationend',\n              this.nativeOnEnd\n            );\n          }\n          this.nativeOnEnd = undefined;\n        }\n        this.dispatchEvent(\n          new Event('open', { bubbles: true, composed: true })\n        );\n        this.lockScroll();\n        requestAnimationFrame(() => {\n          this.nativeDialog?.show();\n          requestAnimationFrame(() => {\n            this.dispatchEvent(\n              new Event('opened', { bubbles: true, composed: true })\n            );\n          });\n        });\n      } else {\n        this.startNativeCloseAnimation();\n      }\n    }\n  }\n\n  public dismiss() {\n    if (!this.open) return;\n    Promise.resolve().then(() => {\n      this.requestClose();\n    });\n  }\n\n  private startNativeCloseAnimation() {\n    if (this.nativeClosing) return;\n    this.nativeClosing = true;\n    this.dispatchEvent(new Event('close', { bubbles: true, composed: true }));\n\n    const finish = () => {\n      this.nativeDialogContainer?.classList.remove('closing');\n      this.nativeClosing = false;\n      this.nativeDialog?.close();\n      this.unlockScroll();\n      this.dispatchEvent(\n        new Event('closed', { bubbles: true, composed: true })\n      );\n      this.moveNodesBackFromPortal();\n      this.teardownPortal();\n    };\n\n    const container = this.nativeDialogContainer;\n    if (!container) {\n      finish();\n      return;\n    }\n\n    container.classList.add('closing');\n\n    let done = false;\n    const onEnd = () => {\n      if (done) return;\n      done = true;\n      container.removeEventListener('animationend', onEnd);\n      finish();\n    };\n    this.nativeOnEnd = onEnd;\n    container.addEventListener('animationend', onEnd, { once: true });\n\n    window.setTimeout(onEnd, 1);\n  }\n\n  private ensurePortal() {\n    if (this.portalRoot) return;\n    const host = document.createElement('ix-dialog-portal-host');\n    const root = host.attachShadow({ mode: 'open' });\n    if (this.shadowRoot && 'adoptedStyleSheets' in this.shadowRoot) {\n      (root as any).adoptedStyleSheets = (\n        this.shadowRoot as any\n      ).adoptedStyleSheets;\n    }\n    document.body.appendChild(host);\n    this.portalHost = host;\n    this.portalRoot = root;\n  }\n\n  private attachPortalStyles() {\n    if (!this.portalRoot || this.portalStyleEl) return;\n    const style = document.createElement('style');\n    style.textContent = `\n  dialog {\n    position: fixed;\n    inset: 0;\n    margin: 0;\n    padding: 0;\n    border: 0;\n    top: 30%;\n    left: 5%;\n    background: transparent;\n    display: grid;\n    place-items: center;\n    pointer-events: none;\n    z-index: 1000;\n    max-width: none !important;\n    max-height: none !important;\n  }\n  .scrim {\n    position: fixed;\n    inset: 0;\n    background: var(--ix-dialog-scrim, rgba(0,0,0,0.32));\n    pointer-events: auto;\n    z-index: 1000;\n    touch-action: none;\n    border: 0;\n    padding: 0;\n    appearance: none;\n  }\n  .container {\n    position: relative;\n    border-radius: 0.75rem;\n    background: var(--ix-dialog-bg, #fff);\n    box-shadow: var(--ix-dialog-shadow, 0 10px 30px rgba(0,0,0,0.25));\n    display: grid;\n    grid-template-rows: auto 1fr auto;\n    overflow: visible;\n    pointer-events: auto;\n    z-index: 1001;\n    max-width: none!important;\n  }\n  .container .content {\n    overflow: visible;\n  }\n  @media (prefers-reduced-motion: reduce) {\n    dialog > .container { animation: none !important; }\n  }\n`;\n    this.portalRoot.append(style);\n    this.portalStyleEl = style;\n  }\n\n  private teardownPortal() {\n    if (!this.portalHost) return;\n    if (this.portalRoot) render(nothing, this.portalRoot);\n    this.portalStyleEl?.remove();\n    this.portalStyleEl = undefined;\n    this.portalHost.remove();\n    this.portalRoot = undefined;\n    this.portalHost = undefined;\n  }\n\n  private moveNodesToPortal(slotName: string, targetSelector: string) {\n    if (!this.nativeDialogContainer) return;\n    const target = this.nativeDialogContainer.querySelector(targetSelector);\n    if (!target) return;\n    const nodes = Array.from(this.children).filter(\n      el => el instanceof HTMLElement && el.slot === slotName\n    );\n    nodes.forEach(n => target.appendChild(n));\n  }\n\n  private moveNodesBackFromPortal() {\n    if (!this.nativeDialogContainer) return;\n    const h = this.nativeDialogContainer.querySelector('.headline');\n    const b = this.nativeDialogContainer.querySelector('.content');\n    const a = this.nativeDialogContainer.querySelector('.actions');\n    [h, b, a].forEach(container => {\n      if (!container) return;\n      const children = Array.from(container.childNodes);\n      children.forEach(n => this.appendChild(n));\n    });\n  }\n\n  private populatePortal() {\n    this.moveNodesToPortal('headline', '.headline');\n    this.moveNodesToPortal('content', '.content');\n    this.moveNodesToPortal('actions', '.actions');\n  }\n\n  private onKeydown = (e: KeyboardEvent) => {\n    if (e.key !== 'Escape') return;\n    if (this.preventCancel) {\n      e.preventDefault();\n      return;\n    }\n    const cancelEvt = new Event('cancel', {\n      bubbles: true,\n      composed: true,\n      cancelable: true,\n    });\n    const prevented = !this.dispatchEvent(cancelEvt);\n    if (prevented) {\n      e.preventDefault();\n      return;\n    }\n    this.requestClose();\n  };\n\n  private onNativeCancel = (e: Event) => {\n    const forwarded = new Event('cancel', {\n      bubbles: true,\n      composed: true,\n      cancelable: true,\n    });\n    const prevented = !this.dispatchEvent(forwarded);\n    if (prevented) {\n      e.preventDefault();\n      return;\n    }\n    this.requestClose();\n  };\n\n  private requestClose() {\n    this.open = false;\n  }\n\n  private onScrimClick = () => {\n    if (!this.preventCloseOnScrimClick) this.requestClose();\n  };\n\n  private lockScroll() {\n    if (this.isScrollLocked) return;\n    this.isScrollLocked = true;\n    this.scrollYBackup =\n      window.scrollY || document.documentElement.scrollTop || 0;\n    const { body } = document;\n    const scrollbarWidth =\n      window.innerWidth - document.documentElement.clientWidth;\n    if (scrollbarWidth > 0) {\n      body.style.paddingRight = `${scrollbarWidth}px`;\n    }\n    body.style.overflow = 'hidden';\n    body.style.position = 'fixed';\n    body.style.top = `-${this.scrollYBackup}px`;\n    body.style.left = '0';\n    body.style.right = '0';\n    body.style.width = '100%';\n    const stopIfOutside = (ev: Event) => {\n      const t = ev.target as Node | null;\n      if (!this.nativeDialogContainer || !t) return;\n      if (!this.nativeDialogContainer.contains(t)) ev.preventDefault();\n    };\n    const onTouchMove = (e: TouchEvent) => stopIfOutside(e);\n    const onKeyDown = (e: KeyboardEvent) => {\n      const keys = [\n        'PageUp',\n        'PageDown',\n        'Home',\n        'End',\n        'ArrowUp',\n        'ArrowDown',\n        ' ',\n      ];\n      if (!keys.includes(e.key)) return;\n      const t = e.target as Node | null;\n      if (!this.nativeDialogContainer || !t) return;\n      if (!this.nativeDialogContainer.contains(t)) e.preventDefault();\n    };\n    window.addEventListener('touchmove', onTouchMove, { passive: false });\n    window.addEventListener('keydown', onKeyDown, { passive: false });\n    this.removeScrollHandlers = () => {\n      window.removeEventListener('touchmove', onTouchMove as any);\n      window.removeEventListener('keydown', onKeyDown as any);\n    };\n  }\n\n  private unlockScroll() {\n    if (!this.isScrollLocked) return;\n    this.isScrollLocked = false;\n    if (this.removeScrollHandlers) {\n      this.removeScrollHandlers();\n      this.removeScrollHandlers = undefined;\n    }\n    const { body } = document;\n    body.style.paddingRight = '';\n    body.style.position = '';\n    body.style.top = '';\n    body.style.left = '';\n    body.style.right = '';\n    body.style.overflow = '';\n    body.style.width = '';\n    window.scrollTo(0, this.scrollYBackup || 0);\n  }\n\n  onOpen() {\n    this.dispatchEvent(new Event('open'));\n    this.lockScroll();\n  }\n\n  onOpened() {\n    this.dispatchEvent(new Event('opened'));\n  }\n\n  onClose() {\n    this.dispatchEvent(new Event('close'));\n  }\n\n  onClosed() {\n    this.dispatchEvent(new Event('closed'));\n    this.unlockScroll();\n  }\n\n  onCancel(e: Event) {\n    if (this.preventCancel) e.preventDefault();\n    this.dispatchEvent(new Event('cancel', { bubbles: true, composed: true }));\n  }\n\n  private portalTemplate() {\n    return html`\n      <dialog\n        ${ref(this.dialogRef)}\n        @cancel=${this.onNativeCancel}\n        @keydown=${this.onKeydown}\n      >\n        <button\n          class=\"scrim\"\n          type=\"button\"\n          aria-label=\"Close dialog\"\n          @click=${this.onScrimClick}\n        ></button>\n        <div\n          class=\"container\"\n          ${ref(this.containerRef)}\n          role=\"dialog\"\n          aria-modal=\"true\"\n        >\n          <div class=\"headline\"></div>\n          <div class=\"content\"></div>\n          <div class=\"actions\"></div>\n        </div>\n      </dialog>\n    `;\n  }\n\n  private renderMdDialog() {\n    if (this.portalHost) {\n      this.moveNodesBackFromPortal();\n      this.teardownPortal();\n    }\n    return html`<md-dialog\n      ?open=${this.open}\n      class=\"dialog\"\n      ?preventCloseOnScrimClick=${this.preventCloseOnScrimClick}\n      ?disableNextClickIsFromContent=${this.disableNextClickIsFromContent}\n      ?allowOverflow=${this.allowOverflow}\n      @open=${this.onOpen}\n      @opened=${this.onOpened}\n      @close=${this.onClose}\n      @closed=${this.onClosed}\n      @cancel=${this.onCancel}\n    >\n      <slot slot=\"headline\" name=\"headline\"></slot>\n      <slot slot=\"content\" name=\"content\"></slot>\n      <slot slot=\"actions\" name=\"actions\"></slot>\n    </md-dialog>`;\n  }\n\n  private renderNativeDialog() {\n    if (this.portalRoot) {\n      render(this.portalTemplate(), this.portalRoot);\n      this.populatePortal();\n    }\n    return nothing;\n  }\n\n  render() {\n    return this.useNativeDialog\n      ? this.renderNativeDialog()\n      : this.renderMdDialog();\n  }\n}\n"]}

package/dist/internal/dialog.d.ts

@@ -39,6 +39,7 @@ export declare class Dialog extends LitElement {
      */
     type?: 'alert';
     disableNextClickIsFromContent: boolean;
+    allowOverflow: boolean;
     /**
      * Gets the opening animation for a dialog. Set to a new function to customize
      * the animation.

package/dist/internal/dialog.js

@@ -58,6 +58,7 @@ export class Dialog extends LitElement {
          */
         this.returnValue = '';
         this.disableNextClickIsFromContent = false;
+        this.allowOverflow = false;
         /**
          * Gets the opening animation for a dialog. Set to a new function to customize
          * the animation.
@@ -213,6 +214,7 @@ export class Dialog extends LitElement {
             scrollable,
             'show-top-divider': scrollable && !this.isAtScrollTop,
             'show-bottom-divider': scrollable && !this.isAtScrollBottom,
+            'allow-overflow': this.allowOverflow,
         };
         const { ariaLabel } = this;
         return html `
@@ -406,6 +408,9 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], Dialog.prototype, "disableNextClickIsFromContent", void 0);
+__decorate([
+    property({ type: Boolean })
+], Dialog.prototype, "allowOverflow", void 0);
 __decorate([
     query('dialog')
 ], Dialog.prototype, "dialog", void 0);

package/dist/internal/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../src/internal/dialog.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable no-shadow */\n/* eslint-disable class-methods-use-this */\n/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '@material/web/divider/divider.js';\n\nimport { html, isServer, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { ARIAMixinStrict } from '@material/web/internal/aria/aria.js';\nimport { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';\nimport { redispatchEvent } from '@material/web/internal/events/redispatch-event.js';\n\nimport {\n  DIALOG_DEFAULT_CLOSE_ANIMATION,\n  DIALOG_DEFAULT_OPEN_ANIMATION,\n  DialogAnimation,\n  DialogAnimationArgs,\n} from '@material/web/dialog/internal/animations.js';\n\n/**\n * A dialog component.\n *\n * @fires open {Event} Dispatched when the dialog is opening before any animations.\n * @fires opened {Event} Dispatched when the dialog has opened after any animations.\n * @fires close {Event} Dispatched when the dialog is closing before any animations.\n * @fires closed {Event} Dispatched when the dialog has closed after any animations.\n * @fires cancel {Event} Dispatched when the dialog has been canceled by clicking\n * on the scrim or pressing Escape.\n */\nexport class Dialog extends LitElement {\n  static {\n    requestUpdateOnAriaChange(Dialog);\n  }\n\n  /**\n   * Opens the dialog when set to `true` and closes it when set to `false`.\n   */\n  @property({ type: Boolean })\n  get open() {\n    return this.isOpen;\n  }\n\n  set open(open: boolean) {\n    if (open === this.isOpen) {\n      return;\n    }\n\n    this.isOpen = open;\n    if (open) {\n      this.setAttribute('open', '');\n      this.show();\n    } else {\n      this.removeAttribute('open');\n      this.close();\n    }\n  }\n\n  /**\n   * When set to `true`, prevents the dialog from closing when clicking on the scrim\n   */\n  @property({ type: Boolean }) preventCloseOnScrimClick = false;\n\n  /**\n   * Gets or sets the dialog's return value, usually to indicate which button\n   * a user pressed to close it.\n   *\n   * https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/returnValue\n   */\n  @property({ attribute: false }) returnValue = '';\n\n  /**\n   * The type of dialog for accessibility. Set this to `alert` to announce a\n   * dialog as an alert dialog.\n   */\n  @property() type?: 'alert';\n\n  @property({ type: Boolean }) disableNextClickIsFromContent = false;\n\n  /**\n   * Gets the opening animation for a dialog. Set to a new function to customize\n   * the animation.\n   */\n  getOpenAnimation = () => DIALOG_DEFAULT_OPEN_ANIMATION;\n\n  /**\n   * Gets the closing animation for a dialog. Set to a new function to customize\n   * the animation.\n   */\n  getCloseAnimation = () => DIALOG_DEFAULT_CLOSE_ANIMATION;\n\n  private isOpen = false;\n\n  private isOpening = false;\n\n  // getIsConnectedPromise() immediately sets the resolve property.\n  private isConnectedPromiseResolve!: () => void;\n\n  private isConnectedPromise = this.getIsConnectedPromise();\n\n  @query('dialog') private readonly dialog!: HTMLDialogElement | null;\n\n  @query('.scrim') private readonly scrim!: HTMLDialogElement | null;\n\n  @query('.container') private readonly container!: HTMLDialogElement | null;\n\n  @query('.headline') private readonly headline!: HTMLDialogElement | null;\n\n  @query('.content') private readonly content!: HTMLDialogElement | null;\n\n  @query('.actions') private readonly actions!: HTMLDialogElement | null;\n\n  @state() private isAtScrollTop = false;\n\n  @state() private isAtScrollBottom = false;\n\n  @query('.scroller') private readonly scroller!: HTMLElement | null;\n\n  @query('.top.anchor') private readonly topAnchor!: HTMLElement | null;\n\n  @query('.bottom.anchor') private readonly bottomAnchor!: HTMLElement | null;\n\n  private nextClickIsFromContent = false;\n\n  private intersectionObserver?: IntersectionObserver;\n\n  // Dialogs should not be SSR'd while open, so we can just use runtime checks.\n  @state() private hasHeadline = false;\n\n  @state() private hasActions = false;\n\n  @state() private hasIcon = false;\n\n  // See https://bugs.chromium.org/p/chromium/issues/detail?id=1512224\n  // Chrome v120 has a bug where escape keys do not trigger cancels. If we get\n  // a dialog \"close\" event that is triggered without a \"cancel\" after an escape\n  // keydown, then we need to manually trigger our closing logic.\n  //\n  // This bug occurs when pressing escape to close a dialog without first\n  // interacting with the dialog's content.\n  //\n  // Cleanup tracking:\n  // https://github.com/material-components/material-web/issues/5330\n  // This can be removed when full CloseWatcher support added and the above bug\n  // in Chromium is fixed to fire 'cancel' with one escape press and close with\n  // multiple.\n  private escapePressedWithoutCancel = false;\n\n  constructor() {\n    super();\n    if (!isServer) {\n      this.addEventListener('submit', this.handleSubmit);\n\n      // We do not use `delegatesFocus: true` due to a Chromium bug with\n      // selecting text.\n      // See https://bugs.chromium.org/p/chromium/issues/detail?id=950357\n      //\n      // Material requires using focus trapping within the dialog (see\n      // b/314840853 for the bug to add it). This would normally mean we don't\n      // care about delegating focus since the `<dialog>` never receives it.\n      // However, we still need to handle situations when a user has not\n      // provided an focusable child in the content. When that happens, the\n      // `<dialog>` itself is focused.\n      //\n      // Listen to focus/blur instead of focusin/focusout since those can bubble\n      // from content.\n      this.addEventListener('focus', () => {\n        this.dialog?.focus();\n      });\n      this.addEventListener('blur', () => {\n        this.dialog?.blur();\n      });\n    }\n  }\n\n  /**\n   * Opens the dialog and fires a cancelable `open` event. After a dialog's\n   * animation, an `opened` event is fired.\n   *\n   * Add an `autocomplete` attribute to a child of the dialog that should\n   * receive focus after opening.\n   *\n   * @return A Promise that resolves after the animation is finished and the\n   *     `opened` event was fired.\n   */\n  async show() {\n    this.isOpening = true;\n    // Dialogs can be opened before being attached to the DOM, so we need to\n    // wait until we're connected before calling `showModal()`.\n    await this.isConnectedPromise;\n    await this.updateComplete;\n    const dialog = this.dialog!;\n    // Check if already opened or if `dialog.close()` was called while awaiting.\n    if (dialog.open || !this.isOpening) {\n      this.isOpening = false;\n      return;\n    }\n\n    const preventOpen = !this.dispatchEvent(\n      new Event('open', { cancelable: true })\n    );\n    if (preventOpen) {\n      this.open = false;\n      return;\n    }\n\n    // All Material dialogs are modal.\n    dialog.showModal();\n    this.open = true;\n    // Reset scroll position if re-opening a dialog with the same content.\n    if (this.scroller) {\n      this.scroller.scrollTop = 0;\n    }\n    // Native modal dialogs ignore autofocus and instead force focus to the\n    // first focusable child. Override this behavior if there is a child with\n    // an autofocus attribute.\n    this.querySelector<HTMLElement>('[autofocus]')?.focus();\n\n    await this.animateDialog(this.getOpenAnimation());\n    this.dispatchEvent(new Event('opened'));\n    this.isOpening = false;\n  }\n\n  /**\n   * Closes the dialog and fires a cancelable `close` event. After a dialog's\n   * animation, a `closed` event is fired.\n   *\n   * @param returnValue A return value usually indicating which button was used\n   *     to close a dialog. If a dialog is canceled by clicking the scrim or\n   *     pressing Escape, it will not change the return value after closing.\n   * @return A Promise that resolves after the animation is finished and the\n   *     `closed` event was fired.\n   */\n  async close(returnValue = this.returnValue) {\n    this.isOpening = false;\n    if (!this.isConnected) {\n      // Disconnected dialogs do not fire close events or animate.\n      this.open = false;\n      return;\n    }\n\n    await this.updateComplete;\n    const dialog = this.dialog!;\n    // Check if already closed or if `dialog.show()` was called while awaiting.\n    if (!dialog.open || this.isOpening) {\n      this.open = false;\n      return;\n    }\n\n    const prevReturnValue = this.returnValue;\n    this.returnValue = returnValue;\n    const preventClose = !this.dispatchEvent(\n      new Event('close', { cancelable: true })\n    );\n    if (preventClose) {\n      this.returnValue = prevReturnValue;\n      return;\n    }\n\n    await this.animateDialog(this.getCloseAnimation());\n    dialog.close(returnValue);\n    this.open = false;\n    this.dispatchEvent(new Event('closed'));\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.isConnectedPromiseResolve();\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.isConnectedPromise = this.getIsConnectedPromise();\n  }\n\n  protected override render() {\n    const scrollable =\n      this.open && !(this.isAtScrollTop && this.isAtScrollBottom);\n    const classes = {\n      'has-headline': this.hasHeadline,\n      'has-actions': this.hasActions,\n      'has-icon': this.hasIcon,\n      scrollable,\n      'show-top-divider': scrollable && !this.isAtScrollTop,\n      'show-bottom-divider': scrollable && !this.isAtScrollBottom,\n    };\n\n    const { ariaLabel } = this as ARIAMixinStrict;\n    return html`\n      <div class=\"scrim\"></div>\n      <dialog\n        class=${classMap(classes)}\n        aria-label=${ariaLabel || nothing}\n        aria-labelledby=${this.hasHeadline ? 'headline' : nothing}\n        role=${this.type === 'alert' ? 'alertdialog' : nothing}\n        @cancel=${this.handleCancel}\n        @click=${this.handleDialogClick}\n        @close=${this.handleClose}\n        @keydown=${this.handleKeydown}\n        .returnValue=${this.returnValue || nothing}\n      >\n        <div class=\"container\" @mousedown=${this.handleContentClick}>\n          <div class=\"headline\">\n            <div class=\"icon\" aria-hidden=\"true\">\n              <slot name=\"icon\" @slotchange=${this.handleIconChange}></slot>\n            </div>\n            <h2 id=\"headline\" aria-hidden=${!this.hasHeadline || nothing}>\n              <slot\n                name=\"headline\"\n                @slotchange=${this.handleHeadlineChange}\n              ></slot>\n            </h2>\n            <md-divider></md-divider>\n          </div>\n          <div class=\"scroller\">\n            <div class=\"content\">\n              <div class=\"top anchor\"></div>\n              <slot name=\"content\"></slot>\n              <div class=\"bottom anchor\"></div>\n            </div>\n          </div>\n          <div class=\"actions\">\n            <md-divider></md-divider>\n            <slot name=\"actions\" @slotchange=${this.handleActionsChange}></slot>\n          </div>\n        </div>\n      </dialog>\n    `;\n  }\n\n  protected override firstUpdated() {\n    this.intersectionObserver = new IntersectionObserver(\n      entries => {\n        for (const entry of entries) {\n          this.handleAnchorIntersection(entry);\n        }\n      },\n      { root: this.scroller! }\n    );\n\n    this.intersectionObserver.observe(this.topAnchor!);\n    this.intersectionObserver.observe(this.bottomAnchor!);\n  }\n\n  private handleDialogClick(e: MouseEvent) {\n    const container = this.container as EventTarget;\n    if (e.composedPath().includes(container)) {\n      // Ignore clicks on the dialog itself.\n      return;\n    }\n\n    if (this.nextClickIsFromContent && !this.disableNextClickIsFromContent) {\n      // Avoid doing a layout calculation below if we know the click came from\n      // content.\n      this.nextClickIsFromContent = false;\n      return;\n    }\n\n    // If preventCloseOnScrimClick is true, do not close the dialog when clicking on the scrim\n    if (this.preventCloseOnScrimClick) {\n      return;\n    }\n\n    // Click originated on the backdrop. Native `<dialog>`s will not cancel,\n    // but Material dialogs do.\n    const preventDefault = !this.dispatchEvent(\n      new Event('cancel', { cancelable: true })\n    );\n    if (preventDefault) {\n      return;\n    }\n\n    this.close();\n  }\n\n  private handleContentClick() {\n    this.nextClickIsFromContent = true;\n  }\n\n  private handleSubmit(event: SubmitEvent) {\n    const form = event.target as HTMLFormElement;\n    const { submitter } = event;\n    if (form.method !== 'dialog' || !submitter) {\n      return;\n    }\n\n    // Close reason is the submitter's value attribute, or the dialog's\n    // `returnValue` if there is no attribute.\n    this.close(submitter.getAttribute('value') ?? this.returnValue);\n  }\n\n  private handleCancel(event: Event) {\n    if (event.target !== this.dialog) {\n      // Ignore any cancel events dispatched by content.\n      return;\n    }\n\n    this.escapePressedWithoutCancel = false;\n    const preventDefault = !redispatchEvent(this, event);\n    // We always prevent default on the original dialog event since we'll\n    // animate closing it before it actually closes.\n    event.preventDefault();\n    if (preventDefault) {\n      return;\n    }\n\n    this.close();\n  }\n\n  private handleClose() {\n    if (!this.escapePressedWithoutCancel) {\n      return;\n    }\n\n    this.escapePressedWithoutCancel = false;\n    this.dialog?.dispatchEvent(new Event('cancel', { cancelable: true }));\n  }\n\n  private handleKeydown(event: KeyboardEvent) {\n    if (event.key !== 'Escape') {\n      return;\n    }\n\n    // An escape key was pressed. If a \"close\" event fires next without a\n    // \"cancel\" event first, then we know we're in the Chrome v120 bug.\n    this.escapePressedWithoutCancel = true;\n    // Wait a full task for the cancel/close event listeners to fire, then\n    // reset the flag.\n    setTimeout(() => {\n      this.escapePressedWithoutCancel = false;\n    });\n  }\n\n  private async animateDialog(animation: DialogAnimation) {\n    const { dialog, scrim, container, headline, content, actions } = this;\n    if (!dialog || !scrim || !container || !headline || !content || !actions) {\n      return;\n    }\n\n    const {\n      container: containerAnimate,\n      dialog: dialogAnimate,\n      scrim: scrimAnimate,\n      headline: headlineAnimate,\n      content: contentAnimate,\n      actions: actionsAnimate,\n    } = animation;\n\n    const elementAndAnimation: Array<[Element, DialogAnimationArgs[]]> = [\n      [dialog, dialogAnimate ?? []],\n      [scrim, scrimAnimate ?? []],\n      [container, containerAnimate ?? []],\n      [headline, headlineAnimate ?? []],\n      [content, contentAnimate ?? []],\n      [actions, actionsAnimate ?? []],\n    ];\n\n    const animations: Animation[] = [];\n    for (const [element, animation] of elementAndAnimation) {\n      for (const animateArgs of animation) {\n        animations.push(element.animate(...animateArgs));\n      }\n    }\n\n    await Promise.all(animations.map(animation => animation.finished));\n  }\n\n  private handleHeadlineChange(event: Event) {\n    const slot = event.target as HTMLSlotElement;\n    this.hasHeadline = slot.assignedElements().length > 0;\n  }\n\n  private handleActionsChange(event: Event) {\n    const slot = event.target as HTMLSlotElement;\n    this.hasActions = slot.assignedElements().length > 0;\n  }\n\n  private handleIconChange(event: Event) {\n    const slot = event.target as HTMLSlotElement;\n    this.hasIcon = slot.assignedElements().length > 0;\n  }\n\n  private handleAnchorIntersection(entry: IntersectionObserverEntry) {\n    const { target, isIntersecting } = entry;\n    if (target === this.topAnchor) {\n      this.isAtScrollTop = isIntersecting;\n    }\n\n    if (target === this.bottomAnchor) {\n      this.isAtScrollBottom = isIntersecting;\n    }\n  }\n\n  private getIsConnectedPromise() {\n    return new Promise<void>(resolve => {\n      this.isConnectedPromiseResolve = resolve;\n    });\n  }\n}\n"]}
+{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../src/internal/dialog.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable no-shadow */\n/* eslint-disable class-methods-use-this */\n/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '@material/web/divider/divider.js';\n\nimport { html, isServer, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport { ARIAMixinStrict } from '@material/web/internal/aria/aria.js';\nimport { requestUpdateOnAriaChange } from '@material/web/internal/aria/delegate.js';\nimport { redispatchEvent } from '@material/web/internal/events/redispatch-event.js';\n\nimport {\n  DIALOG_DEFAULT_CLOSE_ANIMATION,\n  DIALOG_DEFAULT_OPEN_ANIMATION,\n  DialogAnimation,\n  DialogAnimationArgs,\n} from '@material/web/dialog/internal/animations.js';\n\n/**\n * A dialog component.\n *\n * @fires open {Event} Dispatched when the dialog is opening before any animations.\n * @fires opened {Event} Dispatched when the dialog has opened after any animations.\n * @fires close {Event} Dispatched when the dialog is closing before any animations.\n * @fires closed {Event} Dispatched when the dialog has closed after any animations.\n * @fires cancel {Event} Dispatched when the dialog has been canceled by clicking\n * on the scrim or pressing Escape.\n */\nexport class Dialog extends LitElement {\n  static {\n    requestUpdateOnAriaChange(Dialog);\n  }\n\n  /**\n   * Opens the dialog when set to `true` and closes it when set to `false`.\n   */\n  @property({ type: Boolean })\n  get open() {\n    return this.isOpen;\n  }\n\n  set open(open: boolean) {\n    if (open === this.isOpen) {\n      return;\n    }\n\n    this.isOpen = open;\n    if (open) {\n      this.setAttribute('open', '');\n      this.show();\n    } else {\n      this.removeAttribute('open');\n      this.close();\n    }\n  }\n\n  /**\n   * When set to `true`, prevents the dialog from closing when clicking on the scrim\n   */\n  @property({ type: Boolean }) preventCloseOnScrimClick = false;\n\n  /**\n   * Gets or sets the dialog's return value, usually to indicate which button\n   * a user pressed to close it.\n   *\n   * https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/returnValue\n   */\n  @property({ attribute: false }) returnValue = '';\n\n  /**\n   * The type of dialog for accessibility. Set this to `alert` to announce a\n   * dialog as an alert dialog.\n   */\n  @property() type?: 'alert';\n\n  @property({ type: Boolean }) disableNextClickIsFromContent = false;\n\n  @property({ type: Boolean }) allowOverflow = false;\n\n  /**\n   * Gets the opening animation for a dialog. Set to a new function to customize\n   * the animation.\n   */\n  getOpenAnimation = () => DIALOG_DEFAULT_OPEN_ANIMATION;\n\n  /**\n   * Gets the closing animation for a dialog. Set to a new function to customize\n   * the animation.\n   */\n  getCloseAnimation = () => DIALOG_DEFAULT_CLOSE_ANIMATION;\n\n  private isOpen = false;\n\n  private isOpening = false;\n\n  // getIsConnectedPromise() immediately sets the resolve property.\n  private isConnectedPromiseResolve!: () => void;\n\n  private isConnectedPromise = this.getIsConnectedPromise();\n\n  @query('dialog') private readonly dialog!: HTMLDialogElement | null;\n\n  @query('.scrim') private readonly scrim!: HTMLDialogElement | null;\n\n  @query('.container') private readonly container!: HTMLDialogElement | null;\n\n  @query('.headline') private readonly headline!: HTMLDialogElement | null;\n\n  @query('.content') private readonly content!: HTMLDialogElement | null;\n\n  @query('.actions') private readonly actions!: HTMLDialogElement | null;\n\n  @state() private isAtScrollTop = false;\n\n  @state() private isAtScrollBottom = false;\n\n  @query('.scroller') private readonly scroller!: HTMLElement | null;\n\n  @query('.top.anchor') private readonly topAnchor!: HTMLElement | null;\n\n  @query('.bottom.anchor') private readonly bottomAnchor!: HTMLElement | null;\n\n  private nextClickIsFromContent = false;\n\n  private intersectionObserver?: IntersectionObserver;\n\n  // Dialogs should not be SSR'd while open, so we can just use runtime checks.\n  @state() private hasHeadline = false;\n\n  @state() private hasActions = false;\n\n  @state() private hasIcon = false;\n\n  // See https://bugs.chromium.org/p/chromium/issues/detail?id=1512224\n  // Chrome v120 has a bug where escape keys do not trigger cancels. If we get\n  // a dialog \"close\" event that is triggered without a \"cancel\" after an escape\n  // keydown, then we need to manually trigger our closing logic.\n  //\n  // This bug occurs when pressing escape to close a dialog without first\n  // interacting with the dialog's content.\n  //\n  // Cleanup tracking:\n  // https://github.com/material-components/material-web/issues/5330\n  // This can be removed when full CloseWatcher support added and the above bug\n  // in Chromium is fixed to fire 'cancel' with one escape press and close with\n  // multiple.\n  private escapePressedWithoutCancel = false;\n\n  constructor() {\n    super();\n    if (!isServer) {\n      this.addEventListener('submit', this.handleSubmit);\n\n      // We do not use `delegatesFocus: true` due to a Chromium bug with\n      // selecting text.\n      // See https://bugs.chromium.org/p/chromium/issues/detail?id=950357\n      //\n      // Material requires using focus trapping within the dialog (see\n      // b/314840853 for the bug to add it). This would normally mean we don't\n      // care about delegating focus since the `<dialog>` never receives it.\n      // However, we still need to handle situations when a user has not\n      // provided an focusable child in the content. When that happens, the\n      // `<dialog>` itself is focused.\n      //\n      // Listen to focus/blur instead of focusin/focusout since those can bubble\n      // from content.\n      this.addEventListener('focus', () => {\n        this.dialog?.focus();\n      });\n      this.addEventListener('blur', () => {\n        this.dialog?.blur();\n      });\n    }\n  }\n\n  /**\n   * Opens the dialog and fires a cancelable `open` event. After a dialog's\n   * animation, an `opened` event is fired.\n   *\n   * Add an `autocomplete` attribute to a child of the dialog that should\n   * receive focus after opening.\n   *\n   * @return A Promise that resolves after the animation is finished and the\n   *     `opened` event was fired.\n   */\n  async show() {\n    this.isOpening = true;\n    // Dialogs can be opened before being attached to the DOM, so we need to\n    // wait until we're connected before calling `showModal()`.\n    await this.isConnectedPromise;\n    await this.updateComplete;\n    const dialog = this.dialog!;\n    // Check if already opened or if `dialog.close()` was called while awaiting.\n    if (dialog.open || !this.isOpening) {\n      this.isOpening = false;\n      return;\n    }\n\n    const preventOpen = !this.dispatchEvent(\n      new Event('open', { cancelable: true })\n    );\n    if (preventOpen) {\n      this.open = false;\n      return;\n    }\n\n    // All Material dialogs are modal.\n    dialog.showModal();\n    this.open = true;\n    // Reset scroll position if re-opening a dialog with the same content.\n    if (this.scroller) {\n      this.scroller.scrollTop = 0;\n    }\n    // Native modal dialogs ignore autofocus and instead force focus to the\n    // first focusable child. Override this behavior if there is a child with\n    // an autofocus attribute.\n    this.querySelector<HTMLElement>('[autofocus]')?.focus();\n\n    await this.animateDialog(this.getOpenAnimation());\n    this.dispatchEvent(new Event('opened'));\n    this.isOpening = false;\n  }\n\n  /**\n   * Closes the dialog and fires a cancelable `close` event. After a dialog's\n   * animation, a `closed` event is fired.\n   *\n   * @param returnValue A return value usually indicating which button was used\n   *     to close a dialog. If a dialog is canceled by clicking the scrim or\n   *     pressing Escape, it will not change the return value after closing.\n   * @return A Promise that resolves after the animation is finished and the\n   *     `closed` event was fired.\n   */\n  async close(returnValue = this.returnValue) {\n    this.isOpening = false;\n    if (!this.isConnected) {\n      // Disconnected dialogs do not fire close events or animate.\n      this.open = false;\n      return;\n    }\n\n    await this.updateComplete;\n    const dialog = this.dialog!;\n    // Check if already closed or if `dialog.show()` was called while awaiting.\n    if (!dialog.open || this.isOpening) {\n      this.open = false;\n      return;\n    }\n\n    const prevReturnValue = this.returnValue;\n    this.returnValue = returnValue;\n    const preventClose = !this.dispatchEvent(\n      new Event('close', { cancelable: true })\n    );\n    if (preventClose) {\n      this.returnValue = prevReturnValue;\n      return;\n    }\n\n    await this.animateDialog(this.getCloseAnimation());\n    dialog.close(returnValue);\n    this.open = false;\n    this.dispatchEvent(new Event('closed'));\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.isConnectedPromiseResolve();\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.isConnectedPromise = this.getIsConnectedPromise();\n  }\n\n  protected override render() {\n    const scrollable =\n      this.open && !(this.isAtScrollTop && this.isAtScrollBottom);\n    const classes = {\n      'has-headline': this.hasHeadline,\n      'has-actions': this.hasActions,\n      'has-icon': this.hasIcon,\n      scrollable,\n      'show-top-divider': scrollable && !this.isAtScrollTop,\n      'show-bottom-divider': scrollable && !this.isAtScrollBottom,\n      'allow-overflow': this.allowOverflow,\n    };\n\n    const { ariaLabel } = this as ARIAMixinStrict;\n    return html`\n      <div class=\"scrim\"></div>\n      <dialog\n        class=${classMap(classes)}\n        aria-label=${ariaLabel || nothing}\n        aria-labelledby=${this.hasHeadline ? 'headline' : nothing}\n        role=${this.type === 'alert' ? 'alertdialog' : nothing}\n        @cancel=${this.handleCancel}\n        @click=${this.handleDialogClick}\n        @close=${this.handleClose}\n        @keydown=${this.handleKeydown}\n        .returnValue=${this.returnValue || nothing}\n      >\n        <div class=\"container\" @mousedown=${this.handleContentClick}>\n          <div class=\"headline\">\n            <div class=\"icon\" aria-hidden=\"true\">\n              <slot name=\"icon\" @slotchange=${this.handleIconChange}></slot>\n            </div>\n            <h2 id=\"headline\" aria-hidden=${!this.hasHeadline || nothing}>\n              <slot\n                name=\"headline\"\n                @slotchange=${this.handleHeadlineChange}\n              ></slot>\n            </h2>\n            <md-divider></md-divider>\n          </div>\n          <div class=\"scroller\">\n            <div class=\"content\">\n              <div class=\"top anchor\"></div>\n              <slot name=\"content\"></slot>\n              <div class=\"bottom anchor\"></div>\n            </div>\n          </div>\n          <div class=\"actions\">\n            <md-divider></md-divider>\n            <slot name=\"actions\" @slotchange=${this.handleActionsChange}></slot>\n          </div>\n        </div>\n      </dialog>\n    `;\n  }\n\n  protected override firstUpdated() {\n    this.intersectionObserver = new IntersectionObserver(\n      entries => {\n        for (const entry of entries) {\n          this.handleAnchorIntersection(entry);\n        }\n      },\n      { root: this.scroller! }\n    );\n\n    this.intersectionObserver.observe(this.topAnchor!);\n    this.intersectionObserver.observe(this.bottomAnchor!);\n  }\n\n  private handleDialogClick(e: MouseEvent) {\n    const container = this.container as EventTarget;\n    if (e.composedPath().includes(container)) {\n      // Ignore clicks on the dialog itself.\n      return;\n    }\n\n    if (this.nextClickIsFromContent && !this.disableNextClickIsFromContent) {\n      // Avoid doing a layout calculation below if we know the click came from\n      // content.\n      this.nextClickIsFromContent = false;\n      return;\n    }\n\n    // If preventCloseOnScrimClick is true, do not close the dialog when clicking on the scrim\n    if (this.preventCloseOnScrimClick) {\n      return;\n    }\n\n    // Click originated on the backdrop. Native `<dialog>`s will not cancel,\n    // but Material dialogs do.\n    const preventDefault = !this.dispatchEvent(\n      new Event('cancel', { cancelable: true })\n    );\n    if (preventDefault) {\n      return;\n    }\n\n    this.close();\n  }\n\n  private handleContentClick() {\n    this.nextClickIsFromContent = true;\n  }\n\n  private handleSubmit(event: SubmitEvent) {\n    const form = event.target as HTMLFormElement;\n    const { submitter } = event;\n    if (form.method !== 'dialog' || !submitter) {\n      return;\n    }\n\n    // Close reason is the submitter's value attribute, or the dialog's\n    // `returnValue` if there is no attribute.\n    this.close(submitter.getAttribute('value') ?? this.returnValue);\n  }\n\n  private handleCancel(event: Event) {\n    if (event.target !== this.dialog) {\n      // Ignore any cancel events dispatched by content.\n      return;\n    }\n\n    this.escapePressedWithoutCancel = false;\n    const preventDefault = !redispatchEvent(this, event);\n    // We always prevent default on the original dialog event since we'll\n    // animate closing it before it actually closes.\n    event.preventDefault();\n    if (preventDefault) {\n      return;\n    }\n\n    this.close();\n  }\n\n  private handleClose() {\n    if (!this.escapePressedWithoutCancel) {\n      return;\n    }\n\n    this.escapePressedWithoutCancel = false;\n    this.dialog?.dispatchEvent(new Event('cancel', { cancelable: true }));\n  }\n\n  private handleKeydown(event: KeyboardEvent) {\n    if (event.key !== 'Escape') {\n      return;\n    }\n\n    // An escape key was pressed. If a \"close\" event fires next without a\n    // \"cancel\" event first, then we know we're in the Chrome v120 bug.\n    this.escapePressedWithoutCancel = true;\n    // Wait a full task for the cancel/close event listeners to fire, then\n    // reset the flag.\n    setTimeout(() => {\n      this.escapePressedWithoutCancel = false;\n    });\n  }\n\n  private async animateDialog(animation: DialogAnimation) {\n    const { dialog, scrim, container, headline, content, actions } = this;\n    if (!dialog || !scrim || !container || !headline || !content || !actions) {\n      return;\n    }\n\n    const {\n      container: containerAnimate,\n      dialog: dialogAnimate,\n      scrim: scrimAnimate,\n      headline: headlineAnimate,\n      content: contentAnimate,\n      actions: actionsAnimate,\n    } = animation;\n\n    const elementAndAnimation: Array<[Element, DialogAnimationArgs[]]> = [\n      [dialog, dialogAnimate ?? []],\n      [scrim, scrimAnimate ?? []],\n      [container, containerAnimate ?? []],\n      [headline, headlineAnimate ?? []],\n      [content, contentAnimate ?? []],\n      [actions, actionsAnimate ?? []],\n    ];\n\n    const animations: Animation[] = [];\n    for (const [element, animation] of elementAndAnimation) {\n      for (const animateArgs of animation) {\n        animations.push(element.animate(...animateArgs));\n      }\n    }\n\n    await Promise.all(animations.map(animation => animation.finished));\n  }\n\n  private handleHeadlineChange(event: Event) {\n    const slot = event.target as HTMLSlotElement;\n    this.hasHeadline = slot.assignedElements().length > 0;\n  }\n\n  private handleActionsChange(event: Event) {\n    const slot = event.target as HTMLSlotElement;\n    this.hasActions = slot.assignedElements().length > 0;\n  }\n\n  private handleIconChange(event: Event) {\n    const slot = event.target as HTMLSlotElement;\n    this.hasIcon = slot.assignedElements().length > 0;\n  }\n\n  private handleAnchorIntersection(entry: IntersectionObserverEntry) {\n    const { target, isIntersecting } = entry;\n    if (target === this.topAnchor) {\n      this.isAtScrollTop = isIntersecting;\n    }\n\n    if (target === this.bottomAnchor) {\n      this.isAtScrollBottom = isIntersecting;\n    }\n  }\n\n  private getIsConnectedPromise() {\n    return new Promise<void>(resolve => {\n      this.isConnectedPromiseResolve = resolve;\n    });\n  }\n}\n"]}

package/dist/ix-dialog-styles.d.ts

@@ -0,0 +1 @@
+export declare const IxDialogStyles: import("lit").CSSResult;

package/dist/ix-dialog-styles.js

@@ -0,0 +1,55 @@
+import { css } from 'lit';
+export const IxDialogStyles = css `
+  :host {
+    display: contents;
+  }
+
+  dialog {
+    border: none;
+    padding: 0;
+    margin: 0;
+    max-width: 90vw;
+    max-height: 90dvh;
+    width: auto;
+    background: transparent;
+  }
+
+  dialog::backdrop {
+    background: rgba(0, 0, 0, 0.32);
+  }
+
+  .container {
+    box-sizing: border-box;
+    background: var(--ix-dialog-bg, #fff);
+    color: var(--ix-dialog-fg, inherit);
+    border-radius: var(--ix-dialog-radius, 0.75rem);
+    max-width: var(--ix-dialog-max-width, 45rem);
+    overflow: hidden;
+    box-shadow: var(
+      --ix-dialog-shadow,
+      0 0.625rem 1.875rem rgba(0, 0, 0, 0.25)
+    );
+  }
+
+  .headline {
+    padding: 1.25rem 1.5rem 0.75rem;
+    font: var(
+      --ix-dialog-headline-font,
+      600 1.125rem/1.2 system-ui,
+      sans-serif
+    );
+  }
+
+  .content {
+    padding: 0 1.5rem 1rem;
+    overflow: auto;
+  }
+
+  .actions {
+    padding: 0.75rem 1rem 1rem;
+    display: flex;
+    gap: 0.5rem;
+    justify-content: flex-end;
+  }
+`;
+//# sourceMappingURL=ix-dialog-styles.js.map

package/dist/ix-dialog-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ix-dialog-styles.js","sourceRoot":"","sources":["../src/ix-dialog-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDhC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxDialogStyles = css`\n  :host {\n    display: contents;\n  }\n\n  dialog {\n    border: none;\n    padding: 0;\n    margin: 0;\n    max-width: 90vw;\n    max-height: 90dvh;\n    width: auto;\n    background: transparent;\n  }\n\n  dialog::backdrop {\n    background: rgba(0, 0, 0, 0.32);\n  }\n\n  .container {\n    box-sizing: border-box;\n    background: var(--ix-dialog-bg, #fff);\n    color: var(--ix-dialog-fg, inherit);\n    border-radius: var(--ix-dialog-radius, 0.75rem);\n    max-width: var(--ix-dialog-max-width, 45rem);\n    overflow: hidden;\n    box-shadow: var(\n      --ix-dialog-shadow,\n      0 0.625rem 1.875rem rgba(0, 0, 0, 0.25)\n    );\n  }\n\n  .headline {\n    padding: 1.25rem 1.5rem 0.75rem;\n    font: var(\n      --ix-dialog-headline-font,\n      600 1.125rem/1.2 system-ui,\n      sans-serif\n    );\n  }\n\n  .content {\n    padding: 0 1.5rem 1rem;\n    overflow: auto;\n  }\n\n  .actions {\n    padding: 0.75rem 1rem 1rem;\n    display: flex;\n    gap: 0.5rem;\n    justify-content: flex-end;\n  }\n`;\n"]}

package/dist/ix-dialog.d.ts

@@ -1,4 +1,5 @@
+import type { CSSResultGroup } from 'lit';
 import { IxDialog } from './IxDialog.js';
 export declare class IxDialogStyled extends IxDialog {
-    static styles: import("lit").CSSResult;
+    static styles: CSSResultGroup;
 }

package/dist/ix-dialog.js

@@ -1,12 +1,17 @@
+var _a, _b;
 import { css } from 'lit';
 import { IxDialog } from './IxDialog.js';
-export class IxDialogStyled extends IxDialog {
+export class IxDialogStyled extends (_b = IxDialog) {
 }
-IxDialogStyled.styles = css `
-    .dialog {
-      max-height: 90vh;
-      max-width: 90vw;
-    }
-  `;
-window.customElements.define('ix-dialog', IxDialogStyled);
+_a = IxDialogStyled;
+IxDialogStyled.styles = [
+    Reflect.get(_b, "styles", _a),
+    css `
+      .dialog {
+        max-height: 90vh;
+        max-width: 90vw;
+      }
+    `,
+];
+customElements.define('ix-dialog', IxDialogStyled);
 //# sourceMappingURL=ix-dialog.js.map

package/dist/ix-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"ix-dialog.js","sourceRoot":"","sources":["../src/ix-dialog.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,MAAM,OAAO,cAAe,SAAQ,QAAQ;;AAC1B,qBAAM,GAAG,GAAG,CAAA;;;;;GAK3B,CAAC;AAGJ,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC","sourcesContent":["import { css } from 'lit';\nimport { IxDialog } from './IxDialog.js';\n\nexport class IxDialogStyled extends IxDialog {\n  static override styles = css`\n    .dialog {\n      max-height: 90vh;\n      max-width: 90vw;\n    }\n  `;\n}\n\nwindow.customElements.define('ix-dialog', IxDialogStyled);\n"]}
+{"version":3,"file":"ix-dialog.js","sourceRoot":"","sources":["../src/ix-dialog.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,MAAM,OAAO,cAAe,SAAQ,MAAA,QAAQ,CAAA;;;AAC1B,qBAAM,GAAmB;IACvC,6BAAK;IACL,GAAG,CAAA;;;;;KAKF;CACF,CAAC;AAGJ,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,CAAC","sourcesContent":["import type { CSSResultGroup } from 'lit';\nimport { css } from 'lit';\nimport { IxDialog } from './IxDialog.js';\n\nexport class IxDialogStyled extends IxDialog {\n  static override styles: CSSResultGroup = [\n    super.styles,\n    css`\n      .dialog {\n        max-height: 90vh;\n        max-width: 90vw;\n      }\n    `,\n  ];\n}\n\ncustomElements.define('ix-dialog', IxDialogStyled);\n"]}

package/dist/ix-dialog.min.js

@@ -1 +1,47 @@
-import{LitElement,isServer,nothing,html,css}from"lit";import{__decorate}from"tslib";import{property,query,state}from"lit/decorators.js";import"@material/web/divider/divider.js";import{classMap}from"lit/directives/class-map.js";import{requestUpdateOnAriaChange}from"@material/web/internal/aria/delegate.js";import{redispatchEvent}from"@material/web/internal/events/redispatch-event.js";import{DIALOG_DEFAULT_OPEN_ANIMATION,DIALOG_DEFAULT_CLOSE_ANIMATION}from"@material/web/dialog/internal/animations.js";class Dialog extends LitElement{get open(){return this.isOpen}set open(e){e!==this.isOpen&&((this.isOpen=e)?(this.setAttribute("open",""),this.show()):(this.removeAttribute("open"),this.close()))}constructor(){super(),this.preventCloseOnScrimClick=!1,this.returnValue="",this.disableNextClickIsFromContent=!1,this.getOpenAnimation=()=>DIALOG_DEFAULT_OPEN_ANIMATION,this.getCloseAnimation=()=>DIALOG_DEFAULT_CLOSE_ANIMATION,this.isOpen=!1,this.isOpening=!1,this.isConnectedPromise=this.getIsConnectedPromise(),this.isAtScrollTop=!1,this.isAtScrollBottom=!1,this.nextClickIsFromContent=!1,this.hasHeadline=!1,this.hasActions=!1,this.hasIcon=!1,this.escapePressedWithoutCancel=!1,isServer||(this.addEventListener("submit",this.handleSubmit),this.addEventListener("focus",()=>{var e;null!=(e=this.dialog)&&e.focus()}),this.addEventListener("blur",()=>{var e;null!=(e=this.dialog)&&e.blur()}))}async show(){this.isOpening=!0,await this.isConnectedPromise,await this.updateComplete;var e=this.dialog;e.open||!this.isOpening?this.isOpening=!1:!this.dispatchEvent(new Event("open",{cancelable:!0}))?this.open=!1:(e.showModal(),this.open=!0,this.scroller&&(this.scroller.scrollTop=0),null!=(e=this.querySelector("[autofocus]"))&&e.focus(),await this.animateDialog(this.getOpenAnimation()),this.dispatchEvent(new Event("opened")),this.isOpening=!1)}async close(e=this.returnValue){var t,i;this.isOpening=!1,!this.isConnected||(await this.updateComplete,!(t=this.dialog).open)||this.isOpening?this.open=!1:(i=this.returnValue,this.returnValue=e,!this.dispatchEvent(new Event("close",{cancelable:!0}))?this.returnValue=i:(await this.animateDialog(this.getCloseAnimation()),t.close(e),this.open=!1,this.dispatchEvent(new Event("closed"))))}connectedCallback(){super.connectedCallback(),this.isConnectedPromiseResolve()}disconnectedCallback(){super.disconnectedCallback(),this.isConnectedPromise=this.getIsConnectedPromise()}render(){var e=this.open&&!(this.isAtScrollTop&&this.isAtScrollBottom),e={"has-headline":this.hasHeadline,"has-actions":this.hasActions,"has-icon":this.hasIcon,scrollable:e,"show-top-divider":e&&!this.isAtScrollTop,"show-bottom-divider":e&&!this.isAtScrollBottom},t=this.ariaLabel;return html`<div class="scrim"></div><dialog class="${classMap(e)}" aria-label="${t||nothing}" aria-labelledby="${this.hasHeadline?"headline":nothing}" role="${"alert"===this.type?"alertdialog":nothing}" @cancel="${this.handleCancel}" @click="${this.handleDialogClick}" @close="${this.handleClose}" @keydown="${this.handleKeydown}" .returnValue="${this.returnValue||nothing}"><div class="container" @mousedown="${this.handleContentClick}"><div class="headline"><div class="icon" aria-hidden="true"><slot name="icon" @slotchange="${this.handleIconChange}"></slot></div><h2 id="headline" aria-hidden="${!this.hasHeadline||nothing}"><slot name="headline" @slotchange="${this.handleHeadlineChange}"></slot></h2><md-divider></md-divider></div><div class="scroller"><div class="content"><div class="top anchor"></div><slot name="content"></slot><div class="bottom anchor"></div></div></div><div class="actions"><md-divider></md-divider><slot name="actions" @slotchange="${this.handleActionsChange}"></slot></div></div></dialog>`}firstUpdated(){this.intersectionObserver=new IntersectionObserver(e=>{for(var t of e)this.handleAnchorIntersection(t)},{root:this.scroller}),this.intersectionObserver.observe(this.topAnchor),this.intersectionObserver.observe(this.bottomAnchor)}handleDialogClick(e){var t=this.container;e.composedPath().includes(t)||(this.nextClickIsFromContent&&!this.disableNextClickIsFromContent?this.nextClickIsFromContent=!1:!this.preventCloseOnScrimClick&&this.dispatchEvent(new Event("cancel",{cancelable:!0}))&&this.close())}handleContentClick(){this.nextClickIsFromContent=!0}handleSubmit(e){var t=e.submitter;"dialog"===e.target.method&&t&&this.close(null!=(e=t.getAttribute("value"))?e:this.returnValue)}handleCancel(e){var t;e.target!==this.dialog||(this.escapePressedWithoutCancel=!1,t=!redispatchEvent(this,e),e.preventDefault(),t)||this.close()}handleClose(){var e;this.escapePressedWithoutCancel&&(this.escapePressedWithoutCancel=!1,null!=(e=this.dialog))&&e.dispatchEvent(new Event("cancel",{cancelable:!0}))}handleKeydown(e){"Escape"===e.key&&(this.escapePressedWithoutCancel=!0,setTimeout(()=>{this.escapePressedWithoutCancel=!1}))}async animateDialog(e){var{dialog:i,scrim:o,container:n,headline:s,content:a,actions:l}=this;if(i&&o&&n&&s&&a&&l){var{container:r,dialog:d,scrim:c,headline:h,content:p,actions:m}=e,g=[];for(let[e,t]of[[i,null!=d?d:[]],[o,null!=c?c:[]],[n,null!=r?r:[]],[s,null!=h?h:[]],[a,null!=p?p:[]],[l,null!=m?m:[]]])for(var v of t)g.push(e.animate(...v));await Promise.all(g.map(e=>e.finished))}}handleHeadlineChange(e){e=e.target;this.hasHeadline=0<e.assignedElements().length}handleActionsChange(e){e=e.target;this.hasActions=0<e.assignedElements().length}handleIconChange(e){e=e.target;this.hasIcon=0<e.assignedElements().length}handleAnchorIntersection(e){var{target:e,isIntersecting:t}=e;e===this.topAnchor&&(this.isAtScrollTop=t),e===this.bottomAnchor&&(this.isAtScrollBottom=t)}getIsConnectedPromise(){return new Promise(e=>{this.isConnectedPromiseResolve=e})}}requestUpdateOnAriaChange(Dialog),__decorate([property({type:Boolean})],Dialog.prototype,"open",null),__decorate([property({type:Boolean})],Dialog.prototype,"preventCloseOnScrimClick",void 0),__decorate([property({attribute:!1})],Dialog.prototype,"returnValue",void 0),__decorate([property()],Dialog.prototype,"type",void 0),__decorate([property({type:Boolean})],Dialog.prototype,"disableNextClickIsFromContent",void 0),__decorate([query("dialog")],Dialog.prototype,"dialog",void 0),__decorate([query(".scrim")],Dialog.prototype,"scrim",void 0),__decorate([query(".container")],Dialog.prototype,"container",void 0),__decorate([query(".headline")],Dialog.prototype,"headline",void 0),__decorate([query(".content")],Dialog.prototype,"content",void 0),__decorate([query(".actions")],Dialog.prototype,"actions",void 0),__decorate([state()],Dialog.prototype,"isAtScrollTop",void 0),__decorate([state()],Dialog.prototype,"isAtScrollBottom",void 0),__decorate([query(".scroller")],Dialog.prototype,"scroller",void 0),__decorate([query(".top.anchor")],Dialog.prototype,"topAnchor",void 0),__decorate([query(".bottom.anchor")],Dialog.prototype,"bottomAnchor",void 0),__decorate([state()],Dialog.prototype,"hasHeadline",void 0),__decorate([state()],Dialog.prototype,"hasActions",void 0),__decorate([state()],Dialog.prototype,"hasIcon",void 0);let styles=css`:host{border-start-start-radius:var(--md-dialog-container-shape-start-start,var(--md-dialog-container-shape,var(--md-sys-shape-corner-extra-large,28px)));border-start-end-radius:var(--md-dialog-container-shape-start-end,var(--md-dialog-container-shape,var(--md-sys-shape-corner-extra-large,28px)));border-end-end-radius:var(--md-dialog-container-shape-end-end,var(--md-dialog-container-shape,var(--md-sys-shape-corner-extra-large,28px)));border-end-start-radius:var(--md-dialog-container-shape-end-start,var(--md-dialog-container-shape,var(--md-sys-shape-corner-extra-large,28px)));display:contents;margin:auto;max-height:min(560px,100% - 48px);max-width:min(560px,100% - 48px);min-width:280px;position:fixed;height:fit-content;width:fit-content}dialog{background:rgba(0,0,0,0);border:none;border-radius:inherit;box-shadow:0 12px 16px 0 rgba(0,0,0,.58);flex-direction:column;height:inherit;margin:inherit;max-height:inherit;max-width:inherit;min-height:inherit;min-width:inherit;outline:0;overflow:visible;padding:0;width:inherit}dialog[open]{display:block}::backdrop{background:rgba(0,0,0,.5)}h2{all:unset;align-self:stretch}.headline{align-items:center;color:var(--md-dialog-headline-color,var(--md-sys-color-on-surface,#1d1b20));display:flex;flex-direction:column;font-family:var(--md-dialog-headline-font,var(--md-sys-typescale-headline-small-font,var(--md-ref-typeface-brand,Roboto)));font-size:var(--md-dialog-headline-size,var(--md-sys-typescale-headline-small-size,1.5rem));line-height:var(--md-dialog-headline-line-height,var(--md-sys-typescale-headline-small-line-height,2rem));font-weight:var(--md-dialog-headline-weight,var(--md-sys-typescale-headline-small-weight,var(--md-ref-typeface-weight-regular,400)));position:relative}slot[name=headline]::slotted(*){align-items:center;align-self:stretch;box-sizing:border-box;display:flex;gap:8px;padding:24px 24px 0}.icon{display:flex}slot[name=icon]::slotted(*){color:var(--md-dialog-icon-color,var(--md-sys-color-secondary,#625b71));fill:currentColor;font-size:var(--md-dialog-icon-size,24px);margin-top:24px;height:var(--md-dialog-icon-size,24px);width:var(--md-dialog-icon-size,24px)}.has-icon slot[name=headline]::slotted(*){justify-content:center;padding-top:16px}.scrollable slot[name=headline]::slotted(*){padding-bottom:16px}.scrollable.has-headline slot[name=content]::slotted(*){padding-top:8px}.container{border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative;transform-origin:top}.container::before{background:var(--md-dialog-container-color,var(--md-sys-color-surface-container-high,#ece6f0));border-radius:inherit;content:'';inset:0;position:absolute}.scroller{display:flex;flex:1;flex-direction:column;overflow:initial;z-index:1}.scrollable .scroller{overflow-y:scroll}.content{color:var(--clr-on-surface,#092241);font-family:var(--text-default-font,sans-serif);font-size:var(--text-default-size,16px);letter-spacing:var(--text-default-letter-spacing,.0275em);line-height:var(--text-default-line-height,1.75em);font-weight:var(--text-default-weight,normal);text-transform:var(--text-default-decoration,none);text-decoration:var(--text-default-transform,none);height:min-content;position:relative}slot[name=content]::slotted(*){box-sizing:border-box;padding:24px}.anchor{position:absolute}.top.anchor{top:0}.bottom.anchor{bottom:0}.actions{position:relative}slot[name=actions]::slotted(*){box-sizing:border-box;display:flex;gap:8px;justify-content:flex-end;padding:16px 24px 24px}.has-actions slot[name=content]::slotted(*){padding-bottom:8px}md-divider{display:none;position:absolute}.has-actions.show-bottom-divider .actions md-divider,.has-headline.show-top-divider .headline md-divider{display:flex}.headline md-divider{bottom:0}.actions md-divider{top:0}@media (forced-colors:active){dialog{outline:2px solid WindowText}}`;class MdDialog extends Dialog{}MdDialog.styles=[styles],window.customElements.define("md-dialog",MdDialog);class IxDialog extends LitElement{constructor(){super(...arguments),this.open=!1,this.preventCancel=!1,this.preventCloseOnScrimClick=!1,this.disableNextClickIsFromContent=!1,this.scrollPosition=0}disconnectedCallback(){super.disconnectedCallback(),this.resetBodyStyles()}resetBodyStyles(){var e=document.body;e.style.paddingRight="0",e.style.position="",e.style.top="",e.style.left="",e.style.right="",e.style.overflow="",e.style.width="",window.scrollTo(0,this.scrollPosition)}onOpen(){this.dispatchEvent(new Event("open"));var e=document.body,t=e.clientWidth,i=(this.scrollPosition=window.scrollY,e.style.overflow="hidden",e.clientWidth);e.style.paddingRight=i-t+"px",e.style.position="fixed",e.style.top=`-${this.scrollPosition}px`,e.style.left="0",e.style.right="0",e.style.width="100%"}onOpened(){this.dispatchEvent(new Event("opened"))}onClose(){this.dispatchEvent(new Event("close"))}onClosed(){this.dispatchEvent(new Event("closed")),this.resetBodyStyles()}onCancel(e){this.preventCancel&&e.preventDefault(),this.dispatchEvent(new Event("cancel"))}render(){return html`<md-dialog ?open="${this.open}" class="dialog" ?preventCloseOnScrimClick="${this.preventCloseOnScrimClick}" ?disableNextClickIsFromContent="${this.disableNextClickIsFromContent}" @open="${this.onOpen}" @opened="${this.onOpened}" @close="${this.onClose}" @closed="${this.onClosed}" @cancel="${this.onCancel}"><slot slot="headline" name="headline"></slot><slot slot="content" name="content"></slot><slot slot="actions" name="actions"></slot></md-dialog>`}}requestUpdateOnAriaChange(IxDialog),IxDialog.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0},__decorate([query(".dialog")],IxDialog.prototype,"component",void 0),__decorate([property({type:Boolean,reflect:!0})],IxDialog.prototype,"open",void 0),__decorate([property({type:Boolean,attribute:"prevent-cancel"})],IxDialog.prototype,"preventCancel",void 0),__decorate([property({type:Boolean})],IxDialog.prototype,"preventCloseOnScrimClick",void 0),__decorate([property({type:Boolean})],IxDialog.prototype,"disableNextClickIsFromContent",void 0),__decorate([state()],IxDialog.prototype,"scrollPosition",void 0);class IxDialogStyled extends IxDialog{}IxDialogStyled.styles=css`.dialog{max-height:90vh;max-width:90vw}`,window.customElements.define("ix-dialog",IxDialogStyled);export{IxDialogStyled};
+import{css,LitElement,isServer,nothing,html,render}from"lit";import{__decorate}from"tslib";import{requestUpdateOnAriaChange}from"@material/web/internal/aria/delegate.js";import{property,query,state}from"lit/decorators.js";import{createRef,ref}from"lit/directives/ref.js";import"@material/web/divider/divider.js";import{classMap}from"lit/directives/class-map.js";import{redispatchEvent}from"@material/web/internal/events/redispatch-event.js";import{DIALOG_DEFAULT_OPEN_ANIMATION,DIALOG_DEFAULT_CLOSE_ANIMATION}from"@material/web/dialog/internal/animations.js";let IxDialogStyles=css`:host{display:contents}dialog{border:none;padding:0;margin:0;max-width:90vw;max-height:90dvh;width:auto;background:0 0}dialog::backdrop{background:rgba(0,0,0,.32)}.container{box-sizing:border-box;background:var(--ix-dialog-bg,#fff);color:var(--ix-dialog-fg,inherit);border-radius:var(--ix-dialog-radius,.75rem);max-width:var(--ix-dialog-max-width,45rem);overflow:hidden;box-shadow:var(--ix-dialog-shadow,0 .625rem 1.875rem rgba(0,0,0,.25))}.headline{padding:1.25rem 1.5rem .75rem;font:var(--ix-dialog-headline-font,600 1.125rem/1.2 system-ui,sans-serif)}.content{padding:0 1.5rem 1rem;overflow:auto}.actions{padding:.75rem 1rem 1rem;display:flex;gap:.5rem;justify-content:flex-end}`;class Dialog extends LitElement{get open(){return this.isOpen}set open(e){e!==this.isOpen&&((this.isOpen=e)?(this.setAttribute("open",""),this.show()):(this.removeAttribute("open"),this.close()))}constructor(){super(),this.preventCloseOnScrimClick=!1,this.returnValue="",this.disableNextClickIsFromContent=!1,this.allowOverflow=!1,this.getOpenAnimation=()=>DIALOG_DEFAULT_OPEN_ANIMATION,this.getCloseAnimation=()=>DIALOG_DEFAULT_CLOSE_ANIMATION,this.isOpen=!1,this.isOpening=!1,this.isConnectedPromise=this.getIsConnectedPromise(),this.isAtScrollTop=!1,this.isAtScrollBottom=!1,this.nextClickIsFromContent=!1,this.hasHeadline=!1,this.hasActions=!1,this.hasIcon=!1,this.escapePressedWithoutCancel=!1,isServer||(this.addEventListener("submit",this.handleSubmit),this.addEventListener("focus",()=>{var e;null!=(e=this.dialog)&&e.focus()}),this.addEventListener("blur",()=>{var e;null!=(e=this.dialog)&&e.blur()}))}async show(){this.isOpening=!0,await this.isConnectedPromise,await this.updateComplete;var e=this.dialog;e.open||!this.isOpening?this.isOpening=!1:!this.dispatchEvent(new Event("open",{cancelable:!0}))?this.open=!1:(e.showModal(),this.open=!0,this.scroller&&(this.scroller.scrollTop=0),null!=(e=this.querySelector("[autofocus]"))&&e.focus(),await this.animateDialog(this.getOpenAnimation()),this.dispatchEvent(new Event("opened")),this.isOpening=!1)}async close(e=this.returnValue){var t,o;this.isOpening=!1,!this.isConnected||(await this.updateComplete,!(t=this.dialog).open)||this.isOpening?this.open=!1:(o=this.returnValue,this.returnValue=e,!this.dispatchEvent(new Event("close",{cancelable:!0}))?this.returnValue=o:(await this.animateDialog(this.getCloseAnimation()),t.close(e),this.open=!1,this.dispatchEvent(new Event("closed"))))}connectedCallback(){super.connectedCallback(),this.isConnectedPromiseResolve()}disconnectedCallback(){super.disconnectedCallback(),this.isConnectedPromise=this.getIsConnectedPromise()}render(){var e=this.open&&!(this.isAtScrollTop&&this.isAtScrollBottom),e={"has-headline":this.hasHeadline,"has-actions":this.hasActions,"has-icon":this.hasIcon,scrollable:e,"show-top-divider":e&&!this.isAtScrollTop,"show-bottom-divider":e&&!this.isAtScrollBottom,"allow-overflow":this.allowOverflow},t=this.ariaLabel;return html`<div class="scrim"></div><dialog class="${classMap(e)}" aria-label="${t||nothing}" aria-labelledby="${this.hasHeadline?"headline":nothing}" role="${"alert"===this.type?"alertdialog":nothing}" @cancel="${this.handleCancel}" @click="${this.handleDialogClick}" @close="${this.handleClose}" @keydown="${this.handleKeydown}" .returnValue="${this.returnValue||nothing}"><div class="container" @mousedown="${this.handleContentClick}"><div class="headline"><div class="icon" aria-hidden="true"><slot name="icon" @slotchange="${this.handleIconChange}"></slot></div><h2 id="headline" aria-hidden="${!this.hasHeadline||nothing}"><slot name="headline" @slotchange="${this.handleHeadlineChange}"></slot></h2><md-divider></md-divider></div><div class="scroller"><div class="content"><div class="top anchor"></div><slot name="content"></slot><div class="bottom anchor"></div></div></div><div class="actions"><md-divider></md-divider><slot name="actions" @slotchange="${this.handleActionsChange}"></slot></div></div></dialog>`}firstUpdated(){this.intersectionObserver=new IntersectionObserver(e=>{for(var t of e)this.handleAnchorIntersection(t)},{root:this.scroller}),this.intersectionObserver.observe(this.topAnchor),this.intersectionObserver.observe(this.bottomAnchor)}handleDialogClick(e){var t=this.container;e.composedPath().includes(t)||(this.nextClickIsFromContent&&!this.disableNextClickIsFromContent?this.nextClickIsFromContent=!1:!this.preventCloseOnScrimClick&&this.dispatchEvent(new Event("cancel",{cancelable:!0}))&&this.close())}handleContentClick(){this.nextClickIsFromContent=!0}handleSubmit(e){var t=e.submitter;"dialog"===e.target.method&&t&&this.close(null!=(e=t.getAttribute("value"))?e:this.returnValue)}handleCancel(e){var t;e.target!==this.dialog||(this.escapePressedWithoutCancel=!1,t=!redispatchEvent(this,e),e.preventDefault(),t)||this.close()}handleClose(){var e;this.escapePressedWithoutCancel&&(this.escapePressedWithoutCancel=!1,null!=(e=this.dialog))&&e.dispatchEvent(new Event("cancel",{cancelable:!0}))}handleKeydown(e){"Escape"===e.key&&(this.escapePressedWithoutCancel=!0,setTimeout(()=>{this.escapePressedWithoutCancel=!1}))}async animateDialog(e){var{dialog:o,scrim:i,container:a,headline:n,content:s,actions:l}=this;if(o&&i&&a&&n&&s&&l){var{container:r,dialog:d,scrim:c,headline:h,content:p,actions:v}=e,g=[];for(let[e,t]of[[o,null!=d?d:[]],[i,null!=c?c:[]],[a,null!=r?r:[]],[n,null!=h?h:[]],[s,null!=p?p:[]],[l,null!=v?v:[]]])for(var m of t)g.push(e.animate(...m));await Promise.all(g.map(e=>e.finished))}}handleHeadlineChange(e){e=e.target;this.hasHeadline=0<e.assignedElements().length}handleActionsChange(e){e=e.target;this.hasActions=0<e.assignedElements().length}handleIconChange(e){e=e.target;this.hasIcon=0<e.assignedElements().length}handleAnchorIntersection(e){var{target:e,isIntersecting:t}=e;e===this.topAnchor&&(this.isAtScrollTop=t),e===this.bottomAnchor&&(this.isAtScrollBottom=t)}getIsConnectedPromise(){return new Promise(e=>{this.isConnectedPromiseResolve=e})}}requestUpdateOnAriaChange(Dialog),__decorate([property({type:Boolean})],Dialog.prototype,"open",null),__decorate([property({type:Boolean})],Dialog.prototype,"preventCloseOnScrimClick",void 0),__decorate([property({attribute:!1})],Dialog.prototype,"returnValue",void 0),__decorate([property()],Dialog.prototype,"type",void 0),__decorate([property({type:Boolean})],Dialog.prototype,"disableNextClickIsFromContent",void 0),__decorate([property({type:Boolean})],Dialog.prototype,"allowOverflow",void 0),__decorate([query("dialog")],Dialog.prototype,"dialog",void 0),__decorate([query(".scrim")],Dialog.prototype,"scrim",void 0),__decorate([query(".container")],Dialog.prototype,"container",void 0),__decorate([query(".headline")],Dialog.prototype,"headline",void 0),__decorate([query(".content")],Dialog.prototype,"content",void 0),__decorate([query(".actions")],Dialog.prototype,"actions",void 0),__decorate([state()],Dialog.prototype,"isAtScrollTop",void 0),__decorate([state()],Dialog.prototype,"isAtScrollBottom",void 0),__decorate([query(".scroller")],Dialog.prototype,"scroller",void 0),__decorate([query(".top.anchor")],Dialog.prototype,"topAnchor",void 0),__decorate([query(".bottom.anchor")],Dialog.prototype,"bottomAnchor",void 0),__decorate([state()],Dialog.prototype,"hasHeadline",void 0),__decorate([state()],Dialog.prototype,"hasActions",void 0),__decorate([state()],Dialog.prototype,"hasIcon",void 0);let styles=css`:host{border-start-start-radius:var(--md-dialog-container-shape-start-start,var(--md-dialog-container-shape,var(--md-sys-shape-corner-extra-large,28px)));border-start-end-radius:var(--md-dialog-container-shape-start-end,var(--md-dialog-container-shape,var(--md-sys-shape-corner-extra-large,28px)));border-end-end-radius:var(--md-dialog-container-shape-end-end,var(--md-dialog-container-shape,var(--md-sys-shape-corner-extra-large,28px)));border-end-start-radius:var(--md-dialog-container-shape-end-start,var(--md-dialog-container-shape,var(--md-sys-shape-corner-extra-large,28px)));display:contents;margin:auto;max-height:min(560px,100% - 48px);max-width:min(560px,100% - 48px);min-width:280px;position:fixed;height:fit-content;width:fit-content}dialog{background:rgba(0,0,0,0);border:none;border-radius:inherit;box-shadow:0 12px 16px 0 rgba(0,0,0,.58);flex-direction:column;height:inherit;margin:inherit;max-height:inherit;max-width:inherit;min-height:inherit;min-width:inherit;outline:0;overflow:visible;padding:0;width:inherit}dialog[open]{display:block}::backdrop{background:rgba(0,0,0,.5)}h2{all:unset;align-self:stretch}.headline{align-items:center;color:var(--md-dialog-headline-color,var(--md-sys-color-on-surface,#1d1b20));display:flex;flex-direction:column;font-family:var(--md-dialog-headline-font,var(--md-sys-typescale-headline-small-font,var(--md-ref-typeface-brand,Roboto)));font-size:var(--md-dialog-headline-size,var(--md-sys-typescale-headline-small-size,1.5rem));line-height:var(--md-dialog-headline-line-height,var(--md-sys-typescale-headline-small-line-height,2rem));font-weight:var(--md-dialog-headline-weight,var(--md-sys-typescale-headline-small-weight,var(--md-ref-typeface-weight-regular,400)));position:relative}slot[name=headline]::slotted(*){align-items:center;align-self:stretch;box-sizing:border-box;display:flex;gap:8px;padding:24px 24px 0}.icon{display:flex}slot[name=icon]::slotted(*){color:var(--md-dialog-icon-color,var(--md-sys-color-secondary,#625b71));fill:currentColor;font-size:var(--md-dialog-icon-size,24px);margin-top:24px;height:var(--md-dialog-icon-size,24px);width:var(--md-dialog-icon-size,24px)}.has-icon slot[name=headline]::slotted(*){justify-content:center;padding-top:16px}.scrollable slot[name=headline]::slotted(*){padding-bottom:16px}.scrollable.has-headline slot[name=content]::slotted(*){padding-top:8px}.container{border-radius:inherit;display:flex;flex-direction:column;flex-grow:1;overflow:hidden;position:relative;transform-origin:top}.allow-overflow .container{overflow:visible}.container::before{background:var(--md-dialog-container-color,var(--md-sys-color-surface-container-high,#ece6f0));border-radius:inherit;content:'';inset:0;position:absolute}.scroller{display:flex;flex:1;flex-direction:column;overflow:initial;z-index:1}.scrollable .scroller{overflow-y:scroll}.content{color:var(--clr-on-surface,#092241);font-family:var(--text-default-font,sans-serif);font-size:var(--text-default-size,16px);letter-spacing:var(--text-default-letter-spacing,.0275em);line-height:var(--text-default-line-height,1.75em);font-weight:var(--text-default-weight,normal);text-transform:var(--text-default-decoration,none);text-decoration:var(--text-default-transform,none);height:min-content;position:relative}slot[name=content]::slotted(*){box-sizing:border-box;padding:24px}.anchor{position:absolute}.top.anchor{top:0}.bottom.anchor{bottom:0}.actions{position:relative}slot[name=actions]::slotted(*){box-sizing:border-box;display:flex;gap:8px;justify-content:flex-end;padding:16px 24px 24px}.has-actions slot[name=content]::slotted(*){padding-bottom:8px}md-divider{display:none;position:absolute}.has-actions.show-bottom-divider .actions md-divider,.has-headline.show-top-divider .headline md-divider{display:flex}.headline md-divider{bottom:0}.actions md-divider{top:0}@media (forced-colors:active){dialog{outline:2px solid WindowText}}`;class MdDialog extends Dialog{}MdDialog.styles=[styles],window.customElements.define("md-dialog",MdDialog);class IxDialog extends LitElement{constructor(){super(...arguments),this.open=!1,this.preventCancel=!1,this.preventCloseOnScrimClick=!1,this.disableNextClickIsFromContent=!1,this.useNativeDialog=!1,this.allowOverflow=!1,this.nativeClosing=!1,this.dialogRef=createRef(),this.containerRef=createRef(),this.pointerDownInside=!1,this.isScrollLocked=!1,this.scrollYBackup=0,this.onKeydown=e=>{var t;"Escape"===e.key&&(this.preventCancel||(t=new Event("cancel",{bubbles:!0,composed:!0,cancelable:!0}),!this.dispatchEvent(t))?e.preventDefault():this.requestClose())},this.onNativeCancel=e=>{var t=new Event("cancel",{bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(t)?this.requestClose():e.preventDefault()},this.onScrimClick=()=>{this.preventCloseOnScrimClick||this.requestClose()}}get nativeDialog(){var e;return null!=(e=this.dialogRef.value)?e:null}get nativeDialogContainer(){var e;return null!=(e=this.containerRef.value)?e:null}connectedCallback(){super.connectedCallback(),this.mo=new MutationObserver(()=>{this.useNativeDialog&&this.open&&this.populatePortal()}),this.mo.observe(this,{childList:!0,subtree:!0,attributes:!0,characterData:!0})}disconnectedCallback(){var e;super.disconnectedCallback(),null!=(e=this.mo)&&e.disconnect(),this.unlockScroll(),this.teardownPortal()}updated(e){this.useNativeDialog&&e.has("open")&&(this.open?(this.ensurePortal(),this.portalRoot&&(this.attachPortalStyles(),render(this.portalTemplate(),this.portalRoot),this.populatePortal()),this.nativeClosing&&(this.nativeClosing=!1,null!=(e=this.nativeDialogContainer)&&e.classList.remove("closing"),this.nativeOnEnd&&this.nativeDialogContainer&&this.nativeDialogContainer.removeEventListener("animationend",this.nativeOnEnd),this.nativeOnEnd=void 0),this.dispatchEvent(new Event("open",{bubbles:!0,composed:!0})),this.lockScroll(),requestAnimationFrame(()=>{var e;null!=(e=this.nativeDialog)&&e.show(),requestAnimationFrame(()=>{this.dispatchEvent(new Event("opened",{bubbles:!0,composed:!0}))})})):this.startNativeCloseAnimation())}dismiss(){this.open&&Promise.resolve().then(()=>{this.requestClose()})}startNativeCloseAnimation(){if(!this.nativeClosing){this.nativeClosing=!0,this.dispatchEvent(new Event("close",{bubbles:!0,composed:!0}));let o=()=>{var e;null!=(e=this.nativeDialogContainer)&&e.classList.remove("closing"),this.nativeClosing=!1,null!=(e=this.nativeDialog)&&e.close(),this.unlockScroll(),this.dispatchEvent(new Event("closed",{bubbles:!0,composed:!0})),this.moveNodesBackFromPortal(),this.teardownPortal()},i=this.nativeDialogContainer;if(i){i.classList.add("closing");let e=!1,t=()=>{e||(e=!0,i.removeEventListener("animationend",t),o())};this.nativeOnEnd=t,i.addEventListener("animationend",t,{once:!0}),window.setTimeout(t,1)}else o()}}ensurePortal(){var e,t;this.portalRoot||(t=(e=document.createElement("ix-dialog-portal-host")).attachShadow({mode:"open"}),this.shadowRoot&&"adoptedStyleSheets"in this.shadowRoot&&(t.adoptedStyleSheets=this.shadowRoot.adoptedStyleSheets),document.body.appendChild(e),this.portalHost=e,this.portalRoot=t)}attachPortalStyles(){var e;this.portalRoot&&!this.portalStyleEl&&((e=document.createElement("style")).textContent=`
+  dialog {
+    position: fixed;
+    inset: 0;
+    margin: 0;
+    padding: 0;
+    border: 0;
+    top: 30%;
+    left: 5%;
+    background: transparent;
+    display: grid;
+    place-items: center;
+    pointer-events: none;
+    z-index: 1000;
+    max-width: none !important;
+    max-height: none !important;
+  }
+  .scrim {
+    position: fixed;
+    inset: 0;
+    background: var(--ix-dialog-scrim, rgba(0,0,0,0.32));
+    pointer-events: auto;
+    z-index: 1000;
+    touch-action: none;
+    border: 0;
+    padding: 0;
+    appearance: none;
+  }
+  .container {
+    position: relative;
+    border-radius: 0.75rem;
+    background: var(--ix-dialog-bg, #fff);
+    box-shadow: var(--ix-dialog-shadow, 0 10px 30px rgba(0,0,0,0.25));
+    display: grid;
+    grid-template-rows: auto 1fr auto;
+    overflow: visible;
+    pointer-events: auto;
+    z-index: 1001;
+    max-width: none!important;
+  }
+  .container .content {
+    overflow: visible;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    dialog > .container { animation: none !important; }
+  }
+`,this.portalRoot.append(e),this.portalStyleEl=e)}teardownPortal(){var e;this.portalHost&&(this.portalRoot&&render(nothing,this.portalRoot),null!=(e=this.portalStyleEl)&&e.remove(),this.portalStyleEl=void 0,this.portalHost.remove(),this.portalRoot=void 0,this.portalHost=void 0)}moveNodesToPortal(o,e){if(this.nativeDialogContainer){let t=this.nativeDialogContainer.querySelector(e);t&&Array.from(this.children).filter(e=>e instanceof HTMLElement&&e.slot===o).forEach(e=>t.appendChild(e))}}moveNodesBackFromPortal(){this.nativeDialogContainer&&[this.nativeDialogContainer.querySelector(".headline"),this.nativeDialogContainer.querySelector(".content"),this.nativeDialogContainer.querySelector(".actions")].forEach(e=>{e&&Array.from(e.childNodes).forEach(e=>this.appendChild(e))})}populatePortal(){this.moveNodesToPortal("headline",".headline"),this.moveNodesToPortal("content",".content"),this.moveNodesToPortal("actions",".actions")}requestClose(){this.open=!1}lockScroll(){if(!this.isScrollLocked){this.isScrollLocked=!0,this.scrollYBackup=window.scrollY||document.documentElement.scrollTop||0;var i=document.body,a=window.innerWidth-document.documentElement.clientWidth;0<a&&(i.style.paddingRight=a+"px"),i.style.overflow="hidden",i.style.position="fixed",i.style.top=`-${this.scrollYBackup}px`,i.style.left="0",i.style.right="0",i.style.width="100%";let t=e=>{var t=e.target;this.nativeDialogContainer&&t&&(this.nativeDialogContainer.contains(t)||e.preventDefault())},e=e=>t(e),o=e=>{var t;["PageUp","PageDown","Home","End","ArrowUp","ArrowDown"," "].includes(e.key)&&(t=e.target,this.nativeDialogContainer)&&t&&(this.nativeDialogContainer.contains(t)||e.preventDefault())};window.addEventListener("touchmove",e,{passive:!1}),window.addEventListener("keydown",o,{passive:!1}),this.removeScrollHandlers=()=>{window.removeEventListener("touchmove",e),window.removeEventListener("keydown",o)}}}unlockScroll(){var e;this.isScrollLocked&&(this.isScrollLocked=!1,this.removeScrollHandlers&&(this.removeScrollHandlers(),this.removeScrollHandlers=void 0),e=document.body,e.style.paddingRight="",e.style.position="",e.style.top="",e.style.left="",e.style.right="",e.style.overflow="",e.style.width="",window.scrollTo(0,this.scrollYBackup||0))}onOpen(){this.dispatchEvent(new Event("open")),this.lockScroll()}onOpened(){this.dispatchEvent(new Event("opened"))}onClose(){this.dispatchEvent(new Event("close"))}onClosed(){this.dispatchEvent(new Event("closed")),this.unlockScroll()}onCancel(e){this.preventCancel&&e.preventDefault(),this.dispatchEvent(new Event("cancel",{bubbles:!0,composed:!0}))}portalTemplate(){return html`<dialog ${ref(this.dialogRef)} @cancel="${this.onNativeCancel}" @keydown="${this.onKeydown}"><button class="scrim" type="button" aria-label="Close dialog" @click="${this.onScrimClick}"></button><div class="container" ${ref(this.containerRef)} role="dialog" aria-modal="true"><div class="headline"></div><div class="content"></div><div class="actions"></div></div></dialog>`}renderMdDialog(){return this.portalHost&&(this.moveNodesBackFromPortal(),this.teardownPortal()),html`<md-dialog ?open="${this.open}" class="dialog" ?preventCloseOnScrimClick="${this.preventCloseOnScrimClick}" ?disableNextClickIsFromContent="${this.disableNextClickIsFromContent}" ?allowOverflow="${this.allowOverflow}" @open="${this.onOpen}" @opened="${this.onOpened}" @close="${this.onClose}" @closed="${this.onClosed}" @cancel="${this.onCancel}"><slot slot="headline" name="headline"></slot><slot slot="content" name="content"></slot><slot slot="actions" name="actions"></slot></md-dialog>`}renderNativeDialog(){return this.portalRoot&&(render(this.portalTemplate(),this.portalRoot),this.populatePortal()),nothing}render(){return this.useNativeDialog?this.renderNativeDialog():this.renderMdDialog()}}var _a,_b;requestUpdateOnAriaChange(IxDialog),IxDialog.styles=[IxDialogStyles,css`:host([use-native-dialog]) dialog[open],:host([use-native-dialog][closing]) dialog{position:fixed;inset:0;margin:0;padding:0;border:0;background:0 0;display:block;inline-size:100vw;block-size:100dvh;pointer-events:none;z-index:99;overscroll-behavior:contain}:host([use-native-dialog]) dialog[open] .scrim,:host([use-native-dialog]) dialog[open]>.container,:host([use-native-dialog][closing]) .scrim,:host([use-native-dialog][closing]) dialog>.container{pointer-events:auto}:host([use-native-dialog]) dialog[open] .scrim,:host([use-native-dialog][closing]) .scrim{position:fixed;inset:0;background:var(--ix-dialog-scrim,rgba(0,0,0,.32))}:host([use-native-dialog]) dialog[open] .scrim{overscroll-behavior:contain;touch-action:none}:host([use-native-dialog]) dialog[open]>.container,:host([use-native-dialog][closing]) dialog>.container{transform:translate(-50%,-50%);width:auto;height:auto;max-block-size:var(--ix-dialog-max-height,90dvh);border-radius:.75rem;background:var(--ix-dialog-bg,#fff);box-shadow:var(--ix-dialog-shadow,0 .625rem 1.875rem rgba(0,0,0,.25));display:grid;grid-template-rows:auto 1fr auto;overflow:hidden;z-index:9;transform-origin:top center;will-change:transform,opacity}:host([use-native-dialog]) .actions,:host([use-native-dialog]) .content,:host([use-native-dialog]) .headline{padding:var(--ix-dialog-section-padding,1rem)}:host([use-native-dialog]) .content{overflow:auto}:host([use-native-dialog]) .actions{display:inline-flex;gap:var(--ix-dialog-actions-gap,.5rem);justify-content:flex-end;align-items:center;padding-block:var(--ix-dialog-actions-padding-block,.75rem);border-top:var(--ix-dialog-actions-border,1px solid rgba(0,0,0,.08))}@keyframes ix-fold-in{from{transform:translate(-50%,-50%) translateY(-.5rem) scaleY(.92);opacity:0}to{transform:translate(-50%,-50%) translateY(0) scaleY(1);opacity:1}}@keyframes ix-fold-out{from{transform:translate(-50%,-50%) translateY(0) scaleY(1);opacity:1}to{transform:translate(-50%,-50%) translateY(-.5rem) scaleY(.98);opacity:0}}:host([use-native-dialog]:not([closing])) dialog[open]>.container{animation:ix-fold-in var(--ix-dialog-in-dur,1000ms) cubic-bezier(.2,.7,.3,1) both}:host([use-native-dialog][closing]) dialog>.container{animation:ix-fold-out var(--ix-dialog-out-dur,250ms) cubic-bezier(.2,.7,.3,1) both}@media (prefers-reduced-motion:reduce){:host([use-native-dialog]) dialog>.container{animation:none!important}}`],IxDialog.shadowRootOptions={...LitElement.shadowRootOptions,delegatesFocus:!0},__decorate([query(".dialog")],IxDialog.prototype,"component",void 0),__decorate([property({type:Boolean,reflect:!0})],IxDialog.prototype,"open",void 0),__decorate([property({type:Boolean,attribute:"prevent-cancel"})],IxDialog.prototype,"preventCancel",void 0),__decorate([property({type:Boolean})],IxDialog.prototype,"preventCloseOnScrimClick",void 0),__decorate([property({type:Boolean})],IxDialog.prototype,"disableNextClickIsFromContent",void 0),__decorate([property({type:Boolean,reflect:!0,attribute:"use-native-dialog"})],IxDialog.prototype,"useNativeDialog",void 0),__decorate([property({type:Boolean})],IxDialog.prototype,"allowOverflow",void 0),__decorate([state()],IxDialog.prototype,"nativeClosing",void 0);class IxDialogStyled extends(_b=IxDialog){}(_a=IxDialogStyled).styles=[Reflect.get(_b,"styles",_a),css`.dialog{max-height:90vh;max-width:90vw}`],customElements.define("ix-dialog",IxDialogStyled);export{IxDialogStyled};

package/dist/md-dialog.js

@@ -149,6 +149,10 @@ export const styles = css `
     transform-origin: top;
   }
 
+  .allow-overflow .container {
+    overflow: visible;
+  }
+
   .container::before {
     background: var(
       --md-dialog-container-color,

package/dist/md-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"md-dialog.js","sourceRoot":"","sources":["../src/md-dialog.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqB,GAAG,EAAE,MAAM,KAAK,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiPxB,CAAC;AAEF,MAAM,OAAO,QAAS,SAAQ,MAAM;;AAClB,eAAM,GAAwB,CAAC,MAAM,CAAC,CAAC;AAGzD,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["import { CSSResultOrNative, css } from 'lit';\n\nimport { Dialog } from './internal/dialog.js';\n\nexport const styles = css`\n  :host {\n    border-start-start-radius: var(\n      --md-dialog-container-shape-start-start,\n      var(\n        --md-dialog-container-shape,\n        var(--md-sys-shape-corner-extra-large, 28px)\n      )\n    );\n    border-start-end-radius: var(\n      --md-dialog-container-shape-start-end,\n      var(\n        --md-dialog-container-shape,\n        var(--md-sys-shape-corner-extra-large, 28px)\n      )\n    );\n    border-end-end-radius: var(\n      --md-dialog-container-shape-end-end,\n      var(\n        --md-dialog-container-shape,\n        var(--md-sys-shape-corner-extra-large, 28px)\n      )\n    );\n    border-end-start-radius: var(\n      --md-dialog-container-shape-end-start,\n      var(\n        --md-dialog-container-shape,\n        var(--md-sys-shape-corner-extra-large, 28px)\n      )\n    );\n    display: contents;\n    margin: auto;\n    max-height: min(560px, 100% - 48px);\n    max-width: min(560px, 100% - 48px);\n    min-width: 280px;\n    position: fixed;\n    height: fit-content;\n    width: fit-content;\n  }\n\n  dialog {\n    background: rgba(0, 0, 0, 0);\n    border: none;\n    border-radius: inherit;\n    box-shadow: 0px 12px 16px 0px rgba(0, 0, 0, 0.58);\n    flex-direction: column;\n    height: inherit;\n    margin: inherit;\n    max-height: inherit;\n    max-width: inherit;\n    min-height: inherit;\n    min-width: inherit;\n    outline: none;\n    overflow: visible;\n    padding: 0;\n    width: inherit;\n  }\n\n  dialog[open] {\n    display: block;\n  }\n\n  ::backdrop {\n    background: rgba(0, 0, 0, 0.5);\n  }\n\n  h2 {\n    all: unset;\n    align-self: stretch;\n  }\n\n  .headline {\n    align-items: center;\n    color: var(\n      --md-dialog-headline-color,\n      var(--md-sys-color-on-surface, #1d1b20)\n    );\n    display: flex;\n    flex-direction: column;\n    font-family: var(\n      --md-dialog-headline-font,\n      var(\n        --md-sys-typescale-headline-small-font,\n        var(--md-ref-typeface-brand, Roboto)\n      )\n    );\n    font-size: var(\n      --md-dialog-headline-size,\n      var(--md-sys-typescale-headline-small-size, 1.5rem)\n    );\n    line-height: var(\n      --md-dialog-headline-line-height,\n      var(--md-sys-typescale-headline-small-line-height, 2rem)\n    );\n    font-weight: var(\n      --md-dialog-headline-weight,\n      var(\n        --md-sys-typescale-headline-small-weight,\n        var(--md-ref-typeface-weight-regular, 400)\n      )\n    );\n    position: relative;\n  }\n\n  slot[name='headline']::slotted(*) {\n    align-items: center;\n    align-self: stretch;\n    box-sizing: border-box;\n    display: flex;\n    gap: 8px;\n    padding: 24px 24px 0;\n  }\n\n  .icon {\n    display: flex;\n  }\n\n  slot[name='icon']::slotted(*) {\n    color: var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625b71));\n    fill: currentColor;\n    font-size: var(--md-dialog-icon-size, 24px);\n    margin-top: 24px;\n    height: var(--md-dialog-icon-size, 24px);\n    width: var(--md-dialog-icon-size, 24px);\n  }\n\n  .has-icon slot[name='headline']::slotted(*) {\n    justify-content: center;\n    padding-top: 16px;\n  }\n\n  .scrollable slot[name='headline']::slotted(*) {\n    padding-bottom: 16px;\n  }\n\n  .scrollable.has-headline slot[name='content']::slotted(*) {\n    padding-top: 8px;\n  }\n\n  .container {\n    border-radius: inherit;\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n    overflow: hidden;\n    position: relative;\n    transform-origin: top;\n  }\n\n  .container::before {\n    background: var(\n      --md-dialog-container-color,\n      var(--md-sys-color-surface-container-high, #ece6f0)\n    );\n    border-radius: inherit;\n    content: '';\n    inset: 0;\n    position: absolute;\n  }\n\n  .scroller {\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    overflow: initial;\n    z-index: 1;\n  }\n\n  .scrollable .scroller {\n    overflow-y: scroll;\n  }\n\n  .content {\n    color: var(--clr-on-surface, #092241);\n    font-family: var(--text-default-font, sans-serif);\n    font-size: var(--text-default-size, 16px);\n    letter-spacing: var(--text-default-letter-spacing, 0.0275em);\n    line-height: var(--text-default-line-height, 1.75em);\n    font-weight: var(--text-default-weight, normal);\n    text-transform: var(--text-default-decoration, none);\n    text-decoration: var(--text-default-transform, none);\n    height: min-content;\n    position: relative;\n  }\n\n  slot[name='content']::slotted(*) {\n    box-sizing: border-box;\n    padding: 24px;\n  }\n\n  .anchor {\n    position: absolute;\n  }\n\n  .top.anchor {\n    top: 0;\n  }\n\n  .bottom.anchor {\n    bottom: 0;\n  }\n\n  .actions {\n    position: relative;\n  }\n\n  slot[name='actions']::slotted(*) {\n    box-sizing: border-box;\n    display: flex;\n    gap: 8px;\n    justify-content: flex-end;\n    padding: 16px 24px 24px;\n  }\n\n  .has-actions slot[name='content']::slotted(*) {\n    padding-bottom: 8px;\n  }\n\n  md-divider {\n    display: none;\n    position: absolute;\n  }\n\n  .has-headline.show-top-divider .headline md-divider,\n  .has-actions.show-bottom-divider .actions md-divider {\n    display: flex;\n  }\n\n  .headline md-divider {\n    bottom: 0;\n  }\n\n  .actions md-divider {\n    top: 0;\n  }\n\n  @media (forced-colors: active) {\n    dialog {\n      outline: 2px solid WindowText;\n    }\n  }\n`;\n\nexport class MdDialog extends Dialog {\n  static override styles: CSSResultOrNative[] = [styles];\n}\n\nwindow.customElements.define('md-dialog', MdDialog);\n"]}
+{"version":3,"file":"md-dialog.js","sourceRoot":"","sources":["../src/md-dialog.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqB,GAAG,EAAE,MAAM,KAAK,CAAC;AAE7C,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAE9C,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqPxB,CAAC;AAEF,MAAM,OAAO,QAAS,SAAQ,MAAM;;AAClB,eAAM,GAAwB,CAAC,MAAM,CAAC,CAAC;AAGzD,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC","sourcesContent":["import { CSSResultOrNative, css } from 'lit';\n\nimport { Dialog } from './internal/dialog.js';\n\nexport const styles = css`\n  :host {\n    border-start-start-radius: var(\n      --md-dialog-container-shape-start-start,\n      var(\n        --md-dialog-container-shape,\n        var(--md-sys-shape-corner-extra-large, 28px)\n      )\n    );\n    border-start-end-radius: var(\n      --md-dialog-container-shape-start-end,\n      var(\n        --md-dialog-container-shape,\n        var(--md-sys-shape-corner-extra-large, 28px)\n      )\n    );\n    border-end-end-radius: var(\n      --md-dialog-container-shape-end-end,\n      var(\n        --md-dialog-container-shape,\n        var(--md-sys-shape-corner-extra-large, 28px)\n      )\n    );\n    border-end-start-radius: var(\n      --md-dialog-container-shape-end-start,\n      var(\n        --md-dialog-container-shape,\n        var(--md-sys-shape-corner-extra-large, 28px)\n      )\n    );\n    display: contents;\n    margin: auto;\n    max-height: min(560px, 100% - 48px);\n    max-width: min(560px, 100% - 48px);\n    min-width: 280px;\n    position: fixed;\n    height: fit-content;\n    width: fit-content;\n  }\n\n  dialog {\n    background: rgba(0, 0, 0, 0);\n    border: none;\n    border-radius: inherit;\n    box-shadow: 0px 12px 16px 0px rgba(0, 0, 0, 0.58);\n    flex-direction: column;\n    height: inherit;\n    margin: inherit;\n    max-height: inherit;\n    max-width: inherit;\n    min-height: inherit;\n    min-width: inherit;\n    outline: none;\n    overflow: visible;\n    padding: 0;\n    width: inherit;\n  }\n\n  dialog[open] {\n    display: block;\n  }\n\n  ::backdrop {\n    background: rgba(0, 0, 0, 0.5);\n  }\n\n  h2 {\n    all: unset;\n    align-self: stretch;\n  }\n\n  .headline {\n    align-items: center;\n    color: var(\n      --md-dialog-headline-color,\n      var(--md-sys-color-on-surface, #1d1b20)\n    );\n    display: flex;\n    flex-direction: column;\n    font-family: var(\n      --md-dialog-headline-font,\n      var(\n        --md-sys-typescale-headline-small-font,\n        var(--md-ref-typeface-brand, Roboto)\n      )\n    );\n    font-size: var(\n      --md-dialog-headline-size,\n      var(--md-sys-typescale-headline-small-size, 1.5rem)\n    );\n    line-height: var(\n      --md-dialog-headline-line-height,\n      var(--md-sys-typescale-headline-small-line-height, 2rem)\n    );\n    font-weight: var(\n      --md-dialog-headline-weight,\n      var(\n        --md-sys-typescale-headline-small-weight,\n        var(--md-ref-typeface-weight-regular, 400)\n      )\n    );\n    position: relative;\n  }\n\n  slot[name='headline']::slotted(*) {\n    align-items: center;\n    align-self: stretch;\n    box-sizing: border-box;\n    display: flex;\n    gap: 8px;\n    padding: 24px 24px 0;\n  }\n\n  .icon {\n    display: flex;\n  }\n\n  slot[name='icon']::slotted(*) {\n    color: var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625b71));\n    fill: currentColor;\n    font-size: var(--md-dialog-icon-size, 24px);\n    margin-top: 24px;\n    height: var(--md-dialog-icon-size, 24px);\n    width: var(--md-dialog-icon-size, 24px);\n  }\n\n  .has-icon slot[name='headline']::slotted(*) {\n    justify-content: center;\n    padding-top: 16px;\n  }\n\n  .scrollable slot[name='headline']::slotted(*) {\n    padding-bottom: 16px;\n  }\n\n  .scrollable.has-headline slot[name='content']::slotted(*) {\n    padding-top: 8px;\n  }\n\n  .container {\n    border-radius: inherit;\n    display: flex;\n    flex-direction: column;\n    flex-grow: 1;\n    overflow: hidden;\n    position: relative;\n    transform-origin: top;\n  }\n\n  .allow-overflow .container {\n    overflow: visible;\n  }\n\n  .container::before {\n    background: var(\n      --md-dialog-container-color,\n      var(--md-sys-color-surface-container-high, #ece6f0)\n    );\n    border-radius: inherit;\n    content: '';\n    inset: 0;\n    position: absolute;\n  }\n\n  .scroller {\n    display: flex;\n    flex: 1;\n    flex-direction: column;\n    overflow: initial;\n    z-index: 1;\n  }\n\n  .scrollable .scroller {\n    overflow-y: scroll;\n  }\n\n  .content {\n    color: var(--clr-on-surface, #092241);\n    font-family: var(--text-default-font, sans-serif);\n    font-size: var(--text-default-size, 16px);\n    letter-spacing: var(--text-default-letter-spacing, 0.0275em);\n    line-height: var(--text-default-line-height, 1.75em);\n    font-weight: var(--text-default-weight, normal);\n    text-transform: var(--text-default-decoration, none);\n    text-decoration: var(--text-default-transform, none);\n    height: min-content;\n    position: relative;\n  }\n\n  slot[name='content']::slotted(*) {\n    box-sizing: border-box;\n    padding: 24px;\n  }\n\n  .anchor {\n    position: absolute;\n  }\n\n  .top.anchor {\n    top: 0;\n  }\n\n  .bottom.anchor {\n    bottom: 0;\n  }\n\n  .actions {\n    position: relative;\n  }\n\n  slot[name='actions']::slotted(*) {\n    box-sizing: border-box;\n    display: flex;\n    gap: 8px;\n    justify-content: flex-end;\n    padding: 16px 24px 24px;\n  }\n\n  .has-actions slot[name='content']::slotted(*) {\n    padding-bottom: 8px;\n  }\n\n  md-divider {\n    display: none;\n    position: absolute;\n  }\n\n  .has-headline.show-top-divider .headline md-divider,\n  .has-actions.show-bottom-divider .actions md-divider {\n    display: flex;\n  }\n\n  .headline md-divider {\n    bottom: 0;\n  }\n\n  .actions md-divider {\n    top: 0;\n  }\n\n  @media (forced-colors: active) {\n    dialog {\n      outline: 2px solid WindowText;\n    }\n  }\n`;\n\nexport class MdDialog extends Dialog {\n  static override styles: CSSResultOrNative[] = [styles];\n}\n\nwindow.customElements.define('md-dialog', MdDialog);\n"]}

package/package.json

@@ -3,7 +3,7 @@
   "description": "Webcomponent ix-dialog following open-wc recommendations",
   "license": "MIT",
   "author": "Digital Realty",
-  "version": "1.2.1",
+  "version": "1.2.3",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -102,5 +102,5 @@
     "README.md",
     "LICENSE"
   ],
-  "gitHead": "0a87dc6e3da94a1375ec43a7ead2bfdec4913821"
+  "gitHead": "1ae325f4f33004b99a810afc06da42e119200d2f"
 }