@iamproperty/components 7.5.0 → 7.5.1--beta2

package/assets/js/components/inline-edit/inline-edit.component.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"inline-edit.component.min.js","sources":["inline-edit.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'inline edit',\n});\nclass iamInlineEdit extends HTMLElement {\n    constructor() {\n        super();\n        const shadowRoot = this.attachShadow({ mode: 'open' });\n        const assetLocation = document.body.hasAttribute('data-assets-location')\n            ? document.body.getAttribute('data-assets-location')\n            : '/assets';\n        const 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/inline-edit.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style class=\"styles\">\n    @import \"${coreCSS}\";\n    ${loadCSS}\n    </style>\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n    \n    <slot></slot>\n    <div class=\"btns\" part=\"btns\">\n      <button class=\"btn btn-action\" id=\"save\" part=\"save-btn\"><i class=\"fa-regular fa-save m-0\"></i> Save</button><button class=\"btn btn-action\" id=\"cancel\" part=\"cancel-btn\">Cancel</button>\n    </div>\n    <div class=\"status pe-none\" part=\"status\">\n      <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saving\"><i class=\"fa-regular fa-spinner fa-spin me-1\"></i> Saving...</span>\n      <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saved\"><i class=\"fa-regular fa-check me-1\"></i> Saved</span>\n      <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"notsaved\"><i class=\"fa-regular fa-circle-info me-1\"></i> Not Saved</span>\n    </div>\n    `;\n        shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const inlineEdit = this;\n        const saveButton = this.shadowRoot.querySelector('#save');\n        const cancelButton = this.shadowRoot.querySelector('#cancel');\n        const input = this.querySelector('input, textarea, select');\n        const preview = this.querySelector('.preview');\n        const statusSaving = this.shadowRoot.querySelector('#saving');\n        const statusSaved = this.shadowRoot.querySelector('#saved');\n        const statusNotSaved = this.shadowRoot.querySelector('#notsaved');\n        // Save the original value for later\n        let originalValue = input.value;\n        // cancel\n        cancelButton.addEventListener('click', () => {\n            input.value = originalValue;\n            input.blur();\n            inlineEdit.blur();\n            inlineEdit.classList.remove('was-validated');\n            statusNotSaved.classList.add('d-none');\n            const cancelEvent = new CustomEvent('inline-edit-cancel', {\n                detail: { name: input.getAttribute('name') },\n            });\n            inlineEdit.dispatchEvent(cancelEvent);\n        });\n        // Save\n        saveButton.addEventListener('click', () => {\n            if (inlineEdit.querySelector(':invalid')) {\n                inlineEdit.classList.add('was-validated');\n                return false;\n            }\n            originalValue = input.value;\n            // dispatch save event\n            const saveEvent = new CustomEvent('inline-edit-save', {\n                detail: { name: input.getAttribute('name'), value: input.value },\n            });\n            inlineEdit.dispatchEvent(saveEvent);\n            //inlineEdit.setAttribute('data-saving','true');\n            input.disabled = true;\n            input.blur();\n            inlineEdit.blur();\n            statusSaving.classList.remove('d-none');\n            if (preview) {\n                console.log(input.value);\n                preview.innerHTML = input.value;\n            }\n        });\n        // Save\n        if (input.tagName === 'INPUT') {\n            input.addEventListener('keydown', (event) => {\n                switch (event.key // change to event.key to key to use the above variable\n                ) {\n                    case 'Enter':\n                        event.stopPropagation();\n                        event.preventDefault();\n                        saveButton.click();\n                        break;\n                }\n            });\n        }\n        // Saved\n        inlineEdit.addEventListener('inline-edit-saved', () => {\n            setTimeout(() => {\n                statusSaving.classList.add('d-none');\n                statusSaved.classList.remove('d-none');\n                const confirmEvent = new CustomEvent('inline-edit-confirmed', {\n                    detail: { name: input.getAttribute('name') },\n                });\n                inlineEdit.dispatchEvent(confirmEvent);\n            }, 100);\n            // Reset to normal\n            setTimeout(() => {\n                input.disabled = false;\n                inlineEdit.removeAttribute('data-saving');\n                statusSaving.classList.add('d-none');\n                statusSaved.classList.add('d-none');\n                statusNotSaved.classList.add('d-none');\n            }, 1000);\n        });\n        // enter key saves\n        if (input.tagName === 'SELECT') {\n            input.addEventListener('change', () => {\n                originalValue = input.value;\n                const saveEvent = new CustomEvent('inline-edit-save', {\n                    detail: { name: input.getAttribute('name'), value: input.value },\n                });\n                inlineEdit.dispatchEvent(saveEvent);\n                inlineEdit.setAttribute('data-saving', 'true');\n                input.disabled = true;\n                input.blur();\n            });\n        }\n        if (input.tagName != 'SELECT') {\n            input.addEventListener('focus', () => {\n                input.select();\n            });\n        }\n        //blur it should autosave\n        input.addEventListener('blur', () => {\n            if (input.value != originalValue) {\n                if (inlineEdit.hasAttribute('data-autosave')) {\n                    originalValue = input.value;\n                    const saveEvent = new CustomEvent('inline-edit-autosave', {\n                        detail: { name: input.getAttribute('name'), value: input.value },\n                    });\n                    inlineEdit.dispatchEvent(saveEvent);\n                    statusSaving.classList.remove('d-none');\n                    if (preview) {\n                        preview.innerHTML = input.value;\n                    }\n                }\n                else if (!inlineEdit.querySelector('.inline-feedback')) {\n                    statusNotSaved.classList.remove('d-none');\n                }\n            }\n        });\n        // checkboxes\n        inlineEdit.addEventListener('change', (event) => {\n            if (event && event.target instanceof HTMLElement && event.target.closest('input[type=\"checkbox\"]')) {\n                let saveValue = '';\n                Array.from(inlineEdit.querySelectorAll(`label input[type=\"checkbox\"]:checked`)).forEach((checkbox, index) => {\n                    if (index != 0)\n                        saveValue += ', ';\n                    saveValue += checkbox.value;\n                });\n                const saveEvent = new CustomEvent('inline-edit-save', {\n                    detail: {\n                        name: event.target.closest('input[type=\"checkbox\"]').getAttribute('name'),\n                        value: saveValue,\n                    },\n                });\n                inlineEdit.dispatchEvent(saveEvent);\n            }\n        });\n    }\n}\nexport default iamInlineEdit;\n"],"names":["iamInlineEdit","shadowRoot","assetLocation","coreCSS","template","inlineEdit","saveButton","cancelButton","input","preview","statusSaving","statusSaved","statusNotSaved","originalValue","cancelEvent","saveEvent","event","confirmEvent","saveValue","checkbox","index"],"mappings":"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"}
+{"version":3,"file":"inline-edit.component.min.js","sources":["inline-edit.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'inline edit',\n});\nclass iamInlineEdit extends HTMLElement {\n    constructor() {\n        super();\n        const shadowRoot = this.attachShadow({ mode: 'open' });\n        const assetLocation = document.body.hasAttribute('data-assets-location')\n            ? document.body.getAttribute('data-assets-location')\n            : '/assets';\n        const loadCSS = `@import \"${assetLocation}/css/components/inline-edit.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style class=\"styles\">\n    \n    ${loadCSS}\n    </style>\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\">\n    \n    <slot></slot>\n    <div class=\"btns\" part=\"btns\">\n      <button class=\"btn btn-action\" id=\"save\" part=\"save-btn\"><i class=\"fa-regular fa-save m-0\"></i> Save</button><button class=\"btn btn-action\" id=\"cancel\" part=\"cancel-btn\">Cancel</button>\n    </div>\n    <div class=\"status pe-none\" part=\"status\">\n      <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saving\"><i class=\"fa-regular fa-spinner fa-spin me-1\"></i> Saving...</span>\n      <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"saved\"><i class=\"fa-regular fa-check me-1\"></i> Saved</span>\n      <span class=\"btn btn-action border-0 bg-transparent prevent-invert d-none\" id=\"notsaved\"><i class=\"fa-regular fa-circle-info me-1\"></i> Not Saved</span>\n    </div>\n    `;\n        shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const inlineEdit = this;\n        const saveButton = this.shadowRoot.querySelector('#save');\n        const cancelButton = this.shadowRoot.querySelector('#cancel');\n        const input = this.querySelector('input, textarea, select');\n        const preview = this.querySelector('.preview');\n        const statusSaving = this.shadowRoot.querySelector('#saving');\n        const statusSaved = this.shadowRoot.querySelector('#saved');\n        const statusNotSaved = this.shadowRoot.querySelector('#notsaved');\n        // Save the original value for later\n        let originalValue = input ? input.value : '';\n        // cancel\n        cancelButton.addEventListener('click', () => {\n            if (input) {\n                input.value = originalValue;\n                input.blur();\n            }\n            inlineEdit.blur();\n            inlineEdit.classList.remove('was-validated');\n            statusNotSaved.classList.add('d-none');\n            const cancelEvent = new CustomEvent('inline-edit-cancel', {\n                detail: { name: input.getAttribute('name') },\n            });\n            inlineEdit.dispatchEvent(cancelEvent);\n        });\n        // Save\n        saveButton.addEventListener('click', () => {\n            if (inlineEdit.querySelector(':invalid')) {\n                inlineEdit.classList.add('was-validated');\n                return false;\n            }\n            originalValue = input.value;\n            // dispatch save event\n            const saveEvent = new CustomEvent('inline-edit-save', {\n                detail: { name: input.getAttribute('name'), value: input.value },\n            });\n            inlineEdit.dispatchEvent(saveEvent);\n            inlineEdit.blur();\n            statusSaving.classList.remove('d-none');\n            if (input) {\n                input.disabled = true;\n                input.blur();\n                if (preview) {\n                    preview.innerHTML = input.value;\n                }\n            }\n        });\n        if (input) {\n            // Save\n            if (input.tagName === 'INPUT') {\n                input.addEventListener('keydown', (event) => {\n                    switch (event.key // change to event.key to key to use the above variable\n                    ) {\n                        case 'Enter':\n                            event.stopPropagation();\n                            event.preventDefault();\n                            saveButton.click();\n                            break;\n                    }\n                });\n            }\n            // enter key saves\n            if (input.tagName === 'SELECT') {\n                input.addEventListener('change', () => {\n                    originalValue = input.value;\n                    const saveEvent = new CustomEvent('inline-edit-save', {\n                        detail: { name: input.getAttribute('name'), value: input.value },\n                    });\n                    inlineEdit.dispatchEvent(saveEvent);\n                    inlineEdit.setAttribute('data-saving', 'true');\n                    input.disabled = true;\n                    input.blur();\n                });\n            }\n            if (input.tagName != 'SELECT') {\n                input.addEventListener('focus', () => {\n                    input.select();\n                });\n            }\n            //blur it should autosave\n            input.addEventListener('blur', () => {\n                if (input.value != originalValue) {\n                    if (inlineEdit.hasAttribute('data-autosave')) {\n                        originalValue = input.value;\n                        const saveEvent = new CustomEvent('inline-edit-autosave', {\n                            detail: { name: input.getAttribute('name'), value: input.value },\n                        });\n                        inlineEdit.dispatchEvent(saveEvent);\n                        statusSaving.classList.remove('d-none');\n                        if (preview) {\n                            preview.innerHTML = input.value;\n                        }\n                    }\n                    else if (!inlineEdit.querySelector('.inline-feedback')) {\n                        statusNotSaved.classList.remove('d-none');\n                    }\n                }\n            });\n        }\n        // Saved\n        inlineEdit.addEventListener('inline-edit-saved', () => {\n            setTimeout(() => {\n                statusSaving.classList.add('d-none');\n                statusSaved.classList.remove('d-none');\n                const confirmEvent = new CustomEvent('inline-edit-confirmed', {\n                    detail: { name: input.getAttribute('name') },\n                });\n                inlineEdit.dispatchEvent(confirmEvent);\n            }, 100);\n            // Reset to normal\n            setTimeout(() => {\n                input.disabled = false;\n                inlineEdit.removeAttribute('data-saving');\n                statusSaving.classList.add('d-none');\n                statusSaved.classList.add('d-none');\n                statusNotSaved.classList.add('d-none');\n            }, 1000);\n        });\n        // checkboxes\n        inlineEdit.addEventListener('change', (event) => {\n            if (event && event.target instanceof HTMLElement && event.target.closest('input[type=\"checkbox\"]')) {\n                let saveValue = '';\n                Array.from(inlineEdit.querySelectorAll(`label input[type=\"checkbox\"]:checked`)).forEach((checkbox, index) => {\n                    if (index != 0)\n                        saveValue += ', ';\n                    saveValue += checkbox.value;\n                });\n                const saveEvent = new CustomEvent('inline-edit-save', {\n                    detail: {\n                        name: event.target.closest('input[type=\"checkbox\"]').getAttribute('name'),\n                        value: saveValue,\n                    },\n                });\n                inlineEdit.dispatchEvent(saveEvent);\n            }\n        });\n    }\n}\nexport default iamInlineEdit;\n"],"names":["iamInlineEdit","shadowRoot","template","inlineEdit","saveButton","cancelButton","input","preview","statusSaving","statusSaved","statusNotSaved","originalValue","cancelEvent","saveEvent","event","confirmEvent","saveValue","checkbox","index"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,aACb,CAAC,EACD,MAAMA,UAAsB,WAAY,CACpC,aAAc,CACV,MAAK,EACL,MAAMC,EAAa,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EAC/B,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAiBrBD,EAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC3D,CACA,mBAAoB,CAEhB,MAAMC,EAAa,KACbC,EAAa,KAAK,WAAW,cAAc,OAAO,EAClDC,EAAe,KAAK,WAAW,cAAc,SAAS,EACtDC,EAAQ,KAAK,cAAc,yBAAyB,EACpDC,EAAU,KAAK,cAAc,UAAU,EACvCC,EAAe,KAAK,WAAW,cAAc,SAAS,EACtDC,EAAc,KAAK,WAAW,cAAc,QAAQ,EACpDC,EAAiB,KAAK,WAAW,cAAc,WAAW,EAEhE,IAAIC,EAAgBL,EAAQA,EAAM,MAAQ,GAE1CD,EAAa,iBAAiB,QAAS,IAAM,CACrCC,IACAA,EAAM,MAAQK,EACdL,EAAM,KAAI,GAEdH,EAAW,KAAI,EACfA,EAAW,UAAU,OAAO,eAAe,EAC3CO,EAAe,UAAU,IAAI,QAAQ,EACrC,MAAME,EAAc,IAAI,YAAY,qBAAsB,CACtD,OAAQ,CAAE,KAAMN,EAAM,aAAa,MAAM,CAAC,CAC1D,CAAa,EACDH,EAAW,cAAcS,CAAW,CACxC,CAAC,EAEDR,EAAW,iBAAiB,QAAS,IAAM,CACvC,GAAID,EAAW,cAAc,UAAU,EACnC,OAAAA,EAAW,UAAU,IAAI,eAAe,EACjC,GAEXQ,EAAgBL,EAAM,MAEtB,MAAMO,EAAY,IAAI,YAAY,mBAAoB,CAClD,OAAQ,CAAE,KAAMP,EAAM,aAAa,MAAM,EAAG,MAAOA,EAAM,KAAK,CAC9E,CAAa,EACDH,EAAW,cAAcU,CAAS,EAClCV,EAAW,KAAI,EACfK,EAAa,UAAU,OAAO,QAAQ,EAClCF,IACAA,EAAM,SAAW,GACjBA,EAAM,KAAI,EACNC,IACAA,EAAQ,UAAYD,EAAM,OAGtC,CAAC,EACGA,IAEIA,EAAM,UAAY,SAClBA,EAAM,iBAAiB,UAAYQ,GAAU,CACzC,OAAQA,EAAM,IAClC,CACwB,IAAK,QACDA,EAAM,gBAAe,EACrBA,EAAM,eAAc,EACpBV,EAAW,MAAK,EAChB,KAC5B,CACgB,CAAC,EAGDE,EAAM,UAAY,UAClBA,EAAM,iBAAiB,SAAU,IAAM,CACnCK,EAAgBL,EAAM,MACtB,MAAMO,EAAY,IAAI,YAAY,mBAAoB,CAClD,OAAQ,CAAE,KAAMP,EAAM,aAAa,MAAM,EAAG,MAAOA,EAAM,KAAK,CACtF,CAAqB,EACDH,EAAW,cAAcU,CAAS,EAClCV,EAAW,aAAa,cAAe,MAAM,EAC7CG,EAAM,SAAW,GACjBA,EAAM,KAAI,CACd,CAAC,EAEDA,EAAM,SAAW,UACjBA,EAAM,iBAAiB,QAAS,IAAM,CAClCA,EAAM,OAAM,CAChB,CAAC,EAGLA,EAAM,iBAAiB,OAAQ,IAAM,CACjC,GAAIA,EAAM,OAASK,EACf,GAAIR,EAAW,aAAa,eAAe,EAAG,CAC1CQ,EAAgBL,EAAM,MACtB,MAAMO,EAAY,IAAI,YAAY,uBAAwB,CACtD,OAAQ,CAAE,KAAMP,EAAM,aAAa,MAAM,EAAG,MAAOA,EAAM,KAAK,CAC1F,CAAyB,EACDH,EAAW,cAAcU,CAAS,EAClCL,EAAa,UAAU,OAAO,QAAQ,EAClCD,IACAA,EAAQ,UAAYD,EAAM,MAElC,MACUH,EAAW,cAAc,kBAAkB,GACjDO,EAAe,UAAU,OAAO,QAAQ,CAGpD,CAAC,GAGLP,EAAW,iBAAiB,oBAAqB,IAAM,CACnD,WAAW,IAAM,CACbK,EAAa,UAAU,IAAI,QAAQ,EACnCC,EAAY,UAAU,OAAO,QAAQ,EACrC,MAAMM,EAAe,IAAI,YAAY,wBAAyB,CAC1D,OAAQ,CAAE,KAAMT,EAAM,aAAa,MAAM,CAAC,CAC9D,CAAiB,EACDH,EAAW,cAAcY,CAAY,CACzC,EAAG,GAAG,EAEN,WAAW,IAAM,CACbT,EAAM,SAAW,GACjBH,EAAW,gBAAgB,aAAa,EACxCK,EAAa,UAAU,IAAI,QAAQ,EACnCC,EAAY,UAAU,IAAI,QAAQ,EAClCC,EAAe,UAAU,IAAI,QAAQ,CACzC,EAAG,GAAI,CACX,CAAC,EAEDP,EAAW,iBAAiB,SAAWW,GAAU,CAC7C,GAAIA,GAASA,EAAM,kBAAkB,aAAeA,EAAM,OAAO,QAAQ,wBAAwB,EAAG,CAChG,IAAIE,EAAY,GAChB,MAAM,KAAKb,EAAW,iBAAiB,sCAAsC,CAAC,EAAE,QAAQ,CAACc,EAAUC,IAAU,CACrGA,GAAS,IACTF,GAAa,MACjBA,GAAaC,EAAS,KAC1B,CAAC,EACD,MAAMJ,EAAY,IAAI,YAAY,mBAAoB,CAClD,OAAQ,CACJ,KAAMC,EAAM,OAAO,QAAQ,wBAAwB,EAAE,aAAa,MAAM,EACxE,MAAOE,CAC/B,CACA,CAAiB,EACDb,EAAW,cAAcU,CAAS,CACtC,CACJ,CAAC,CACL,CACJ"}

package/assets/js/components/marketing/marketing.component.js

@@ -11,14 +11,10 @@ class iamMarketing extends HTMLElement {
         const assetLocation = document.body.hasAttribute('data-assets-location')
             ? document.body.getAttribute('data-assets-location')
             : '/assets';
-        const coreCSS = document.body.hasAttribute('data-core-css')
-            ? document.body.getAttribute('data-core-css')
-            : `${assetLocation}/css/core.min.css`;
         const loadCSS = `@import "${assetLocation}/css/components/marketing.component.css";`;
         const template = document.createElement('template');
         template.innerHTML = `
     <style>
-    @import "${coreCSS}";
     ${loadCSS}
     
     </style>

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

@@ -1,9 +1,8 @@
 /*!
-  * iamKey v7.5.0
+  * iamKey v7.5.1--beta2
   * Copyright 2022-2025 iamproperty
-  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Marketing"});class o extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const e=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",i=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${e}/css/core.min.css`,t=document.createElement("template");t.innerHTML=`
+  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Marketing"});class e extends HTMLElement{constructor(){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>
-    @import "${i}";
     :host{display:flex;position:relative;overflow:hidden;position:relative;overflow:hidden;margin-bottom:2rem;min-width:100%;padding:2rem;border-radius:.5rem;text-align:center;align-items:flex-end;padding-top:33%}figure{position:absolute;height:100%;width:100%;top:0;left:0;margin:0}figure:after{content:"";inset:0;height:100%;width:100%;position:absolute;background-image:linear-gradient(15deg, #00313c 0%, #03404f 28.7%, #03404f 31.5%, #044353 60.1%, #1bb1dc 83.2%, rgba(28, 182, 226, 0.486) 100%);opacity:.85;z-index:1}img{pointer-events:none;position:absolute;inset:0;width:100%;max-height:auto;z-index:2;-webkit-mask-image:-webkit-gradient(linear, left top, left bottom, from(rgb(0, 0, 0)), to(rgba(0, 0, 0, 0)));mask-image:linear-gradient(to bottom, rgb(0, 0, 0), rgba(0, 0, 0, 0));mix-blend-mode:multiply}::slotted(*){position:relative;z-index:2;text-align:center}/*# sourceMappingURL=assets/css/components/marketing.component.css.map */
 
     
@@ -13,5 +12,5 @@
       
       <slot></slot>
     </div>
-    `,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){this.classList.add("invert-colours"),this.hasAttribute("data-img")&&this.shadowRoot.querySelector(".marketing").insertAdjacentHTML("afterbegin",`<figure><img src="${this.getAttribute("data-img")}" alt="" /></figure>`)}}export{o as default};
+    `,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){this.classList.add("invert-colours"),this.hasAttribute("data-img")&&this.shadowRoot.querySelector(".marketing").insertAdjacentHTML("afterbegin",`<figure><img src="${this.getAttribute("data-img")}" alt="" /></figure>`)}}export{e as default};
 //# sourceMappingURL=marketing.component.min.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"marketing.component.min.js","sources":["marketing.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'Marketing',\n});\nclass iamMarketing 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/marketing.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    @import \"${coreCSS}\";\n    ${loadCSS}\n    \n    </style>\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\" />\n    <div class=\"marketing\">\n      \n      <slot></slot>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        this.classList.add('invert-colours');\n        if (this.hasAttribute('data-img')) {\n            this.shadowRoot\n                .querySelector('.marketing')\n                .insertAdjacentHTML('afterbegin', `<figure><img src=\"${this.getAttribute('data-img')}\" alt=\"\" /></figure>`);\n        }\n    }\n}\nexport default iamMarketing;\n"],"names":["iamMarketing","assetLocation","coreCSS","template"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,WACb,CAAC,EACD,MAAMA,UAAqB,WAAY,CACnC,aAAc,CACV,MAAK,EACL,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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAUd,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,KAAK,UAAU,IAAI,gBAAgB,EAC/B,KAAK,aAAa,UAAU,GAC5B,KAAK,WACA,cAAc,YAAY,EAC1B,mBAAmB,aAAc,qBAAqB,KAAK,aAAa,UAAU,CAAC,sBAAsB,CAEtH,CACJ"}
+{"version":3,"file":"marketing.component.min.js","sources":["marketing.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'Marketing',\n});\nclass iamMarketing 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/marketing.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${loadCSS}\n    \n    </style>\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\" />\n    <div class=\"marketing\">\n      \n      <slot></slot>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        this.classList.add('invert-colours');\n        if (this.hasAttribute('data-img')) {\n            this.shadowRoot\n                .querySelector('.marketing')\n                .insertAdjacentHTML('afterbegin', `<figure><img src=\"${this.getAttribute('data-img')}\" alt=\"\" /></figure>`);\n        }\n    }\n}\nexport default iamMarketing;\n"],"names":["iamMarketing","template"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,WACb,CAAC,EACD,MAAMA,UAAqB,WAAY,CACnC,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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAWrB,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,KAAK,UAAU,IAAI,gBAAgB,EAC/B,KAAK,aAAa,UAAU,GAC5B,KAAK,WACA,cAAc,YAAY,EAC1B,mBAAmB,aAAc,qBAAqB,KAAK,aAAa,UAAU,CAAC,sBAAsB,CAEtH,CACJ"}

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

@@ -1,11 +1,12 @@
 /*!
-  * iamKey v7.5.0
+  * iamKey v7.5.1--beta2
   * Copyright 2022-2025 iamproperty
-  */class m extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const r=`@import "${document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets"}/css/components/menu.component.css";`,s=document.createElement("template");s.innerHTML=`
+  */class p extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const n=document.createElement("template");n.innerHTML=`
     <style>
-    ${r}
+    :host{inset:auto;top:anchor(bottom);left:anchor(left);position:fixed;position-try-fallbacks:flip-block,flip-inline;width:max-content;height:min-content;max-height:var(--menu-max-height, min(100vh - 6rem));background:var(--menu-bg, canvas);margin:var(--menu-margin, 0);padding:var(--menu-padding, 0.5rem);border:var(--menu-border, 2px solid grey);overflow:auto;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.1)}:host(.menu--fill){width:anchor-size(width);min-width:anchor-size(width);max-width:anchor-size(width)}:host(:popover-open),:host([popover-open]){display:block}:host(:not([popover])){position:static;display:block}:host(.menu--sm){width:10rem}:host(.menu--md){width:15rem}:host(.menu--lg){width:20rem}:host(.menu--height-sm){max-height:12.5rem}:host(.menu--height-lg){max-height:25rem}::slotted(*:is(button,a,label,span)){background:unset !important;border:unset !important;color:var(--colour-primary) !important;font-weight:inherit !important;font-family:inherit !important;font-size:1rem !important;line-height:1.1875rem !important;display:block !important;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding-block:var(--menu-item-padding, 0.5rem) !important;width:var(--menu-item-width, 100%) !important;max-width:var(--menu-item-width, 100%) !important;text-align:var(--menu-item-text-align, left) !important}::slotted(*:is(button,a,label)){padding-inline:var(--menu-item-padding, 0.5rem);cursor:var(--menu-item-cursor, pointer) !important}::slotted(*:is(span):first-child){padding-top:0 !important;font-weight:700 !important}::slotted(*:is(button,a,label,span):last-child){margin-bottom:0 !important}::slotted(*:is(label)){--radio-size: 1.25rem;--radio-inner-size: 0.75rem;--radio-inner-top: 0.75rem;--radio-inner-left: 0.75rem;--checkbox-tick-size: 0.75rem;--checkbox-inner-size: 0.625rem;--checkbox-inner-top: 0.375rem;--checkbox-inner-left: 0.5rem;padding-left:2.25rem !important}::slotted(*:is(button,a,label):is(.selected)){background:#e9f8fc !important;border-left:4px solid var(--colour-info) !important;border-radius:.25rem !important;padding-left:calc(var(--menu-item-padding, 0.5rem) - 4px) !important}@media(prefers-color-scheme: dark){::slotted(*:is(button,a,label):is(.selected):not(:hover,.hover)){color:#000 !important}}::slotted(*:is(button,a,label):is(:hover,.hover,:focus,.focus)){background:var(--colour-light) !important;border-radius:.25rem !important}::slotted(*:is(button,a,label):is(:active,.active)){background:#e0e0e0 !important;border-radius:.25rem !important}@media(prefers-color-scheme: dark){::slotted(*:is(button,a,label):is(:active,.active)){color:#000 !important}}::slotted(hr){height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}::slotted(iam-menu:not([popover])){border:none !important;border-radius:0 !important;box-shadow:none !important;padding:0;margin:0;width:auto}::slotted(iam-menu[popover]){top:anchor(top);left:calc(anchor(right) + 1rem)}/*# sourceMappingURL=assets/css/components/menu.component.css.map */
+
     </style>
     <div class="menu--inner" part="inner">
       <slot></slot>
-    </div>`,this.shadowRoot.appendChild(s.content.cloneNode(!0))}connectedCallback(){const n=this.hasAttribute("id")?this.getAttribute("id"):!1,r=document.querySelector(`[popovertarget="${n}"]`);let s=this.querySelectorAll(":scope > a, :scope > button, :scope > details > summary"),l=this.querySelectorAll("a, button");this.closest(".menu__wrapper")&&(l=this.shadowRoot.querySelector("slot").assignedElements({flatten:!0}),s=l),this.querySelectorAll("details");let c,u;n&&r&&(this.setAttribute("role","menu"),this.style["position-anchor"]=`--${n}`,r?.setAttribute("aria-haspopup","true"),r==null||(r.style["anchor-name"]=`--${n}`),r?.setAttribute("aria-controls",n)),l.forEach((t,e)=>{t.setAttribute("role","menuitem"),t.setAttribute("tabindex","0"),e==0&&t.setAttribute("autofocus",!0)}),this.addEventListener("keydown",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest("a, button, summary")){const e=document.activeElement,i=Array.from(s).indexOf(e)-1,a=Array.from(s).indexOf(e)+1;switch(t.keyCode){case 27:e.closest("details")?(t.stopPropagation(),t.preventDefault(),e.closest("details").removeAttribute("open"),e.closest("details").querySelector(":scope summary").focus()):(t.stopPropagation(),r.focus());break;case 32:case 13:break;case 35:t.stopPropagation(),t.preventDefault(),this.querySelector("details[open]").removeAttribute("open"),Array.from(l)[l.length-1].focus();break;case 36:t.stopPropagation(),t.preventDefault(),this.querySelector("details[open]").removeAttribute("open"),Array.from(l)[0].focus();break;case 38:if(t.stopPropagation(),t.preventDefault(),Array.from(s).indexOf(e)>-1)Array.from(s)[i]!=null?Array.from(s)[i].focus():Array.from(s)[s.length-1].focus();else if(e.closest("details")){const o=e.closest("details").querySelectorAll("a, button, :scope details > summary");u=Array.from(o).indexOf(e)-1,Array.from(o)[u]!=null?Array.from(o)[u].focus():Array.from(o)[o.length-1].focus()}break;case 40:if(t.stopPropagation(),t.preventDefault(),Array.from(s).indexOf(e)>-1)Array.from(s)[a]!=null?Array.from(s)[a].focus():Array.from(s)[0].focus();else if(e.closest("details")){const o=e.closest("details").querySelectorAll("a, button, :scope details > summary");c=Array.from(o).indexOf(e)+1,Array.from(o)[c]!=null?Array.from(o)[c].focus():Array.from(o)[0].focus()}break}}}),this.addEventListener("toggle",t=>{var e,i,a,o;const d=new CustomEvent(t.newState,{detail:{id:this.getAttribute("id"),target:t.target}});this.dispatchEvent(d),this.closest(".menu__wrapper")&&l[0].focus(),this.hasAttribute("popover-open")&&(t.preventDefault(),this.removeAttribute("popover-open"),this.hidePopover()),this.matches(":popover-open")&&document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`)?((e=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||e===void 0||e.setAttribute("aria-pressed","true"),(i=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||i===void 0||i.classList.add("active")):((a=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||a===void 0||a.removeAttribute("aria-pressed"),(o=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||o===void 0||o.classList.remove("active"))}),this.addEventListener("click",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest("button:has(+ iam-menu:not([popover]))")){const e=t.target.closest("button:has(+ iam-menu)");e?.classList.toggle("open")}else if(t&&t.target instanceof HTMLElement&&t.target.closest("button.selectable")){const e=t.target.closest("button.selectable");this.hasAttribute("multiple")?e.classList.toggle("selected"):e?.classList.contains("selected")?this.querySelectorAll(".selected").forEach(i=>{i.classList.remove("selected")}):(this.querySelectorAll(".selected").forEach(i=>{i.classList.remove("selected")}),e.classList.add("selected"))}}),CSS.supports("top","anchor(top)")||document.addEventListener("click",t=>{if(t.originalTarget&&t.originalTarget.matches("[popovertarget]")){const e=t.originalTarget,i=e.getAttribute("popovertarget"),a=document.getElementById(i),o=e.getBoundingClientRect(),d=o.top,p=o.left;a.style.setProperty("top",d+"px"),a.style.setProperty("left",p+e.clientWidth+"px")}})}}export{m as default};
+    </div>`,this.shadowRoot.appendChild(n.content.cloneNode(!0))}connectedCallback(){const n=this.hasAttribute("id")?this.getAttribute("id"):!1,a=document.querySelector(`[popovertarget="${n}"]`);let r=this.querySelectorAll(":scope > a, :scope > button, :scope > details > summary"),l=this.querySelectorAll("a, button");this.closest(".menu__wrapper")&&(l=this.shadowRoot.querySelector("slot").assignedElements({flatten:!0}),r=l),this.querySelectorAll("details");let d,m;n&&a&&(this.setAttribute("role","menu"),this.style["position-anchor"]=`--${n}`,a?.setAttribute("aria-haspopup","true"),a==null||(a.style["anchor-name"]=`--${n}`),a?.setAttribute("aria-controls",n)),l.forEach((t,e)=>{t.setAttribute("role","menuitem"),t.setAttribute("tabindex","0"),e==0&&t.setAttribute("autofocus",!0)}),this.addEventListener("keydown",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest("a, button, summary")){const e=document.activeElement,i=Array.from(r).indexOf(e)-1,s=Array.from(r).indexOf(e)+1;switch(t.keyCode){case 27:e.closest("details")?(t.stopPropagation(),t.preventDefault(),e.closest("details").removeAttribute("open"),e.closest("details").querySelector(":scope summary").focus()):(t.stopPropagation(),a.focus());break;case 32:case 13:break;case 35:t.stopPropagation(),t.preventDefault(),this.querySelector("details[open]").removeAttribute("open"),Array.from(l)[l.length-1].focus();break;case 36:t.stopPropagation(),t.preventDefault(),this.querySelector("details[open]").removeAttribute("open"),Array.from(l)[0].focus();break;case 38:if(t.stopPropagation(),t.preventDefault(),Array.from(r).indexOf(e)>-1)Array.from(r)[i]!=null?Array.from(r)[i].focus():Array.from(r)[r.length-1].focus();else if(e.closest("details")){const o=e.closest("details").querySelectorAll("a, button, :scope details > summary");m=Array.from(o).indexOf(e)-1,Array.from(o)[m]!=null?Array.from(o)[m].focus():Array.from(o)[o.length-1].focus()}break;case 40:if(t.stopPropagation(),t.preventDefault(),Array.from(r).indexOf(e)>-1)Array.from(r)[s]!=null?Array.from(r)[s].focus():Array.from(r)[0].focus();else if(e.closest("details")){const o=e.closest("details").querySelectorAll("a, button, :scope details > summary");d=Array.from(o).indexOf(e)+1,Array.from(o)[d]!=null?Array.from(o)[d].focus():Array.from(o)[0].focus()}break}}}),this.addEventListener("toggle",t=>{var e,i,s,o;const c=new CustomEvent(t.newState,{detail:{id:this.getAttribute("id"),target:t.target}});this.dispatchEvent(c),this.closest(".menu__wrapper")&&l[0].focus(),this.hasAttribute("popover-open")&&(t.preventDefault(),this.removeAttribute("popover-open"),this.hidePopover()),this.matches(":popover-open")&&document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`)?((e=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||e===void 0||e.setAttribute("aria-pressed","true"),(i=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||i===void 0||i.classList.add("active")):((s=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||s===void 0||s.removeAttribute("aria-pressed"),(o=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||o===void 0||o.classList.remove("active"))}),this.addEventListener("click",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest("button:has(+ iam-menu:not([popover]))")){const e=t.target.closest("button:has(+ iam-menu)");e?.classList.toggle("open")}else if(t&&t.target instanceof HTMLElement&&t.target.closest("button.selectable")){const e=t.target.closest("button.selectable");this.hasAttribute("multiple")?e.classList.toggle("selected"):e?.classList.contains("selected")?this.querySelectorAll(".selected").forEach(i=>{i.classList.remove("selected")}):(this.querySelectorAll(".selected").forEach(i=>{i.classList.remove("selected")}),e.classList.add("selected"))}}),CSS.supports("top","anchor(top)")||document.addEventListener("click",t=>{if(t.originalTarget&&t.originalTarget.matches("[popovertarget]")){const e=t.originalTarget,i=e.getAttribute("popovertarget"),s=document.getElementById(i),o=e.getBoundingClientRect(),c=o.top,u=o.left;s.style.setProperty("top",c+"px"),s.style.setProperty("left",u+e.clientWidth+"px")}})}}export{p as default};
 //# sourceMappingURL=menu.component.min.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"menu.component.min.js","sources":["menu.component.js"],"sourcesContent":["class iamMenu 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 menuCSS = `@import \"${assetLocation}/css/components/menu.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${menuCSS}\n    </style>\n    <div class=\"menu--inner\" part=\"inner\">\n      <slot></slot>\n    </div>`;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        const menuID = this.hasAttribute('id') ? this.getAttribute('id') : false;\n        const menuButton = document.querySelector(`[popovertarget=\"${menuID}\"]`);\n        let topLevelmenuItems = this.querySelectorAll(':scope > a, :scope > button, :scope > details > summary');\n        let menuItems = this.querySelectorAll('a, button');\n        if (this.closest('.menu__wrapper')) {\n            menuItems = this.shadowRoot.querySelector('slot').assignedElements({ flatten: true });\n            topLevelmenuItems = menuItems;\n        }\n        const subMenus = this.querySelectorAll('details');\n        let subNextIndex;\n        let subPrevIndex;\n        // Set the needed CSS styles to connect the ID attribute to the anchor name\n        if (menuID && menuButton) {\n            this.setAttribute('role', 'menu');\n            this.style['position-anchor'] = `--${menuID}`;\n            menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-haspopup', 'true');\n            menuButton === null || menuButton === void 0 ? void 0 : menuButton.style['anchor-name'] = `--${menuID}`;\n            menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-controls', menuID);\n        }\n        menuItems.forEach((item, index) => {\n            item.setAttribute('role', 'menuitem');\n            item.setAttribute('tabindex', '0');\n            if (index == 0) {\n                item.setAttribute('autofocus', true);\n            }\n        });\n        this.addEventListener('keydown', (event) => {\n            if (event && event.target instanceof HTMLElement && event.target.closest('a, button, summary')) {\n                const activeItem = document.activeElement;\n                const prevIndex = Array.from(topLevelmenuItems).indexOf(activeItem) - 1;\n                const nextIndex = Array.from(topLevelmenuItems).indexOf(activeItem) + 1;\n                switch (event.keyCode // change to event.key to key to use the above variable\n                ) {\n                    case 27: // Esc\n                        if (activeItem.closest('details')) {\n                            event.stopPropagation();\n                            event.preventDefault();\n                            activeItem.closest('details').removeAttribute('open');\n                            activeItem.closest('details').querySelector(':scope summary').focus();\n                        }\n                        else {\n                            event.stopPropagation();\n                            menuButton.focus();\n                        }\n                        break;\n                    case 32: // Space\n                    case 13: // Enter\n                        break;\n                    case 35: // end\n                        event.stopPropagation();\n                        event.preventDefault();\n                        this.querySelector('details[open]').removeAttribute('open');\n                        Array.from(menuItems)[menuItems.length - 1].focus();\n                        break;\n                    case 36: // home\n                        event.stopPropagation();\n                        event.preventDefault();\n                        this.querySelector('details[open]').removeAttribute('open');\n                        Array.from(menuItems)[0].focus();\n                        break;\n                    case 38: // up\n                        event.stopPropagation();\n                        event.preventDefault();\n                        if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n                            if (Array.from(topLevelmenuItems)[prevIndex] != undefined)\n                                Array.from(topLevelmenuItems)[prevIndex].focus();\n                            else\n                                Array.from(topLevelmenuItems)[topLevelmenuItems.length - 1].focus();\n                        }\n                        else if (activeItem.closest('details')) {\n                            const subMenuItems = activeItem\n                                .closest('details')\n                                .querySelectorAll('a, button, :scope details > summary');\n                            subPrevIndex = Array.from(subMenuItems).indexOf(activeItem) - 1;\n                            if (Array.from(subMenuItems)[subPrevIndex] != undefined)\n                                Array.from(subMenuItems)[subPrevIndex].focus();\n                            else\n                                Array.from(subMenuItems)[subMenuItems.length - 1].focus();\n                        }\n                        break;\n                    case 40: // down\n                        event.stopPropagation();\n                        event.preventDefault();\n                        if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n                            if (Array.from(topLevelmenuItems)[nextIndex] != undefined)\n                                Array.from(topLevelmenuItems)[nextIndex].focus();\n                            else\n                                Array.from(topLevelmenuItems)[0].focus();\n                        }\n                        else if (activeItem.closest('details')) {\n                            const subMenuItems = activeItem\n                                .closest('details')\n                                .querySelectorAll('a, button, :scope details > summary');\n                            subNextIndex = Array.from(subMenuItems).indexOf(activeItem) + 1;\n                            if (Array.from(subMenuItems)[subNextIndex] != undefined)\n                                Array.from(subMenuItems)[subNextIndex].focus();\n                            else\n                                Array.from(subMenuItems)[0].focus();\n                        }\n                        break;\n                }\n            }\n        });\n        this.addEventListener('toggle', (e) => {\n            var _a, _b, _c, _d;\n            const updateEvent = new CustomEvent(e.newState, { detail: { id: this.getAttribute('id'), target: e.target } });\n            this.dispatchEvent(updateEvent);\n            // Fix the focus\n            if (this.closest('.menu__wrapper')) {\n                menuItems[0].focus();\n            }\n            if (this.hasAttribute('popover-open')) {\n                e.preventDefault();\n                this.removeAttribute('popover-open');\n                this.hidePopover();\n            }\n            if (this.matches(':popover-open') && document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) {\n                (_a = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-pressed', 'true');\n                (_b = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _b === void 0 ? void 0 : _b.classList.add('active');\n            }\n            else {\n                (_c = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _c === void 0 ? void 0 : _c.removeAttribute('aria-pressed');\n                (_d = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _d === void 0 ? void 0 : _d.classList.remove('active');\n            }\n        });\n        this.addEventListener('click', (event) => {\n            if (event &&\n                event.target instanceof HTMLElement &&\n                event.target.closest('button:has(+ iam-menu:not([popover]))')) {\n                const button = event.target.closest('button:has(+ iam-menu)');\n                button === null || button === void 0 ? void 0 : button.classList.toggle('open');\n            }\n            else if (event && event.target instanceof HTMLElement && event.target.closest('button.selectable')) {\n                const button = event.target.closest('button.selectable');\n                if (this.hasAttribute('multiple')) {\n                    button.classList.toggle('selected');\n                }\n                else if (button === null || button === void 0 ? void 0 : button.classList.contains('selected')) {\n                    this.querySelectorAll('.selected').forEach((item) => {\n                        item.classList.remove('selected');\n                    });\n                }\n                else {\n                    this.querySelectorAll('.selected').forEach((item) => {\n                        item.classList.remove('selected');\n                    });\n                    button.classList.add('selected');\n                }\n            }\n        });\n        // safari and firefox anchor fix for cards\n        if (!CSS.supports('top', 'anchor(top)')) {\n            document.addEventListener('click', (event) => {\n                if (event.originalTarget && event.originalTarget.matches('[popovertarget]')) {\n                    const button = event.originalTarget;\n                    const popoverID = button.getAttribute('popovertarget');\n                    const popover = document.getElementById(popoverID);\n                    const viewportOffset = button.getBoundingClientRect();\n                    const top = viewportOffset.top;\n                    const left = viewportOffset.left;\n                    popover.style.setProperty('top', top + 'px');\n                    popover.style.setProperty('left', left + button.clientWidth + 'px');\n                }\n            });\n        }\n    }\n}\nexport default iamMenu;\n"],"names":["iamMenu","menuCSS","template","menuID","menuButton","topLevelmenuItems","menuItems","subNextIndex","subPrevIndex","item","index","event","activeItem","prevIndex","nextIndex","subMenuItems","e","_a","_b","_c","_d","updateEvent","button","popoverID","popover","viewportOffset","top","left"],"mappings":"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"}
