@iamproperty/components 7.2.2--beta3 → 7.4.0

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

@@ -0,0 +1,13 @@
+/*!
+  * iamKey v7.4.0
+  * 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>
+    @import "${n}";
+    </style>
+      <div class="milestone-group" part="milestone-group">
+        <slot>
+        </slot>
+      </div>
+    `,(s=this.shadowRoot)===null||s===void 0||s.appendChild(o.content.cloneNode(!0))}connectedCallback(){l(this,"iam-milestone-group",["hide-future-items","show-future-items"]),h(this)}}export{m as default};
+//# sourceMappingURL=milestone-group.component.min.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"milestone-group.component.min.js","sources":["../_global.js","../../modules/milestone-group.js","milestone-group.component.js"],"sourcesContent":["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","export const showFuture = function (milestoneGroupElement) {\n    const futureToggle = milestoneGroupElement.dataset.showAllToggle;\n    if (!futureToggle) {\n        return;\n    }\n    const toggleBtn = document.createElement('button');\n    toggleBtn.innerHTML = 'Show next steps';\n    toggleBtn.classList.add('btn', 'btn-tertiary', 'show-all-toggle');\n    milestoneGroupElement.appendChild(toggleBtn);\n    toggleBtn.addEventListener('click', () => {\n        if (milestoneGroupElement.classList.contains('show-all')) {\n            toggleBtn.innerHTML = 'Show next steps';\n            milestoneGroupElement.classList.remove('show-all');\n            toggleInteractionEvent('hide-future-items', milestoneGroupElement);\n        }\n        else {\n            toggleBtn.innerHTML = 'Hide next steps';\n            milestoneGroupElement.classList.add('show-all');\n            toggleInteractionEvent('show-future-items', milestoneGroupElement);\n        }\n    });\n};\nconst toggleInteractionEvent = function (eventName, element) {\n    const customEvent = new CustomEvent(eventName, {});\n    element.dispatchEvent(customEvent);\n};\nconst milestoneGroup = function (milestoneGroupElement) {\n    showFuture(milestoneGroupElement);\n};\nexport default milestoneGroup;\n","import { trackComponent, trackComponentRegistered } from '../_global.js';\nimport milestoneGroup from '../../modules/milestone-group.js';\ntrackComponentRegistered('iam-milestone-group');\nclass iamMilestoneGroup extends HTMLElement {\n    constructor() {\n        var _a;\n        super();\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 template = document.createElement('template');\n        template.innerHTML = `\r\n    <style>\r\n    @import \"${coreCSS}\";\r\n    </style>\r\n      <div class=\"milestone-group\" part=\"milestone-group\">\r\n        <slot>\r\n        </slot>\r\n      </div>\r\n    `;\n        (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        const milestoneGroupComponent = this;\n        trackComponent(milestoneGroupComponent, 'iam-milestone-group', [\n            'hide-future-items',\n            'show-future-items'\n        ]);\n        milestoneGroup(this);\n    }\n}\nexport default iamMilestoneGroup;\n"],"names":["trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","showFuture","milestoneGroupElement","toggleBtn","toggleInteractionEvent","element","customEvent","milestoneGroup","iamMilestoneGroup","_a","assetLocation","coreCSS","template"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAE,EACzC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,EACaC,EAAiB,CAACC,EAAWF,EAAeG,KAErD,OAAO,UAAY,OAAO,WAAa,CAAE,EACzC,OAAO,UAAU,KAAK,CAClB,MAAO,qBACP,QAASH,CACjB,CAAK,EACDG,EAAY,QAASC,GAAc,CAC/BF,EAAU,iBAAiBE,EAAW,SAAUC,EAAO,CACnD,MAAMC,EAAe,CACjB,MAAOF,EACP,QAASJ,EACT,OAAQK,EAAM,MACjB,EACD,OAAO,KAAKA,EAAM,MAAM,EAAE,QAASE,GAAa,CAC5C,MAAMC,EAAcH,EAAM,OAAOE,CAAQ,EACzCD,EAAaC,CAAQ,EAAIC,CACzC,CAAa,EACD,OAAO,UAAU,KAAKF,CAAY,CAC9C,CAAS,CACT,CAAK,EACM,IC7BEG,EAAa,SAAUC,EAAuB,CAEvD,GAAI,CADiBA,EAAsB,QAAQ,cAE/C,OAEJ,MAAMC,EAAY,SAAS,cAAc,QAAQ,EACjDA,EAAU,UAAY,kBACtBA,EAAU,UAAU,IAAI,MAAO,eAAgB,iBAAiB,EAChED,EAAsB,YAAYC,CAAS,EAC3CA,EAAU,iBAAiB,QAAS,IAAM,CAClCD,EAAsB,UAAU,SAAS,UAAU,GACnDC,EAAU,UAAY,kBACtBD,EAAsB,UAAU,OAAO,UAAU,EACjDE,EAAuB,oBAAqBF,CAAqB,IAGjEC,EAAU,UAAY,kBACtBD,EAAsB,UAAU,IAAI,UAAU,EAC9CE,EAAuB,oBAAqBF,CAAqB,EAE7E,CAAK,CACL,EACME,EAAyB,SAAUR,EAAWS,EAAS,CACzD,MAAMC,EAAc,IAAI,YAAYV,EAAW,CAAA,CAAE,EACjDS,EAAQ,cAAcC,CAAW,CACrC,EACMC,EAAiB,SAAUL,EAAuB,CACpDD,EAAWC,CAAqB,CACpC,EC1BAX,EAAyB,qBAAqB,EAC9C,MAAMiB,UAA0B,WAAY,CACxC,aAAc,CACV,IAAIC,EACJ,MAAO,EACP,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,oBAChBE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAObF,EAAK,KAAK,cAAgB,MAAQA,IAAO,QAAkBA,EAAG,YAAYG,EAAS,QAAQ,UAAU,EAAI,CAAC,CACnH,CACI,mBAAoB,CAEhBnB,EADgC,KACQ,sBAAuB,CAC3D,oBACA,mBACZ,CAAS,EACDc,EAAe,IAAI,CAC3B,CACA"}

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

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.2.2--beta3
+  * iamKey v7.4.0
   * 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

@@ -58,7 +58,6 @@ class iamMultiselect extends HTMLElement {
             const observer = new MutationObserver(function (mutations) {
                 mutations.forEach(function (mutationRecord) {
                     const targetElement = mutationRecord.target;
-                    console.log(targetElement);
                     if (targetElement.classList.contains('was-validated')) {
                         wrapper.classList.add('was-validated');
                     }
@@ -130,7 +129,20 @@ class iamMultiselect extends HTMLElement {
             multiselect.classList.add('hover');
             clearTimeout(hoverTimeout);
         });
-        search.addEventListener('blur', () => {
+        search.addEventListener('blur', (event) => {
+            setTimeout(function () {
+                const activeElement = document.activeElement;
+                if (activeElement.getAttribute('type') != 'checkbox') {
+                    if (multiselect.querySelector(`input[type="checkbox"][value="${search.value}" i]`)) {
+                        multiselect.querySelector(`input[type="checkbox"][value="${search.value}" i]`).checked = true;
+                        setItem(multiselect.querySelector(`input[type="checkbox"][value="${search.value}" i]`));
+                    }
+                    search.value = "";
+                    Array.from(multiselect.querySelectorAll(`label input[type="checkbox"]`)).forEach((checkbox) => {
+                        setItem(checkbox);
+                    });
+                }
+            }, 200);
             clearTimeout(hoverTimeout);
             hoverTimeout = setTimeout(function () {
                 multiselect.classList.remove('hover');
@@ -141,6 +153,7 @@ class iamMultiselect extends HTMLElement {
             if (event && event.target instanceof HTMLElement && event.target.closest('input[type="checkbox"]')) {
                 const checkbox = event.target.closest('input[type="checkbox"]');
                 setItem(checkbox);
+                search.value = "";
                 search.focus();
                 clearTimeout(hoverTimeout);
                 multiselect.classList.add('hover');
@@ -162,6 +175,38 @@ class iamMultiselect extends HTMLElement {
             const activeElement = document.activeElement;
             switch (event.key // change to event.key to key to use the above variable
             ) {
+                case 'ArrowLeft':
+                    // Up pressed
+                    event.preventDefault();
+                    if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {
+                        const arrCheckboxes = multiselect.querySelectorAll(`label[slot="checked"][slot="checked"]`);
+                        const activeIndex = Array.from(arrCheckboxes).indexOf(activeElement.closest('label'));
+                        const prevCheckbox = Array.from(arrCheckboxes)[activeIndex - 1];
+                        if (prevCheckbox)
+                            prevCheckbox.focus();
+                        else
+                            search.focus();
+                    }
+                    else if (activeElement == multiselect) {
+                        const options = Array.from(multiselect.querySelectorAll('label[slot="checked"]')).sort(function (a, b) {
+                            return +a.dataset.order - +b.dataset.order;
+                        });
+                        options.pop().focus();
+                    }
+                    break;
+                case 'ArrowRight':
+                    // Up pressed
+                    event.preventDefault();
+                    if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {
+                        const arrCheckboxes = multiselect.querySelectorAll(`label[slot="checked"][slot="checked"]`);
+                        const activeIndex = Array.from(arrCheckboxes).indexOf(activeElement.closest('label'));
+                        const nextCheckbox = Array.from(arrCheckboxes)[activeIndex + 1];
+                        if (nextCheckbox)
+                            nextCheckbox.focus();
+                        else
+                            search.focus();
+                    }
+                    break;
                 case 'ArrowUp':
                     // Up pressed
                     event.preventDefault();
@@ -200,6 +245,13 @@ class iamMultiselect extends HTMLElement {
                     setItem(activeElement);
                     search.focus();
                     break;
+                case 'Backspace':
+                    if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {
+                        activeElement.checked = false;
+                        setItem(activeElement);
+                        search.focus();
+                    }
+                    break;
             }
         });
         function checkLastTag() {

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

@@ -1,10 +1,10 @@
 /*!
-  * iamKey v7.2.2--beta3
+  * iamKey v7.4.0
   * Copyright 2022-2025 iamproperty
-  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"mutliselect"});class b extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",l=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,s=document.createElement("template");s.innerHTML=`
+  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"mutliselect"});class m extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const e=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",d=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${e}/css/core.min.css`,s=document.createElement("template");s.innerHTML=`
     <style>
-    @import "${l}";
-    .outer{position:relative;max-width:var(--input-max-width, 50rem);display:block}label{margin-bottom:0;padding-bottom:.5rem}.wrapper{margin-bottom:1.5rem;max-width:var(--input-max-width, 50rem)}.wrapper:after{content:"";display:block;position:absolute;top:100%;left:0;width:100%;height:1rem}.wrapper input{margin-bottom:0.5rem}.wrapper .feedback{position:absolute;right:0;bottom:100%;padding:.85rem;width:min-content;white-space:nowrap;margin-bottom:.5rem;display:none}.wrapper.was-validated .feedback{display:block}.wrapper.filled{display:flex;flex-direction:row;flex-wrap:wrap;align-items:flex-start;min-height:calc(2.75rem + 4px);padding:0.5rem 2rem 0rem 0.8125rem;font-size:var(--input-fs, 1rem);line-height:var(--input-lh, 1.25rem);color:var(--colour-body);background-color:var(--colour-canvas-2);border:2px solid var(--colour-primary);border-radius:0.5rem}.wrapper.filled:is(:focus-within,.focus-within):not(:disabled){border-color:var(--colour-info);outline:0;box-shadow:0 0 0 .1rem rgba(30,190,230,.25)}.wrapper.filled input{all:unset;font-size:1rem;line-height:1.625rem;display:inline-block;width:0;flex-grow:1;padding:0 0.5rem 0 0 !important;margin-inline:0.1875rem;order:999;margin-bottom:0.5rem}.wrapper.filled .feedback{display:none !important}.wrapper.filled:is(:focus,.focus):not(:disabled){border-color:var(--colour-info);outline:0;box-shadow:0 0 0 .1rem rgba(30,190,230,.25)}button{position:absolute;top:.75rem;right:.5rem;border:none;background:none;padding-inline:.5rem;display:var(--display-button, none)}button:after{content:"\u2715";font-weight:bold}.dropdown{position:absolute;top:calc(100% + .5rem);padding:0;left:0;width:100%;margin:0;z-index:99;display:none;max-height:15.25rem !important;overflow:auto}.dropdown:before{display:none}.wrapper:is(:focus-within) .dropdown{display:var(--display-panel, none)}@media(hover: hover){.wrapper .dropdown:hover{display:var(--display-panel, none)}}@media(hover: none){:host(.hover) .wrapper .dropdown{display:block}}:host-context(:focus-within) input{background-color:none !important}:host-context(iam-inline-edit){display:block;--display-btns: none}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]),:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover{background-color:var(--colour-light)}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]) input,:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover input{background-color:var(--colour-light)}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]) .dropdown,:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover .dropdown{display:none}:host-context(iam-inline-edit) .wrapper{margin-bottom:0}:host-context(iam-inline-edit) .wrapper:not(.filled):not(:focus-within):not([data-mousedown]) input{border:none;background:none;margin-left:-1rem;width:calc(100% + 1rem);max-width:calc(100% + 1rem);box-shadow:none}:host-context(iam-inline-edit) .wrapper:not(.filled):not(:focus-within):not([data-mousedown]) .dropdown{display:none}:host-context(iam-inline-edit) .wrapper.filled:not(:focus-within):not([data-mousedown]){background:none;border:none;padding-left:0}/*# sourceMappingURL=assets/css/components/multiselect.css.map */
+    @import "${d}";
+    .visually-hidden,.visually-hidden-focusable:not(:focus):not(:focus-within){position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.outer{position:relative;max-width:var(--input-max-width, 50rem);display:block}label{margin-bottom:0;padding-bottom:.5rem}.wrapper{margin-bottom:1.5rem;max-width:var(--input-max-width, 50rem)}.wrapper:after{content:"";display:block;position:absolute;top:100%;left:0;width:100%;height:1rem}.wrapper input{margin-bottom:0.5rem}.wrapper .feedback{position:absolute;right:0;bottom:100%;padding:.85rem;width:min-content;white-space:nowrap;margin-bottom:.5rem;display:none}.wrapper.was-validated .feedback{display:block}.wrapper.filled{display:flex;flex-direction:row;flex-wrap:wrap;align-items:flex-start;min-height:calc(2.75rem + 4px);padding:0.5rem 2rem 0rem 0.8125rem;font-size:var(--input-fs, 1rem);line-height:var(--input-lh, 1.25rem);color:var(--colour-body);background-color:var(--colour-canvas-2);border:2px solid var(--colour-primary);border-radius:0.5rem}.wrapper.filled:is(:focus-within,.focus-within):not(:disabled){border-color:var(--colour-info);outline:0;box-shadow:0 0 0 .1rem rgba(30,190,230,.25)}.wrapper.filled input{all:unset;font-size:1rem;line-height:1.625rem;display:inline-block;width:0;flex-grow:1;padding:0 0.5rem 0 0 !important;margin-inline:0.1875rem;order:999;margin-bottom:0.5rem}.wrapper.filled .feedback{display:none !important}.wrapper.filled:is(:focus,.focus):not(:disabled){border-color:var(--colour-info);outline:0;box-shadow:0 0 0 .1rem rgba(30,190,230,.25)}button{position:absolute;top:.75rem;right:.5rem;border:none;background:none;padding-inline:.5rem;display:var(--display-button, none)}button:after{content:"\u2715";font-weight:bold}.dropdown{position:absolute;top:calc(100% + .5rem);padding:0;left:0;width:100%;margin:0;z-index:99;display:none;max-height:15.25rem !important;overflow:auto}.dropdown:before{display:none}.wrapper:is(:focus-within) .dropdown{display:var(--display-panel, none)}@media(hover: hover){.wrapper .dropdown:hover{display:var(--display-panel, none)}}@media(hover: none){:host(.hover) .wrapper .dropdown{display:block}}:host-context(:focus-within) input{background-color:none !important}:host-context(iam-inline-edit){display:block;--display-btns: none}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]),:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover{background-color:var(--colour-light)}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]) input,:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover input{background-color:var(--colour-light)}:host-context(iam-inline-edit) label:hover+.outer:not(:focus-within) .wrapper:not([data-mousedown]) .dropdown,:host-context(iam-inline-edit) .outer:not(:focus-within) .wrapper:not([data-mousedown]):hover .dropdown{display:none}:host-context(iam-inline-edit) .wrapper{margin-bottom:0}:host-context(iam-inline-edit) .wrapper:not(.filled):not(:focus-within):not([data-mousedown]) input{border:none;background:none;margin-left:-1rem;width:calc(100% + 1rem);max-width:calc(100% + 1rem);box-shadow:none}:host-context(iam-inline-edit) .wrapper:not(.filled):not(:focus-within):not([data-mousedown]) .dropdown{display:none}:host-context(iam-inline-edit) .wrapper.filled:not(:focus-within):not([data-mousedown]){background:none;border:none;padding-left:0}/*# sourceMappingURL=assets/css/components/multiselect.css.map */
 
     ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
     </style>
