@iamproperty/components 7.4.0 → 7.5.0

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

@@ -1 +1 @@
-{"version":3,"file":"carousel.component.min.js","sources":["../../modules/carousel.js","../_global.js","carousel.component.js"],"sourcesContent":["export const generateThumbnailList = function (carouselComponent) {\n    const thumbnailImages = [];\n    Array.from(carouselComponent.querySelectorAll(':scope > div')).forEach((slide, index) => {\n        if (slide.hasAttribute('data-thumbnail')) {\n            thumbnailImages[index] = slide.getAttribute('data-thumbnail');\n        }\n    });\n    return thumbnailImages;\n};\nexport const generatePipsHTML = function (carouselComponent, thumbnailImages) {\n    const itemCount = carouselComponent.querySelectorAll(':scope > div').length;\n    let pips = '';\n    for (let i = 1; i <= itemCount; i++) {\n        let pipContent = null;\n        let pipClass = '';\n        if (thumbnailImages.length && thumbnailImages[i - 1]) {\n            pipClass = 'has-thumbnail';\n            pipContent = `<img src=\"${thumbnailImages[i - 1]}\" alt=\"Slide ${i}\" height=\"148\"/>`;\n        }\n        else {\n            pipContent = `Slide ${i}`;\n        }\n        pips += `<button class=\"control-${i} ${pipClass}\" data-slide=\"${i}\" ${i == 1 ? 'aria-current' : ''}>${pipContent}</button>`;\n    }\n    return pips;\n};\nexport const getProgressMax = function (itemCount, visibleItems) {\n    if (visibleItems == 1) {\n        return itemCount;\n    }\n    const max = Math.ceil(itemCount / visibleItems) * visibleItems - visibleItems;\n    return max + 1;\n};\nconst getProgressPercent = function (value, max) {\n    return ((value - 1) / (max - 1)) * 100;\n};\nexport const carousel = function (carouselComponent) {\n    let scrollTimeout;\n    const carouselElement = carouselComponent.shadowRoot.querySelector('.carousel');\n    const carouselInner = carouselElement.querySelector('.carousel__inner');\n    const carouselControls = carouselElement.querySelector('.carousel__controls');\n    const carouselProgress = carouselElement.querySelector('.carousel__progress [type=\"range\"]');\n    const itemCount = carouselComponent.querySelectorAll(':scope > div').length;\n    let scrollArea = carouselInner.clientWidth;\n    let itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n    let visibleItems = Math.round(scrollArea / itemWidth);\n    carouselProgress.setAttribute('min', 1);\n    carouselProgress.setAttribute('step', visibleItems);\n    let progressMax = getProgressMax(itemCount, visibleItems);\n    carouselProgress.setAttribute('max', progressMax);\n    carouselProgress.value = 1;\n    let percent = getProgressPercent(1, progressMax);\n    carouselProgress.style.setProperty('--percent', percent + '%');\n    let stepperInterval, stepperEvent = 'mouseup', stepperStart = 'mousedown';\n    if ('ontouchstart' in document.documentElement) {\n        stepperEvent = 'touchend';\n        stepperStart = 'touchstart';\n    }\n    // On scroll we need to make sure the buttons get corrected and the next testimonial is shown\n    carouselInner.addEventListener('scroll', function () {\n        clearTimeout(scrollTimeout);\n        scrollTimeout = setTimeout(function () {\n            const scrollArea = carouselInner.clientWidth;\n            const scrollWidth = carouselInner.scrollWidth;\n            const scrollLeft = carouselInner.scrollLeft;\n            let targetSlide = Math.round((scrollLeft / scrollWidth) * itemCount) + 1;\n            const itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n            const lastItemOffset = carouselComponent.querySelector(':scope > div:last-child').offsetLeft;\n            //+60px here is to account for when the next offscreen slide is visible beneath the next arrow\n            const lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= lastItemOffset + 60;\n            const visibleItems = Math.round(scrollArea / itemWidth);\n            //Check if theres room for more slides than we have\n            const leftOverSpace = Math.ceil(itemCount / visibleItems) * visibleItems - itemCount;\n            carouselProgress.setAttribute('step', visibleItems);\n            if (leftOverSpace > 0 && lastItemInView) {\n                targetSlide = Math.floor(itemCount / visibleItems) * visibleItems + 1;\n            }\n            Array.from(carouselElement.querySelectorAll('.carousel__controls button')).forEach((button) => {\n                button.removeAttribute('aria-current');\n            });\n            carouselElement.querySelector('.control-' + targetSlide).setAttribute('aria-current', true);\n            // Disable the previous button\n            if (targetSlide == 1)\n                carouselElement.querySelector('.btn-prev').setAttribute('disabled', 'disabled');\n            else\n                carouselElement.querySelector('.btn-prev').removeAttribute('disabled');\n            // Disable the next button if the last item is in view\n            if (targetSlide > itemCount - visibleItems)\n                carouselElement.querySelector('.btn-next').setAttribute('disabled', 'disabled');\n            else\n                carouselElement.querySelector('.btn-next').removeAttribute('disabled');\n            carouselProgress.value = targetSlide;\n            progressMax = getProgressMax(itemCount, visibleItems);\n            carouselProgress.setAttribute('max', progressMax);\n            percent = (targetSlide / progressMax) * 100;\n            percent = getProgressPercent(targetSlide, progressMax);\n            carouselProgress.style.setProperty('--percent', percent + '%');\n        }, 100);\n    }, false);\n    // when the buttons are used we need to make sure the carousel scrolls to the correct place\n    carouselControls.addEventListener('click', function (e) {\n        for (let target = e.target; target && target != this; target = target.parentNode) {\n            if (typeof target.matches == 'function' && target.matches('button')) {\n                e.preventDefault();\n                Array.from(carouselControls.querySelectorAll('button')).forEach((button) => {\n                    button.removeAttribute('aria-current');\n                });\n                target.setAttribute('aria-current', true);\n                const customEvent = new CustomEvent('pip-clicked', {\n                    detail: {\n                        slide: target.getAttribute('data-slide'),\n                    },\n                });\n                carouselComponent.dispatchEvent(customEvent);\n                const el = carouselComponent.querySelector(`:scope > *:nth-child(${target.getAttribute('data-slide')})`);\n                carouselInner.scroll({\n                    top: 0,\n                    left: el.offsetLeft - carouselInner.getBoundingClientRect().left,\n                    behavior: 'smooth',\n                });\n                break;\n            }\n        }\n    }, false);\n    carouselElement.addEventListener('click', function (e) {\n        const scrollArea = carouselInner.clientWidth;\n        //const scrollWidth = carouselInner.scrollWidth;\n        const itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n        const visibleItems = Math.round(scrollArea / itemWidth);\n        const lastItemOffset = carouselComponent.querySelector(':scope > div:last-child').offsetLeft;\n        const lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= lastItemOffset + 60;\n        //Check if theres room for more slides than we have\n        const leftOverSpace = Math.ceil(itemCount / visibleItems) * visibleItems - itemCount;\n        /*\n        When the last slide isn't filled with items, we only want to move back the number of items on the slide,\n        rather than the total number of possible visible items\n      */\n        const spacesToMove = visibleItems - leftOverSpace;\n        //Only want to change the amount of movement if the last item is visible\n        const movement = lastItemInView && leftOverSpace > 0 ? spacesToMove * itemWidth : carouselInner.clientWidth;\n        for (let target = e.target; target && target != this; target = target.parentNode) {\n            if (typeof target.matches == 'function' && target.matches('.btn-next, .btn-prev')) {\n                const direction = target.matches('.btn-next') ? 'next' : 'prev';\n                const customEvent = new CustomEvent(`${direction}-clicked`, {\n                    detail: {\n                        slide: target.getAttribute('data-go'),\n                    },\n                });\n                carouselComponent.dispatchEvent(customEvent);\n                e.preventDefault();\n                const scrollTo = target.classList.contains('btn-prev')\n                    ? carouselInner.scrollLeft - movement\n                    : carouselInner.scrollLeft + carouselInner.clientWidth;\n                carouselInner.scroll({\n                    top: 0,\n                    left: scrollTo,\n                    behavior: 'smooth',\n                });\n                break;\n            }\n        }\n    }, false);\n    carouselProgress.addEventListener(stepperStart, function () {\n        clearInterval(stepperInterval);\n        stepperInterval = setInterval(function () {\n            scrollArea = carouselInner.clientWidth;\n            itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n            visibleItems = Math.round(scrollArea / itemWidth);\n            carouselProgress.setAttribute('step', visibleItems);\n            progressMax = getProgressMax(itemCount, visibleItems);\n            carouselProgress.setAttribute('max', progressMax);\n            percent = getProgressPercent(carouselProgress.value, progressMax);\n            carouselProgress.style.setProperty('--percent', percent + '%');\n        }, 10);\n    });\n    carouselProgress.addEventListener(stepperEvent, function () {\n        clearInterval(stepperInterval);\n    });\n    carouselProgress.addEventListener('change', function () {\n        clearInterval(stepperInterval);\n        const target = carouselComponent.querySelector(`:scope > *:nth-child(${carouselProgress.value})`);\n        carouselInner.scroll({\n            top: 0,\n            left: target ? target.offsetLeft - carouselInner.getBoundingClientRect().left : 0,\n            behavior: 'smooth',\n        });\n        //const direction = target.matches('.btn-next') ? 'next' : 'prev';\n        const customEvent = new CustomEvent(`slider-changed`, {\n            detail: {\n                slide: carouselProgress.value,\n            },\n        });\n        carouselComponent.dispatchEvent(customEvent);\n    }, false);\n};\nexport default carousel;\n","export const trackComponentRegistered = (componentName) => {\n    // Data layer Web component created\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'customElementRegistered',\n        element: componentName,\n    });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n    // Data layer Web component created\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'customElementAdded',\n        element: componentName,\n    });\n    trackEvents.forEach((eventName) => {\n        component.addEventListener(eventName, function (event) {\n            const eventDetails = {\n                event: eventName,\n                element: componentName,\n                target: event.target,\n            };\n            Object.keys(event.detail).forEach((eventKey) => {\n                const eventDetail = event.detail[eventKey];\n                eventDetails[eventKey] = eventDetail;\n            });\n            window.dataLayer.push(eventDetails);\n        });\n    });\n    return true;\n};\n","import { generateThumbnailList, generatePipsHTML, carousel } from '../../modules/carousel.js';\nimport { trackComponent, trackComponentRegistered } from '../_global.js';\ntrackComponentRegistered('iam-carousel');\nclass iamCarousel extends HTMLElement {\n    constructor() {\n        super();\n        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/carousel.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${loadCSS}\n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n    </style>\n    <div class=\"carousel\" part=\"carousel\">\n      <div class=\"carousel__wrapper\">\n        <div class=\"carousel__inner\">\n          <div class=\"carousel__content\" part=\"content\">\n            <slot></slot>\n          </div>\n        </div>\n \n      </div>\n        <div class=\"carousel__btns\" part=\"btns\">\n          <button class=\"btn btn-secondary btn-compact fa-plus-large btn-prev\" data-go=\"0\" disabled  part=\"prev\">Prev</button>\n          <button class=\"btn btn-secondary btn-compact fa-plus-large btn-next\" data-go=\"2\" part=\"next\">Next</button>\n        </div>\n\n        <div class=\"carousel__controls\" part=\"controls\">\n          \n        </div>\n\n        <div class=\"carousel__progress\" part=\"progress\">\n          <input type=\"range\" min=\"0\" max=\"100\" value=\"1\" step=\"1\">\n        </div>\n\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const carouselComponent = this;\n        //const carouselElement = this.shadowRoot.querySelector('.carousel');\n        //const row = this.shadowRoot.querySelector('.row');\n        let thumbnailImages = [];\n        const carouselControls = this.shadowRoot.querySelector('.carousel__controls');\n        if (carouselComponent.querySelector('[data-thumbnail]')) {\n            thumbnailImages = generateThumbnailList(carouselComponent);\n            carouselComponent.classList.add('thumbnails');\n        }\n        // populate the pips\n        carouselControls.innerHTML = generatePipsHTML(carouselComponent, thumbnailImages);\n        Array.from(carouselComponent.querySelectorAll(':scope > div > img:first-child:last-child, :scope > div > picture:first-child:last-child img')).forEach((image) => {\n            image.style.inset = '0 0.5rem 0 0.5rem';\n            image.style.position = 'absolute';\n            image.style.width = 'calc(100% - 1rem)';\n            image.style.height = '100%';\n            image.style['object-fit'] = 'cover';\n            image.closest('div').classList.add('image__wrapper');\n        });\n        carousel(carouselComponent);\n        trackComponent(carouselComponent, 'iam-carousel', [\n            'pip-clicked',\n            'next-clicked',\n            'prev-clicked',\n            'slider-changed',\n        ]);\n    }\n}\nexport default iamCarousel;\n"],"names":["generateThumbnailList","carouselComponent","thumbnailImages","slide","index","generatePipsHTML","itemCount","pips","i","pipContent","pipClass","getProgressMax","visibleItems","getProgressPercent","value","max","carousel","scrollTimeout","carouselElement","carouselInner","carouselControls","carouselProgress","scrollArea","itemWidth","progressMax","percent","stepperInterval","stepperEvent","stepperStart","scrollWidth","scrollLeft","targetSlide","lastItemOffset","lastItemInView","leftOverSpace","button","e","target","customEvent","el","spacesToMove","movement","direction","scrollTo","trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","iamCarousel","template","image"],"mappings":"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"}
+{"version":3,"file":"carousel.component.min.js","sources":["../../modules/carousel.js","../_global.js","carousel.component.js"],"sourcesContent":["export const generateThumbnailList = function (carouselComponent) {\n    const thumbnailImages = [];\n    Array.from(carouselComponent.querySelectorAll(':scope > div')).forEach((slide, index) => {\n        if (slide.hasAttribute('data-thumbnail')) {\n            thumbnailImages[index] = slide.getAttribute('data-thumbnail');\n        }\n    });\n    return thumbnailImages;\n};\nexport const generatePipsHTML = function (carouselComponent, thumbnailImages) {\n    const itemCount = carouselComponent.querySelectorAll(':scope > div').length;\n    let pips = '';\n    for (let i = 1; i <= itemCount; i++) {\n        let pipContent = null;\n        let pipClass = '';\n        if (thumbnailImages.length && thumbnailImages[i - 1]) {\n            pipClass = 'has-thumbnail';\n            pipContent = `<img src=\"${thumbnailImages[i - 1]}\" alt=\"Slide ${i}\" height=\"148\"/>`;\n        }\n        else {\n            pipContent = `Slide ${i}`;\n        }\n        pips += `<button class=\"control-${i} ${pipClass}\" data-slide=\"${i}\" ${i == 1 ? 'aria-current' : ''}>${pipContent}</button>`;\n    }\n    return pips;\n};\nexport const getProgressMax = function (itemCount, visibleItems) {\n    if (visibleItems == 1) {\n        return itemCount;\n    }\n    const max = Math.ceil(itemCount / visibleItems) * visibleItems - visibleItems;\n    return max + 1;\n};\nconst getProgressPercent = function (value, max) {\n    return ((value - 1) / (max - 1)) * 100;\n};\nexport const carousel = function (carouselComponent) {\n    let scrollTimeout;\n    const carouselElement = carouselComponent.shadowRoot.querySelector('.carousel');\n    const carouselInner = carouselElement.querySelector('.carousel__inner');\n    const carouselControls = carouselElement.querySelector('.carousel__controls');\n    const carouselProgress = carouselElement.querySelector('.carousel__progress [type=\"range\"]');\n    const itemCount = carouselComponent.querySelectorAll(':scope > div').length;\n    let scrollArea = carouselInner.clientWidth;\n    let itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n    let visibleItems = Math.round(scrollArea / itemWidth);\n    carouselProgress.setAttribute('min', 1);\n    carouselProgress.setAttribute('step', visibleItems);\n    let progressMax = getProgressMax(itemCount, visibleItems);\n    carouselProgress.setAttribute('max', progressMax);\n    carouselProgress.value = 1;\n    let percent = getProgressPercent(1, progressMax);\n    carouselProgress.style.setProperty('--percent', percent + '%');\n    let stepperInterval, stepperEvent = 'mouseup', stepperStart = 'mousedown';\n    if ('ontouchstart' in document.documentElement) {\n        stepperEvent = 'touchend';\n        stepperStart = 'touchstart';\n    }\n    // On scroll we need to make sure the buttons get corrected and the next testimonial is shown\n    carouselInner.addEventListener('scroll', function () {\n        clearTimeout(scrollTimeout);\n        scrollTimeout = setTimeout(function () {\n            const scrollArea = carouselInner.clientWidth;\n            const scrollWidth = carouselInner.scrollWidth;\n            const scrollLeft = carouselInner.scrollLeft;\n            let targetSlide = Math.round((scrollLeft / scrollWidth) * itemCount) + 1;\n            const itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n            const lastItemOffset = carouselComponent.querySelector(':scope > div:last-child').offsetLeft;\n            //+60px here is to account for when the next offscreen slide is visible beneath the next arrow\n            const lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= lastItemOffset + 60;\n            const visibleItems = Math.round(scrollArea / itemWidth);\n            //Check if theres room for more slides than we have\n            const leftOverSpace = Math.ceil(itemCount / visibleItems) * visibleItems - itemCount;\n            carouselProgress.setAttribute('step', visibleItems);\n            if (leftOverSpace > 0 && lastItemInView) {\n                targetSlide = Math.floor(itemCount / visibleItems) * visibleItems + 1;\n            }\n            Array.from(carouselElement.querySelectorAll('.carousel__controls button')).forEach((button) => {\n                button.removeAttribute('aria-current');\n            });\n            carouselElement.querySelector('.control-' + targetSlide).setAttribute('aria-current', true);\n            // Disable the previous button\n            if (targetSlide == 1)\n                carouselElement.querySelector('.btn-prev').setAttribute('disabled', 'disabled');\n            else\n                carouselElement.querySelector('.btn-prev').removeAttribute('disabled');\n            // Disable the next button if the last item is in view\n            if (targetSlide > itemCount - visibleItems)\n                carouselElement.querySelector('.btn-next').setAttribute('disabled', 'disabled');\n            else\n                carouselElement.querySelector('.btn-next').removeAttribute('disabled');\n            carouselProgress.value = targetSlide;\n            progressMax = getProgressMax(itemCount, visibleItems);\n            carouselProgress.setAttribute('max', progressMax);\n            percent = (targetSlide / progressMax) * 100;\n            percent = getProgressPercent(targetSlide, progressMax);\n            carouselProgress.style.setProperty('--percent', percent + '%');\n        }, 100);\n    }, false);\n    // when the buttons are used we need to make sure the carousel scrolls to the correct place\n    carouselControls.addEventListener('click', function (e) {\n        for (let target = e.target; target && target != this; target = target.parentNode) {\n            if (typeof target.matches == 'function' && target.matches('button')) {\n                e.preventDefault();\n                Array.from(carouselControls.querySelectorAll('button')).forEach((button) => {\n                    button.removeAttribute('aria-current');\n                });\n                target.setAttribute('aria-current', true);\n                const customEvent = new CustomEvent('pip-clicked', {\n                    detail: {\n                        slide: target.getAttribute('data-slide'),\n                    },\n                });\n                carouselComponent.dispatchEvent(customEvent);\n                const el = carouselComponent.querySelector(`:scope > *:nth-child(${target.getAttribute('data-slide')})`);\n                carouselInner.scroll({\n                    top: 0,\n                    left: el.offsetLeft - carouselInner.getBoundingClientRect().left,\n                    behavior: 'smooth',\n                });\n                break;\n            }\n        }\n    }, false);\n    carouselElement.addEventListener('click', function (e) {\n        const scrollArea = carouselInner.clientWidth;\n        //const scrollWidth = carouselInner.scrollWidth;\n        const itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n        const visibleItems = Math.round(scrollArea / itemWidth);\n        const lastItemOffset = carouselComponent.querySelector(':scope > div:last-child').offsetLeft;\n        const lastItemInView = carouselInner.scrollLeft + scrollArea + carouselInner.getBoundingClientRect().left >= lastItemOffset + 60;\n        //Check if theres room for more slides than we have\n        const leftOverSpace = Math.ceil(itemCount / visibleItems) * visibleItems - itemCount;\n        /*\n        When the last slide isn't filled with items, we only want to move back the number of items on the slide,\n        rather than the total number of possible visible items\n      */\n        const spacesToMove = visibleItems - leftOverSpace;\n        //Only want to change the amount of movement if the last item is visible\n        const movement = lastItemInView && leftOverSpace > 0 ? spacesToMove * itemWidth : carouselInner.clientWidth;\n        for (let target = e.target; target && target != this; target = target.parentNode) {\n            if (typeof target.matches == 'function' && target.matches('.btn-next, .btn-prev')) {\n                const direction = target.matches('.btn-next') ? 'next' : 'prev';\n                const customEvent = new CustomEvent(`${direction}-clicked`, {\n                    detail: {\n                        slide: target.getAttribute('data-go'),\n                    },\n                });\n                carouselComponent.dispatchEvent(customEvent);\n                e.preventDefault();\n                const scrollTo = target.classList.contains('btn-prev')\n                    ? carouselInner.scrollLeft - movement\n                    : carouselInner.scrollLeft + carouselInner.clientWidth;\n                carouselInner.scroll({\n                    top: 0,\n                    left: scrollTo,\n                    behavior: 'smooth',\n                });\n                break;\n            }\n        }\n    }, false);\n    carouselProgress.addEventListener(stepperStart, function () {\n        clearInterval(stepperInterval);\n        stepperInterval = setInterval(function () {\n            scrollArea = carouselInner.clientWidth;\n            itemWidth = carouselComponent.querySelector(':scope > div').scrollWidth;\n            visibleItems = Math.round(scrollArea / itemWidth);\n            carouselProgress.setAttribute('step', visibleItems);\n            progressMax = getProgressMax(itemCount, visibleItems);\n            carouselProgress.setAttribute('max', progressMax);\n            percent = getProgressPercent(carouselProgress.value, progressMax);\n            carouselProgress.style.setProperty('--percent', percent + '%');\n        }, 10);\n    });\n    carouselProgress.addEventListener(stepperEvent, function () {\n        clearInterval(stepperInterval);\n    });\n    carouselProgress.addEventListener('change', function () {\n        clearInterval(stepperInterval);\n        const target = carouselComponent.querySelector(`:scope > *:nth-child(${carouselProgress.value})`);\n        carouselInner.scroll({\n            top: 0,\n            left: target ? target.offsetLeft - carouselInner.getBoundingClientRect().left : 0,\n            behavior: 'smooth',\n        });\n        //const direction = target.matches('.btn-next') ? 'next' : 'prev';\n        const customEvent = new CustomEvent(`slider-changed`, {\n            detail: {\n                slide: carouselProgress.value,\n            },\n        });\n        carouselComponent.dispatchEvent(customEvent);\n    }, false);\n};\nexport default carousel;\n","export const trackComponentRegistered = (componentName) => {\n    // Data layer Web component created\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'customElementRegistered',\n        element: componentName,\n    });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n    // Data layer Web component created\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'customElementAdded',\n        element: componentName,\n    });\n    trackEvents.forEach((eventName) => {\n        component.addEventListener(eventName, function (event) {\n            const eventDetails = {\n                event: eventName,\n                element: componentName,\n                target: event.target,\n            };\n            Object.keys(event.detail).forEach((eventKey) => {\n                const eventDetail = event.detail[eventKey];\n                eventDetails[eventKey] = eventDetail;\n            });\n            window.dataLayer.push(eventDetails);\n        });\n    });\n    return true;\n};\n","import { generateThumbnailList, generatePipsHTML, carousel } from '../../modules/carousel.js';\nimport { trackComponent, trackComponentRegistered } from '../_global.js';\ntrackComponentRegistered('iam-carousel');\nclass iamCarousel extends HTMLElement {\n    constructor() {\n        super();\n        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/carousel.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = /* HTML */ `\n      <style>\n        ${loadCSS}\n        ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n      </style>\n      <div class=\"carousel\" part=\"carousel\">\n        <div class=\"carousel__wrapper\">\n          <div class=\"carousel__inner\">\n            <div class=\"carousel__content\" part=\"content\">\n              <slot></slot>\n            </div>\n          </div>\n        </div>\n        <div class=\"carousel__btns\" part=\"btns\">\n          <button class=\"btn btn-secondary btn-compact fa-plus-large btn-prev\" data-go=\"0\" disabled part=\"prev\">\n            Prev\n          </button>\n          <button class=\"btn btn-secondary btn-compact fa-plus-large btn-next\" data-go=\"2\" part=\"next\">Next</button>\n        </div>\n\n        <div class=\"carousel__controls\" part=\"controls\"></div>\n\n        <div class=\"carousel__progress\" part=\"progress\">\n          <input type=\"range\" min=\"0\" max=\"100\" value=\"1\" step=\"1\" />\n        </div>\n      </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const carouselComponent = this;\n        //const carouselElement = this.shadowRoot.querySelector('.carousel');\n        //const row = this.shadowRoot.querySelector('.row');\n        let thumbnailImages = [];\n        const carouselControls = this.shadowRoot.querySelector('.carousel__controls');\n        if (carouselComponent.querySelector('[data-thumbnail]')) {\n            thumbnailImages = generateThumbnailList(carouselComponent);\n            carouselComponent.classList.add('thumbnails');\n        }\n        // populate the pips\n        carouselControls.innerHTML = generatePipsHTML(carouselComponent, thumbnailImages);\n        Array.from(carouselComponent.querySelectorAll(':scope > div > img:first-child:last-child, :scope > div > picture:first-child:last-child img')).forEach((image) => {\n            image.style.inset = '0 0.5rem 0 0.5rem';\n            image.style.position = 'absolute';\n            image.style.width = 'calc(100% - 1rem)';\n            image.style.height = '100%';\n            image.style['object-fit'] = 'cover';\n            image.closest('div').classList.add('image__wrapper');\n        });\n        carousel(carouselComponent);\n        trackComponent(carouselComponent, 'iam-carousel', [\n            'pip-clicked',\n            'next-clicked',\n            'prev-clicked',\n            'slider-changed',\n        ]);\n    }\n}\nexport default iamCarousel;\n"],"names":["generateThumbnailList","carouselComponent","thumbnailImages","slide","index","generatePipsHTML","itemCount","pips","i","pipContent","pipClass","getProgressMax","visibleItems","getProgressPercent","value","max","carousel","scrollTimeout","carouselElement","carouselInner","carouselControls","carouselProgress","scrollArea","itemWidth","progressMax","percent","stepperInterval","stepperEvent","stepperStart","scrollWidth","scrollLeft","targetSlide","lastItemOffset","lastItemInView","leftOverSpace","button","e","target","customEvent","el","spacesToMove","movement","direction","scrollTo","trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","iamCarousel","template","image"],"mappings":"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"}

