import { p as proxyCustomElement, H, c as createEvent, h } from './p-a53686b3.js';
import './p-717306ef.js';
import { H as HeaderCenterContentWidth } from './p-5a256d98.js';
import './p-a4a001e1.js';
import './p-f518a4cf.js';
import './p-7e32c40b.js';
import './p-dcdffb3c.js';
import './p-5d21a361.js';
import './p-ad16c7a1.js';
import './p-f40f4b2a.js';
import './p-1f68d501.js';
import './p-ee88e3f1.js';
import './p-8142cc73.js';
import './p-905ccb30.js';
import './p-bc3d2778.js';
import './p-c8429245.js';
import './p-06625463.js';
import './p-f447b984.js';
import './p-9c5a93d8.js';
import './p-7933b555.js';
import './p-0f6c0360.js';
import './p-814ca2ad.js';
import './p-d8a98b3b.js';
import './p-07303cb5.js';
import './p-5f8dc01a.js';
import './p-2a023831.js';
import './p-5ba6737a.js';
import './p-e4a9f8f0.js';
import './p-f2a6768b.js';
import './p-40657c82.js';
import './p-f600576a.js';
import './p-3b20ec86.js';
import './p-9dd5d6c8.js';
import './p-77a93845.js';
import './p-06f939ab.js';
import './p-8cd2d6dd.js';
import './p-484a1d6d.js';
import './p-0f3fbb1e.js';
import './p-820e795b.js';
import './p-46cbbcb5.js';
import './p-d74742b8.js';
import './p-6e383896.js';
import './p-4bad4fb0.js';
import './p-d1886fff.js';
import './p-a6ca40fc.js';
import './p-b0e88537.js';
import { U as UtilBreakpointObserverBreakpoints } from './p-cdcaf0eb.js';
import { d as defineCustomElement$6 } from './p-e8fc33ed.js';
import { d as defineCustomElement$5 } from './p-cc5bd9f9.js';
import { d as defineCustomElement$4 } from './p-ccccd7bb.js';
import { d as defineCustomElement$3 } from './p-3c5d25a0.js';
import { d as defineCustomElement$2 } from './p-33f08ec3.js';