@@ -22,5 +22,5 @@
     </div>
     </div>
     </label>
-    `,this.shadowRoot.appendChild(s.content.cloneNode(!0))}connectedCallback(){const t=this,l=this.closest("form"),s=this.shadowRoot.querySelector(".wrapper"),a=t.shadowRoot.querySelector("#search"),h=t.shadowRoot.querySelector("#clear");let i=0;const m=t.shadowRoot.querySelector("label .inner-label");if(m.innerHTML=t.getAttribute("data-label"),t.hasAttribute("placeholder")&&a.setAttribute("placeholder",t.getAttribute("placeholder")),t.setAttribute("data-error","true"),l&&t.hasAttribute("data-is-required")){const e=new MutationObserver(function(o){o.forEach(function(n){const r=n.target;console.log(r),r.classList.contains("was-validated")?s.classList.add("was-validated"):s.classList.remove("was-validated")})});l.classList.contains("was-validated")?s.classList.add("was-validated"):s.classList.remove("was-validated"),e.observe(l,{attributes:!0,attributeFilter:["style","class"]})}function c(e){e.checked==!1?(e.closest("label").removeAttribute("slot"),e.closest("label").removeAttribute("style"),e.closest("label").removeAttribute("data-order")):(i++,e.closest("label").setAttribute("slot","checked"),e.closest("label").setAttribute("style",`--order:${i};`),e.closest("label").setAttribute("data-order",i)),t.querySelector('label[slot="checked"]')?(s.classList.add("filled"),t.removeAttribute("data-error"),a.removeAttribute("placeholder")):(s.classList.remove("filled"),t.setAttribute("data-error","true"),t.hasAttribute("placeholder")&&a.setAttribute("placeholder",t.getAttribute("placeholder")))}Array.from(t.querySelectorAll('label input[type="checkbox"]:checked')).forEach(e=>{c(e)}),a.addEventListener("input",()=>{Array.from(t.querySelectorAll('label:not([slot="checked"])')).forEach(e=>{const n=e.querySelector("input").value,r=e.textContent;n.toLowerCase().includes(a.value.toLowerCase())||r.toLowerCase().includes(a.value.toLowerCase())?e.removeAttribute("slot"):e.setAttribute("slot","notmatched")})});let d;t.addEventListener("focus",()=>{t.classList.add("hover"),clearTimeout(d)}),a.addEventListener("blur",()=>{clearTimeout(d),d=setTimeout(function(){t.classList.remove("hover")},1e3)}),t.addEventListener("change",e=>{if(e&&e.target instanceof HTMLElement&&e.target.closest('input[type="checkbox"]')){const o=e.target.closest('input[type="checkbox"]');c(o),a.focus(),clearTimeout(d),t.classList.add("hover"),d=setTimeout(function(){t.classList.remove("hover")},5e3)}}),h.addEventListener("click",function(){Array.from(t.querySelectorAll('label input[type="checkbox"]')).forEach(e=>{e.checked=!1,c(e)}),a.focus()}),t.addEventListener("keydown",function(e){const o=document.activeElement;switch(e.key){case"ArrowUp":if(e.preventDefault(),o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"){const n=t.querySelectorAll('label:not([slot="checked"]):not([slot="checked"])'),r=Array.from(n).indexOf(o.closest("label")),p=Array.from(n)[r-1];p?p.focus():a.focus()}break;case"ArrowDown":if(e.preventDefault(),o==t)t.querySelector('label:not([slot="checked"]):not([slot="checked"])').focus();else if(o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"){const n=o.value,r=t.querySelector(`label:has(input[value="${n}"]) ~ label:not([slot="checked"]):not([slot="checked"])`);r&&r.focus()}break;case"Enter":e.stopPropagation(),e.preventDefault(),o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"&&(o.checked==!1?o.checked=!0:o.checked=!1),c(o),a.focus();break}});function u(){if(i==0)return!1;let e=t.querySelector(`label[data-order="${i}"]`);return e||(e=u(i--)),e}a.addEventListener("keydown",function(e){switch(e.key){case"Enter":t.querySelector(`input[value="${a.value}"]:not(:checked)`)||(a.value=""),a.focus();break;case"Backspace":if(!a.value){const n=u();if(n){const r=n.querySelector("input");r.checked=!1,c(r)}a.focus()}break}}),t.addEventListener("mousedown",()=>{s.setAttribute("data-mousedown","true")}),t.addEventListener("mouseup",()=>{s.removeAttribute("data-mousedown")})}}export{b as default};
+    `,this.shadowRoot.appendChild(s.content.cloneNode(!0))}connectedCallback(){const e=this,d=this.closest("form"),s=this.shadowRoot.querySelector(".wrapper"),r=e.shadowRoot.querySelector("#search"),h=e.shadowRoot.querySelector("#clear");let c=0;const b=e.shadowRoot.querySelector("label .inner-label");if(b.innerHTML=e.getAttribute("data-label"),e.hasAttribute("placeholder")&&r.setAttribute("placeholder",e.getAttribute("placeholder")),e.setAttribute("data-error","true"),d&&e.hasAttribute("data-is-required")){const t=new MutationObserver(function(o){o.forEach(function(a){a.target.classList.contains("was-validated")?s.classList.add("was-validated"):s.classList.remove("was-validated")})});d.classList.contains("was-validated")?s.classList.add("was-validated"):s.classList.remove("was-validated"),t.observe(d,{attributes:!0,attributeFilter:["style","class"]})}function l(t){t.checked==!1?(t.closest("label").removeAttribute("slot"),t.closest("label").removeAttribute("style"),t.closest("label").removeAttribute("data-order")):(c++,t.closest("label").setAttribute("slot","checked"),t.closest("label").setAttribute("style",`--order:${c};`),t.closest("label").setAttribute("data-order",c)),e.querySelector('label[slot="checked"]')?(s.classList.add("filled"),e.removeAttribute("data-error"),r.removeAttribute("placeholder")):(s.classList.remove("filled"),e.setAttribute("data-error","true"),e.hasAttribute("placeholder")&&r.setAttribute("placeholder",e.getAttribute("placeholder")))}Array.from(e.querySelectorAll('label input[type="checkbox"]:checked')).forEach(t=>{l(t)}),r.addEventListener("input",()=>{Array.from(e.querySelectorAll('label:not([slot="checked"])')).forEach(t=>{const a=t.querySelector("input").value,i=t.textContent;a.toLowerCase().includes(r.value.toLowerCase())||i.toLowerCase().includes(r.value.toLowerCase())?t.removeAttribute("slot"):t.setAttribute("slot","notmatched")})});let u;e.addEventListener("focus",()=>{e.classList.add("hover"),clearTimeout(u)}),r.addEventListener("blur",t=>{setTimeout(function(){document.activeElement.getAttribute("type")!="checkbox"&&(e.querySelector(`input[type="checkbox"][value="${r.value}" i]`)&&(e.querySelector(`input[type="checkbox"][value="${r.value}" i]`).checked=!0,l(e.querySelector(`input[type="checkbox"][value="${r.value}" i]`))),r.value="",Array.from(e.querySelectorAll('label input[type="checkbox"]')).forEach(a=>{l(a)}))},200),clearTimeout(u),u=setTimeout(function(){e.classList.remove("hover")},1e3)}),e.addEventListener("change",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest('input[type="checkbox"]')){const o=t.target.closest('input[type="checkbox"]');l(o),r.value="",r.focus(),clearTimeout(u),e.classList.add("hover"),u=setTimeout(function(){e.classList.remove("hover")},5e3)}}),h.addEventListener("click",function(){Array.from(e.querySelectorAll('label input[type="checkbox"]')).forEach(t=>{t.checked=!1,l(t)}),r.focus()}),e.addEventListener("keydown",function(t){const o=document.activeElement;switch(t.key){case"ArrowLeft":if(t.preventDefault(),o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"){const a=e.querySelectorAll('label[slot="checked"][slot="checked"]'),i=Array.from(a).indexOf(o.closest("label")),n=Array.from(a)[i-1];n?n.focus():r.focus()}else o==e&&Array.from(e.querySelectorAll('label[slot="checked"]')).sort(function(i,n){return+i.dataset.order-+n.dataset.order}).pop().focus();break;case"ArrowRight":if(t.preventDefault(),o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"){const a=e.querySelectorAll('label[slot="checked"][slot="checked"]'),i=Array.from(a).indexOf(o.closest("label")),n=Array.from(a)[i+1];n?n.focus():r.focus()}break;case"ArrowUp":if(t.preventDefault(),o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"){const a=e.querySelectorAll('label:not([slot="checked"]):not([slot="checked"])'),i=Array.from(a).indexOf(o.closest("label")),n=Array.from(a)[i-1];n?n.focus():r.focus()}break;case"ArrowDown":if(t.preventDefault(),o==e)e.querySelector('label:not([slot="checked"]):not([slot="checked"])').focus();else if(o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"){const a=o.value,i=e.querySelector(`label:has(input[value="${a}"]) ~ label:not([slot="checked"]):not([slot="checked"])`);i&&i.focus()}break;case"Enter":t.stopPropagation(),t.preventDefault(),o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"&&(o.checked==!1?o.checked=!0:o.checked=!1),l(o),r.focus();break;case"Backspace":o.hasAttribute("type")&&o.getAttribute("type")=="checkbox"&&(o.checked=!1,l(o),r.focus());break}});function p(){if(c==0)return!1;let t=e.querySelector(`label[data-order="${c}"]`);return t||(t=p(c--)),t}r.addEventListener("keydown",function(t){switch(t.key){case"Enter":e.querySelector(`input[value="${r.value}"]:not(:checked)`)||(r.value=""),r.focus();break;case"Backspace":if(!r.value){const a=p();if(a){const i=a.querySelector("input");i.checked=!1,l(i)}r.focus()}break}}),e.addEventListener("mousedown",()=>{s.setAttribute("data-mousedown","true")}),e.addEventListener("mouseup",()=>{s.removeAttribute("data-mousedown")})}}export{m as default};
 //# sourceMappingURL=multiselect.component.min.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"multiselect.component.min.js","sources":["multiselect.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'mutliselect',\n});\nclass iamMultiselect 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/multiselect.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    @import \"${coreCSS}\";\n    ${loadCSS}\n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n    </style>\n    <label for=\"search\" class=\"mb-0\"><span class=\"inner-label label\"></span> <slot name=\"feedback\"></slot>\n    <div class=\"outer\">\n    <div class=\"wrapper\">\n      \n      <slot name=\"checked\"></slot>\n      <input name=\"search\" id=\"search\" autocomplete=\"off\" required part=\"search-input\"/>\n      <span class=\"admin-panel feedback\">This field is required</span>\n      <div class=\"admin-panel dropdown\" part=\"dropdown\">\n        <slot></slot>\n      </div>\n      <button id=\"clear\"><span class=\"visually-hidden\">Clear</span></button>\n    </div>\n    </div>\n    </label>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const multiselect = this;\n        const form = this.closest('form');\n        const wrapper = this.shadowRoot.querySelector('.wrapper');\n        const search = multiselect.shadowRoot.querySelector('#search');\n        const button = multiselect.shadowRoot.querySelector('#clear');\n        let order = 0;\n        const innerLabel = multiselect.shadowRoot.querySelector('label .inner-label');\n        innerLabel.innerHTML = multiselect.getAttribute('data-label');\n        if (multiselect.hasAttribute('placeholder')) {\n            search.setAttribute('placeholder', multiselect.getAttribute('placeholder'));\n        }\n        multiselect.setAttribute('data-error', 'true');\n        // If in form and is required lets watch for the form being submitted\n        if (form && multiselect.hasAttribute('data-is-required')) {\n            const observer = new MutationObserver(function (mutations) {\n                mutations.forEach(function (mutationRecord) {\n                    const targetElement = mutationRecord.target;\n                    console.log(targetElement);\n                    if (targetElement.classList.contains('was-validated')) {\n                        wrapper.classList.add('was-validated');\n                    }\n                    else {\n                        wrapper.classList.remove('was-validated');\n                    }\n                });\n            });\n            if (form.classList.contains('was-validated')) {\n                wrapper.classList.add('was-validated');\n            }\n            else {\n                wrapper.classList.remove('was-validated');\n            }\n            observer.observe(form, {\n                attributes: true,\n                attributeFilter: ['style', 'class'],\n            });\n        }\n        // Set the correct attributes\n        function setItem(inputToSet) {\n            if (inputToSet.checked == false) {\n                inputToSet.closest('label').removeAttribute('slot');\n                inputToSet.closest('label').removeAttribute('style');\n                inputToSet.closest('label').removeAttribute('data-order');\n            }\n            else {\n                order++;\n                inputToSet.closest('label').setAttribute('slot', 'checked');\n                inputToSet.closest('label').setAttribute('style', `--order:${order};`);\n                inputToSet.closest('label').setAttribute('data-order', order);\n            }\n            // check for errors\n            if (multiselect.querySelector('label[slot=\"checked\"]')) {\n                wrapper.classList.add('filled');\n                multiselect.removeAttribute('data-error');\n                search.removeAttribute('placeholder');\n            }\n            else {\n                wrapper.classList.remove('filled');\n                multiselect.setAttribute('data-error', 'true');\n                if (multiselect.hasAttribute('placeholder')) {\n                    search.setAttribute('placeholder', multiselect.getAttribute('placeholder'));\n                }\n            }\n        }\n        // Set on load\n        Array.from(multiselect.querySelectorAll(`label input[type=\"checkbox\"]:checked`)).forEach((checkbox) => {\n            setItem(checkbox);\n        });\n        // Filter list\n        search.addEventListener('input', () => {\n            Array.from(multiselect.querySelectorAll(`label:not([slot=\"checked\"])`)).forEach((label) => {\n                const checkbox = label.querySelector('input');\n                const searchValue = checkbox.value;\n                const labelText = label.textContent;\n                if (searchValue.toLowerCase().includes(search.value.toLowerCase()) ||\n                    labelText.toLowerCase().includes(search.value.toLowerCase())) {\n                    label.removeAttribute('slot');\n                }\n                else {\n                    label.setAttribute('slot', 'notmatched');\n                }\n            });\n        });\n        // Add a delayed hover effect for non hover devices\n        let hoverTimeout;\n        multiselect.addEventListener('focus', () => {\n            multiselect.classList.add('hover');\n            clearTimeout(hoverTimeout);\n        });\n        search.addEventListener('blur', () => {\n            clearTimeout(hoverTimeout);\n            hoverTimeout = setTimeout(function () {\n                multiselect.classList.remove('hover');\n            }, 1000);\n        });\n        // Set items\n        multiselect.addEventListener('change', (event) => {\n            if (event && event.target instanceof HTMLElement && event.target.closest('input[type=\"checkbox\"]')) {\n                const checkbox = event.target.closest('input[type=\"checkbox\"]');\n                setItem(checkbox);\n                search.focus();\n                clearTimeout(hoverTimeout);\n                multiselect.classList.add('hover');\n                hoverTimeout = setTimeout(function () {\n                    multiselect.classList.remove('hover');\n                }, 5000);\n            }\n        });\n        // Clear all\n        button.addEventListener('click', function () {\n            Array.from(multiselect.querySelectorAll(`label input[type=\"checkbox\"]`)).forEach((checkbox) => {\n                checkbox.checked = false;\n                setItem(checkbox);\n            });\n            search.focus();\n        });\n        // Add some keyboard features to keep it accessible\n        multiselect.addEventListener('keydown', function (event) {\n            const activeElement = document.activeElement;\n            switch (event.key // change to event.key to key to use the above variable\n            ) {\n                case 'ArrowUp':\n                    // Up pressed\n                    event.preventDefault();\n                    if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {\n                        const arrCheckboxes = multiselect.querySelectorAll(`label:not([slot=\"checked\"]):not([slot=\"checked\"])`);\n                        const activeIndex = Array.from(arrCheckboxes).indexOf(activeElement.closest('label'));\n                        const prevCheckbox = Array.from(arrCheckboxes)[activeIndex - 1];\n                        if (prevCheckbox)\n                            prevCheckbox.focus();\n                        else\n                            search.focus();\n                    }\n                    break;\n                case 'ArrowDown':\n                    // Down pressed\n                    event.preventDefault();\n                    if (activeElement == multiselect) {\n                        multiselect.querySelector('label:not([slot=\"checked\"]):not([slot=\"checked\"])').focus();\n                    }\n                    else if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {\n                        const activeValue = activeElement.value;\n                        const nextCheckbox = multiselect.querySelector(`label:has(input[value=\"${activeValue}\"]) ~ label:not([slot=\"checked\"]):not([slot=\"checked\"])`);\n                        if (nextCheckbox)\n                            nextCheckbox.focus();\n                    }\n                    break;\n                case 'Enter':\n                    event.stopPropagation();\n                    event.preventDefault();\n                    if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {\n                        if (activeElement.checked == false)\n                            activeElement.checked = true;\n                        else\n                            activeElement.checked = false;\n                    }\n                    setItem(activeElement);\n                    search.focus();\n                    break;\n            }\n        });\n        function checkLastTag() {\n            if (order == 0)\n                return false;\n            let lastTag = multiselect.querySelector(`label[data-order=\"${order}\"]`);\n            if (!lastTag) {\n                lastTag = checkLastTag(order--);\n            }\n            return lastTag;\n        }\n        search.addEventListener('keydown', function (event) {\n            switch (event.key // change to event.key to key to use the above variable\n            ) {\n                case 'Enter':\n                    const match = multiselect.querySelector(`input[value=\"${search.value}\"]:not(:checked)`);\n                    if (!match)\n                        search.value = '';\n                    search.focus();\n                    break;\n                case 'Backspace':\n                    if (!search.value) {\n                        const lastTag = checkLastTag(order);\n                        if (lastTag) {\n                            const lastTagInput = lastTag.querySelector('input');\n                            lastTagInput.checked = false;\n                            setItem(lastTagInput);\n                        }\n                        search.focus();\n                    }\n                    break;\n            }\n        });\n        // Fix for the inline edit multiselect\n        multiselect.addEventListener('mousedown', () => {\n            wrapper.setAttribute('data-mousedown', 'true');\n        });\n        multiselect.addEventListener('mouseup', () => {\n            wrapper.removeAttribute('data-mousedown');\n        });\n    }\n}\nexport default iamMultiselect;\n"],"names":["iamMultiselect","assetLocation","coreCSS","template","multiselect","form","wrapper","search","button","order","innerLabel","observer","mutations","mutationRecord","targetElement","setItem","inputToSet","checkbox","label","searchValue","labelText","hoverTimeout","event","activeElement","arrCheckboxes","activeIndex","prevCheckbox","activeValue","nextCheckbox","checkLastTag","lastTag","lastTagInput"],"mappings":"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"}
+{"version":3,"file":"multiselect.component.min.js","sources":["multiselect.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'mutliselect',\n});\nclass iamMultiselect 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/multiselect.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    @import \"${coreCSS}\";\n    ${loadCSS}\n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n    </style>\n    <label for=\"search\" class=\"mb-0\"><span class=\"inner-label label\"></span> <slot name=\"feedback\"></slot>\n    <div class=\"outer\">\n    <div class=\"wrapper\">\n      \n      <slot name=\"checked\"></slot>\n      <input name=\"search\" id=\"search\" autocomplete=\"off\" required part=\"search-input\"/>\n      <span class=\"admin-panel feedback\">This field is required</span>\n      <div class=\"admin-panel dropdown\" part=\"dropdown\">\n        <slot></slot>\n      </div>\n      <button id=\"clear\"><span class=\"visually-hidden\">Clear</span></button>\n    </div>\n    </div>\n    </label>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const multiselect = this;\n        const form = this.closest('form');\n        const wrapper = this.shadowRoot.querySelector('.wrapper');\n        const search = multiselect.shadowRoot.querySelector('#search');\n        const button = multiselect.shadowRoot.querySelector('#clear');\n        let order = 0;\n        const innerLabel = multiselect.shadowRoot.querySelector('label .inner-label');\n        innerLabel.innerHTML = multiselect.getAttribute('data-label');\n        if (multiselect.hasAttribute('placeholder')) {\n            search.setAttribute('placeholder', multiselect.getAttribute('placeholder'));\n        }\n        multiselect.setAttribute('data-error', 'true');\n        // If in form and is required lets watch for the form being submitted\n        if (form && multiselect.hasAttribute('data-is-required')) {\n            const observer = new MutationObserver(function (mutations) {\n                mutations.forEach(function (mutationRecord) {\n                    const targetElement = mutationRecord.target;\n                    if (targetElement.classList.contains('was-validated')) {\n                        wrapper.classList.add('was-validated');\n                    }\n                    else {\n                        wrapper.classList.remove('was-validated');\n                    }\n                });\n            });\n            if (form.classList.contains('was-validated')) {\n                wrapper.classList.add('was-validated');\n            }\n            else {\n                wrapper.classList.remove('was-validated');\n            }\n            observer.observe(form, {\n                attributes: true,\n                attributeFilter: ['style', 'class'],\n            });\n        }\n        // Set the correct attributes\n        function setItem(inputToSet) {\n            if (inputToSet.checked == false) {\n                inputToSet.closest('label').removeAttribute('slot');\n                inputToSet.closest('label').removeAttribute('style');\n                inputToSet.closest('label').removeAttribute('data-order');\n            }\n            else {\n                order++;\n                inputToSet.closest('label').setAttribute('slot', 'checked');\n                inputToSet.closest('label').setAttribute('style', `--order:${order};`);\n                inputToSet.closest('label').setAttribute('data-order', order);\n            }\n            // check for errors\n            if (multiselect.querySelector('label[slot=\"checked\"]')) {\n                wrapper.classList.add('filled');\n                multiselect.removeAttribute('data-error');\n                search.removeAttribute('placeholder');\n            }\n            else {\n                wrapper.classList.remove('filled');\n                multiselect.setAttribute('data-error', 'true');\n                if (multiselect.hasAttribute('placeholder')) {\n                    search.setAttribute('placeholder', multiselect.getAttribute('placeholder'));\n                }\n            }\n        }\n        // Set on load\n        Array.from(multiselect.querySelectorAll(`label input[type=\"checkbox\"]:checked`)).forEach((checkbox) => {\n            setItem(checkbox);\n        });\n        // Filter list\n        search.addEventListener('input', () => {\n            Array.from(multiselect.querySelectorAll(`label:not([slot=\"checked\"])`)).forEach((label) => {\n                const checkbox = label.querySelector('input');\n                const searchValue = checkbox.value;\n                const labelText = label.textContent;\n                if (searchValue.toLowerCase().includes(search.value.toLowerCase()) ||\n                    labelText.toLowerCase().includes(search.value.toLowerCase())) {\n                    label.removeAttribute('slot');\n                }\n                else {\n                    label.setAttribute('slot', 'notmatched');\n                }\n            });\n        });\n        // Add a delayed hover effect for non hover devices\n        let hoverTimeout;\n        multiselect.addEventListener('focus', () => {\n            multiselect.classList.add('hover');\n            clearTimeout(hoverTimeout);\n        });\n        search.addEventListener('blur', (event) => {\n            setTimeout(function () {\n                const activeElement = document.activeElement;\n                if (activeElement.getAttribute('type') != 'checkbox') {\n                    if (multiselect.querySelector(`input[type=\"checkbox\"][value=\"${search.value}\" i]`)) {\n                        multiselect.querySelector(`input[type=\"checkbox\"][value=\"${search.value}\" i]`).checked = true;\n                        setItem(multiselect.querySelector(`input[type=\"checkbox\"][value=\"${search.value}\" i]`));\n                    }\n                    search.value = \"\";\n                    Array.from(multiselect.querySelectorAll(`label input[type=\"checkbox\"]`)).forEach((checkbox) => {\n                        setItem(checkbox);\n                    });\n                }\n            }, 200);\n            clearTimeout(hoverTimeout);\n            hoverTimeout = setTimeout(function () {\n                multiselect.classList.remove('hover');\n            }, 1000);\n        });\n        // Set items\n        multiselect.addEventListener('change', (event) => {\n            if (event && event.target instanceof HTMLElement && event.target.closest('input[type=\"checkbox\"]')) {\n                const checkbox = event.target.closest('input[type=\"checkbox\"]');\n                setItem(checkbox);\n                search.value = \"\";\n                search.focus();\n                clearTimeout(hoverTimeout);\n                multiselect.classList.add('hover');\n                hoverTimeout = setTimeout(function () {\n                    multiselect.classList.remove('hover');\n                }, 5000);\n            }\n        });\n        // Clear all\n        button.addEventListener('click', function () {\n            Array.from(multiselect.querySelectorAll(`label input[type=\"checkbox\"]`)).forEach((checkbox) => {\n                checkbox.checked = false;\n                setItem(checkbox);\n            });\n            search.focus();\n        });\n        // Add some keyboard features to keep it accessible\n        multiselect.addEventListener('keydown', function (event) {\n            const activeElement = document.activeElement;\n            switch (event.key // change to event.key to key to use the above variable\n            ) {\n                case 'ArrowLeft':\n                    // Up pressed\n                    event.preventDefault();\n                    if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {\n                        const arrCheckboxes = multiselect.querySelectorAll(`label[slot=\"checked\"][slot=\"checked\"]`);\n                        const activeIndex = Array.from(arrCheckboxes).indexOf(activeElement.closest('label'));\n                        const prevCheckbox = Array.from(arrCheckboxes)[activeIndex - 1];\n                        if (prevCheckbox)\n                            prevCheckbox.focus();\n                        else\n                            search.focus();\n                    }\n                    else if (activeElement == multiselect) {\n                        const options = Array.from(multiselect.querySelectorAll('label[slot=\"checked\"]')).sort(function (a, b) {\n                            return +a.dataset.order - +b.dataset.order;\n                        });\n                        options.pop().focus();\n                    }\n                    break;\n                case 'ArrowRight':\n                    // Up pressed\n                    event.preventDefault();\n                    if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {\n                        const arrCheckboxes = multiselect.querySelectorAll(`label[slot=\"checked\"][slot=\"checked\"]`);\n                        const activeIndex = Array.from(arrCheckboxes).indexOf(activeElement.closest('label'));\n                        const nextCheckbox = Array.from(arrCheckboxes)[activeIndex + 1];\n                        if (nextCheckbox)\n                            nextCheckbox.focus();\n                        else\n                            search.focus();\n                    }\n                    break;\n                case 'ArrowUp':\n                    // Up pressed\n                    event.preventDefault();\n                    if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {\n                        const arrCheckboxes = multiselect.querySelectorAll(`label:not([slot=\"checked\"]):not([slot=\"checked\"])`);\n                        const activeIndex = Array.from(arrCheckboxes).indexOf(activeElement.closest('label'));\n                        const prevCheckbox = Array.from(arrCheckboxes)[activeIndex - 1];\n                        if (prevCheckbox)\n                            prevCheckbox.focus();\n                        else\n                            search.focus();\n                    }\n                    break;\n                case 'ArrowDown':\n                    // Down pressed\n                    event.preventDefault();\n                    if (activeElement == multiselect) {\n                        multiselect.querySelector('label:not([slot=\"checked\"]):not([slot=\"checked\"])').focus();\n                    }\n                    else if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {\n                        const activeValue = activeElement.value;\n                        const nextCheckbox = multiselect.querySelector(`label:has(input[value=\"${activeValue}\"]) ~ label:not([slot=\"checked\"]):not([slot=\"checked\"])`);\n                        if (nextCheckbox)\n                            nextCheckbox.focus();\n                    }\n                    break;\n                case 'Enter':\n                    event.stopPropagation();\n                    event.preventDefault();\n                    if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {\n                        if (activeElement.checked == false)\n                            activeElement.checked = true;\n                        else\n                            activeElement.checked = false;\n                    }\n                    setItem(activeElement);\n                    search.focus();\n                    break;\n                case 'Backspace':\n                    if (activeElement.hasAttribute('type') && activeElement.getAttribute('type') == 'checkbox') {\n                        activeElement.checked = false;\n                        setItem(activeElement);\n                        search.focus();\n                    }\n                    break;\n            }\n        });\n        function checkLastTag() {\n            if (order == 0)\n                return false;\n            let lastTag = multiselect.querySelector(`label[data-order=\"${order}\"]`);\n            if (!lastTag) {\n                lastTag = checkLastTag(order--);\n            }\n            return lastTag;\n        }\n        search.addEventListener('keydown', function (event) {\n            switch (event.key // change to event.key to key to use the above variable\n            ) {\n                case 'Enter':\n                    const match = multiselect.querySelector(`input[value=\"${search.value}\"]:not(:checked)`);\n                    if (!match)\n                        search.value = '';\n                    search.focus();\n                    break;\n                case 'Backspace':\n                    if (!search.value) {\n                        const lastTag = checkLastTag(order);\n                        if (lastTag) {\n                            const lastTagInput = lastTag.querySelector('input');\n                            lastTagInput.checked = false;\n                            setItem(lastTagInput);\n                        }\n                        search.focus();\n                    }\n                    break;\n            }\n        });\n        // Fix for the inline edit multiselect\n        multiselect.addEventListener('mousedown', () => {\n            wrapper.setAttribute('data-mousedown', 'true');\n        });\n        multiselect.addEventListener('mouseup', () => {\n            wrapper.removeAttribute('data-mousedown');\n        });\n    }\n}\nexport default iamMultiselect;\n"],"names":["iamMultiselect","assetLocation","coreCSS","template","multiselect","form","wrapper","search","button","order","innerLabel","observer","mutations","mutationRecord","setItem","inputToSet","checkbox","label","searchValue","labelText","hoverTimeout","event","activeElement","arrCheckboxes","activeIndex","prevCheckbox","a","b","nextCheckbox","activeValue","checkLastTag","lastTag","lastTagInput"],"mappings":"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"}

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

@@ -292,6 +292,25 @@ class iamNav extends HTMLElement {
                 searchButton.removeAttribute('aria-expanded');
             });
         }
+        if (this.classList.contains('nav--sticky')) {
+            console.log('hey');
+            let oldScrollY = window.scrollY;
+            window.onscroll = function (e) {
+                if (oldScrollY < window.scrollY) {
+                    document.body.setAttribute('data-direction', "down");
+                }
+                else {
+                    document.body.setAttribute('data-direction', "up");
+                }
+                if (window.scrollY > 100) {
+                    document.body.classList.add('past100');
+                }
+                else {
+                    document.body.classList.remove('past100');
+                }
+                oldScrollY = window.scrollY;
+            };
+        }
     }
 }
 export default iamNav;