import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-148a7577.js';
import { d as DialogVariation, c as DialogSize, D as DialogHeadingLevel } from './typography-variation.enum-531cdf64.js';
import { r as randomIdGenerator } from './randomIdGenerator.util-56406f2e.js';
import './badge-notification-shape.enum-e15a6245.js';
import './badge-status-variation.enum-8d6370ff.js';
import { B as ButtonSize } from './code-example-variation.enum-e656d235.js';
import './form-input-search-variation.enum-6d8dc10a.js';
import { B as ButtonVariation } from './button-variation.enum-94fffdd6.js';
import './calendar-week-view-heading-level.enum-6774297c.js';
import './code-variation.enum-1eee7c7a.js';
import './expandable-accordion-header-level.enum-85681e2f.js';
import './expandable-faq-item-variation.enum-a8cb225b.js';
import './expandable-faq-variation.enum-6934c367.js';
import './footer-card-variation.enum-cc732148.js';
import './form-checkbox-variation.enum-83e906fc.js';
import './form-file-upload-variation.enum-9c49ec5e.js';
import './form-input-type.enum-3da3db27.js';
import './form-input-variation.enum-64d9450f.js';
import './form-select-variation.enum-f2f6098d.js';
import './form-textarea-variation.enum-05017e8e.js';
import './form-validation-message-variation.enum-bcef8a9d.js';
import './info-card-multi-type.enum-07ee124f.js';
import './info-card-variation.enum-2ccc52c1.js';
import './layout-block-variation.enum-b7a20db4.js';
import './layout-columns-variation.enum-34f7754e.js';
import './link-button-variation.enum-84d4976f.js';
import './list-type.enum-fbb331ad.js';
import './loader-skeleton-variation.enum-f9f867b4.js';
import './loader-spinner-size.enum-0b246fa0.js';
import './logo-variation.enum-5b68b79f.js';
import './media-figure-alignment.enum-a1d36567.js';
import './navigation-sidebar-variation.enum-8fead764.js';
import './progress-indicator-variation.enum-b12ba50a.js';
import './progress-list-item-variation.enum-384b9a3a.js';
import './progress-list-variation.enum-300bd89d.js';
import './progressbar-variation.enum-40adaab4.js';
import './quote-image-inner-position.enum-8e9b1e65.js';
import './table-variation.enum-dd9366b6.js';
import './tag-media-icon.enum-fefa191c.js';
import './tag-size.enum-403e0cd8.js';
import './tools-feedback-banner-type.enum-74b4e580.js';
import './tools-feedback-rating-variation.enum-29058ff2.js';
import './tools-theme-provider.brand.enum-8c5a98c9.js';
import './typography-heading-jumbo-variation.enum-eb737f1b.js';
import './typography-meta-variation.enum-1f7c2878.js';
import './typography-time-variation.enum-34c830ef.js';
import './util-breakpoint-observer-breakpoints.enum-6d004731.js';