package/assets/js/components/collapsible-side/collapsible-side.component.min.js

@@ -1,10 +1,10 @@
 /*!
-  * iamKey v7.4.0
+  * iamKey v7.5.0
   * Copyright 2022-2025 iamproperty
   */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"collapsible side menu"});class c extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const o=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${o}/css/core.min.css`,t=document.createElement("template");t.innerHTML=`
     <style class="styles">
     @import "${e}";
-    :host{--colour-border: #e9e9e9;--side-link-hover: var(--colour-canvas-2);grid-column:full-width;display:block;min-height:calc(100vh - var(--nav-height));padding-top:0 !important;margin-inline:auto;width:100%;overflow:hidden;position:relative}@media screen and (prefers-color-scheme: light){:host{--side-link-hover: #eeeeee}}@media screen and (min-width: 62em){:host{max-height:calc(100vh - var(--nav-height));overflow:auto}}.container{position:static;min-height:100%;padding-top:0 !important;padding-bottom:0 !important;padding-left:0 !important}@media screen and (min-width: 62em){.container{padding-left:5.25rem !important}}.container.inline .side-menu{position:absolute;top:0}.side-menu{position:absolute;z-index:20;top:0;left:0;height:100%;min-height:calc(100vh - var(--nav-height));width:4.375rem;height:calc(100% - var(--nav-height));padding:0 2.5rem 0 0;transition:width 1s}.side-menu:before{content:"";position:absolute;z-index:1;top:0;right:2.5rem;height:100%;border-right:2px solid var(--colour-border)}@media screen and (min-width: 36em){.side-menu{left:0;width:5rem}}@media screen and (min-width: 62em){.side-menu{left:5.25rem;margin-left:-5.25rem;position:fixed;top:var(--nav-height)}.side-menu:not(.open).hover{width:21.5rem}.side-menu:not(.open).hover .btn[class*=fa-]:before{content:"\uF023" !important;transform:rotate(0)}}.side-menu .btn{display:var(--btn-display, block);position:absolute;top:2rem;right:2.5rem;margin-bottom:0;margin-right:-1.25rem;background-color:var(--colour-canvas-2);border:2px solid var(--colour-border);z-index:99;color:var(--colour-primary-theme);transition:opacity .2s}.side-menu .btn[aria-expanded][class*=fa-]:before{content:"\uF053" !important}@media screen and (min-width: 62em){.side-menu .btn[aria-expanded]{opacity:0}}.side-menu:is(:hover,:focus-within,:active) .btn{border:2px solid var(--colour-border);color:var(--colour-primary)}@media screen and (min-width: 62em){.side-menu:is(:hover,:focus-within,:active) .btn{opacity:1}}.side-menu:is(.open){width:calc(100% - var(--container-padding-x) + 2.5rem)}@media screen and (min-width: 36em){.side-menu:is(.open){width:26.375rem}}@media screen and (min-width: 62em){.side-menu:is(.open){width:21.5rem}}.side-menu .side-menu-content{position:absolute;top:0;right:2.5rem;padding:2rem 2.5rem 2.5rem 0;width:21.9375rem;background-color:var(--colour-canvas);opacity:0;transition:opacity 1s;min-height:100%;overflow:auto;max-height:100%;scrollbar-width:thin}.side-menu .side-menu-content .h3{padding-left:1.5rem}@media screen and (min-width: 36em){.side-menu .side-menu-content{width:23.875rem}.side-menu .side-menu-content .h3{padding-left:2.5rem}}@media screen and (min-width: 62em){.side-menu .side-menu-content{width:19rem}.side-menu .side-menu-content .h3{padding-left:var(--container-padding-x-md)}}.side-menu:not(.hover):not(.open) .side-menu-content.closed{display:none}.side-menu.open .side-menu-content{opacity:1}@media screen and (min-width: 62em){.side-menu.hover .side-menu-content{opacity:1}}.main-content{position:relative;z-index:10;padding-top:1.5rem;padding-left:3.75rem}@media screen and (min-width: 36em){.main-content{padding-left:5rem}}@media screen and (min-width: 62em){.main-content{padding-top:2.5rem !important;padding-left:0}}.main-content>span.h3{padding-top:.75rem;border-bottom:2px solid var(--colour-border);margin-bottom:2.5rem !important}@media screen and (min-width: 62em){.main-content>span.h3{display:none}}::slotted(.main-content__title){border-bottom:2px solid var(--colour-border);margin-bottom:2.5rem !important;max-width:100% !important;display:block}@media screen and (min-width: 62em){::slotted(.main-content__title){display:none}}@media screen and (min-width: 62em){.container:has(.side-menu.open){padding-left:2rem !important;margin-left:max(19rem,50% - var(--container-max-width)/2);margin-right:0;max-width:min(var(--container-max-width),100% - 19rem)}}@media screen and (min-width: 62em){:host([open-always]){--btn-display: none}}:host([inline]){width:100%;max-width:100%}@media screen and (min-width: 62em){:host([inline]){max-width:min(var(--container-max-width),100% - 19rem)}}:host([menu-right]) .container{padding-right:0 !important}@media screen and (min-width: 62em){:host([menu-right]) .container{padding-right:5.25rem !important}}@media screen and (min-width: 62em){:host([menu-right]) .container:has(.side-menu.open){margin-right:max(19rem,50% - var(--container-max-width)/2);margin-left:0}}:host([menu-right]) .side-menu{left:auto;right:-2.5rem;padding:0 0 0 2.5rem}@media screen and (min-width: 62em){:host([menu-right]) .side-menu{right:0}}:host([menu-right]) .side-menu::before{right:100%}:host([menu-right]) .side-menu .btn{right:100%}:host([menu-right]) .side-menu .btn:before{transform:rotate(180deg)}:host([menu-right]) .main-content{padding-left:var(--container-padding-x);padding-right:3.75rem}@media screen and (min-width: 36em){:host([menu-right]) .main-content{padding-right:5rem}}@media screen and (min-width: 62em){:host([menu-right]) .main-content{padding-right:0}}/*# sourceMappingURL=assets/css/components/collapsible-side.css.map */
+    :host{--colour-border: #e9e9e9;--side-link-hover: var(--colour-canvas-2);grid-column:full-width;display:block;min-height:calc(100vh - var(--nav-height));padding-top:0 !important;margin-inline:auto;width:100%;overflow:hidden;position:relative}@media screen and (prefers-color-scheme: light){:host{--side-link-hover: #eeeeee}}@media screen and (min-width: 62em){:host{max-height:calc(100vh - var(--nav-height));overflow:auto}}.container{position:static;min-height:100%;padding-top:0 !important;padding-bottom:0 !important;padding-left:0 !important}@media screen and (min-width: 62em){.container{padding-left:5.25rem !important}}.container.inline .side-menu{position:absolute;top:0}.side-menu{position:absolute;z-index:20;top:0;left:0;height:100%;min-height:calc(100vh - var(--nav-height));width:4.375rem;height:calc(100% - var(--nav-height));padding:0 2.5rem 0 0;transition:width 1s}.side-menu:before{content:"";position:absolute;z-index:1;top:0;right:2.5rem;height:100%;border-right:2px solid var(--colour-border)}@media screen and (min-width: 36em){.side-menu{left:0;width:5rem}}@media screen and (min-width: 62em){.side-menu{left:5.25rem;margin-left:-5.25rem;position:fixed;top:var(--nav-height)}.side-menu:not(.open).hover{width:21.5rem}.side-menu:not(.open).hover .btn[class*=fa-]:before{content:"\uF023" !important;transform:rotate(0)}}.side-menu .btn{display:var(--btn-display, block);position:absolute;top:2rem;right:2.5rem;margin-bottom:0;margin-right:-1.25rem;background-color:var(--colour-canvas-2);border:2px solid var(--colour-border);z-index:99;color:var(--colour-primary-theme);transition:opacity .2s}.side-menu .btn[aria-expanded][class*=fa-]:before{content:"\uF053" !important}@media screen and (min-width: 62em){.side-menu .btn[aria-expanded]{opacity:0}}.side-menu:is(:hover,:focus-within,:active) .btn{border:2px solid var(--colour-border);color:var(--colour-primary)}@media screen and (min-width: 62em){.side-menu:is(:hover,:focus-within,:active) .btn{opacity:1}}.side-menu:is(.open){width:calc(100% - var(--container-padding-x) + 2.5rem)}@media screen and (min-width: 36em){.side-menu:is(.open){width:26.375rem}}@media screen and (min-width: 62em){.side-menu:is(.open){width:21.5rem}}.side-menu .side-menu-content{position:absolute;top:0;right:2.5rem;padding:2rem 2.5rem 2.5rem 0;width:21.9375rem;background-color:var(--colour-canvas);opacity:0;transition:opacity 1s;min-height:100%;overflow:auto;max-height:100%;scrollbar-width:thin}.side-menu .side-menu-content .h3{padding-left:1.5rem}@media screen and (min-width: 36em){.side-menu .side-menu-content .h3{padding-left:2.5rem}.side-menu .side-menu-content{width:23.875rem}}@media screen and (min-width: 62em){.side-menu .side-menu-content{width:19rem}.side-menu .side-menu-content .h3{padding-left:var(--container-padding-x-md)}}.side-menu:not(.hover):not(.open) .side-menu-content.closed{display:none}.side-menu.open .side-menu-content{opacity:1}@media screen and (min-width: 62em){.side-menu.hover .side-menu-content{opacity:1}}.main-content{position:relative;z-index:10;padding-top:1.5rem;padding-left:3.75rem}@media screen and (min-width: 36em){.main-content{padding-left:5rem}}@media screen and (min-width: 62em){.main-content{padding-top:2.5rem !important;padding-left:0}}.main-content>span.h3{padding-top:.75rem;border-bottom:2px solid var(--colour-border);margin-bottom:2.5rem !important}@media screen and (min-width: 62em){.main-content>span.h3{display:none}}::slotted(.main-content__title){border-bottom:2px solid var(--colour-border);margin-bottom:2.5rem !important;max-width:100% !important;display:block}@media screen and (min-width: 62em){::slotted(.main-content__title){display:none}}@media screen and (min-width: 62em){.container:has(.side-menu.open){padding-left:2rem !important;margin-left:max(19rem,50% - var(--container-max-width)/2);margin-right:0;max-width:min(var(--container-max-width),100% - 19rem)}}@media screen and (min-width: 62em){:host([open-always]){--btn-display: none}}:host([inline]){width:100%;max-width:100%}@media screen and (min-width: 62em){:host([inline]){max-width:min(var(--container-max-width),100% - 19rem)}}:host([menu-right]) .container{padding-right:0 !important}@media screen and (min-width: 62em){:host([menu-right]) .container{padding-right:5.25rem !important}}@media screen and (min-width: 62em){:host([menu-right]) .container:has(.side-menu.open){margin-right:max(19rem,50% - var(--container-max-width)/2);margin-left:0}}:host([menu-right]) .side-menu{left:auto;right:-2.5rem;padding:0 0 0 2.5rem}@media screen and (min-width: 62em){:host([menu-right]) .side-menu{right:0}}:host([menu-right]) .side-menu::before{right:100%}:host([menu-right]) .side-menu .btn{right:100%}:host([menu-right]) .side-menu .btn:before{transform:rotate(180deg)}:host([menu-right]) .main-content{padding-left:var(--container-padding-x);padding-right:3.75rem}@media screen and (min-width: 36em){:host([menu-right]) .main-content{padding-right:5rem}}@media screen and (min-width: 62em){:host([menu-right]) .main-content{padding-right:0}}/*# sourceMappingURL=assets/css/components/collapsible-side.css.map */
 
     ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
     </style>

package/assets/js/components/collapsible-side/collapsible-side.component.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"collapsible-side.component.min.js","sources":["collapsible-side.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'collapsible side menu',\n});\nclass iamCollapsibleSideMenu extends HTMLElement {\n    constructor() {\n        super();\n        this.attachShadow({ mode: 'open' });\n        const assetLocation = document.body.hasAttribute('data-assets-location')\n            ? document.body.getAttribute('data-assets-location')\n            : '/assets';\n        const coreCSS = document.body.hasAttribute('data-core-css')\n            ? document.body.getAttribute('data-core-css')\n            : `${assetLocation}/css/core.min.css`;\n        const loadCSS = `@import \"${assetLocation}/css/components/collapsible-side.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style class=\"styles\">\n    @import \"${coreCSS}\";\n    ${loadCSS}\n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n    </style>\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n      <div class=\"container\" part=\"container\">\n\n        <div class=\"side-menu\" part=\"side-menu\">\n          <button class=\"btn btn-compact fa-chevron-right btn-secondary btn-sm btn-collapse\" part=\"btn\">Open or close Collapsible menu</button>\n          \n          <div class=\"side-menu-content closed\" part=\"side-menu-content\">\n            <slot name=\"menu\"></slot>\n          </div>\n        </div>\n\n        <div class=\"main-content\" part=\"main-content\">\n          <slot></slot>\n        </div>\n\n      </div>\n    `;\n        if (this.shadowRoot) {\n            this.shadowRoot.appendChild(template.content.cloneNode(true));\n        }\n    }\n    connectedCallback() {\n        if (!this.shadowRoot)\n            return;\n        const container = this.shadowRoot.querySelector('.container');\n        const sideMenu = this.shadowRoot.querySelector('.side-menu');\n        const sideMenuContent = this.shadowRoot.querySelector('.side-menu-content');\n        const mainContent = this.shadowRoot.querySelector('.main-content');\n        const button = this.shadowRoot.querySelector('.side-menu > .btn');\n        if (!sideMenu || !sideMenuContent || !mainContent || !button)\n            return;\n        // Load external CSS if needed\n        if (this.hasAttribute('data-css')) {\n            const styles = this.shadowRoot.querySelector('.styles');\n            if (styles) {\n                styles.insertAdjacentHTML('beforeend', `@import \"${this.getAttribute('data-css')}\";`);\n            }\n        }\n        // Set side nav title\n        if (!this.hasAttribute('data-title')) {\n            this.setAttribute('data-title', 'configuration');\n        }\n        sideMenuContent.insertAdjacentHTML('afterbegin', `<span class=\"h3\">${this.getAttribute('data-title')}</span>`);\n        mainContent.insertAdjacentHTML('afterbegin', `<span class=\"h3\">${this.getAttribute('data-title')}</span>`);\n        const titleElement = this.querySelector(':scope > :is(h1,h2,h3,h4,h5,h6)');\n        if (titleElement) {\n            titleElement.classList.add('h4', 'main-content__title');\n        }\n        if (this.hasAttribute('open') && window.innerWidth > 992) {\n            sideMenu.classList.add('open');\n            button.setAttribute('aria-expanded', 'true');\n        }\n        if (this.hasAttribute('inline')) {\n            container.classList.add('inline');\n        }\n        if (this.hasAttribute('menu-right')) {\n            sideMenu.classList.add('menu-right');\n        }\n        // Open the menu\n        button.addEventListener('click', () => {\n            if (!sideMenu.classList.contains('open')) {\n                sideMenuContent.classList.remove('closed');\n                setTimeout(function () {\n                    sideMenu.classList.add('open');\n                    button.setAttribute('aria-expanded', 'true');\n                }, 100);\n            }\n            else {\n                sideMenu.classList.remove('open');\n                button.removeAttribute('aria-expanded');\n                setTimeout(function () {\n                    sideMenuContent.classList.add('closed');\n                }, 1000); // Delay until its close so the animation is broken\n                // While the menu is closing dont allow the hover to re-open it until its fully closed.\n                sideMenu.classList.add('pe-none');\n                setTimeout(function () {\n                    sideMenu.classList.remove('pe-none');\n                }, 1000);\n            }\n        });\n        // Mimic hover event on desktop so that we can control when classes are set and which order\n        sideMenu.addEventListener('mouseenter', () => {\n            if (window.innerWidth > 992) {\n                if (!sideMenu.classList.contains('open'))\n                    sideMenuContent.classList.remove('closed');\n                sideMenu.classList.add('hover');\n            }\n        });\n        sideMenu.addEventListener('mousemove', () => {\n            if (window.innerWidth > 992) {\n                if (!sideMenu.classList.contains('open'))\n                    sideMenuContent.classList.remove('closed');\n            }\n        });\n        sideMenu.addEventListener('mouseleave', () => {\n            if (window.innerWidth > 992) {\n                sideMenu.classList.remove('hover');\n                if (!sideMenu.classList.contains('open'))\n                    setTimeout(function () {\n                        sideMenuContent.classList.add('closed');\n                    }, 1000); // Delay until its close so the animation is broken\n            }\n        });\n        const sideMenuParentGroups = this.querySelectorAll('.parent');\n        const sideMenuParentGroupsTopLinks = this.querySelectorAll('.parent > li:first-of-type');\n        sideMenuParentGroupsTopLinks === null || sideMenuParentGroupsTopLinks === void 0 ? void 0 : sideMenuParentGroupsTopLinks.forEach((parentLink) => {\n            parentLink.addEventListener('click', () => {\n                if (!parentLink || !parentLink.parentElement)\n                    return false; // make sure elements exist\n                if (parentLink.parentElement.classList.contains('reveal')) {\n                    parentLink.parentElement.classList.remove('reveal'); // remove if clicking a revealed parent\n                }\n                else {\n                    // remove other reveals and add reveal to this one\n                    sideMenuParentGroups === null || sideMenuParentGroups === void 0 ? void 0 : sideMenuParentGroups.forEach((parentGroup) => {\n                        parentGroup.classList.remove('reveal');\n                    });\n                    parentLink.parentElement.classList.add('reveal');\n                }\n            });\n        });\n    }\n}\nexport default iamCollapsibleSideMenu;\n"],"names":["iamCollapsibleSideMenu","assetLocation","coreCSS","template","container","sideMenu","sideMenuContent","mainContent","button","styles","titleElement","sideMenuParentGroups","sideMenuParentGroupsTopLinks","parentLink","parentGroup"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAE,EACzC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,uBACb,CAAC,EACD,MAAMA,UAA+B,WAAY,CAC7C,aAAc,CACV,MAAO,EACP,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EACjE,SAAS,KAAK,aAAa,sBAAsB,EACjD,UACAC,EAAU,SAAS,KAAK,aAAa,eAAe,EACpD,SAAS,KAAK,aAAa,eAAe,EAC1C,GAAGD,CAAa,oBAEhBE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD,CAAO;AAAA;AAAA;AAAA,MAEhB,KAAK,aAAa,KAAK,EAAI,YAAY,KAAK,aAAa,KAAK,CAAC,KAAO,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAmBlE,KAAK,YACL,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAExE,CACI,mBAAoB,CAChB,GAAI,CAAC,KAAK,WACN,OACJ,MAAMC,EAAY,KAAK,WAAW,cAAc,YAAY,EACtDC,EAAW,KAAK,WAAW,cAAc,YAAY,EACrDC,EAAkB,KAAK,WAAW,cAAc,oBAAoB,EACpEC,EAAc,KAAK,WAAW,cAAc,eAAe,EAC3DC,EAAS,KAAK,WAAW,cAAc,mBAAmB,EAChE,GAAI,CAACH,GAAY,CAACC,GAAmB,CAACC,GAAe,CAACC,EAClD,OAEJ,GAAI,KAAK,aAAa,UAAU,EAAG,CAC/B,MAAMC,EAAS,KAAK,WAAW,cAAc,SAAS,EAClDA,GACAA,EAAO,mBAAmB,YAAa,YAAY,KAAK,aAAa,UAAU,CAAC,IAAI,CAEpG,CAEa,KAAK,aAAa,YAAY,GAC/B,KAAK,aAAa,aAAc,eAAe,EAEnDH,EAAgB,mBAAmB,aAAc,oBAAoB,KAAK,aAAa,YAAY,CAAC,SAAS,EAC7GC,EAAY,mBAAmB,aAAc,oBAAoB,KAAK,aAAa,YAAY,CAAC,SAAS,EACzG,MAAMG,EAAe,KAAK,cAAc,iCAAiC,EACrEA,GACAA,EAAa,UAAU,IAAI,KAAM,qBAAqB,EAEtD,KAAK,aAAa,MAAM,GAAK,OAAO,WAAa,MACjDL,EAAS,UAAU,IAAI,MAAM,EAC7BG,EAAO,aAAa,gBAAiB,MAAM,GAE3C,KAAK,aAAa,QAAQ,GAC1BJ,EAAU,UAAU,IAAI,QAAQ,EAEhC,KAAK,aAAa,YAAY,GAC9BC,EAAS,UAAU,IAAI,YAAY,EAGvCG,EAAO,iBAAiB,QAAS,IAAM,CAC9BH,EAAS,UAAU,SAAS,MAAM,GAQnCA,EAAS,UAAU,OAAO,MAAM,EAChCG,EAAO,gBAAgB,eAAe,EACtC,WAAW,UAAY,CACnBF,EAAgB,UAAU,IAAI,QAAQ,CACzC,EAAE,GAAI,EAEPD,EAAS,UAAU,IAAI,SAAS,EAChC,WAAW,UAAY,CACnBA,EAAS,UAAU,OAAO,SAAS,CACtC,EAAE,GAAI,IAhBPC,EAAgB,UAAU,OAAO,QAAQ,EACzC,WAAW,UAAY,CACnBD,EAAS,UAAU,IAAI,MAAM,EAC7BG,EAAO,aAAa,gBAAiB,MAAM,CAC9C,EAAE,GAAG,EActB,CAAS,EAEDH,EAAS,iBAAiB,aAAc,IAAM,CACtC,OAAO,WAAa,MACfA,EAAS,UAAU,SAAS,MAAM,GACnCC,EAAgB,UAAU,OAAO,QAAQ,EAC7CD,EAAS,UAAU,IAAI,OAAO,EAE9C,CAAS,EACDA,EAAS,iBAAiB,YAAa,IAAM,CACrC,OAAO,WAAa,MACfA,EAAS,UAAU,SAAS,MAAM,GACnCC,EAAgB,UAAU,OAAO,QAAQ,EAE7D,CAAS,EACDD,EAAS,iBAAiB,aAAc,IAAM,CACtC,OAAO,WAAa,MACpBA,EAAS,UAAU,OAAO,OAAO,EAC5BA,EAAS,UAAU,SAAS,MAAM,GACnC,WAAW,UAAY,CACnBC,EAAgB,UAAU,IAAI,QAAQ,CACzC,EAAE,GAAI,EAE3B,CAAS,EACD,MAAMK,EAAuB,KAAK,iBAAiB,SAAS,EACtDC,EAA+B,KAAK,iBAAiB,4BAA4B,EACKA,GAA6B,QAASC,GAAe,CAC7IA,EAAW,iBAAiB,QAAS,IAAM,CACvC,GAAI,CAACA,GAAc,CAACA,EAAW,cAC3B,MAAO,GACPA,EAAW,cAAc,UAAU,SAAS,QAAQ,EACpDA,EAAW,cAAc,UAAU,OAAO,QAAQ,GAI0BF,GAAqB,QAASG,GAAgB,CACtHA,EAAY,UAAU,OAAO,QAAQ,CAC7D,CAAqB,EACDD,EAAW,cAAc,UAAU,IAAI,QAAQ,EAEnE,CAAa,CACb,CAAS,CACT,CACA"}
+{"version":3,"file":"collapsible-side.component.min.js","sources":["collapsible-side.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'collapsible side menu',\n});\nclass iamCollapsibleSideMenu extends HTMLElement {\n    constructor() {\n        super();\n        this.attachShadow({ mode: 'open' });\n        const assetLocation = document.body.hasAttribute('data-assets-location')\n            ? document.body.getAttribute('data-assets-location')\n            : '/assets';\n        const coreCSS = document.body.hasAttribute('data-core-css')\n            ? document.body.getAttribute('data-core-css')\n            : `${assetLocation}/css/core.min.css`;\n        const loadCSS = `@import \"${assetLocation}/css/components/collapsible-side.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style class=\"styles\">\n    @import \"${coreCSS}\";\n    ${loadCSS}\n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n    </style>\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n      <div class=\"container\" part=\"container\">\n\n        <div class=\"side-menu\" part=\"side-menu\">\n          <button class=\"btn btn-compact fa-chevron-right btn-secondary btn-sm btn-collapse\" part=\"btn\">Open or close Collapsible menu</button>\n          \n          <div class=\"side-menu-content closed\" part=\"side-menu-content\">\n            <slot name=\"menu\"></slot>\n          </div>\n        </div>\n\n        <div class=\"main-content\" part=\"main-content\">\n          <slot></slot>\n        </div>\n\n      </div>\n    `;\n        if (this.shadowRoot) {\n            this.shadowRoot.appendChild(template.content.cloneNode(true));\n        }\n    }\n    connectedCallback() {\n        if (!this.shadowRoot)\n            return;\n        const container = this.shadowRoot.querySelector('.container');\n        const sideMenu = this.shadowRoot.querySelector('.side-menu');\n        const sideMenuContent = this.shadowRoot.querySelector('.side-menu-content');\n        const mainContent = this.shadowRoot.querySelector('.main-content');\n        const button = this.shadowRoot.querySelector('.side-menu > .btn');\n        if (!sideMenu || !sideMenuContent || !mainContent || !button)\n            return;\n        // Load external CSS if needed\n        if (this.hasAttribute('data-css')) {\n            const styles = this.shadowRoot.querySelector('.styles');\n            if (styles) {\n                styles.insertAdjacentHTML('beforeend', `@import \"${this.getAttribute('data-css')}\";`);\n            }\n        }\n        // Set side nav title\n        if (!this.hasAttribute('data-title')) {\n            this.setAttribute('data-title', 'configuration');\n        }\n        sideMenuContent.insertAdjacentHTML('afterbegin', `<span class=\"h3\">${this.getAttribute('data-title')}</span>`);\n        mainContent.insertAdjacentHTML('afterbegin', `<span class=\"h3\">${this.getAttribute('data-title')}</span>`);\n        const titleElement = this.querySelector(':scope > :is(h1,h2,h3,h4,h5,h6)');\n        if (titleElement) {\n            titleElement.classList.add('h4', 'main-content__title');\n        }\n        if (this.hasAttribute('open') && window.innerWidth > 992) {\n            sideMenu.classList.add('open');\n            button.setAttribute('aria-expanded', 'true');\n        }\n        if (this.hasAttribute('inline')) {\n            container.classList.add('inline');\n        }\n        if (this.hasAttribute('menu-right')) {\n            sideMenu.classList.add('menu-right');\n        }\n        // Open the menu\n        button.addEventListener('click', () => {\n            if (!sideMenu.classList.contains('open')) {\n                sideMenuContent.classList.remove('closed');\n                setTimeout(function () {\n                    sideMenu.classList.add('open');\n                    button.setAttribute('aria-expanded', 'true');\n                }, 100);\n            }\n            else {\n                sideMenu.classList.remove('open');\n                button.removeAttribute('aria-expanded');\n                setTimeout(function () {\n                    sideMenuContent.classList.add('closed');\n                }, 1000); // Delay until its close so the animation is broken\n                // While the menu is closing dont allow the hover to re-open it until its fully closed.\n                sideMenu.classList.add('pe-none');\n                setTimeout(function () {\n                    sideMenu.classList.remove('pe-none');\n                }, 1000);\n            }\n        });\n        // Mimic hover event on desktop so that we can control when classes are set and which order\n        sideMenu.addEventListener('mouseenter', () => {\n            if (window.innerWidth > 992) {\n                if (!sideMenu.classList.contains('open'))\n                    sideMenuContent.classList.remove('closed');\n                sideMenu.classList.add('hover');\n            }\n        });\n        sideMenu.addEventListener('mousemove', () => {\n            if (window.innerWidth > 992) {\n                if (!sideMenu.classList.contains('open'))\n                    sideMenuContent.classList.remove('closed');\n            }\n        });\n        sideMenu.addEventListener('mouseleave', () => {\n            if (window.innerWidth > 992) {\n                sideMenu.classList.remove('hover');\n                if (!sideMenu.classList.contains('open'))\n                    setTimeout(function () {\n                        sideMenuContent.classList.add('closed');\n                    }, 1000); // Delay until its close so the animation is broken\n            }\n        });\n        const sideMenuParentGroups = this.querySelectorAll('.parent');\n        const sideMenuParentGroupsTopLinks = this.querySelectorAll('.parent > li:first-of-type');\n        sideMenuParentGroupsTopLinks === null || sideMenuParentGroupsTopLinks === void 0 ? void 0 : sideMenuParentGroupsTopLinks.forEach((parentLink) => {\n            parentLink.addEventListener('click', () => {\n                if (!parentLink || !parentLink.parentElement)\n                    return false; // make sure elements exist\n                if (parentLink.parentElement.classList.contains('reveal')) {\n                    parentLink.parentElement.classList.remove('reveal'); // remove if clicking a revealed parent\n                }\n                else {\n                    // remove other reveals and add reveal to this one\n                    sideMenuParentGroups === null || sideMenuParentGroups === void 0 ? void 0 : sideMenuParentGroups.forEach((parentGroup) => {\n                        parentGroup.classList.remove('reveal');\n                    });\n                    parentLink.parentElement.classList.add('reveal');\n                }\n            });\n        });\n    }\n}\nexport default iamCollapsibleSideMenu;\n"],"names":["iamCollapsibleSideMenu","assetLocation","coreCSS","template","container","sideMenu","sideMenuContent","mainContent","button","styles","titleElement","sideMenuParentGroups","sideMenuParentGroupsTopLinks","parentLink","parentGroup"],"mappings":"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"}

package/assets/js/components/content/content.component.min.js

@@ -1,9 +1,9 @@
 /*!
-  * iamKey v7.4.0
+  * iamKey v7.5.0
   * Copyright 2022-2025 iamproperty
   */class s extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const e=document.createElement("template");e.innerHTML=`
     <style>
-    @layer elements{*,*::before,*::after{box-sizing:border-box}button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}[role=button]{cursor:pointer}button:focus:not(:focus-visible){outline:0}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 0.125rem;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}.btn:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}.btn:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}.btn:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}.btn:not(:last-child){margin-right:var(--btn-margin)}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.colour-success{--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success:before,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active):before{content:"\uF00C";font-family:"Font Awesome 6 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 6 Pro";line-height:1em}.btn.btn[class*=fa-after]{padding-right:4rem}.btn.btn[class*=fa-after]:before{margin-right:0;margin-right:0.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}.btn:not(.btn-compact):before{margin-right:1rem}.btn i[class*=fa-]{font-family:"Font Awesome 6 Pro";margin-right:1rem;line-height:1em;font-style:inherit}.btn i[class*=fa-]:not(:first-child){margin-left:1rem;margin-right:0}.btn.btn--prompt:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt:after,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active):after{margin-left:1.5rem;margin-right:-0.5rem}.btn:has(select){position:relative;padding-right:3.5rem}.btn:has(select):not(.mw-100){max-width:13rem}.btn:has(select) select{all:unset !important;margin:calc(-0.75rem) calc(-2.5rem) !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:3.5rem !important;margin-right:-3.5rem !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;max-width:100% !important;outline:none;font-weight:bold;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important}.btn:has(select) select option{padding:0;text-align:left;color:var(--colour-primary)}.btn:has(select):after{position:absolute;top:0.625rem;right:2rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}.btn:has(select).active:after{transform:rotate(-90deg)}.btn:has(select:focus):after{transform:rotate(-90deg)}.btn-filter:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 6 Pro"}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary)}.btn-secondary:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:rgba(0,0,0,0);border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative}.btn.btn-tertiary:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}.btn.btn-tertiary.text-decoration-none:after{width:0%}.btn.btn-tertiary [class*=fa-]{margin-left:0;margin-right:.5rem}.btn.btn-tertiary [class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}.btn.btn-tertiary:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active):after{width:60% !important}.btn.btn-tertiary:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}@layer elements{.btn-action{--btn-border-width: 0.0625rem;--btn-padding-block: 0.3125rem;--btn-padding-inline: 0.3125rem;--btn-margin: 0.5rem;border-radius:0.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem}.btn-action:not(.btn-primary){color:var(--colour-heading)}.btn-action:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}.btn-action.btn[class*=fa-]:before{content:var(--fa);margin-right:0.375rem}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) .btn-action,.btn-action:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:0.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;line-height:var(--compact-size) !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem}.btn-compact:not(:last-child){margin-right:0.5rem}.btn-compact:before{content:var(--fa);position:absolute;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - 0.25rem);font-weight:900}.btn-compact[class*=fa-]:before{line-height:calc(var(--compact-size) - 0.25rem)}@media screen and (prefers-color-scheme: dark){.btn-compact[class*=fa-]:before{color:#fff}}.btn-compact.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}.btn-compact.btn-action{--compact-size: 2rem;font-size:1rem}.btn-compact.btn-action:before{font-size:1em;font-weight:400}.btn-compact.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:rgba(0,0,0,0)}.btn-compact.btn-secondary:not([class*=colour-]){--colour: var(--colour-light)}.btn-compact.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour)}.btn-compact.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse):is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}.btn-compact[data-number]{position:relative}.btn-compact[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:#fff;letter-spacing:-0.1em;font-family:arial,sans-serif}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary:not(:hover,:focus,.hover,:focus-within):not(.btn-collapse),.invert-colours .btn-compact.btn-secondary:not(:hover,:focus,.hover,:focus-within):not(.btn-collapse){background-color:var(--colour-inverted) !important;border-color:var(--colour-inverted) !important;color:var(--colour-primary-theme)}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary:is(:hover,:focus,.hover,:focus-within):not([disabled]):not(.btn-collapse),.invert-colours .btn-compact.btn-secondary:is(:hover,:focus,.hover,:focus-within):not([disabled]):not(.btn-collapse){background-color:rgba(0,0,0,0);border-color:var(--colour-inverted) !important;color:var(--colour-inverted)}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary[disabled],.invert-colours .btn-compact.btn-secondary[disabled]{background-color:var(--colour-inverted) !important;border-color:var(--colour-inverted) !important;color:var(--colour-primary-theme) !important}}*,*::before,*::after{box-sizing:border-box}:host{display:contents}::slotted(iam-marketing:first-child:last-child){margin-bottom:0;min-height:100%;min-width:100%}/*# sourceMappingURL=assets/css/components/content.component.css.map */
+    @layer elements{*,*::before,*::after{box-sizing:border-box}button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}[role=button]{cursor:pointer}button:focus:not(:focus-visible){outline:0}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 0.125rem;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}.btn:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}.btn:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}.btn:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}.btn:not(:last-child){margin-right:var(--btn-margin)}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.colour-success{--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success:before,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active):before{content:"\uF00C";font-family:"Font Awesome 6 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 6 Pro";line-height:1em}.btn.btn[class*=fa-after]{padding-right:4rem}.btn.btn[class*=fa-after]:before{margin-right:0;margin-right:0.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}.btn:not(.btn-compact):before{margin-right:1rem}.btn i[class*=fa-]{font-family:"Font Awesome 6 Pro";margin-right:1rem;line-height:1em;font-style:inherit}.btn i[class*=fa-]:not(:first-child){margin-left:1rem;margin-right:0}.btn.btn--prompt:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt:after,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active):after{margin-left:1.5rem;margin-right:-0.5rem}.btn:has(select){position:relative;padding-right:3.5rem}.btn:has(select):not(.mw-100){max-width:13rem}.btn:has(select) select{all:unset !important;margin:calc(-0.75rem) calc(-2.5rem) !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:3.5rem !important;margin-right:-3.5rem !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;max-width:100% !important;outline:none;font-weight:bold;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important}.btn:has(select) select option{padding:0;text-align:left;color:var(--colour-primary)}.btn:has(select):after{position:absolute;top:0.625rem;right:2rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}.btn:has(select).active:after{transform:rotate(-90deg)}.btn:has(select:focus):after{transform:rotate(-90deg)}.btn-filter:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 6 Pro"}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary)}.btn-secondary:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:rgba(0,0,0,0);border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative}.btn.btn-tertiary:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}.btn.btn-tertiary.text-decoration-none:after{width:0%}.btn.btn-tertiary [class*=fa-]{margin-left:0;margin-right:.5rem}.btn.btn-tertiary [class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}.btn.btn-tertiary:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active):after{width:60% !important}.btn.btn-tertiary:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}@layer elements{.btn-action{--btn-border-width: 0.0625rem;--btn-padding-block: 0.3125rem;--btn-padding-inline: 0.3125rem;--btn-margin: 0.5rem}.btn-action:not(.btn-primary){color:var(--colour-heading)}.btn-action:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}.btn-action{border-radius:0.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem}.btn-action.btn[class*=fa-]:before{content:var(--fa);margin-right:0.375rem}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) .btn-action,.btn-action:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:0.5rem}.btn-compact:not(:last-child){margin-right:0.5rem}.btn-compact{text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;line-height:var(--compact-size) !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem}.btn-compact:before{content:var(--fa);position:absolute;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - 0.25rem);font-weight:900}.btn-compact[class*=fa-]:before{line-height:calc(var(--compact-size) - 0.25rem)}@container style(--theme: dark){.btn-compact[class*=fa-]:before{color:#fff}}.btn-compact.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}.btn-compact.btn-action{--compact-size: 2rem;font-size:1rem}.btn-compact.btn-action:before{font-size:1em;font-weight:400}.btn-compact.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:rgba(0,0,0,0)}.btn-compact.btn-secondary:not([class*=colour-]){--colour: var(--colour-light)}.btn-compact.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour)}.btn-compact.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse):is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}.btn-compact[data-number]{position:relative}.btn-compact[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:#fff;letter-spacing:-0.1em;font-family:arial,sans-serif}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary:not(:hover,:focus,.hover,:focus-within):not(.btn-collapse),.invert-colours .btn-compact.btn-secondary:not(:hover,:focus,.hover,:focus-within):not(.btn-collapse){background-color:var(--colour-inverted) !important;border-color:var(--colour-inverted) !important;color:var(--colour-primary-theme)}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary:is(:hover,:focus,.hover,:focus-within):not([disabled]):not(.btn-collapse),.invert-colours .btn-compact.btn-secondary:is(:hover,:focus,.hover,:focus-within):not([disabled]):not(.btn-collapse){background-color:rgba(0,0,0,0);border-color:var(--colour-inverted) !important;color:var(--colour-inverted)}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary[disabled],.invert-colours .btn-compact.btn-secondary[disabled]{background-color:var(--colour-inverted) !important;border-color:var(--colour-inverted) !important;color:var(--colour-primary-theme) !important}}*,*::before,*::after{box-sizing:border-box}:host{display:contents}::slotted(iam-marketing:first-child:last-child){margin-bottom:0;min-height:100%;min-width:100%}/*# sourceMappingURL=assets/css/components/content.component.css.map */
 
 
     ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}

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

@@ -1 +1 @@
-{"version":3,"file":"content.component.min.js","sources":["content.component.js"],"sourcesContent":["class iamContent extends HTMLElement {\n    constructor() {\n        super();\n        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/content.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${loadCSS}\n\n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n    </style>\n    <div class=\"content__container\">\n      <slot></slot>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const component = this;\n        const url = this.getAttribute('data-url');\n        const registerComponents = (contentComponent) => {\n            const components = ['card', 'marketing', 'notification'];\n            const assetLocation = document.body.hasAttribute('data-assets-location')\n                ? document.body.getAttribute('data-assets-location')\n                : '/assets';\n            // Load components - Each component will load once the first of its type has been loaded\n            components.forEach((component) => {\n                if (component == 'notification') {\n                    document.querySelectorAll('[data-notification]').forEach((element) => {\n                        element.outerHTML = element.outerHTML\n                            .replace(/<div/g, '<iam-notification')\n                            .replace(/<\\/div>/g, '</iam-notification>');\n                    });\n                }\n                if (contentComponent.getElementsByTagName(`iam-${component}`).length === 0)\n                    return;\n                import(/* @vite-ignore */ `${assetLocation}/js/components/${component}/${component}.component.js`)\n                    .then((module) => {\n                    if (!window.customElements.get(`iam-${component}`))\n                        window.customElements.define(`iam-${component}`, module.default);\n                })\n                    .catch((err) => {\n                    console.log(err.message);\n                });\n            });\n        };\n        if (url) {\n            const newXHRRequest = new XMLHttpRequest();\n            newXHRRequest.open('GET', url, true);\n            newXHRRequest.onload = function () {\n                if (this.status === 200) {\n                    const response = JSON.parse(this.responseText);\n                    component.innerHTML = `${response.content.rendered}`;\n                    registerComponents(component);\n                }\n            };\n            newXHRRequest.send();\n        }\n    }\n}\nexport default iamContent;\n"],"names":["iamContent","template","component","url","registerComponents","contentComponent","components","assetLocation","element","module","err","newXHRRequest","response"],"mappings":";;;IAAA,MAAMA,UAAmB,WAAY,CACjC,aAAc,CACV,MAAO,EACP,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA,MAIvB,KAAK,aAAa,KAAK,EAAI,YAAY,KAAK,aAAa,KAAK,CAAC,KAAO,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,MAMtE,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CACpE,CACI,mBAAoB,CAEhB,MAAMC,EAAY,KACZC,EAAM,KAAK,aAAa,UAAU,EAClCC,EAAsBC,GAAqB,CAC7C,MAAMC,EAAa,CAAC,OAAQ,YAAa,cAAc,EACjDC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EACjE,SAAS,KAAK,aAAa,sBAAsB,EACjD,UAEND,EAAW,QAASJ,GAAc,CAC1BA,GAAa,gBACb,SAAS,iBAAiB,qBAAqB,EAAE,QAASM,GAAY,CAClEA,EAAQ,UAAYA,EAAQ,UACvB,QAAQ,QAAS,mBAAmB,EACpC,QAAQ,WAAY,qBAAqB,CACtE,CAAqB,EAEDH,EAAiB,qBAAqB,OAAOH,CAAS,EAAE,EAAE,SAAW,GAEzE,OAA0B,GAAGK,CAAa,kBAAkBL,CAAS,IAAIA,CAAS,iBAC7E,KAAMO,GAAW,CACb,OAAO,eAAe,IAAI,OAAOP,CAAS,EAAE,GAC7C,OAAO,eAAe,OAAO,OAAOA,CAAS,GAAIO,EAAO,OAAO,CACtE,CAAA,EACI,MAAOC,GAAQ,CAChB,QAAQ,IAAIA,EAAI,OAAO,CAC3C,CAAiB,CACjB,CAAa,CACJ,EACD,GAAIP,EAAK,CACL,MAAMQ,EAAgB,IAAI,eAC1BA,EAAc,KAAK,MAAOR,EAAK,EAAI,EACnCQ,EAAc,OAAS,UAAY,CAC/B,GAAI,KAAK,SAAW,IAAK,CACrB,MAAMC,EAAW,KAAK,MAAM,KAAK,YAAY,EAC7CV,EAAU,UAAY,GAAGU,EAAS,QAAQ,QAAQ,GAClDR,EAAmBF,CAAS,CAChD,CACa,EACDS,EAAc,KAAM,CAChC,CACA,CACA"}
+{"version":3,"file":"content.component.min.js","sources":["content.component.js"],"sourcesContent":["class iamContent extends HTMLElement {\n    constructor() {\n        super();\n        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/content.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${loadCSS}\n\n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n    </style>\n    <div class=\"content__container\">\n      <slot></slot>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const component = this;\n        const url = this.getAttribute('data-url');\n        const registerComponents = (contentComponent) => {\n            const components = ['card', 'marketing', 'notification'];\n            const assetLocation = document.body.hasAttribute('data-assets-location')\n                ? document.body.getAttribute('data-assets-location')\n                : '/assets';\n            // Load components - Each component will load once the first of its type has been loaded\n            components.forEach((component) => {\n                if (component == 'notification') {\n                    document.querySelectorAll('[data-notification]').forEach((element) => {\n                        element.outerHTML = element.outerHTML\n                            .replace(/<div/g, '<iam-notification')\n                            .replace(/<\\/div>/g, '</iam-notification>');\n                    });\n                }\n                if (contentComponent.getElementsByTagName(`iam-${component}`).length === 0)\n                    return;\n                import(/* @vite-ignore */ `${assetLocation}/js/components/${component}/${component}.component.js`)\n                    .then((module) => {\n                    if (!window.customElements.get(`iam-${component}`))\n                        window.customElements.define(`iam-${component}`, module.default);\n                })\n                    .catch((err) => {\n                    console.log(err.message);\n                });\n            });\n        };\n        if (url) {\n            const newXHRRequest = new XMLHttpRequest();\n            newXHRRequest.open('GET', url, true);\n            newXHRRequest.onload = function () {\n                if (this.status === 200) {\n                    const response = JSON.parse(this.responseText);\n                    component.innerHTML = `${response.content.rendered}`;\n                    registerComponents(component);\n                }\n            };\n            newXHRRequest.send();\n        }\n    }\n}\nexport default iamContent;\n"],"names":["iamContent","template","component","url","registerComponents","contentComponent","components","assetLocation","element","module","err","newXHRRequest","response"],"mappings":";;;IAAA,MAAMA,UAAmB,WAAY,CACjC,aAAc,CACV,MAAK,EACL,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA,MAIvB,KAAK,aAAa,KAAK,EAAI,YAAY,KAAK,aAAa,KAAK,CAAC,KAAO,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,MAMtE,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAEhB,MAAMC,EAAY,KACZC,EAAM,KAAK,aAAa,UAAU,EAClCC,EAAsBC,GAAqB,CAC7C,MAAMC,EAAa,CAAC,OAAQ,YAAa,cAAc,EACjDC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EACjE,SAAS,KAAK,aAAa,sBAAsB,EACjD,UAEND,EAAW,QAASJ,GAAc,CAC1BA,GAAa,gBACb,SAAS,iBAAiB,qBAAqB,EAAE,QAASM,GAAY,CAClEA,EAAQ,UAAYA,EAAQ,UACvB,QAAQ,QAAS,mBAAmB,EACpC,QAAQ,WAAY,qBAAqB,CAClD,CAAC,EAEDH,EAAiB,qBAAqB,OAAOH,CAAS,EAAE,EAAE,SAAW,GAEzE,OAA0B,GAAGK,CAAa,kBAAkBL,CAAS,IAAIA,CAAS,iBAC7E,KAAMO,GAAW,CACb,OAAO,eAAe,IAAI,OAAOP,CAAS,EAAE,GAC7C,OAAO,eAAe,OAAO,OAAOA,CAAS,GAAIO,EAAO,OAAO,CACvE,CAAC,EACI,MAAOC,GAAQ,CAChB,QAAQ,IAAIA,EAAI,OAAO,CAC3B,CAAC,CACL,CAAC,CACL,EACA,GAAIP,EAAK,CACL,MAAMQ,EAAgB,IAAI,eAC1BA,EAAc,KAAK,MAAOR,EAAK,EAAI,EACnCQ,EAAc,OAAS,UAAY,CAC/B,GAAI,KAAK,SAAW,IAAK,CACrB,MAAMC,EAAW,KAAK,MAAM,KAAK,YAAY,EAC7CV,EAAU,UAAY,GAAGU,EAAS,QAAQ,QAAQ,GAClDR,EAAmBF,CAAS,CAChC,CACJ,EACAS,EAAc,KAAI,CACtB,CACJ,CACJ"}

package/assets/js/components/darkmode/darkmode.component.js

@@ -0,0 +1,70 @@
+window.dataLayer = window.dataLayer || [];
+window.dataLayer.push({
+    event: 'customElementRegistered',
+    element: 'Dark mode button',
+});
+class iamDarkMode extends HTMLElement {
+    constructor() {
+        var _a;
+        super();
+        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/darkmode.component.css";`;
+        const template = document.createElement('template');
+        template.innerHTML = `
+    <style>${loadCSS}
+    </style>
+      <slot></slot>
+    `;
+        (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));
+    }
+    connectedCallback() {
+        const label = this.querySelector('label');
+        const storedTheme = localStorage.getItem('user-theme');
+        // Work from local storage first then look at the media preferences
+        label === null || label === void 0 ? void 0 : label.innerHTML = `<input type="checkbox" name="dark-mode"  /> Light mode`;
+        if (storedTheme == 'dark-theme') {
+            label === null || label === void 0 ? void 0 : label.innerHTML = `<input type="checkbox" name="dark-mode" checked="checked" /> Dark mode`;
+            label === null || label === void 0 ? void 0 : label.classList.add('dark-theme');
+        }
+        else if (storedTheme == 'light-theme') {
+            label === null || label === void 0 ? void 0 : label.innerHTML = `<input type="checkbox" name="dark-mode"  /> Light mode`;
+            label === null || label === void 0 ? void 0 : label.classList.remove('dark-theme');
+        }
+        const hasDarkPreference = window.matchMedia('(prefers-color-scheme: dark)').matches;
+        if (hasDarkPreference) {
+            label === null || label === void 0 ? void 0 : label.innerHTML = `<input type="checkbox" name="dark-mode" checked="checked" /> Dark mode`;
+            label === null || label === void 0 ? void 0 : label.classList.remove('dark-theme');
+        }
+        this.addEventListener('click', (event) => {
+            console.log(label === null || label === void 0 ? void 0 : label.querySelector('input:checked'));
+            if (label === null || label === void 0 ? void 0 : label.querySelector('input:checked')) {
+                label === null || label === void 0 ? void 0 : label.innerHTML = `<input type="checkbox" name="dark-mode" checked="checked" /> Dark mode`;
+                localStorage.setItem('user-theme', 'dark-theme');
+                document.documentElement.className = 'dark-theme';
+                label === null || label === void 0 ? void 0 : label.classList.add('dark-theme');
+            }
+            else {
+                label === null || label === void 0 ? void 0 : label.innerHTML = `<input type="checkbox" name="dark-mode" /> Light mode`;
+                localStorage.setItem('user-theme', 'light-theme');
+                document.documentElement.className = 'light-theme';
+                label === null || label === void 0 ? void 0 : label.classList.remove('dark-theme');
+            }
+        });
+        window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', ({ matches }) => {
+            if (matches) {
+                label === null || label === void 0 ? void 0 : label.innerHTML = `<input type="checkbox" name="dark-mode" checked="checked" /> Dark mode`;
+                label === null || label === void 0 ? void 0 : label.classList.add('dark-theme');
+            }
+        });
+        window.matchMedia('(prefers-color-scheme: light)').addEventListener('change', ({ matches }) => {
+            if (matches) {
+                label === null || label === void 0 ? void 0 : label.innerHTML = `<input type="checkbox" name="dark-mode"  /> Light mode`;
+                label === null || label === void 0 ? void 0 : label.classList.remove('dark-theme');
+            }
+        });
+    }
+}
+export default iamDarkMode;

