@iamproperty/components 7.8.2--beta6 → 7.8.2--beta7

package/assets/js/components/nav/nav.component.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"nav.component.min.js","sources":["nav.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'nav',\n});\nclass iamNav extends HTMLElement {\n    constructor() {\n        super();\n        const shadowRoot = this.attachShadow({ mode: 'open' });\n        const assetLocation = document.body.hasAttribute('data-assets-location')\n            ? document.body.getAttribute('data-assets-location')\n            : '/assets';\n        const loadCSS = `@import \"${assetLocation}/css/components/nav.component.css\";`;\n        const loadExtraCSS = `@import \"${assetLocation}/css/components/nav.global.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style class=\"styles\">\n\n    ${loadCSS}\n    </style>\n    <style class=\"doc-styles\">\n    </style>\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\">\n    <div class=\"container\">\n      <slot name=\"logo\"></slot>\n      <div class=\"buttons-holder\"></div>\n      <button class=\"btn-menu\" part=\"btn-menu\">Menu<i class=\"fa-regular fa-bars\"></i><i class=\"fa-regular fa-xmark-large\"></i></button>\n\n      <div class=\"menu__outer\">\n        <div class=\"menu closed\">\n\n          <div class=\"menu__primary\">\n            <slot></slot>\n            <slot name=\"dual\"></slot>\n          </div>\n          <div class=\"dialog__wrapper d-none\" id=\"search-wrapper\"></div>\n          <slot name=\"actions\"></slot>\n          <div class=\"menu__secondary bg-light\">\n            <div class=\"container\">\n            <slot name=\"secondary\"></slot>\n            </div>\n          </div>\n        </div>\n        <slot name=\"menus\"></slot>\n      </div>\n    </div>\n    <div class=\"backdrop\" part=\"backdrop\"></div>\n    `;\n        shadowRoot.appendChild(template.content.cloneNode(true));\n        // insert extra CSS\n        if (!document.getElementById('navGlobal'))\n            document.head.insertAdjacentHTML('beforeend', `<style id=\"navGlobal\">${loadExtraCSS}</style>`);\n    }\n    connectedCallback() {\n        // Load external CSS if needed\n        if (this.hasAttribute('data-css'))\n            this.shadowRoot\n                .querySelector('.doc-styles')\n                .insertAdjacentHTML('beforeend', `@import \"${this.getAttribute('data-css')}\";`);\n        const menuButton = this.shadowRoot.querySelector('.btn-menu');\n        const menu = this.shadowRoot.querySelector('.menu');\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const iamNav = this;\n        const backdrop = this.shadowRoot.querySelector('.backdrop');\n        const buttonsHolder = this.shadowRoot.querySelector('.buttons-holder');\n        // Check the content\n        const createNavMenu = (component) => {\n            buttonsHolder.innerHTML = '';\n            component.querySelectorAll(':scope > *').forEach(function (element) {\n                const tagname = element.tagName;\n                switch (tagname) {\n                    case 'BUTTON':\n                        if (!element.hasAttribute('slot')) {\n                            element.setAttribute('slot', 'actions');\n                            menu.classList.add('has-actions');\n                        }\n                        break;\n                }\n                // Create menu button\n                if (element.classList.contains('nav--menu') &&\n                    element.hasAttribute('data-title') &&\n                    element.hasAttribute('data-icon')) {\n                    const title = element.getAttribute('data-title');\n                    const iconClass = element.getAttribute('data-icon');\n                    // Create the menu button that sits seperately to the menu\n                    const button = document.createElement('button');\n                    button.setAttribute('slot', title);\n                    button.classList.add('btn-menu');\n                    button.setAttribute('part', 'btn-menu');\n                    button.innerHTML = `<span class=\"btn btn-primary\"><span>${title}</span><i class=\"${iconClass}\"></i><i class=\"fa-regular fa-xmark-large\"></i></span>`;\n                    buttonsHolder.insertAdjacentElement('beforeend', button);\n                    const mdButton = button.querySelector('.btn-primary');\n                    // Make sure the menu is added to the right part of the component\n                    element.setAttribute('slot', 'menus');\n                    // If open we need to make sure the main mobile menu is closed, the new button has the right state and the backdrop is shown\n                    if (element.classList.contains('open')) {\n                        button.setAttribute('aria-expanded', true);\n                        mdButton.classList.toggle('active');\n                        component.classList.add('open');\n                        backdrop.classList.add('show');\n                    }\n                    else {\n                        element.classList.add('closed'); // closed class is added to prevent the elements being tabbed into, this causes visual issues\n                    }\n                    // Click event\n                    button.addEventListener('click', function (e) {\n                        e.preventDefault();\n                        button.toggleAttribute('aria-expanded');\n                        console.log(element);\n                        element.classList.toggle('open');\n                        mdButton.classList.toggle('active');\n                        // Close desktop menus\n                        const openMenu = component.querySelector(':scope > details[open]');\n                        if (openMenu)\n                            openMenu.removeAttribute('open');\n                        // Close the main menu and fix states on the button, iamNav component and backdrop\n                        if (element.classList.contains('open')) {\n                            menu.classList.remove('open');\n                            menuButton.removeAttribute('aria-expanded');\n                            setTimeout(function () {\n                                menu.classList.add('closed');\n                            }, 1000); // Delay until its close so the animation is broken\n                            component.classList.add('open');\n                            backdrop.classList.add('show');\n                            element.classList.remove('closed');\n                        }\n                        else {\n                            component.classList.remove('open');\n                            backdrop.classList.remove('show');\n                            setTimeout(function () {\n                                element.classList.add('closed');\n                            }, 1000);\n                        }\n                        // Close any open menus\n                        component.querySelectorAll('.nav--menu.open').forEach(function (openmenu) {\n                            if (openmenu != element) {\n                                openmenu.classList.remove('open');\n                            }\n                        });\n                        component.shadowRoot\n                            .querySelectorAll('.buttons-holder .btn-menu[aria-expanded]')\n                            .forEach(function (selectedButton) {\n                            if (selectedButton != button) {\n                                selectedButton.removeAttribute('aria-expanded');\n                                const innerBtn = selectedButton.querySelector('.btn-primary');\n                                innerBtn.classList.remove('active');\n                            }\n                        });\n                    }, false);\n                }\n            });\n            component.querySelectorAll('details').forEach(function (element) {\n                element.classList.add('details--revert');\n            });\n        };\n        createNavMenu(this);\n        this.addEventListener('rebuilt', () => {\n            console.log('rebuilt nav');\n            createNavMenu(this);\n        });\n        // Has secondary link\n        if (this.querySelector('[slot=\"secondary\"]')) {\n            menu.classList.add('has-secondary');\n        }\n        // Open and close the menu\n        menuButton.addEventListener('click', function (e) {\n            e.preventDefault();\n            //menuButton.toggleAttribute('aria-expanded');\n            menu.classList.toggle('open');\n            // Close any other menus\n            iamNav.querySelectorAll('.nav--menu.open').forEach(function (element) {\n                element.classList.remove('open');\n                setTimeout(function () {\n                    element.classList.add('closed');\n                }, 1000);\n            });\n            iamNav.shadowRoot.querySelectorAll('.buttons-holder .btn-menu[aria-expanded]').forEach(function (element) {\n                element.removeAttribute('aria-expanded');\n                const innerBtn = element.querySelector('.btn-primary');\n                innerBtn.classList.remove('active');\n            });\n            if (menu.classList.contains('open')) {\n                iamNav.classList.add('open');\n                menu.classList.remove('closed');\n            }\n            else {\n                iamNav.classList.remove('open');\n                setTimeout(function () {\n                    menu.classList.add('closed');\n                }, 1000);\n            }\n        }, false);\n        // Allow outside JS to close the menu\n        this.addEventListener('request-close', () => {\n            menuButton.removeAttribute('aria-expanded');\n            menu.classList.remove('open');\n            iamNav.classList.remove('open');\n        });\n        // Close the menu on the click of the backdrop on desktop\n        backdrop.addEventListener('click', () => {\n            const openMenu = this.querySelector('details[open] summary');\n            if (openMenu)\n                openMenu.click();\n            iamNav.classList.toggle('open');\n            iamNav.querySelectorAll('.nav--menu.open').forEach(function (element) {\n                element.classList.remove('open');\n            });\n            iamNav.shadowRoot.querySelectorAll('.buttons-holder .btn-menu[aria-expanded]').forEach(function (element) {\n                element.removeAttribute('aria-expanded');\n                const innerBtn = element.querySelector('.btn-primary');\n                innerBtn.classList.remove('active');\n            });\n            backdrop.classList.remove('show');\n        });\n        // On desktop close other menu's (details) when one is clicked\n        this.addEventListener('click', (event) => {\n            if (event && event.target instanceof HTMLElement && event.target.closest('summary')) {\n                if (window.innerWidth > 992 && !event.target.closest('.nav--menu')) {\n                    const summary = event.target.closest('summary');\n                    const details = summary.closest('details');\n                    const wrapper = details.parentNode;\n                    if (details.hasAttribute('open'))\n                        details.removeAttribute('open');\n                    else\n                        details.setAttribute('open', 'true');\n                    // Close any bespoke menus\n                    iamNav.querySelectorAll('.nav--menu.open').forEach(function (element) {\n                        element.classList.remove('open');\n                        setTimeout(function () {\n                            menu.classList.add('closed');\n                        }, 1000);\n                    });\n                    iamNav.shadowRoot.querySelectorAll('.buttons-holder .btn-menu[aria-expanded]').forEach(function (element) {\n                        element.removeAttribute('aria-expanded');\n                        const innerBtn = element.querySelector('.btn-primary');\n                        innerBtn.classList.remove('active');\n                    });\n                    // Close any other dropdowns on the same level\n                    Array.from(wrapper.querySelectorAll(':scope > details')).forEach((detailsArrayElement) => {\n                        if (detailsArrayElement != details)\n                            detailsArrayElement.removeAttribute('open');\n                    });\n                    if (this.querySelectorAll(':scope > details[open]').length) {\n                        backdrop.classList.add('show');\n                        iamNav.classList.add('open');\n                        if (this.querySelectorAll(':scope > details[open][slot=\"secondary\"]').length)\n                            iamNav.classList.add('open-secondary');\n                    }\n                    else {\n                        backdrop.classList.remove('show');\n                        iamNav.classList.remove('open');\n                        iamNav.classList.remove('open-secondary');\n                    }\n                    event.preventDefault();\n                }\n            }\n        });\n        // Mega menu title\n        this.querySelectorAll('details').forEach((detailsElement) => {\n            const summary = detailsElement.querySelector('summary');\n            const containerDiv = detailsElement.querySelector(':Scope > div');\n            containerDiv.setAttribute('data-title', summary.textContent);\n        });\n        // Search\n        if (this.querySelector('[slot=\"search\"]')) {\n            menu.classList.add('has-search');\n            const searchWrapper = this.shadowRoot.querySelector('#search-wrapper');\n            searchWrapper.classList.remove('d-none');\n            searchWrapper.insertAdjacentHTML('afterbegin', `<button class=\"btn btn-secondary btn-compact fa-search me-0 mb-0\" id=\"search-button\" aria-controls=\"search-dialog\">Open Search field</button>\n      <dialog id=\"search-dialog\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col mb-0 ms-auto col-md-7\">\n            <slot name=\"search\"></slot>\n          </div>\n          <div class=\"col d-none d-md-block mw-fit-content ms-3\">\n            <button class=\"btn btn-compact btn-secondary fa-xmark-large m-0 mb-0\" type=\"button\" id=\"search-close\">Close search field</button>\n          </div>\n        </div>\n      </div>\n      </dialog>`);\n            const searchButton = this.shadowRoot.querySelector('#search-button');\n            const searchClose = this.shadowRoot.querySelector('#search-close');\n            const searchDialog = this.shadowRoot.querySelector('#search-dialog');\n            if (this.hasAttribute('data-search-open')) {\n                searchDialog.setAttribute('open', 'open');\n                this.classList.add('search-open');\n                searchButton.setAttribute('aria-expanded', true);\n            }\n            searchButton.addEventListener('click', () => {\n                searchDialog.setAttribute('open', 'open');\n                this.classList.add('search-open');\n                searchButton.setAttribute('aria-expanded', true);\n            });\n            searchClose.addEventListener('click', () => {\n                searchDialog.removeAttribute('open');\n                this.classList.remove('search-open');\n                searchButton.removeAttribute('aria-expanded');\n            });\n        }\n        if (this.classList.contains('nav--sticky')) {\n            let oldScrollY = window.scrollY;\n            window.onscroll = function (e) {\n                if (oldScrollY < window.scrollY) {\n                    document.body.setAttribute('data-direction', 'down');\n                }\n                else {\n                    document.body.setAttribute('data-direction', 'up');\n                }\n                if (window.scrollY > 100) {\n                    document.body.classList.add('past100');\n                }\n                else {\n                    document.body.classList.remove('past100');\n                }\n                oldScrollY = window.scrollY;\n            };\n        }\n    }\n}\nexport default iamNav;\n"],"names":["iamNav","shadowRoot","template","menuButton","menu","backdrop","buttonsHolder","createNavMenu","component","element","title","iconClass","button","mdButton","e","openMenu","openmenu","selectedButton","event","details","wrapper","detailsArrayElement","detailsElement","summary","searchWrapper","searchButton","searchClose","searchDialog","oldScrollY"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,KACb,CAAC,EACD,MAAMA,UAAe,WAAY,CAC7B,aAAc,CACV,MAAK,EACL,MAAMC,EAAa,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EAC/B,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAIvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAiCrBD,EAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,EAElD,SAAS,eAAe,WAAW,GACpC,SAAS,KAAK,mBAAmB,YAAa;AAAA,SAA+C,CACrG,CACA,mBAAoB,CAEZ,KAAK,aAAa,UAAU,GAC5B,KAAK,WACA,cAAc,aAAa,EAC3B,mBAAmB,YAAa,YAAY,KAAK,aAAa,UAAU,CAAC,IAAI,EACtF,MAAMC,EAAa,KAAK,WAAW,cAAc,WAAW,EACtDC,EAAO,KAAK,WAAW,cAAc,OAAO,EAE5CJ,EAAS,KACTK,EAAW,KAAK,WAAW,cAAc,WAAW,EACpDC,EAAgB,KAAK,WAAW,cAAc,iBAAiB,EAE/DC,EAAiBC,GAAc,CACjCF,EAAc,UAAY,GAC1BE,EAAU,iBAAiB,YAAY,EAAE,QAAQ,SAAUC,EAAS,CAWhE,GAVgBA,EAAQ,UAEf,WACIA,EAAQ,aAAa,MAAM,IAC5BA,EAAQ,aAAa,OAAQ,SAAS,EACtCL,EAAK,UAAU,IAAI,aAAa,IAKxCK,EAAQ,UAAU,SAAS,WAAW,GACtCA,EAAQ,aAAa,YAAY,GACjCA,EAAQ,aAAa,WAAW,EAAG,CACnC,MAAMC,EAAQD,EAAQ,aAAa,YAAY,EACzCE,EAAYF,EAAQ,aAAa,WAAW,EAE5CG,EAAS,SAAS,cAAc,QAAQ,EAC9CA,EAAO,aAAa,OAAQF,CAAK,EACjCE,EAAO,UAAU,IAAI,UAAU,EAC/BA,EAAO,aAAa,OAAQ,UAAU,EACtCA,EAAO,UAAY,uCAAuCF,CAAK,oBAAoBC,CAAS,yDAC5FL,EAAc,sBAAsB,YAAaM,CAAM,EACvD,MAAMC,EAAWD,EAAO,cAAc,cAAc,EAEpDH,EAAQ,aAAa,OAAQ,OAAO,EAEhCA,EAAQ,UAAU,SAAS,MAAM,GACjCG,EAAO,aAAa,gBAAiB,EAAI,EACzCC,EAAS,UAAU,OAAO,QAAQ,EAClCL,EAAU,UAAU,IAAI,MAAM,EAC9BH,EAAS,UAAU,IAAI,MAAM,GAG7BI,EAAQ,UAAU,IAAI,QAAQ,EAGlCG,EAAO,iBAAiB,QAAS,SAAUE,EAAG,CAC1CA,EAAE,eAAc,EAChBF,EAAO,gBAAgB,eAAe,EACtC,QAAQ,IAAIH,CAAO,EACnBA,EAAQ,UAAU,OAAO,MAAM,EAC/BI,EAAS,UAAU,OAAO,QAAQ,EAElC,MAAME,EAAWP,EAAU,cAAc,wBAAwB,EAC7DO,GACAA,EAAS,gBAAgB,MAAM,EAE/BN,EAAQ,UAAU,SAAS,MAAM,GACjCL,EAAK,UAAU,OAAO,MAAM,EAC5BD,EAAW,gBAAgB,eAAe,EAC1C,WAAW,UAAY,CACnBC,EAAK,UAAU,IAAI,QAAQ,CAC/B,EAAG,GAAI,EACPI,EAAU,UAAU,IAAI,MAAM,EAC9BH,EAAS,UAAU,IAAI,MAAM,EAC7BI,EAAQ,UAAU,OAAO,QAAQ,IAGjCD,EAAU,UAAU,OAAO,MAAM,EACjCH,EAAS,UAAU,OAAO,MAAM,EAChC,WAAW,UAAY,CACnBI,EAAQ,UAAU,IAAI,QAAQ,CAClC,EAAG,GAAI,GAGXD,EAAU,iBAAiB,iBAAiB,EAAE,QAAQ,SAAUQ,EAAU,CAClEA,GAAYP,GACZO,EAAS,UAAU,OAAO,MAAM,CAExC,CAAC,EACDR,EAAU,WACL,iBAAiB,0CAA0C,EAC3D,QAAQ,SAAUS,EAAgB,CAC/BA,GAAkBL,IAClBK,EAAe,gBAAgB,eAAe,EAC7BA,EAAe,cAAc,cAAc,EACnD,UAAU,OAAO,QAAQ,EAE1C,CAAC,CACL,EAAG,EAAK,CACZ,CACJ,CAAC,EACDT,EAAU,iBAAiB,SAAS,EAAE,QAAQ,SAAUC,EAAS,CAC7DA,EAAQ,UAAU,IAAI,iBAAiB,CAC3C,CAAC,CACL,EA8GA,GA7GAF,EAAc,IAAI,EAClB,KAAK,iBAAiB,UAAW,IAAM,CACnC,QAAQ,IAAI,aAAa,EACzBA,EAAc,IAAI,CACtB,CAAC,EAEG,KAAK,cAAc,oBAAoB,GACvCH,EAAK,UAAU,IAAI,eAAe,EAGtCD,EAAW,iBAAiB,QAAS,SAAUW,EAAG,CAC9CA,EAAE,eAAc,EAEhBV,EAAK,UAAU,OAAO,MAAM,EAE5BJ,EAAO,iBAAiB,iBAAiB,EAAE,QAAQ,SAAUS,EAAS,CAClEA,EAAQ,UAAU,OAAO,MAAM,EAC/B,WAAW,UAAY,CACnBA,EAAQ,UAAU,IAAI,QAAQ,CAClC,EAAG,GAAI,CACX,CAAC,EACDT,EAAO,WAAW,iBAAiB,0CAA0C,EAAE,QAAQ,SAAUS,EAAS,CACtGA,EAAQ,gBAAgB,eAAe,EACtBA,EAAQ,cAAc,cAAc,EAC5C,UAAU,OAAO,QAAQ,CACtC,CAAC,EACGL,EAAK,UAAU,SAAS,MAAM,GAC9BJ,EAAO,UAAU,IAAI,MAAM,EAC3BI,EAAK,UAAU,OAAO,QAAQ,IAG9BJ,EAAO,UAAU,OAAO,MAAM,EAC9B,WAAW,UAAY,CACnBI,EAAK,UAAU,IAAI,QAAQ,CAC/B,EAAG,GAAI,EAEf,EAAG,EAAK,EAER,KAAK,iBAAiB,gBAAiB,IAAM,CACzCD,EAAW,gBAAgB,eAAe,EAC1CC,EAAK,UAAU,OAAO,MAAM,EAC5BJ,EAAO,UAAU,OAAO,MAAM,CAClC,CAAC,EAEDK,EAAS,iBAAiB,QAAS,IAAM,CACrC,MAAMU,EAAW,KAAK,cAAc,uBAAuB,EACvDA,GACAA,EAAS,MAAK,EAClBf,EAAO,UAAU,OAAO,MAAM,EAC9BA,EAAO,iBAAiB,iBAAiB,EAAE,QAAQ,SAAUS,EAAS,CAClEA,EAAQ,UAAU,OAAO,MAAM,CACnC,CAAC,EACDT,EAAO,WAAW,iBAAiB,0CAA0C,EAAE,QAAQ,SAAUS,EAAS,CACtGA,EAAQ,gBAAgB,eAAe,EACtBA,EAAQ,cAAc,cAAc,EAC5C,UAAU,OAAO,QAAQ,CACtC,CAAC,EACDJ,EAAS,UAAU,OAAO,MAAM,CACpC,CAAC,EAED,KAAK,iBAAiB,QAAUa,GAAU,CACtC,GAAIA,GAASA,EAAM,kBAAkB,aAAeA,EAAM,OAAO,QAAQ,SAAS,GAC1E,OAAO,WAAa,KAAO,CAACA,EAAM,OAAO,QAAQ,YAAY,EAAG,CAEhE,MAAMC,EADUD,EAAM,OAAO,QAAQ,SAAS,EACtB,QAAQ,SAAS,EACnCE,EAAUD,EAAQ,WACpBA,EAAQ,aAAa,MAAM,EAC3BA,EAAQ,gBAAgB,MAAM,EAE9BA,EAAQ,aAAa,OAAQ,MAAM,EAEvCnB,EAAO,iBAAiB,iBAAiB,EAAE,QAAQ,SAAUS,EAAS,CAClEA,EAAQ,UAAU,OAAO,MAAM,EAC/B,WAAW,UAAY,CACnBL,EAAK,UAAU,IAAI,QAAQ,CAC/B,EAAG,GAAI,CACX,CAAC,EACDJ,EAAO,WAAW,iBAAiB,0CAA0C,EAAE,QAAQ,SAAUS,EAAS,CACtGA,EAAQ,gBAAgB,eAAe,EACtBA,EAAQ,cAAc,cAAc,EAC5C,UAAU,OAAO,QAAQ,CACtC,CAAC,EAED,MAAM,KAAKW,EAAQ,iBAAiB,kBAAkB,CAAC,EAAE,QAASC,GAAwB,CAClFA,GAAuBF,GACvBE,EAAoB,gBAAgB,MAAM,CAClD,CAAC,EACG,KAAK,iBAAiB,wBAAwB,EAAE,QAChDhB,EAAS,UAAU,IAAI,MAAM,EAC7BL,EAAO,UAAU,IAAI,MAAM,EACvB,KAAK,iBAAiB,0CAA0C,EAAE,QAClEA,EAAO,UAAU,IAAI,gBAAgB,IAGzCK,EAAS,UAAU,OAAO,MAAM,EAChCL,EAAO,UAAU,OAAO,MAAM,EAC9BA,EAAO,UAAU,OAAO,gBAAgB,GAE5CkB,EAAM,eAAc,CACxB,CAER,CAAC,EAED,KAAK,iBAAiB,SAAS,EAAE,QAASI,GAAmB,CACzD,MAAMC,EAAUD,EAAe,cAAc,SAAS,EACjCA,EAAe,cAAc,cAAc,EACnD,aAAa,aAAcC,EAAQ,WAAW,CAC/D,CAAC,EAEG,KAAK,cAAc,iBAAiB,EAAG,CACvCnB,EAAK,UAAU,IAAI,YAAY,EAC/B,MAAMoB,EAAgB,KAAK,WAAW,cAAc,iBAAiB,EACrEA,EAAc,UAAU,OAAO,QAAQ,EACvCA,EAAc,mBAAmB,aAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAY3C,EACJ,MAAMC,EAAe,KAAK,WAAW,cAAc,gBAAgB,EAC7DC,EAAc,KAAK,WAAW,cAAc,eAAe,EAC3DC,EAAe,KAAK,WAAW,cAAc,gBAAgB,EAC/D,KAAK,aAAa,kBAAkB,IACpCA,EAAa,aAAa,OAAQ,MAAM,EACxC,KAAK,UAAU,IAAI,aAAa,EAChCF,EAAa,aAAa,gBAAiB,EAAI,GAEnDA,EAAa,iBAAiB,QAAS,IAAM,CACzCE,EAAa,aAAa,OAAQ,MAAM,EACxC,KAAK,UAAU,IAAI,aAAa,EAChCF,EAAa,aAAa,gBAAiB,EAAI,CACnD,CAAC,EACDC,EAAY,iBAAiB,QAAS,IAAM,CACxCC,EAAa,gBAAgB,MAAM,EACnC,KAAK,UAAU,OAAO,aAAa,EACnCF,EAAa,gBAAgB,eAAe,CAChD,CAAC,CACL,CACA,GAAI,KAAK,UAAU,SAAS,aAAa,EAAG,CACxC,IAAIG,EAAa,OAAO,QACxB,OAAO,SAAW,SAAUd,EAAG,CACvBc,EAAa,OAAO,QACpB,SAAS,KAAK,aAAa,iBAAkB,MAAM,EAGnD,SAAS,KAAK,aAAa,iBAAkB,IAAI,EAEjD,OAAO,QAAU,IACjB,SAAS,KAAK,UAAU,IAAI,SAAS,EAGrC,SAAS,KAAK,UAAU,OAAO,SAAS,EAE5CA,EAAa,OAAO,OACxB,CACJ,CACJ,CACJ"}
+{"version":3,"file":"nav.component.min.js","sources":["../../modules/nav.js","nav.component.js"],"sourcesContent":["var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nexport const navTemplate = /* HTML */ `<div class=\"container\">\n  <slot name=\"logo\"></slot>\n\n  <div class=\"buttons-holder\">\n    <button class=\"btn-menu\" part=\"btn-menu-account\" id=\"btn-menu-account\">\n      <span class=\"btn btn-primary\">\n        <span id=\"account-btn-title\"></span>\n        <i class=\"fa-user fa-solid\"></i>\n        <i class=\"fa-regular fa-xmark-large\"></i>\n      </span>\n    </button>\n    <button class=\"btn-menu\" part=\"btn-menu\" id=\"btn-menu\">\n      Menu\n      <i class=\"fa-regular fa-bars\"></i>\n      <i class=\"fa-regular fa-xmark-large\"></i>\n    </button>\n  </div>\n\n  <div class=\"menu__outer\" part=\"menu__outer\">\n    <div class=\"menu closed\" part=\"menu\">\n\n      <div class=\"menu__primary\">\n        <slot></slot>\n        <slot name=\"dual\"></slot>\n      </div>\n      <div class=\"dialog__wrapper d-none\" id=\"search-wrapper\"></div>\n\n      <slot name=\"actions\"></slot>\n\n      <div class=\"menu__secondary bg-light\">\n        <div class=\"container\">\n\n          <slot name=\"secondary\"></slot>\n        </div>\n      </div>\n    </div>\n    <div class=\"nav--menu\" part=\"nav--menu\">\n      <slot name=\"account\"></slot>\n    </div>\n  </div>\n</div>\n<div class=\"backdrop\" part=\"backdrop\"></div>`;\n// #region Standadised Nav\nexport const populateNav = (data, slot = '') => {\n    let html = ``;\n    data.forEach((feature) => {\n        if (feature.attributes.sections.length)\n            html += `<details name=\"megamenu\" ${slot != '' ? `slot=\"${slot}\"` : ''}><summary>${feature.attributes.title}</summary><div data-title=\"${feature.attributes.title}\">${populateSections(feature.attributes.sections)}</div></details>`;\n        else if (feature.attributes.links)\n            html += `<details name=\"megamenu\" ${slot != '' ? `slot=\"${slot}\"` : ''}><summary>${feature.attributes.title}</summary><div data-title=\"${feature.attributes.title}\">${populateLinks(feature.attributes.links)}</div></details>`;\n        else\n            html += `<a href=\"/\" ${slot != '' ? `slot=\"${slot}\"` : ''}>${feature.attributes.title}</a>`;\n    });\n    return html;\n};\nexport const populateSections = (data) => {\n    let html = ``;\n    data.forEach((section) => {\n        html += `<span class=\"section section--${section.layout}\">\n      ${section.title ? `<span class=\"lead section-title\" data-product=\"${section.id}\" data-title>${section.title}:</span>` : ''}\n      ${section.description ? `<span class=\"lead section-desc text-body\" data-product=\"${section.id}\"><i class=\"fa-solid fa-rocket colour-warning\"></i> ${section.description}</span>` : ''}\n      ${populateLinks(section.links)}\n    </span>`;\n    });\n    return html;\n};\nexport const populateLinks = (data) => {\n    let html = ``;\n    data.forEach((link) => {\n        html += `<a href=\"${link.destinations.unlinked}\" title=\"Learn more about this features product\" target=\"_blank\" data-product=\"${link.productKey}\" data-feature=\"${link.featureKey}\" data-enabled=\"${link.destinations.linkedEnabled}\" data-disabled=\"${link.destinations.linkedDisabled}\">${link.title}</a>`;\n    });\n    return html;\n};\nexport const loadNavData = (mode) => __awaiter(void 0, void 0, void 0, function* () {\n    const ajaxURL = mode != 'dev' ? 'https://hub.iamproperty.group/data/ecosystem-switcher.json' : 'https://dev.hub.iamproperty.group/data/ecosystem-switcher.json';\n    try {\n        const response = yield fetch(ajaxURL, {\n            method: 'GET',\n            headers: {\n                Accept: 'application/json',\n            },\n        });\n        const json = yield response.json();\n        const data = json.data ? json.data : json;\n        return data;\n    }\n    catch (error) {\n        if ((error === null || error === void 0 ? void 0 : error.name) === 'AbortError') {\n            return true;\n        }\n        console.log(error);\n        return 'There has been a problem. Please try again in a few moments.';\n    }\n});\nexport const loadUserData = (mode, subject, product) => __awaiter(void 0, void 0, void 0, function* () {\n    const ajaxURL = mode != 'dev' ? 'https://api.sso.iamproperty.group/navigation/access-context' : 'https://api.dev.sso.iamproperty.group/navigation/access-context';\n    try {\n        const response = yield fetch(ajaxURL, {\n            method: 'post',\n            headers: {\n                Accept: 'application/vnd.api+json',\n                'Content-Type': 'application/vnd.api+json'\n            },\n            body: JSON.stringify({\n                \"data\": {\n                    \"type\": \"navigation-access-context-request\",\n                    \"attributes\": {\n                        \"subject\": subject,\n                        \"requestingProduct\": product,\n                        \"navigationSchemaVersion\": \"2026-04-16\"\n                    }\n                }\n            })\n        });\n        const json = yield response.json();\n        const data = json.data ? json.data : json;\n        return data;\n    }\n    catch (error) {\n        if ((error === null || error === void 0 ? void 0 : error.name) === 'AbortError') {\n            return true;\n        }\n        console.log(error);\n        return 'There has been a problem. Please try again in a few moments.';\n    }\n});\nexport const setEnabledLinks = (component, data) => {\n    const elements = component.querySelectorAll('[data-product][data-feature]');\n    elements.forEach((element) => {\n        if (data.attributes.features[element.getAttribute('data-product')]) {\n            const isEnabled = data.attributes.features[element.getAttribute('data-product')].includes(element.getAttribute('data-feature'));\n            element.setAttribute('data-is-enabled', isEnabled);\n            if (isEnabled && element.getAttribute('data-enabled')) {\n                element.setAttribute('href', element.getAttribute('data-enabled'));\n                element.removeAttribute('target');\n                element.removeAttribute('title');\n            }\n        }\n    });\n};\n// #endregion\nexport const branchSelector = (component) => {\n    const branchSelector = component.querySelector(\"iam-branch-selector\");\n    const mql = window.matchMedia(\"(width > 62em)\");\n    if (mql.matches)\n        branchSelector === null || branchSelector === void 0 ? void 0 : branchSelector.setAttribute('slot', 'secondary');\n    mql.addEventListener(\"change\", (e) => {\n        if (e.matches && component.classList.contains('has-secondary'))\n            branchSelector === null || branchSelector === void 0 ? void 0 : branchSelector.setAttribute('slot', 'secondary');\n        else\n            branchSelector === null || branchSelector === void 0 ? void 0 : branchSelector.setAttribute('slot', 'account');\n    });\n};\nexport const menuEvents = (component, menu, menuButton, accountMenu, accountMenuButton) => {\n    menuButton.addEventListener('click', (e) => {\n        var _a;\n        e.preventDefault();\n        menu.classList.toggle('open');\n        accountMenu.classList.remove('open');\n        if (menu.classList.contains('open')) {\n            component.classList.add('open');\n        }\n        else {\n            component.classList.remove('open');\n        }\n        accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.querySelector('.btn-primary').classList.remove('active');\n        accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.removeAttribute('aria-expanded');\n        (_a = component.querySelector(':scope > details[open]')) === null || _a === void 0 ? void 0 : _a.removeAttribute('open');\n    }, false);\n};\nexport const megaMenuTitles = (component) => {\n    // Mega menu title\n    component.querySelectorAll('details').forEach((detailsElement) => {\n        const summary = detailsElement.querySelector('summary');\n        const containerDiv = detailsElement.querySelector(':Scope > div');\n        if (containerDiv)\n            containerDiv.setAttribute('data-title', summary.textContent);\n    });\n};\nexport const megaMenusEvents = (component, menu, menuButton, accountMenu, accountMenuButton, backdrop) => {\n    component.addEventListener('click', (event) => {\n        if (event && event.target instanceof HTMLElement && event.target.closest('summary')) {\n            const summary = event.target.closest('summary');\n            const details = summary.closest('details');\n            if (window.innerWidth > 992 && !event.target.closest('.nav--menu')) {\n                if (details === null || details === void 0 ? void 0 : details.hasAttribute('open')) { // Is open before the user clicks on the details summary\n                    backdrop.classList.remove('show');\n                    component.classList.remove('open');\n                    component.classList.remove('open-secondary');\n                }\n                else {\n                    backdrop.classList.add('show');\n                    component.classList.add('open');\n                    if ((details === null || details === void 0 ? void 0 : details.hasAttribute('slot')) && (details === null || details === void 0 ? void 0 : details.getAttribute('slot')) == \"secondary\")\n                        component.classList.add('open-secondary');\n                    // Open the first details element if one isn't open\n                    if (!details.querySelector('details[open]') && details.querySelector('details'))\n                        details.querySelector('details').setAttribute('open', true);\n                }\n                // Close all other siblings of details\n                details === null || details === void 0 ? void 0 : details.parentNode.querySelectorAll(':scope > details').forEach(element => {\n                    if (element != details)\n                        element.removeAttribute('open');\n                });\n                menu.classList.remove('open');\n                accountMenu.classList.remove('open');\n                accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.querySelector('.btn-primary').classList.remove('active');\n                menuButton === null || menuButton === void 0 ? void 0 : menuButton.removeAttribute('aria-expanded');\n                accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.removeAttribute('aria-expanded');\n            }\n        }\n    });\n};\nexport const accountMenuEvents = (component, menu, menuButton, accountMenu, accountMenuButton, backdrop) => {\n    accountMenuButton.addEventListener('click', () => {\n        var _a;\n        // Close the main menu\n        menu.classList.remove('open');\n        accountMenu.classList.toggle('open');\n        if (accountMenu.classList.contains('open')) {\n            component.classList.add('open');\n            accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.querySelector('.btn-primary').classList.add('active');\n            accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.setAttribute('aria-expanded', true);\n        }\n        else {\n            component.classList.remove('open');\n            accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.querySelector('.btn-primary').classList.remove('active');\n            accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.removeAttribute('aria-expanded');\n        }\n        (_a = component.querySelector(':scope > details[open]')) === null || _a === void 0 ? void 0 : _a.removeAttribute('open');\n        menuButton === null || menuButton === void 0 ? void 0 : menuButton.removeAttribute('aria-expanded');\n    });\n};\nexport const backdropEvents = (component, menu, menuButton, accountMenu, accountMenuButton, backdrop) => {\n    // Close the menu on the click of the backdrop on desktop\n    backdrop.addEventListener('click', () => {\n        const openMenu = component.querySelector(':scope > details[open]');\n        if (openMenu)\n            openMenu.removeAttribute('open');\n        component.classList.remove('open');\n        menu.classList.remove('open');\n        menuButton === null || menuButton === void 0 ? void 0 : menuButton.removeAttribute('aria-expanded');\n        accountMenu.classList.remove('open');\n        accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.querySelector('.btn-primary').classList.remove('active');\n        accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.removeAttribute('aria-expanded');\n        backdrop.classList.remove('show');\n    });\n};\n","import { navTemplate, branchSelector, menuEvents, megaMenuTitles, megaMenusEvents, accountMenuEvents, backdropEvents } from '../../modules/nav';\nclass iamNav extends HTMLElement {\n    constructor() {\n        super();\n        const shadowRoot = this.attachShadow({ mode: 'open' });\n        const assetLocation = document.body.hasAttribute('data-assets-location')\n            ? document.body.getAttribute('data-assets-location')\n            : '/assets';\n        const navCSS = `@import \"${assetLocation}/css/components/nav.component.css\";`;\n        const loadExtraCSS = `@import \"${assetLocation}/css/components/nav.global.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = /* HTML */ `\n    <style class=\"styles\">\n    ${navCSS}\n    </style>\n\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\">\n    ${navTemplate}\n    `;\n        shadowRoot.appendChild(template.content.cloneNode(true));\n        // insert extra CSS\n        if (!document.getElementById('navGlobal'))\n            document.head.insertAdjacentHTML('beforeend', `<style id=\"navGlobal\">${loadExtraCSS}</style>`);\n    }\n    connectedCallback() {\n        var _a;\n        const backdrop = this.shadowRoot.querySelector('.backdrop');\n        const menuButton = this.shadowRoot.querySelector('#btn-menu');\n        const menu = this.shadowRoot.querySelector('.menu');\n        const accountMenuButton = this.shadowRoot.querySelector('#btn-menu-account');\n        const accountMenu = this.shadowRoot.querySelector('.nav--menu');\n        const accountBtnTitle = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#account-btn-title');\n        // #region Add Helper classes\n        // Has secondary link\n        if (this.querySelector('[slot=\"secondary\"]')) {\n            this.classList.add('has-secondary');\n        }\n        // #endregion\n        accountBtnTitle.innerHTML = this.hasAttribute('data-account-btn-title') ? this.getAttribute('data-account-btn-title') : 'My account';\n        if (!this.querySelector('[slot=\"account\"]')) {\n            accountMenuButton === null || accountMenuButton === void 0 ? void 0 : accountMenuButton.remove();\n            accountMenu === null || accountMenu === void 0 ? void 0 : accountMenu.remove();\n            accountBtnTitle === null || accountBtnTitle === void 0 ? void 0 : accountBtnTitle.remove();\n        }\n        // Allow outside JS to close the menu\n        this.addEventListener('request-close', () => {\n            menuButton.removeAttribute('aria-expanded');\n            menu.classList.remove('open');\n            this.classList.remove('open');\n        });\n        menuEvents(this, menu, menuButton, accountMenu, accountMenuButton);\n        megaMenuTitles(this);\n        megaMenusEvents(this, menu, menuButton, accountMenu, accountMenuButton, backdrop);\n        accountMenuEvents(this, menu, menuButton, accountMenu, accountMenuButton, backdrop);\n        backdropEvents(this, menu, menuButton, accountMenu, accountMenuButton, backdrop);\n        branchSelector(this);\n        // #region Search\n        if (this.querySelector('[slot=\"search\"]')) {\n            menu.classList.add('has-search');\n            const searchWrapper = this.shadowRoot.querySelector('#search-wrapper');\n            searchWrapper.classList.remove('d-none');\n            searchWrapper.insertAdjacentHTML('afterbegin', `<button class=\"btn btn-secondary btn-compact fa-search me-0 mb-0\" id=\"search-button\" aria-controls=\"search-dialog\">Open Search field</button>\n      <dialog id=\"search-dialog\">\n      <div class=\"container\">\n        <div class=\"row\">\n          <div class=\"col mb-0 ms-auto col-md-7\">\n            <slot name=\"search\"></slot>\n          </div>\n          <div class=\"col d-none d-md-block mw-fit-content ms-3\">\n            <button class=\"btn btn-compact btn-secondary fa-xmark-large m-0 mb-0\" type=\"button\" id=\"search-close\">Close search field</button>\n          </div>\n        </div>\n      </div>\n      </dialog>`);\n            const searchButton = this.shadowRoot.querySelector('#search-button');\n            const searchClose = this.shadowRoot.querySelector('#search-close');\n            const searchDialog = this.shadowRoot.querySelector('#search-dialog');\n            if (this.hasAttribute('data-search-open')) {\n                searchDialog.setAttribute('open', 'open');\n                this.classList.add('search-open');\n                searchButton.setAttribute('aria-expanded', true);\n            }\n            searchButton.addEventListener('click', () => {\n                searchDialog.setAttribute('open', 'open');\n                this.classList.add('search-open');\n                searchButton.setAttribute('aria-expanded', true);\n            });\n            searchClose.addEventListener('click', () => {\n                searchDialog.removeAttribute('open');\n                this.classList.remove('search-open');\n                searchButton.removeAttribute('aria-expanded');\n            });\n        }\n        // #endregion\n    }\n}\nexport default iamNav;\n"],"names":["navTemplate","branchSelector","component","mql","e","menuEvents","menu","menuButton","accountMenu","accountMenuButton","_a","megaMenuTitles","detailsElement","summary","containerDiv","megaMenusEvents","backdrop","event","details","element","accountMenuEvents","backdropEvents","openMenu","iamNav","shadowRoot","template","accountBtnTitle","searchWrapper","searchButton","searchClose","searchDialog"],"mappings":"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"}

package/assets/js/components/nav-standalone/nav-standalone.component.js

@@ -0,0 +1,51 @@
+import iamNav from "../nav/nav.component";
+class iamNavStandalone extends HTMLElement {
+    constructor() {
+        super();
+        const shadowRoot = this.attachShadow({ mode: 'open' });
+        const assetLocation = document.body.hasAttribute('data-assets-location')
+            ? document.body.getAttribute('data-assets-location')
+            : '/assets';
+        const loadCSS = `@import "${assetLocation}/css/components/nav-standalone.component.css";`;
+        //const loadExtraCSS = `@import "${assetLocation}/css/components/nav.global.css";`;
+        const template = document.createElement('template');
+        template.innerHTML = /* HTML */ `
+    <style class="styles">
+    ${loadCSS}
+    </style>
+
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
+    <div class="wrapper">
+      <iam-nav class="iam-nav">
+        <slot></slot>
+        <slot name="account"></slot>
+        <slot name="secondary"></slot>
+      </iam-nav>
+    </div>
+    `;
+        shadowRoot.appendChild(template.content.cloneNode(true));
+        // insert extra CSS
+        if (!document.getElementById('navGlobal'))
+            document.head.insertAdjacentHTML('beforeend', `<style id="navGlobal">${loadExtraCSS}</style>`);
+    }
+    connectedCallback() {
+        if (!window.customElements.get(`iam-nav`))
+            window.customElements.define(`iam-nav`, iamNav);
+        const wrapper = this.shadowRoot.querySelector('.wrapper');
+        wrapper === null || wrapper === void 0 ? void 0 : wrapper.innerHTML = `<iam-nav class="iam-nav">${this.innerHTML}</iam-nav>`;
+        const iamNavElement = wrapper === null || wrapper === void 0 ? void 0 : wrapper.querySelector(':scope > iam-nav');
+        if (iamNavElement.querySelector('[slot="secondary"]')) {
+            iamNavElement.classList.add('has-secondary');
+        }
+        wrapper === null || wrapper === void 0 ? void 0 : wrapper.addEventListener('change', (e) => {
+            const event = new CustomEvent("change", e);
+            this.dispatchEvent(event);
+        });
+        wrapper === null || wrapper === void 0 ? void 0 : wrapper.addEventListener('click', (e) => {
+            console.log(e);
+            const event = new CustomEvent("click", e);
+            this.dispatchEvent(event);
+        });
+    }
+}
+export default iamNavStandalone;