const dialogCss = ":host{--digi--dialog--backdrop--position:fixed;--digi--dialog--backdrop--opacity:1;--digi--dialog--backdrop--z--index:999;--digi--dialog--backdrop--left:0;--digi--dialog--backdrop--top:0;--digi--dialog--backdrop--width:100vw;--digi--dialog--backdrop--height:100vh;--digi--dialog--backdrop--display:flex;--digi--dialog--backdrop--justify--content:center;--digi--dialog--backdrop--align--items:center;--digi--dialog--close--button--display:grid;--digi--dialog--close--button--justify--content:end;--digi--dialog--close--button--margin--right:-1rem;--digi--dialog--button--container--display:flex;--digi--dialog--button--container--flex-wrap:wrap;--digi--dialog--button--container--gap:var(--digi--gutter--large);--digi--dialog--button--container--padding--top:var(--digi--gutter--largest-2);--digi--dialog--button--text--align--mobile:center;--digi--dialog--content--gutter:var(--digi--gutter--largest);--digi--dialog--content--margin:var(--digi--margin--large) auto;--digi--dialog--content--padding:var(--digi--padding--large);--digi--dialog--content--width--small:28.75rem;--digi--dialog--content--width--medium:42.1875rem;--digi--dialog--content--width--large:56.25rem;--digi--dialog--content--color--primary:var(--digi--color--text--primary);--digi--dialog--content--color--background--primary:var(--digi--color--background--primary);--digi--dialog--icon--color--primary:var(--digi--color--icon--primary);--digi--dialog--icon--color--primary--hover:var(--digi--color--icon--primary)}:host .digi-dialog{background:rgba(0, 0, 0, 0.7);overflow-x:hidden;overflow-y:auto;position:var(--digi--dialog--backdrop--position);opacity:var(--digi--dialog--backdrop--opacity);z-index:var(--digi--dialog--backdrop--z--index);left:var(--digi--dialog--backdrop--left);top:var(--digi--dialog--backdrop--top);width:var(--digi--dialog--backdrop--width);height:var(--digi--dialog--backdrop--height);display:var(--digi--dialog--backdrop--display);justify-content:var(--digi--dialog--backdrop--justify--content);align-items:var(--digi--dialog--backdrop--align--items);padding:var(--digi--padding--medium);box-sizing:border-box}:host .digi-dialog--primary{--DIGI--DIALOG--COLOR--BACKGROUND:var(\n    --digi--dialog--content--color--background--primary\n  );--DIGI--DIALOG--COLOR:var(--digi--dialog--content--color--primary);--DIGI--DIALOG--CONTENT--BUTTON--COLOR--BORDER--PRIMARY:initial}:host .digi-dialog--secondary{--digi--dialog--content--color--secondary:var(\n    --digi--global--color--profile--white--base\n  );--digi--dialog--content--color--background--secondary:var(\n    --digi--global--color--profile--blue--base\n  );--DIGI--DIALOG--COLOR--BACKGROUND:var(\n    --digi--dialog--content--color--background--secondary\n  );--DIGI--DIALOG--COLOR:var(--digi--dialog--content--color--secondary);--DIGI--DIALOG--CONTENT--BUTTON--COLOR--BORDER--PRIMARY:#b7b7ff;--digi--color--text--primary:var(--digi--dialog--content--color--secondary)}:host .digi-dialog--small{--DIGI--DIALOG--CONTENT--WIDTH:var(--digi--dialog--content--width--small)}:host .digi-dialog--medium{--DIGI--DIALOG--CONTENT--WIDTH:var(--digi--dialog--content--width--medium)}:host .digi-dialog--large{--DIGI--DIALOG--CONTENT--WIDTH:var(--digi--dialog--content--width--large)}:host .digi-dialog__keydown-handler{width:100%;max-height:100%}:host .digi-dialog__content{background:var(--DIGI--DIALOG--COLOR--BACKGROUND);color:var(--DIGI--DIALOG--COLOR);max-width:var(--DIGI--DIALOG--CONTENT--WIDTH);width:100%;margin:var(--digi--dialog--content--margin);padding:var(--digi--padding--smaller) var(--digi--dialog--content--padding) var(--digi--dialog--content--padding) var(--digi--dialog--content--padding);box-sizing:border-box}:host .digi-dialog__close-button{--digi--button--color--text--function--default:var(--DIGI--DIALOG--COLOR);--digi--button--color--text--function--hover:var(--DIGI--DIALOG--COLOR);--digi--button--color--icon--function--default:var(--digi--dialog--icon--color--primary);--digi--button--color--icon--function--hover:var(--digi--dialog--icon--color--primary--hover);display:var(--digi--dialog--close--button--display);justify-content:var(--digi--dialog--close--button--justify--content);margin-right:var(--digi--dialog--close--button--margin--right)}:host .digi-dialog__button-container{display:var(--digi--dialog--button--container--display);flex-wrap:var(--digi--dialog--button--container--flex-wrap);gap:var(--digi--dialog--button--container--gap);padding-top:var(--digi--dialog--button--container--padding--top)}:host .digi-dialog__button-container digi-button,:host .digi-dialog__button-container .digi-button--medium{text-align:var(--digi--dialog--button--text--align--mobile)}:host .digi-dialog__button-container digi-button :first-of-type,:host .digi-dialog__button-container .digi-button--medium :first-of-type{--digi--button--color--border--primary--default:var(--DIGI--DIALOG--CONTENT--BUTTON--COLOR--BORDER--PRIMARY);--digi--button--color--border--primary--hover:var(--DIGI--DIALOG--CONTENT--BUTTON--COLOR--BORDER--PRIMARY)}";
const DigiDialogStyle0 = dialogCss;