+{"version":3,"file":"menu.component.min.js","sources":["menu.component.js"],"sourcesContent":["class iamMenu 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 menuCSS = `@import \"${assetLocation}/css/components/menu.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${menuCSS}\n    </style>\n    <div class=\"menu--inner\" part=\"inner\">\n      <slot></slot>\n    </div>`;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        const menuID = this.hasAttribute('id') ? this.getAttribute('id') : false;\n        const menuButton = document.querySelector(`[popovertarget=\"${menuID}\"]`);\n        let topLevelmenuItems = this.querySelectorAll(':scope > a, :scope > button, :scope > details > summary');\n        let menuItems = this.querySelectorAll('a, button');\n        if (this.closest('.menu__wrapper')) {\n            menuItems = this.shadowRoot.querySelector('slot').assignedElements({ flatten: true });\n            topLevelmenuItems = menuItems;\n        }\n        const subMenus = this.querySelectorAll('details');\n        let subNextIndex;\n        let subPrevIndex;\n        // Set the needed CSS styles to connect the ID attribute to the anchor name\n        if (menuID && menuButton) {\n            this.setAttribute('role', 'menu');\n            this.style['position-anchor'] = `--${menuID}`;\n            menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-haspopup', 'true');\n            menuButton === null || menuButton === void 0 ? void 0 : menuButton.style['anchor-name'] = `--${menuID}`;\n            menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-controls', menuID);\n        }\n        menuItems.forEach((item, index) => {\n            item.setAttribute('role', 'menuitem');\n            item.setAttribute('tabindex', '0');\n            if (index == 0) {\n                item.setAttribute('autofocus', true);\n            }\n        });\n        this.addEventListener('keydown', (event) => {\n            if (event && event.target instanceof HTMLElement && event.target.closest('a, button, summary')) {\n                const activeItem = document.activeElement;\n                const prevIndex = Array.from(topLevelmenuItems).indexOf(activeItem) - 1;\n                const nextIndex = Array.from(topLevelmenuItems).indexOf(activeItem) + 1;\n                switch (event.keyCode // change to event.key to key to use the above variable\n                ) {\n                    case 27: // Esc\n                        if (activeItem.closest('details')) {\n                            event.stopPropagation();\n                            event.preventDefault();\n                            activeItem.closest('details').removeAttribute('open');\n                            activeItem.closest('details').querySelector(':scope summary').focus();\n                        }\n                        else {\n                            event.stopPropagation();\n                            menuButton.focus();\n                        }\n                        break;\n                    case 32: // Space\n                    case 13: // Enter\n                        break;\n                    case 35: // end\n                        event.stopPropagation();\n                        event.preventDefault();\n                        this.querySelector('details[open]').removeAttribute('open');\n                        Array.from(menuItems)[menuItems.length - 1].focus();\n                        break;\n                    case 36: // home\n                        event.stopPropagation();\n                        event.preventDefault();\n                        this.querySelector('details[open]').removeAttribute('open');\n                        Array.from(menuItems)[0].focus();\n                        break;\n                    case 38: // up\n                        event.stopPropagation();\n                        event.preventDefault();\n                        if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n                            if (Array.from(topLevelmenuItems)[prevIndex] != undefined)\n                                Array.from(topLevelmenuItems)[prevIndex].focus();\n                            else\n                                Array.from(topLevelmenuItems)[topLevelmenuItems.length - 1].focus();\n                        }\n                        else if (activeItem.closest('details')) {\n                            const subMenuItems = activeItem\n                                .closest('details')\n                                .querySelectorAll('a, button, :scope details > summary');\n                            subPrevIndex = Array.from(subMenuItems).indexOf(activeItem) - 1;\n                            if (Array.from(subMenuItems)[subPrevIndex] != undefined)\n                                Array.from(subMenuItems)[subPrevIndex].focus();\n                            else\n                                Array.from(subMenuItems)[subMenuItems.length - 1].focus();\n                        }\n                        break;\n                    case 40: // down\n                        event.stopPropagation();\n                        event.preventDefault();\n                        if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n                            if (Array.from(topLevelmenuItems)[nextIndex] != undefined)\n                                Array.from(topLevelmenuItems)[nextIndex].focus();\n                            else\n                                Array.from(topLevelmenuItems)[0].focus();\n                        }\n                        else if (activeItem.closest('details')) {\n                            const subMenuItems = activeItem\n                                .closest('details')\n                                .querySelectorAll('a, button, :scope details > summary');\n                            subNextIndex = Array.from(subMenuItems).indexOf(activeItem) + 1;\n                            if (Array.from(subMenuItems)[subNextIndex] != undefined)\n                                Array.from(subMenuItems)[subNextIndex].focus();\n                            else\n                                Array.from(subMenuItems)[0].focus();\n                        }\n                        break;\n                }\n            }\n        });\n        this.addEventListener('toggle', (e) => {\n            var _a, _b, _c, _d;\n            const updateEvent = new CustomEvent(e.newState, { detail: { id: this.getAttribute('id'), target: e.target } });\n            this.dispatchEvent(updateEvent);\n            // Fix the focus\n            if (this.closest('.menu__wrapper')) {\n                menuItems[0].focus();\n            }\n            if (this.hasAttribute('popover-open')) {\n                e.preventDefault();\n                this.removeAttribute('popover-open');\n                this.hidePopover();\n            }\n            if (this.matches(':popover-open') && document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) {\n                (_a = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-pressed', 'true');\n                (_b = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _b === void 0 ? void 0 : _b.classList.add('active');\n            }\n            else {\n                (_c = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _c === void 0 ? void 0 : _c.removeAttribute('aria-pressed');\n                (_d = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _d === void 0 ? void 0 : _d.classList.remove('active');\n            }\n        });\n        this.addEventListener('click', (event) => {\n            if (event &&\n                event.target instanceof HTMLElement &&\n                event.target.closest('button:has(+ iam-menu:not([popover]))')) {\n                const button = event.target.closest('button:has(+ iam-menu)');\n                button === null || button === void 0 ? void 0 : button.classList.toggle('open');\n            }\n            else if (event && event.target instanceof HTMLElement && event.target.closest('button.selectable')) {\n                const button = event.target.closest('button.selectable');\n                if (this.hasAttribute('multiple')) {\n                    button.classList.toggle('selected');\n                }\n                else if (button === null || button === void 0 ? void 0 : button.classList.contains('selected')) {\n                    this.querySelectorAll('.selected').forEach((item) => {\n                        item.classList.remove('selected');\n                    });\n                }\n                else {\n                    this.querySelectorAll('.selected').forEach((item) => {\n                        item.classList.remove('selected');\n                    });\n                    button.classList.add('selected');\n                }\n            }\n        });\n        // safari and firefox anchor fix for cards\n        if (!CSS.supports('top', 'anchor(top)')) {\n            document.addEventListener('click', (event) => {\n                if (event.originalTarget && event.originalTarget.matches('[popovertarget]')) {\n                    const button = event.originalTarget;\n                    const popoverID = button.getAttribute('popovertarget');\n                    const popover = document.getElementById(popoverID);\n                    const viewportOffset = button.getBoundingClientRect();\n                    const top = viewportOffset.top;\n                    const left = viewportOffset.left;\n                    popover.style.setProperty('top', top + 'px');\n                    popover.style.setProperty('left', left + button.clientWidth + 'px');\n                }\n            });\n        }\n    }\n}\nexport default iamMenu;\n"],"names":["iamMenu","template","menuID","menuButton","topLevelmenuItems","menuItems","subNextIndex","subPrevIndex","item","index","event","activeItem","prevIndex","nextIndex","subMenuItems","e","_a","_b","_c","_d","updateEvent","button","popoverID","popover","viewportOffset","top","left"],"mappings":"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"}

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

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.5.0
+  * iamKey v7.5.1--beta2
   * Copyright 2022-2025 iamproperty
   */const l=t=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:t})},m=(t,n,a)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:n}),a.forEach(e=>{t.addEventListener(e,function(s){const d={event:e,element:n,target:s.target};Object.keys(s.detail).forEach(o=>{const i=s.detail[o];d[o]=i}),window.dataLayer.push(d)})}),!0),p=function(t){const n=t.dataset.status;if(!n)return;const a=t.shadowRoot.querySelector(".milestone-wrap"),e=document.createElement("span");e.setAttribute("part","status"),e.classList.add("milestone-status"),e.innerHTML=`${n} Step`,n==="Current"&&t.classList.add("current"),a.insertAdjacentElement("afterbegin",e)},u=function(t){const n=t.shadowRoot.querySelector(".task-wrap"),a=t.dataset.items?JSON.parse(t.dataset.items):[];a.length&&(a.forEach(e=>{const s=document.createElement("details"),d=document.createElement("summary"),o=document.createElement("div"),i=document.createElement("p");o.classList.add("task-details"),d.innerHTML=e.name,e.date_completed&&d.classList.add("complete"),s.appendChild(d),e.description&&(i.innerHTML=e.description,o.appendChild(i)),e.actions.length&&o.appendChild(h(e.actions,d)),s.appendChild(o),n.insertAdjacentElement("beforeend",s),s.addEventListener("click",()=>{s?.hasAttribute("open")?r("milestone-item-closed",e.name,t):r("milestone-item-opened",e.name,t)})}),t.appendChild(n))},r=function(t,n,a){const e=new CustomEvent(t,{detail:{title:n}});a.dispatchEvent(e)},h=function(t,n){const a=document.createElement("ul"),e=t.length,d=t.filter(o=>o.date_completed).length||0;if(!(e<1))return n.innerHTML+=` (${d}/${e})`,t.forEach(o=>{const i=document.createElement("li"),c=document.createElement("span");o.date_completed&&(i.classList.add("complete"),c.classList.add("action-date"),c.innerHTML=o.date_completed),i.innerHTML=o.action,i.appendChild(c),a.appendChild(i)}),a},w=function(t){p(t),u(t)};l("iam-milestone");class L extends HTMLElement{constructor(){var n;super(),this.attachShadow({mode:"open"});const a=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"):`${a}/css/core.min.css`,s=document.createElement("template");s.innerHTML=`
     <style>

package/assets/js/components/milestone-group/milestone-group.component.min.js

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.5.0
+  * iamKey v7.5.1--beta2
   * Copyright 2022-2025 iamproperty
   */const r=t=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:t})},l=(t,s,e)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:s}),e.forEach(n=>{t.addEventListener(n,function(o){const a={event:n,element:s,target:o.target};Object.keys(o.detail).forEach(i=>{const d=o.detail[i];a[i]=d}),window.dataLayer.push(a)})}),!0),u=function(t){if(!t.dataset.showAllToggle)return;const e=document.createElement("button");e.innerHTML="Show next steps",e.classList.add("btn","btn-tertiary","show-all-toggle"),t.appendChild(e),e.addEventListener("click",()=>{t.classList.contains("show-all")?(e.innerHTML="Show next steps",t.classList.remove("show-all"),c("hide-future-items",t)):(e.innerHTML="Hide next steps",t.classList.add("show-all"),c("show-future-items",t))})},c=function(t,s){const e=new CustomEvent(t,{});s.dispatchEvent(e)},h=function(t){u(t)};r("iam-milestone-group");class m extends HTMLElement{constructor(){var s;super();const e=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",n=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${e}/css/core.min.css`,o=document.createElement("template");o.innerHTML=`
     <style>

package/assets/js/components/multi-step/multi-step.component.min.js

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.5.0
+  * iamKey v7.5.1--beta2
   * Copyright 2022-2025 iamproperty
   */const g=c=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:c})},y=(c,e,u)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:e}),u.forEach(l=>{c.addEventListener(l,function(i){const n={event:l,element:e,target:i.target};Object.keys(i.detail).forEach(d=>{const t=i.detail[d];n[d]=t}),window.dataLayer.push(n)})}),!0);g("iam-multi-step");class h 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>

