@digital-realty/ix-dialog 1.2.1 → 1.2.2

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,45 @@ export declare class IxDialog extends LitElement {
     preventCancel: boolean;
     preventCloseOnScrimClick: boolean;
     disableNextClickIsFromContent: boolean;
-    private scrollPosition;
+    useNativeDialog: 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,332 @@ export class IxDialog extends LitElement {
         this.preventCancel = false;
         this.preventCloseOnScrimClick = false;
         this.disableNextClickIsFromContent = false;
-        this.scrollPosition = 0;
+        this.useNativeDialog = 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 +347,193 @@ 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}
+      @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 +553,10 @@ __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([
     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  @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      @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/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.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:a,headline:n,content:s,actions:l}=this;if(i&&o&&a&&n&&s&&l){var{container:r,dialog:d,scrim:c,headline:h,content:p,actions:g}=e,v=[];for(let[e,t]of[[i,null!=d?d:[]],[o,null!=c?c:[]],[a,null!=r?r:[]],[n,null!=h?h:[]],[s,null!=p?p:[]],[l,null!=g?g:[]]])for(var m of t)v.push(e.animate(...m));await Promise.all(v.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.useNativeDialog=!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 i=()=>{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()},o=this.nativeDialogContainer;if(o){o.classList.add("closing");let e=!1,t=()=>{e||(e=!0,o.removeEventListener("animationend",t),i())};this.nativeOnEnd=t,o.addEventListener("animationend",t,{once:!0}),window.setTimeout(t,1)}else i()}}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(i,e){if(this.nativeDialogContainer){let t=this.nativeDialogContainer.querySelector(e);t&&Array.from(this.children).filter(e=>e instanceof HTMLElement&&e.slot===i).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 o=document.body,a=window.innerWidth-document.documentElement.clientWidth;0<a&&(o.style.paddingRight=a+"px"),o.style.overflow="hidden",o.style.position="fixed",o.style.top=`-${this.scrollYBackup}px`,o.style.left="0",o.style.right="0",o.style.width="100%";let t=e=>{var t=e.target;this.nativeDialogContainer&&t&&(this.nativeDialogContainer.contains(t)||e.preventDefault())},e=e=>t(e),i=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",i,{passive:!1}),this.removeScrollHandlers=()=>{window.removeEventListener("touchmove",e),window.removeEventListener("keydown",i)}}}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}" @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([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/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.2",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -102,5 +102,5 @@
     "README.md",
     "LICENSE"
   ],
-  "gitHead": "0a87dc6e3da94a1375ec43a7ead2bfdec4913821"
+  "gitHead": "ec17c4a17800ab0383f1e91890928c4897cf0263"
 }