const Dialog = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.afPrimaryButtonClick = createEvent(this, "afPrimaryButtonClick", 7);
        this.afSecondaryButtonClick = createEvent(this, "afSecondaryButtonClick", 7);
        this.afOnClose = createEvent(this, "afOnClose", 7);
        this._focusableElementsSelectors = 'a, input, select, textarea, button, button:not(hidden), iframe, object, [tabindex="0"]';
        this.focusableElements = [];
        this.afId = randomIdGenerator('digi-dialog');
        this.afVariation = DialogVariation.PRIMARY;
        this.afSize = DialogSize.MEDIUM;
        this.afShowDialog = undefined;
        this.afCloseButtonText = 'Stäng';
        this.afHeadingLevel = DialogHeadingLevel.H2;
        this.afHeading = undefined;
        this.afPrimaryButtonText = undefined;
        this.afSecondaryButtonText = undefined;
        this.afFallbackElementSelector = undefined;
    }
    primaryClickHandler(e) {
        this.afPrimaryButtonClick.emit(e);
    }
    secondaryClickHandler(e) {
        this.afSecondaryButtonClick.emit(e);
    }
    escHandler(e) {
        if (this._closeButton) {
            this.closeDialog(e);
        }
    }
    shiftHandler(e) {
        let el;
        if (document.activeElement.tagName === 'DIGI-DIALOG') {
            el = document.activeElement.shadowRoot.activeElement;
        }
        else {
            el = document.activeElement;
        }
        if (this.shouldUseFocusTrap) {
            if (el === this._dialogHeading && !!this.closeButtonEl) {
                e.detail.preventDefault();
                this.closeButtonEl.focus();
            }
            else if (el === this.firstFocusableEl && !!this.closeButtonEl) {
                e.detail.preventDefault();
                this.closeButtonEl.focus();
            }
            else if (el === this._dialogHeading && !this.closeButtonEl) {
                e.detail.preventDefault();
                this.lastFocusableEl.focus();
            }
            else if (el === this.firstFocusableEl && !this.closeButtonEl) {
                e.detail.preventDefault();
                this.lastFocusableEl.focus();
            }
            else if (el === this.closeButtonEl) {
                e.detail.preventDefault();
                this.lastFocusableEl.focus();
            }
        }
        else {
            e.detail.preventDefault();
        }
    }
    tabHandler(e) {
        let el;
        if (document.activeElement.tagName === 'DIGI-DIALOG') {
            el = document.activeElement.shadowRoot.activeElement;
        }
        else {
            el = document.activeElement;
        }
        if (this.shouldUseFocusTrap) {
            if (el === this.lastFocusableEl && !!this.closeButtonEl) {
                e.detail.preventDefault();
                this.closeButtonEl.focus();
            }
            else if (el === this.closeButtonEl || el === this.lastFocusableEl) {
                e.detail.preventDefault();
                this.firstFocusableEl.focus();
            }
        }
        else {
            e.detail.preventDefault();
        }
    }
    onActive() {
        document.body.style.overflow = 'hidden';
        if (!this.afCloseButtonText) {
            this._wrapper.style.paddingTop = '25px';
        }
        if (this._dialogHeading) {
            this._dialogHeading.style.marginTop = '0';
        }
        this.onResize();
        setTimeout(() => {
            this.setFallback();
            this.getFocusableItems();
            this.setFocus();
        }, 50);
    }
    buttonWidthMaxContent() {
        if (this._primaryButton) {
            this._primaryButton.style.width = 'max-content';
            this._primaryButton.querySelector('button').style.width = 'max-content';
        }
        if (this._secondaryButton) {
            this._secondaryButton.style.width = 'max-content';
            this._secondaryButton.querySelector('button').style.width = 'max-content';
        }
    }
    buttonWidth100Percent() {
        if (this._primaryButton) {
            this._primaryButton.style.width = '100%';
            this._primaryButton.querySelector('button').style.width = '100%';
        }
        if (this._secondaryButton) {
            this._secondaryButton.style.width = '100%';
            this._secondaryButton.querySelector('button').style.width = '100%';
        }
    }
    onResize() {
        this.buttonContainerObserver = new ResizeObserver(() => {
            if (this._buttonContainer.clientWidth <= 313) {
                this.buttonWidth100Percent();
            }
            else {
                this.buttonWidthMaxContent();
            }
        });
        this.buttonContainerObserver.observe(this._buttonContainer);
    }
    onInactive() {
        const el = this.fallbackElement;
        if (el) {
            el.focus();
        }
        this.buttonContainerObserver.disconnect();
        document.body.style.overflow = '';
    }
    closeDialog(e) {
        this.afShowDialog = false;
        this.afOnClose.emit(e);
    }
    setFallback() {
        if (!!this.afFallbackElementSelector &&
            !!document.querySelector(this.afFallbackElementSelector)) {
            this.fallbackElement = document.querySelector(this.afFallbackElementSelector);
            if (this.fallbackElement instanceof HTMLHeadingElement) {
                this.fallbackElement.setAttribute('tabindex', '-1');
            }
        }
        else {
            this.fallbackElement = document.activeElement;
        }
    }
    setFocus() {
        if (this.afShowDialog) {
            let el;
            if (this.afHeading) {
                el = this._dialogHeading;
                this._dialogHeading.style.outline = 'none';
            }
            else if (this.firstFocusableEl) {
                el = this.firstFocusableEl;
                if (!el.getAttribute('tabindex')) {
                    el.setAttribute('tabindex', '0');
                }
            }
            else if (this.closeButtonEl) {
                el = this.closeButtonEl;
            }
            else {
                el = this._wrapper;
                el.setAttribute('tabindex', '0');
            }
            if (el) {
                el.focus();
            }
        }
    }
    getFocusableItems() {
        let allElements;
        const slotElements = this._host.querySelectorAll(this._focusableElementsSelectors);
        const defaultElements = this._wrapper.querySelectorAll(this._focusableElementsSelectors);
        if (this._closeButton) {
            this.closeButtonEl = this._closeButton.children[0];
            const defaultElementsWithoutCloseButton = Array.prototype.slice.call(defaultElements);
            defaultElementsWithoutCloseButton.shift();
            allElements = Array.from(slotElements).concat(Array.from(defaultElementsWithoutCloseButton));
        }
        else {
            allElements = Array.from(slotElements).concat(Array.from(defaultElements));
        }
        this.focusableElements = allElements;
        if (this.focusableElements.length > 0) {
            this.firstFocusableEl = this.focusableElements[0];
            this.lastFocusableEl = this.focusableElements[this.focusableElements.length - 1];
        }
    }
    componentDidLoad() {
        if (this.afShowDialog) {
            this.onActive();
        }
    }
    componentDidUpdate() {
        if (this.afShowDialog) {
            this.onActive();
        }
        else if (!this.afShowDialog && this.fallbackElement) {
            this.onInactive();
        }
    }
    get shouldUseFocusTrap() {
        return this.afShowDialog && this.focusableElements.length > 0;
    }
    get cssModifiers() {
        return {
            'digi-dialog--primary': this.afVariation == DialogVariation.PRIMARY,
            'digi-dialog--secondary': this.afVariation == DialogVariation.SECONDARY,
            'digi-dialog--small': this.afSize == DialogSize.SMALL,
            'digi-dialog--medium': this.afSize == DialogSize.MEDIUM,
            'digi-dialog--large': this.afSize == DialogSize.LARGE
        };
    }
    render() {
        return (h(Host, { key: '7645cdea8aa64030e5cdacc13d2b657ced71694d', ref: (el) => {
                this._host = el;
            } }, this.afShowDialog && (h("div", { key: '7956ce0de7909b54bd51a2a203f34239eea43f38', class: Object.assign({ 'digi-dialog': true }, this.cssModifiers) }, h("digi-util-keydown-handler", { key: 'd032d1a8b27b5cd88558c06d1a044dced2c0287c', onAfOnEsc: (e) => this.escHandler(e), onAfOnTab: (e) => this.tabHandler(e), onAfOnShiftTab: (e) => this.shiftHandler(e), class: "digi-dialog__keydown-handler" }, h("div", { key: '5eaa4f82217a657b8a956ca19620ce5ee4058651', ref: (el) => {
                this._wrapper = el;
            }, role: "dialog", "aria-modal": "true", class: "digi-dialog__content" }, h("digi-typography", { key: '08f9045a7fedc3127593a92e85dbdb08243cd7aa' }, this.afCloseButtonText && (h("digi-button", { key: '297e28a9840d4365a98b41d7ce0b704ba20c3632', ref: (el) => (this._closeButton = el), class: "digi-dialog__close-button", afAriaLabel: this.afCloseButtonText, afSize: ButtonSize.MEDIUM, "af-variation": "function", onAfOnClick: (e) => this.closeDialog(e) }, this.afCloseButtonText, h("digi-icon-x", { key: 'b21d15d15f96f30cfeba0cc952c99918dbe92f0d', class: "digi-dialog__close-icon", slot: "icon-secondary" }))), h("slot", { key: '9a17c4c0accd79502cd53d4f1a9b40bd24aa8f63', name: "over-heading" }), this.afHeadingLevel && this.afHeading && (h(this.afHeadingLevel, { key: '797db07e133f8e424972a22dc4cd9c0fff87c1ca', tabindex: "-1", ref: (el) => (this._dialogHeading = el) }, this.afHeading)), h("slot", { key: '228d808404637c354e80264d9a16accd07ef7038' }), h("div", { key: '3026af7da362dae66103f8bee7d0cf82d4b9d9bc', ref: (el) => (this._buttonContainer = el), class: "digi-dialog__button-container" }, this.afSecondaryButtonText && (h("digi-button", { key: '5799f15bee8a093981c7a2ee1746c3ebf5bcaaa4', ref: (el) => (this._secondaryButton = el), afVariation: ButtonVariation.SECONDARY, onAfOnClick: (e) => this.secondaryClickHandler(e) }, this.afSecondaryButtonText)), this.afPrimaryButtonText && (h("digi-button", { key: '78aa226ed8b00565138cdc52c50dbfc719c7775a', ref: (el) => (this._primaryButton = el), afVariation: ButtonVariation.PRIMARY, onAfOnClick: (e) => this.primaryClickHandler(e) }, this.afPrimaryButtonText))))))))));
    }
    get hostElement() { return getElement(this); }
};
Dialog.style = DigiDialogStyle0;

export { Dialog as digi_dialog };