const headerNavigationCss = ".sc-digi-header-navigation-h{--digi--header--border-color:var(--digi--color--divider--secondary);--digi--header--close-button--padding:var(--digi--padding--smaller);display:block}.sc-digi-header-navigation-h .digi-header-navigation.sc-digi-header-navigation{z-index:99}.sc-digi-header-navigation-h .digi-header-navigation__backdrop.sc-digi-header-navigation{background:rgba(0, 0, 0, 0.7);width:100%;height:100%;position:fixed;top:0;left:0}.sc-digi-header-navigation-h .digi-header-navigation__wrapper.sc-digi-header-navigation{display:none;grid-area:nav;background-color:var(--digi--color--background--secondary-muted);border-bottom:var(--digi--header--border-width) solid var(--digi--header--border-color)}.sc-digi-header-navigation-h .digi-header-navigation--visible.sc-digi-header-navigation .digi-header-navigation__wrapper.sc-digi-header-navigation{display:block}.sc-digi-header-navigation-h .digi-header-navigation__close-button.sc-digi-header-navigation{display:flex;flex-wrap:wrap;align-items:center;padding:var(--digi--header--close-button--padding) 0}.sc-digi-header-navigation-h .digi-header-navigation--centered.sc-digi-header-navigation .digi-header-navigation__wrapper.sc-digi-header-navigation{padding-left:0;padding-right:0}.sc-digi-header-navigation-h .digi-header-navigation--centered.sc-digi-header-navigation .digi-header-navigation__inner.sc-digi-header-navigation{margin-left:calc(var(--digi--global--spacing--base) * -1);margin-right:calc(var(--digi--global--spacing--base) * -1)}.sc-digi-header-navigation-h .digi-header-navigation--mobile.sc-digi-header-navigation{width:0;position:fixed;height:100%;right:0;top:0;visibility:hidden;--digi--header-navigation--horizontal-padding:0}.sc-digi-header-navigation-h .digi-header-navigation--mobile.sc-digi-header-navigation .digi-header-navigation__wrapper.sc-digi-header-navigation{position:absolute;top:0;right:0;height:100%;transform:translateX(100%);width:90vw;transition:ease var(--digi--animation--duration--base) all;overflow-y:auto}.sc-digi-header-navigation-h .digi-header-navigation--mobile.sc-digi-header-navigation .digi-header-navigation__inner.sc-digi-header-navigation{margin:0;padding:0;display:block}.sc-digi-header-navigation-h .digi-header-navigation--mobile .digi-header-navigation__inner.sc-digi-header-navigation-s>digi-header-navigation-item:first-child,.sc-digi-header-navigation-h .digi-header-navigation--mobile .digi-header-navigation__inner.sc-digi-header-navigation-s>digi-header-navigation-item,.sc-digi-header-navigation-h .digi-header-navigation--mobile .digi-header-navigation__inner .sc-digi-header-navigation-s>digi-header-navigation-item:first-child{border-top:1px solid var(--digi--header--border-color)}.sc-digi-header-navigation-h .digi-header-navigation--mobile .digi-header-navigation__inner.sc-digi-header-navigation-s>digi-header-navigation-item,.sc-digi-header-navigation-h .digi-header-navigation--mobile .digi-header-navigation__inner .sc-digi-header-navigation-s>digi-header-navigation-item{border-bottom:1px solid var(--digi--header--border-color)}.sc-digi-header-navigation-h .digi-header-navigation--open.sc-digi-header-navigation{visibility:visible}.sc-digi-header-navigation-h .digi-header-navigation--open.sc-digi-header-navigation .digi-header-navigation__wrapper.sc-digi-header-navigation{transform:translateX(0)}.sc-digi-header-navigation-h .digi-header-navigation--open.sc-digi-header-navigation .digi-header-navigation__backdrop.sc-digi-header-navigation{display:block}.sc-digi-header-navigation-h .digi-header-navigation__inner.sc-digi-header-navigation{list-style:none;margin:0;display:flex}.sc-digi-header-navigation-h .digi-header-navigation__navigation-link.sc-digi-header-navigation{display:block;text-decoration:none;color:inherit;padding:var(--digi--padding--medium)}.sc-digi-header-navigation-h .digi-header-navigation__navigation-link.sc-digi-header-navigation:hover{background-color:var(--digi--color--background--interactive--hover--quarternary)}";
const DigiHeaderNavigationStyle0 = headerNavigationCss;