package/assets/js/components/darkmode/darkmode.component.min.js

@@ -0,0 +1,10 @@
+/*!
+  * iamKey v7.5.0
+  * Copyright 2022-2025 iamproperty
+  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Dark mode button"});class a extends HTMLElement{constructor(){var e;super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const t=document.createElement("template");t.innerHTML=`
+    <style>::slotted(.toggle):after{--icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3e%3c!--!Font Awesome Pro v7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license %28Commercial License%29 Copyright 2025 Fonticons, Inc.--%3e%3cpath d='M296 552L296 496C296 482.7 306.7 472 320 472C333.3 472 344 482.7 344 496L344 552C344 565.3 333.3 576 320 576C306.7 576 296 565.3 296 552zM296 144L296 88C296 74.7 306.7 64 320 64C333.3 64 344 74.7 344 88L344 144C344 157.3 333.3 168 320 168C306.7 168 296 157.3 296 144zM139 139C148.4 129.6 163.6 129.6 172.9 139L212.5 178.6C221.9 188 221.9 203.2 212.5 212.5C203.1 221.8 187.9 221.9 178.6 212.5L139 172.9C129.6 163.5 129.6 148.3 139 139zM427.5 427.5C436.9 418.1 452.1 418.1 461.4 427.5L501 467.1C510.4 476.5 510.4 491.7 501 501C491.6 510.3 476.4 510.4 467.1 501L427.5 461.4C418.1 452 418.1 436.8 427.5 427.5zM64 320C64 306.7 74.7 296 88 296L144 296C157.3 296 168 306.7 168 320C168 333.3 157.3 344 144 344L88 344C74.7 344 64 333.3 64 320zM472 320C472 306.7 482.7 296 496 296L552 296C565.3 296 576 306.7 576 320C576 333.3 565.3 344 552 344L496 344C482.7 344 472 333.3 472 320zM139 501C129.6 491.6 129.6 476.4 139 467.1L178.6 427.5C188 418.1 203.2 418.1 212.5 427.5C221.8 436.9 221.9 452.1 212.5 461.4L172.9 501C163.5 510.4 148.3 510.4 139 501zM427.5 212.5C418.1 203.1 418.1 187.9 427.5 178.6L467.1 139C476.5 129.6 491.7 129.6 501 139C510.3 148.4 510.4 163.6 501 172.9L461.4 212.5C452 221.9 436.8 221.9 427.5 212.5zM384 320C384 284.7 355.3 256 320 256C284.7 256 256 284.7 256 320C256 355.3 284.7 384 320 384C355.3 384 384 355.3 384 320zM208 320C208 258.1 258.1 208 320 208C381.9 208 432 258.1 432 320C432 381.9 381.9 432 320 432C258.1 432 208 381.9 208 320z'/%3e%3c/svg%3e");background:var(--colour-primary-theme);mask-image:var(--icon);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;z-index:2}::slotted(.toggle.dark-theme):after{--icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3e%3c!--!Font Awesome Pro v7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license %28Commercial License%29 Copyright 2025 Fonticons, Inc.--%3e%3cpath d='M503.8 153.8C504.8 157.4 508.2 160 512 160C515.8 160 519.1 157.5 520.2 153.8L531.2 115.2L569.8 104.2C573.4 103.2 576 99.8 576 96C576 92.2 573.5 88.9 569.8 87.8L531.2 76.8L520.2 38.2C519.2 34.6 515.8 32 512 32C508.2 32 504.9 34.5 503.8 38.2L492.8 76.8L454.2 87.8C450.6 88.8 448 92.2 448 96C448 99.8 450.5 103.1 454.2 104.2L492.8 115.2L503.8 153.8zM288 128C164.3 128 64 228.3 64 352C64 475.7 164.3 576 288 576C348.2 576 402.9 552.2 443.1 513.6C449.5 507.5 451.3 497.9 447.7 489.8C444.1 481.7 435.7 476.8 426.9 477.5C422.6 477.8 418.3 478 414 478C325.1 478 253 405.9 253 317C253 253.9 289.3 199.2 342.3 172.8C350.2 168.8 354.9 160.3 353.8 151.5C352.7 142.7 346.2 135.5 337.6 133.5C321.6 129.9 305 128 288 128zM419.2 332.8L435.8 390.8C437.4 396.3 442.4 400 448 400C453.6 400 458.7 396.2 460.2 390.8L476.8 332.8L534.8 316.2C540.3 314.6 544 309.6 544 304C544 298.4 540.2 293.3 534.8 291.8L476.8 275.2L460.2 217.2C458.6 211.7 453.6 208 448 208C442.4 208 437.3 211.8 435.8 217.2L419.2 275.2L361.2 291.8C355.7 293.4 352 298.4 352 304C352 309.6 355.8 314.7 361.2 316.2L419.2 332.8z'/%3e%3c/svg%3e")}/*# sourceMappingURL=assets/css/components/darkmode.component.css.map */
+
+    </style>
+      <slot></slot>
+    `,(e=this.shadowRoot)===null||e===void 0||e.appendChild(t.content.cloneNode(!0))}connectedCallback(){const e=this.querySelector("label"),t=localStorage.getItem("user-theme");e==null||(e.innerHTML='<input type="checkbox" name="dark-mode"  /> Light mode'),t=="dark-theme"?(e==null||(e.innerHTML='<input type="checkbox" name="dark-mode" checked="checked" /> Dark mode'),e?.classList.add("dark-theme")):t=="light-theme"&&(e==null||(e.innerHTML='<input type="checkbox" name="dark-mode"  /> Light mode'),e?.classList.remove("dark-theme")),window.matchMedia("(prefers-color-scheme: dark)").matches&&(e==null||(e.innerHTML='<input type="checkbox" name="dark-mode" checked="checked" /> Dark mode'),e?.classList.remove("dark-theme")),this.addEventListener("click",o=>{console.log(e?.querySelector("input:checked")),e?.querySelector("input:checked")?(e==null||(e.innerHTML='<input type="checkbox" name="dark-mode" checked="checked" /> Dark mode'),localStorage.setItem("user-theme","dark-theme"),document.documentElement.className="dark-theme",e?.classList.add("dark-theme")):(e==null||(e.innerHTML='<input type="checkbox" name="dark-mode" /> Light mode'),localStorage.setItem("user-theme","light-theme"),document.documentElement.className="light-theme",e?.classList.remove("dark-theme"))}),window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",({matches:o})=>{o&&(e==null||(e.innerHTML='<input type="checkbox" name="dark-mode" checked="checked" /> Dark mode'),e?.classList.add("dark-theme"))}),window.matchMedia("(prefers-color-scheme: light)").addEventListener("change",({matches:o})=>{o&&(e==null||(e.innerHTML='<input type="checkbox" name="dark-mode"  /> Light mode'),e?.classList.remove("dark-theme"))})}}export{a as default};
+//# sourceMappingURL=darkmode.component.min.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"darkmode.component.min.js","sources":["darkmode.component.js"],"sourcesContent":["window.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'Dark mode button',\n});\nclass iamDarkMode extends HTMLElement {\n    constructor() {\n        var _a;\n        super();\n        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/darkmode.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>${loadCSS}\n    </style>\n      <slot></slot>\n    `;\n        (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        const label = this.querySelector('label');\n        const storedTheme = localStorage.getItem('user-theme');\n        // Work from local storage first then look at the media preferences\n        label === null || label === void 0 ? void 0 : label.innerHTML = `<input type=\"checkbox\" name=\"dark-mode\"  /> Light mode`;\n        if (storedTheme == 'dark-theme') {\n            label === null || label === void 0 ? void 0 : label.innerHTML = `<input type=\"checkbox\" name=\"dark-mode\" checked=\"checked\" /> Dark mode`;\n            label === null || label === void 0 ? void 0 : label.classList.add('dark-theme');\n        }\n        else if (storedTheme == 'light-theme') {\n            label === null || label === void 0 ? void 0 : label.innerHTML = `<input type=\"checkbox\" name=\"dark-mode\"  /> Light mode`;\n            label === null || label === void 0 ? void 0 : label.classList.remove('dark-theme');\n        }\n        const hasDarkPreference = window.matchMedia('(prefers-color-scheme: dark)').matches;\n        if (hasDarkPreference) {\n            label === null || label === void 0 ? void 0 : label.innerHTML = `<input type=\"checkbox\" name=\"dark-mode\" checked=\"checked\" /> Dark mode`;\n            label === null || label === void 0 ? void 0 : label.classList.remove('dark-theme');\n        }\n        this.addEventListener('click', (event) => {\n            console.log(label === null || label === void 0 ? void 0 : label.querySelector('input:checked'));\n            if (label === null || label === void 0 ? void 0 : label.querySelector('input:checked')) {\n                label === null || label === void 0 ? void 0 : label.innerHTML = `<input type=\"checkbox\" name=\"dark-mode\" checked=\"checked\" /> Dark mode`;\n                localStorage.setItem('user-theme', 'dark-theme');\n                document.documentElement.className = 'dark-theme';\n                label === null || label === void 0 ? void 0 : label.classList.add('dark-theme');\n            }\n            else {\n                label === null || label === void 0 ? void 0 : label.innerHTML = `<input type=\"checkbox\" name=\"dark-mode\" /> Light mode`;\n                localStorage.setItem('user-theme', 'light-theme');\n                document.documentElement.className = 'light-theme';\n                label === null || label === void 0 ? void 0 : label.classList.remove('dark-theme');\n            }\n        });\n        window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', ({ matches }) => {\n            if (matches) {\n                label === null || label === void 0 ? void 0 : label.innerHTML = `<input type=\"checkbox\" name=\"dark-mode\" checked=\"checked\" /> Dark mode`;\n                label === null || label === void 0 ? void 0 : label.classList.add('dark-theme');\n            }\n        });\n        window.matchMedia('(prefers-color-scheme: light)').addEventListener('change', ({ matches }) => {\n            if (matches) {\n                label === null || label === void 0 ? void 0 : label.innerHTML = `<input type=\"checkbox\" name=\"dark-mode\"  /> Light mode`;\n                label === null || label === void 0 ? void 0 : label.classList.remove('dark-theme');\n            }\n        });\n    }\n}\nexport default iamDarkMode;\n"],"names":["iamDarkMode","_a","template","label","storedTheme","event","matches"],"mappings":";;;IAAA,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,kBACb,CAAC,EACD,MAAMA,UAAoB,WAAY,CAClC,aAAc,CACV,IAAIC,EACJ,MAAK,EACL,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA,OAKpBD,EAAK,KAAK,cAAgB,MAAQA,IAAO,QAAkBA,EAAG,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC/G,CACA,mBAAoB,CAChB,MAAMC,EAAQ,KAAK,cAAc,OAAO,EAClCC,EAAc,aAAa,QAAQ,YAAY,EAErDD,GAAU,OAAoCA,EAAM,UAAY,0DAC5DC,GAAe,cACfD,GAAU,OAAoCA,EAAM,UAAY,0EAClBA,GAAM,UAAU,IAAI,YAAY,GAEzEC,GAAe,gBACpBD,GAAU,OAAoCA,EAAM,UAAY,0DAClBA,GAAM,UAAU,OAAO,YAAY,GAE3D,OAAO,WAAW,8BAA8B,EAAE,UAExEA,GAAU,OAAoCA,EAAM,UAAY,0EAClBA,GAAM,UAAU,OAAO,YAAY,GAErF,KAAK,iBAAiB,QAAUE,GAAU,CACtC,QAAQ,IAAkDF,GAAM,cAAc,eAAe,CAAC,EAC5CA,GAAM,cAAc,eAAe,GACjFA,GAAU,OAAoCA,EAAM,UAAY,0EAChE,aAAa,QAAQ,aAAc,YAAY,EAC/C,SAAS,gBAAgB,UAAY,aACSA,GAAM,UAAU,IAAI,YAAY,IAG9EA,GAAU,OAAoCA,EAAM,UAAY,yDAChE,aAAa,QAAQ,aAAc,aAAa,EAChD,SAAS,gBAAgB,UAAY,cACSA,GAAM,UAAU,OAAO,YAAY,EAEzF,CAAC,EACD,OAAO,WAAW,8BAA8B,EAAE,iBAAiB,SAAU,CAAC,CAAE,QAAAG,KAAc,CACtFA,IACAH,GAAU,OAAoCA,EAAM,UAAY,0EAClBA,GAAM,UAAU,IAAI,YAAY,EAEtF,CAAC,EACD,OAAO,WAAW,+BAA+B,EAAE,iBAAiB,SAAU,CAAC,CAAE,QAAAG,KAAc,CACvFA,IACAH,GAAU,OAAoCA,EAAM,UAAY,0DAClBA,GAAM,UAAU,OAAO,YAAY,EAEzF,CAAC,CACL,CACJ"}