package/assets/js/components/multiselect/multiselect.component.js

@@ -1,3 +1,13 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import Cookies from 'js-cookie';
 // Data layer Web component created
 window.dataLayer = window.dataLayer || [];
 window.dataLayer.push({
@@ -11,14 +21,11 @@ class iamMultiselect extends HTMLElement {
         const assetLocation = document.body.hasAttribute('data-assets-location')
             ? document.body.getAttribute('data-assets-location')
             : '/assets';
-        const coreCSS = document.body.hasAttribute('data-core-css')
-            ? document.body.getAttribute('data-core-css')
-            : `${assetLocation}/css/core.min.css`;
         const loadCSS = `@import "${assetLocation}/css/components/multiselect.css";`;
         const template = document.createElement('template');
         template.innerHTML = `
     <style>
-    @import "${coreCSS}";
+    
     ${loadCSS}
     ${this.hasAttribute('css') ? `@import "${this.getAttribute('css')}";` : ``}
     </style>
@@ -48,6 +55,7 @@ class iamMultiselect extends HTMLElement {
         const button = multiselect.shadowRoot.querySelector('#clear');
         let order = 0;
         const innerLabel = multiselect.shadowRoot.querySelector('label .inner-label');
+        const ajaxURL = this.getAttribute('data-url');
         innerLabel.innerHTML = multiselect.getAttribute('data-label');
         if (multiselect.hasAttribute('placeholder')) {
             search.setAttribute('placeholder', multiselect.getAttribute('placeholder'));
@@ -89,6 +97,9 @@ class iamMultiselect extends HTMLElement {
                 inputToSet.closest('label').setAttribute('slot', 'checked');
                 inputToSet.closest('label').setAttribute('style', `--order:${order};`);
                 inputToSet.closest('label').setAttribute('data-order', order);
+                if (inputToSet.closest('[data-value]')) {
+                    inputToSet.closest('[data-value]').setAttribute('data-value', inputToSet.closest('label').textContent);
+                }
             }
             // check for errors
             if (multiselect.querySelector('label[slot="checked"]')) {
@@ -109,7 +120,7 @@ class iamMultiselect extends HTMLElement {
             setItem(checkbox);
         });
         // Filter list
-        search.addEventListener('input', () => {
+        const filterList = () => {
             Array.from(multiselect.querySelectorAll(`label:not([slot="checked"])`)).forEach((label) => {
                 const checkbox = label.querySelector('input');
                 const searchValue = checkbox.value;
@@ -122,6 +133,16 @@ class iamMultiselect extends HTMLElement {
                     label.setAttribute('slot', 'notmatched');
                 }
             });
+        };
+        search.addEventListener('input', () => {
+            if (multiselect.hasAttribute('data-url')) {
+                if (search.value.length == 3) {
+                    searchAjax(search.value);
+                }
+            }
+            else {
+                filterList();
+            }
         });
         // Add a delayed hover effect for non hover devices
         let hoverTimeout;
@@ -142,24 +163,42 @@ class iamMultiselect extends HTMLElement {
                         setItem(checkbox);
                     });
                 }
+                if (multiselect.hasAttribute('data-url')) {
+                    Array.from(multiselect.querySelectorAll(`label:has(input[type="checkbox"]:not(:checked))`)).forEach((checkbox) => {
+                        checkbox.remove();
+                    });
+                }
             }, 200);
             clearTimeout(hoverTimeout);
             hoverTimeout = setTimeout(function () {
                 multiselect.classList.remove('hover');
-            }, 1000);
+            }, 500);
         });
         // Set items
         multiselect.addEventListener('change', (event) => {
             if (event && event.target instanceof HTMLElement && event.target.closest('input[type="checkbox"]')) {
                 const checkbox = event.target.closest('input[type="checkbox"]');
+                if (multiselect.hasAttribute('data-single')) {
+                    Array.from(multiselect.querySelectorAll(`label[slot="checked"] input`)).forEach((inputToCancel) => {
+                        inputToCancel.checked = false;
+                        inputToCancel.closest('label').removeAttribute('slot');
+                        inputToCancel.closest('label').removeAttribute('style');
+                        inputToCancel.closest('label').removeAttribute('data-order');
+                    });
+                }
                 setItem(checkbox);
                 search.value = '';
-                search.focus();
-                clearTimeout(hoverTimeout);
-                multiselect.classList.add('hover');
-                hoverTimeout = setTimeout(function () {
+                if (!multiselect.hasAttribute('data-single')) {
+                    search.focus();
+                    clearTimeout(hoverTimeout);
+                    multiselect.classList.add('hover');
+                    hoverTimeout = setTimeout(function () {
+                        multiselect.classList.remove('hover');
+                    }, 5000);
+                }
+                else {
                     multiselect.classList.remove('hover');
-                }, 5000);
+                }
             }
         });
         // Clear all
@@ -292,6 +331,44 @@ class iamMultiselect extends HTMLElement {
         multiselect.addEventListener('mouseup', () => {
             wrapper.removeAttribute('data-mousedown');
         });
+        const searchAjax = (searchterm) => __awaiter(this, void 0, void 0, function* () {
+            const searchAjaxURL = `${ajaxURL}${encodeURI(searchterm)}`;
+            // Setup controller vars if not already set
+            if (!window.controller)
+                window.controller = [];
+            // Abort if controller already present for this url
+            if (window.controller[searchAjaxURL])
+                window.controller[searchAjaxURL].abort();
+            // Create a new controller so it can be aborted if new fetch made
+            window.controller[searchAjaxURL] = new AbortController();
+            const { signal } = controller[searchAjaxURL];
+            try {
+                yield fetch(searchAjaxURL, {
+                    signal: signal,
+                    method: 'get',
+                    credentials: 'same-origin',
+                    headers: new Headers({
+                        'Content-Type': 'application/json',
+                        Accept: 'application/json',
+                        'X-Requested-With': 'XMLHttpRequest',
+                        'X-XSRF-TOKEN': Cookies.get('XSRF-TOKEN'),
+                    }),
+                })
+                    .then((response) => response.json())
+                    .then((response) => {
+                    let items = '';
+                    for (let i = 0; i < response['data'].length; i++) {
+                        items += `<label class="tag"><input type="checkbox" name="${multiselect.hasAttribute('data-name') ? multiselect.getAttribute('data-name') : 'tags'}" value="${response['data'][i].value}"/>${response['data'][i].title}</label>`;
+                    }
+                    multiselect.insertAdjacentHTML('beforeend', `${items}`);
+                    filterList();
+                    return response;
+                });
+            }
+            catch (error) {
+                console.log(error);
+            }
+        });
     }
 }
 export default iamMultiselect;