const HeaderNavigation = /*@__PURE__*/ proxyCustomElement(class HeaderNavigation extends H {
    constructor() {
        super();
        this.__registerHost();
        this.afOnClose = createEvent(this, "afOnClose", 7);
        this.afOnEsc = createEvent(this, "afOnEsc", 7);
        this.afOnBackdropClick = createEvent(this, "afOnBackdropClick", 7);
        this.afOnToggle = createEvent(this, "afOnToggle", 7);
        this._focusableElementsSelectors = 'a, input, select, textarea, button, button:not(hidden), iframe, object, [tabindex="0"]';
        this.focusableElements = [];
        this.isMobile = undefined;
        this.isVisible = undefined;
        this.afCloseButtonText = undefined;
        this.afNavAriaLabel = undefined;
        this.afCloseButtonAriaLabel = undefined;
        this.afFocusableElement = undefined;
        this.afCloseFocusableElement = undefined;
        this.afActive = false;
        this.afBackdrop = true;
        this.afCentered = HeaderCenterContentWidth.DEFAULT;
    }
    //private _observer: any;
    enablePageScroll() {
        document.body.style.height = '';
        document.body.style.overflowY = '';
        document.body.style.paddingRight = '';
    }
    disablePageScroll() {
        document.body.style.height = '100vh';
        document.body.style.overflowY = 'hidden';
    }
    toggleHandler(e) {
        const element = e.target;
        this._closeFocusableElement = element.querySelector('.digi-navigation-sidebar-button button');
        if (element.matches('digi-navigation-sidebar-button')) {
            this.afActive = true;
        }
    }
    get shouldUseFocusTrap() {
        return this.isMobile && this.focusableElements.length > 0;
    }
    closeHandler(e) {
        this.afActive = false;
        this.afOnClose.emit(e);
    }
    escHandler(e) {
        if (this.isMobile) {
            this.afActive = false;
            this.afOnClose.emit(e);
        }
    }
    tabHandler(e) {
        if (this.shouldUseFocusTrap) {
            if (document.activeElement === this.lastFocusableEl) {
                e.detail.preventDefault();
                this.firstFocusableEl.focus();
            }
        }
    }
    backdropClickHandler(e) {
        this.afActive = false;
        this.afOnClose.emit(e);
    }
    shiftHandler(e) {
        if (this.shouldUseFocusTrap) {
            if (document.activeElement === this.firstFocusableEl) {
                e.detail.preventDefault();
                this.lastFocusableEl.focus();
            }
        }
    }
    clickHandler(e) {
        // If clicking on toggle button, refresh the focusable items list
        // with the new sub level of items
        if (this.shouldUseFocusTrap) {
            const el = e.detail.target;
            if (el.tagName.toLowerCase() === 'button') {
                setTimeout(() => {
                    this.getFocusableItems();
                }, 100);
            }
        }
    }
    setMobileView(isMobile) {
        isMobile && this.afActive
            ? (this.disablePageScroll(), this.getFocusableItems())
            : this.enablePageScroll();
    }
    breakpointChange(e) {
        this.isVisible = false;
        const element = e.target;
        const type = element.nodeName;
        if (type.toLowerCase() === 'digi-util-breakpoint-observer') {
            this.isMobile =
                e.detail.value === UtilBreakpointObserverBreakpoints.SMALL;
        }
        if (this.isMobile) {
            setTimeout(() => {
                this.isVisible = true;
            }, 100);
        }
        else {
            this.isVisible = true;
        }
    }
    componentDidLoad() {
        const transition = this._wrapper;
        transition.addEventListener('transitionend', () => {
            this.getFocusableItems();
            this.setFocus();
        });
    }
    getFocusableItems() {
        const allElements = this._wrapper.querySelectorAll(this._focusableElementsSelectors);
        // Filters out visible items
        this.focusableElements = Array.prototype.slice
            .call(allElements)
            .filter(function (item) {
            return item.offsetParent !== null;
        });
        // Sets first and last focusable element
        if (this.focusableElements.length > 0) {
            this.firstFocusableEl = this.focusableElements[0];
            this.lastFocusableEl = this.focusableElements[this.focusableElements.length - 1];
        }
    }
    setFocus() {
        if (this.afActive) {
            let el;
            const firstNavLink = this.firstFocusableEl;
            if (this.afFocusableElement) {
                el = this.hostElement.querySelector(`${this.afFocusableElement}`);
            }
            else {
                el = firstNavLink;
            }
            if (el) {
                el.focus();
            }
        }
        else {
            if (this.afCloseFocusableElement) {
                const el = document.querySelector(`${this.afCloseFocusableElement}`);
                el.focus();
            }
            else if (this._closeFocusableElement) {
                const el = this._closeFocusableElement;
                el.focus();
            }
        }
    }
    get cssModifiers() {
        return {
            'digi-header-navigation--open': this.afActive,
            'digi-header-navigation--mobile': this.isMobile,
            'digi-header-navigation--visible': this.isVisible,
            'digi-header-navigation--centered': this.afCentered !== HeaderCenterContentWidth.DEFAULT
        };
    }
    render() {
        return (h("div", { key: '20ee5ecde5a57ddcb5b387b48811975ce324e7e2', class: Object.assign({ 'digi-header-navigation': true }, this.cssModifiers) }, h("digi-util-breakpoint-observer", { key: '52ed2d9ec166e385acc7f7166bb049cfb258418a', onAfOnChange: (e) => (this.isMobile =
                e.detail.value === UtilBreakpointObserverBreakpoints.SMALL) }, h("digi-util-keydown-handler", { key: 'ab0e0ff9224086bdc3e4ece7f0fb751062999451', onAfOnEsc: (e) => this.escHandler(e), onAfOnTab: (e) => this.tabHandler(e), onAfOnShiftTab: (e) => this.shiftHandler(e) }, h("div", { key: '62bbc4e6b08a9eaa271b1ef06e1decf8c4de0455' }, this.isMobile && (h("div", { key: 'c7b685db77ec70425fb28416934457c1d3fff844', class: "digi-header-navigation__backdrop", onClick: (e) => this.backdropClickHandler(e) })), h("nav", { key: 'a6034a2d893e78c373e04e9a84c79fd8e43ab5f9', class: "digi-header-navigation__wrapper", "aria-label": this.afNavAriaLabel, "af-centered": this.afCentered, ref: (el) => {
                this._wrapper = el;
            } }, this.isMobile && (h("digi-button", { key: '125bacb20ca6ee684a4972df754e404333341668', onClick: (e) => this.closeHandler(e), "af-variation": "function", "af-aria-label": this.afCloseButtonAriaLabel, class: "digi-header-navigation__close-button" }, this.afCloseButtonText, h("digi-icon-x", { key: '05bbb20a4b57c4976fbcd36af4a723cf1c6db373', slot: "icon-secondary" }))), this.afCentered !== HeaderCenterContentWidth.DEFAULT ? (h("digi-layout-container", { "af-max-width": this.afCentered }, h("div", { role: "list", class: "digi-header-navigation__inner" }, h("slot", null)))) : (h("div", { role: "list", class: "digi-header-navigation__inner" }, h("slot", null)))))))));
    }
    get hostElement() { return this; }
    static get watchers() { return {
        "isMobile": ["setMobileView"]
    }; }
    static get style() { return DigiHeaderNavigationStyle0; }
}, [6, "digi-header-navigation", {
        "afCloseButtonText": [1, "af-close-button-text"],
        "afNavAriaLabel": [1, "af-nav-aria-label"],
        "afCloseButtonAriaLabel": [1, "af-close-button-aria-label"],
        "afFocusableElement": [1, "af-focusable-element"],
        "afCloseFocusableElement": [1, "af-close-focusable-element"],
        "afActive": [4, "af-active"],
        "afBackdrop": [4, "af-backdrop"],
        "afCentered": [1, "af-centered"],
        "isMobile": [32],
        "isVisible": [32]
    }, [[8, "afOnToggle", "toggleHandler"], [0, "afOnClick", "clickHandler"], [0, "afOnChange", "breakpointChange"]], {
        "isMobile": ["setMobileView"]
    }]);
function defineCustomElement$1() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["digi-header-navigation", "digi-button", "digi-icon-x", "digi-layout-container", "digi-util-breakpoint-observer", "digi-util-keydown-handler"];
    components.forEach(tagName => { switch (tagName) {
        case "digi-header-navigation":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, HeaderNavigation);
            }
            break;
        case "digi-button":
            if (!customElements.get(tagName)) {
                defineCustomElement$6();
            }
            break;
        case "digi-icon-x":
            if (!customElements.get(tagName)) {
                defineCustomElement$5();
            }
            break;
        case "digi-layout-container":
            if (!customElements.get(tagName)) {
                defineCustomElement$4();
            }
            break;
        case "digi-util-breakpoint-observer":
            if (!customElements.get(tagName)) {
                defineCustomElement$3();
            }
            break;
        case "digi-util-keydown-handler":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
    } });
}

const DigiHeaderNavigation = HeaderNavigation;
const defineCustomElement = defineCustomElement$1;

export { DigiHeaderNavigation, defineCustomElement };
