@iamproperty/components 7.7.1--beta6 → 7.7.1--beta8

package/assets/js/components/notification/notification.component.js

@@ -27,7 +27,7 @@ class iamNotification extends HTMLElement {
         };
         this.addDismissBtn = (component) => {
             var _a;
-            (_a = component.shadowRoot.querySelector('.notification__dismiss')) === null || _a === void 0 ? void 0 : _a.innerHTML = `<button data-dismiss-button part="dismiss-btn">Dismiss</button>`;
+            (_a = component.shadowRoot.querySelector('.notification__dismiss')) === null || _a === void 0 ? void 0 : _a.innerHTML = `<button data-dismiss-button part="dismiss-btn" class="btn btn-secondary btn-compact fa-xmark">Dismiss</button>`;
             component.shadowRoot.querySelector('.notification__dismiss [data-dismiss-button]').addEventListener('click', function () {
                 closeNotification(component);
                 const customEvent = new CustomEvent('dismiss', {
@@ -45,18 +45,19 @@ class iamNotification extends HTMLElement {
         const loadCSS = `@import "${assetLocation}/css/components/notification.css";`;
         const loadExtraCSS = `@import "${assetLocation}/css/components/notification.global.css";`;
         const template = document.createElement('template');
-        template.innerHTML = `
-    <style>
-    ${loadCSS}
-    ${this.hasAttribute('data-css') ? `${this.getAttribute('data-css')}` : ``}
-    </style>
-
-    <div class="notification">
-      <div class="notification__icon"><slot name="icon"></slot></div>
-      <div class="notification__inner"><div class="notification__text"><slot></slot></div><div class="notification__btns"><slot name="btns"></slot></div></div>
-      <div class="notification__dismiss"></div>
-    </div>
-    
+        template.innerHTML = `
+    <style>
+    ${loadCSS}
+    ${this.hasAttribute('data-css') ? `${this.getAttribute('data-css')}` : ``}
+    </style>
+
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
+    <div class="notification">
+      <div class="notification__icon"><slot name="icon"></slot></div>
+      <div class="notification__inner"><div class="notification__text"><slot></slot></div><div class="notification__btns"><slot name="btns"></slot></div></div>
+      <div class="notification__dismiss"></div>
+    </div>
+    
     `;
         this.shadowRoot.appendChild(template.content.cloneNode(true));
         // insert extra CSS

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

@@ -1,13 +1,14 @@
 /*!
-  * iamKey v7.7.1--beta6
+  * iamKey v7.7.1--beta8
   * Copyright 2022-2026 iamproperty
-  */function l(e){if(e.hasAttribute("data-type")&&e.getAttribute("data-type")=="toast"){let i=document.querySelector(".notification__holder");i||(i=document.createElement("div"),i.classList.add("notification__holder"),i.classList.add("container"),document.querySelector("body").appendChild(i)),e.closest(".notification__holder")||i.appendChild(e)}if(e.setAttribute("role","alert"),e.addEventListener("click",function(i){event&&event.target instanceof HTMLElement&&(event.target.closest("[data-dismiss-button]")||event.target.matches("[data-dismiss-button]"))&&(i.preventDefault(),d(e))},!1),e.hasAttribute("data-timeout")){const i=e.getAttribute("data-timeout"),t=new f(function(){d(e)},i);e.addEventListener("mouseenter",()=>{t.pause()}),e.addEventListener("mouseleave",()=>{t.resume()})}}function f(e,i){let t,o,a=i;this.pause=function(){window.clearTimeout(t),a-=new Date-o},this.resume=function(){o=new Date,window.clearTimeout(t),t=window.setTimeout(e,a)},this.resume()}const d=function(e){e.classList.add("d-none")},m=e=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:e})},u=(e,i,t)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:i}),t.forEach(o=>{e.addEventListener(o,function(a){const n={event:o,element:i,target:a.target};Object.keys(a.detail).forEach(s=>{const r=a.detail[s];n[s]=r}),window.dataLayer.push(n)})}),!0);m("iam-notification");class h extends HTMLElement{constructor(){super(),this.addColour=(t,o)=>{t.hasAttribute("data-type")?t.classList.add(`bg-${o}`):t.classList.add(`colour-${o}`)},this.addIcon=(t,o)=>{switch(o){case"danger":t.insertAdjacentHTML("beforeend",'<i class="fa-solid fa-circle-exclamation" aria-hidden="true" slot="icon"></i>');break;case"warning":t.insertAdjacentHTML("beforeend",'<i class="fa-solid fa-triangle-exclamation" aria-hidden="true" slot="icon"></i>');break;case"success":t.insertAdjacentHTML("beforeend",'<i class="fa-solid fa-check-circle" aria-hidden="true" slot="icon"></i>');break;default:t.insertAdjacentHTML("beforeend",'<i class="fa-solid fa-circle-info" aria-hidden="true" slot="icon"></i>')}},this.addDismissBtn=t=>{var o;(o=t.shadowRoot.querySelector(".notification__dismiss"))===null||o===void 0||(o.innerHTML='<button data-dismiss-button part="dismiss-btn">Dismiss</button>'),t.shadowRoot.querySelector(".notification__dismiss [data-dismiss-button]").addEventListener("click",function(){d(t);const a=new CustomEvent("dismiss",{detail:{class:t.classList}});t.dispatchEvent(a)},!1)},this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const i=document.createElement("template");i.innerHTML=`
+  */function l(e){if(e.hasAttribute("data-type")&&e.getAttribute("data-type")=="toast"){let i=document.querySelector(".notification__holder");i||(i=document.createElement("div"),i.classList.add("notification__holder"),i.classList.add("container"),document.querySelector("body").appendChild(i)),e.closest(".notification__holder")||i.appendChild(e)}if(e.setAttribute("role","alert"),e.addEventListener("click",function(i){event&&event.target instanceof HTMLElement&&(event.target.closest("[data-dismiss-button]")||event.target.matches("[data-dismiss-button]"))&&(i.preventDefault(),c(e))},!1),e.hasAttribute("data-timeout")){const i=e.getAttribute("data-timeout"),t=new m(function(){c(e)},i);e.addEventListener("mouseenter",()=>{t.pause()}),e.addEventListener("mouseleave",()=>{t.resume()})}}function m(e,i){let t,o,n=i;this.pause=function(){window.clearTimeout(t),n-=new Date-o},this.resume=function(){o=new Date,window.clearTimeout(t),t=window.setTimeout(e,n)},this.resume()}const c=function(e){e.classList.add("d-none")},f=e=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:e})},b=(e,i,t)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:i}),t.forEach(o=>{e.addEventListener(o,function(n){const a={event:o,element:i,target:n.target};Object.keys(n.detail).forEach(r=>{const s=n.detail[r];a[r]=s}),window.dataLayer.push(a)})}),!0);f("iam-notification");class h extends HTMLElement{constructor(){super(),this.addColour=(t,o)=>{t.hasAttribute("data-type")?t.classList.add(`bg-${o}`):t.classList.add(`colour-${o}`)},this.addIcon=(t,o)=>{switch(o){case"danger":t.insertAdjacentHTML("beforeend",'<i class="fa-solid fa-circle-exclamation" aria-hidden="true" slot="icon"></i>');break;case"warning":t.insertAdjacentHTML("beforeend",'<i class="fa-solid fa-triangle-exclamation" aria-hidden="true" slot="icon"></i>');break;case"success":t.insertAdjacentHTML("beforeend",'<i class="fa-solid fa-check-circle" aria-hidden="true" slot="icon"></i>');break;default:t.insertAdjacentHTML("beforeend",'<i class="fa-solid fa-circle-info" aria-hidden="true" slot="icon"></i>')}},this.addDismissBtn=t=>{var o;(o=t.shadowRoot.querySelector(".notification__dismiss"))===null||o===void 0||(o.innerHTML='<button data-dismiss-button part="dismiss-btn" class="btn btn-secondary btn-compact fa-xmark">Dismiss</button>'),t.shadowRoot.querySelector(".notification__dismiss [data-dismiss-button]").addEventListener("click",function(){c(t);const n=new CustomEvent("dismiss",{detail:{class:t.classList}});t.dispatchEvent(n)},!1)},this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const i=document.createElement("template");i.innerHTML=`
     <style>
-    :host,.iam-notification{display:block;padding:1.375rem 1.5rem 1.375rem 1rem;border-radius:.5rem;box-shadow:2px 6px 12px rgba(0,0,0,.2);margin-bottom:1rem;font-size:.9375rem;border:2px solid var(--colour, var(--colour-info));outline:var(--contrast-outline-width, 0px) solid var(--colour-primary);background:var(--colour-notification-bg)}:host ::slotted(i),:host i,.iam-notification ::slotted(i),.iam-notification i{color:var(--colour, currentColor)}:host(:not(.bg-danger)){color-scheme:light;color:var(--colour-heading)}:host([data-type]),.iam-notification[data-type]{border:2px solid rgba(0,0,0,0)}:host([class*=colour-]){--bg-colour: color-mix(in oklab, var(--colour), #ffffff 80%) !important;background:var(--bg-colour);--colour-heading: var(--colour-primary-theme);--colour-body: var(--colour-primary-theme)}:host([class*=colour-])>*{color-scheme:light}:host(.bg-white),.iam-notification.bg-white{border:none;border-left:.5rem solid var(--colour-info)}:host(.bg-white) ::slotted(i),:host(.bg-white) i,.iam-notification.bg-white ::slotted(i),.iam-notification.bg-white i{color:var(--colour-info)}:host(.bg-danger) .notification{color:var(--colour-white)}:host([data-type=alert]),.iam-notification[data-type=alert]{border-radius:0;position:fixed;top:var(--nav-height);left:0;right:0;z-index:calc(var(--index-menu) - 1);margin-bottom:0}:host([data-type=toast]),.iam-notification[data-type=toast]{margin:auto;display:block;width:100%;max-width:22.5rem}:host([data-type=toast].notification--dismissable){max-width:28.375rem}.notification{container-type:inline-size;display:flex;flex-wrap:nowrap;color:var(--colour-heading)}.notification .notification__icon{margin-inline-end:1rem;flex-grow:0}.notification .notification__icon ::slotted(i){font-size:1.125rem}.notification .notification__inner{display:flex;flex-wrap:wrap;flex-grow:1}@container (width > 23.4375em){.notification .notification__inner{flex-wrap:nowrap}}.notification .notification__text{flex-grow:1;flex-shrink:1;width:100%}.notification .notification__btns.empty{display:none}.notification .notification__btns{flex-grow:0;flex-shrink:0;--colour-underline: currentColor}.notification .notification__btns ::slotted(a),.notification .notification__btns ::slotted(button),.notification .notification__btns>*{margin:1rem 1rem 0 0 !important}@container (width > 23.4375em){.notification .notification__btns{display:flex;align-items:center;border-left:1px solid currentColor;margin-left:2rem}.notification .notification__btns ::slotted(a),.notification .notification__btns ::slotted(button),.notification .notification__btns>*{margin:0 0 0 2rem !important}}.notification .notification__dismiss:empty{display:none}.notification .notification__dismiss{flex-grow:0;padding-left:1rem}.notification .notification__dismiss button{text-indent:300%;overflow:hidden;border:none;height:1.125rem;width:1.125rem;background:rgba(0,0,0,0);display:inline-block;position:relative;color:inherit}.notification .notification__dismiss button:after{content:"";top:0;left:0;position:absolute;display:block;height:1.125rem;width:1.125rem;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-close);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-close);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%}@container (width > 23.4375em){.notification .notification__dismiss{padding-left:2rem;display:flex;align-items:center}}:host(.notification--no-icon) .notification__icon{display:none}:host(.notification--no-bg){box-shadow:none;background:none !important;padding:0;border:0 !important}/*# sourceMappingURL=assets/css/components/notification.css.map */
+    @layer elements{button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit],[role=button]){-webkit-appearance:button;&:not(:disabled){cursor:pointer}}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap;&:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}&:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}&:not(:last-child){margin-right:var(--btn-margin)}}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.btn-complete{--colour: var(--colour-success);--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn-complete,.btn.btn-complete:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem;&:before{content:"\uF00C";font-family:"Font Awesome 7 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn{&[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 7 Pro"}&[class*=fa-after]{padding-right:4rem}&[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}&:not(.btn-compact):before{margin-right:1rem}i[class*=fa-]{--fa-width: 1em;font-family:"Font Awesome 7 Pro";margin-right:1rem;line-height:1em;font-style:inherit;&:not(:first-child){margin-left:1rem;margin-right:0}}}.btn.btn--prompt{&:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active){&:after{margin-left:1.5rem;margin-right:-0.5rem}}.btn-filter{&:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 7 Pro"}}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem);@container style(--theme: dark){color:white}}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}:host,.iam-notification{display:block;padding:1.375rem 1.5rem 1.375rem 1rem;border-radius:.5rem;box-shadow:2px 6px 12px rgba(0,0,0,.2);margin-bottom:1rem;font-size:.9375rem;border:2px solid var(--colour, var(--colour-info));outline:var(--contrast-outline-width, 0px) solid var(--colour-primary);background:var(--colour-notification-bg)}:host ::slotted(i),:host i,.iam-notification ::slotted(i),.iam-notification i{color:var(--colour, currentColor)}:host(:not(.bg-danger)){color-scheme:light;color:var(--colour-heading)}:host([data-type]),.iam-notification[data-type]{border:2px solid rgba(0,0,0,0)}:host([class*=colour-]){--bg-colour: color-mix(in oklab, var(--colour), #ffffff 80%) !important;background:var(--bg-colour);--colour-heading: var(--colour-primary-theme);--colour-body: var(--colour-primary-theme)}:host([class*=colour-])>*{color-scheme:light}:host(.bg-white),.iam-notification.bg-white{border:none;border-left:.5rem solid var(--colour-info)}:host(.bg-white) ::slotted(i),:host(.bg-white) i,.iam-notification.bg-white ::slotted(i),.iam-notification.bg-white i{color:var(--colour-info)}:host(.bg-danger) .notification{color:var(--colour-white)}:host([data-type=alert]),.iam-notification[data-type=alert]{border-radius:0;position:fixed;top:var(--nav-height);left:0;right:0;z-index:calc(var(--index-menu) - 1);margin-bottom:0}:host([data-type=toast]),.iam-notification[data-type=toast]{margin:auto;display:block;width:100%;max-width:22.5rem}:host([data-type=toast].notification--dismissable){max-width:28.375rem}.notification{container-type:inline-size;display:flex;flex-wrap:nowrap;color:var(--colour-heading)}.notification .notification__icon{margin-inline-end:1rem;flex-grow:0}.notification .notification__icon ::slotted(i){font-size:1.125rem}.notification .notification__inner{display:flex;flex-wrap:wrap;flex-grow:1}@container (width > 23.4375em){.notification .notification__inner{flex-wrap:nowrap}}.notification .notification__text{flex-grow:1;flex-shrink:1;width:100%}.notification .notification__btns.empty{display:none}.notification .notification__btns{flex-grow:0;flex-shrink:0;--colour-underline: currentColor}.notification .notification__btns ::slotted(a),.notification .notification__btns ::slotted(button),.notification .notification__btns>*{margin:1rem 1rem 0 0 !important}@container (width > 23.4375em){.notification .notification__btns{display:flex;align-items:center;border-left:1px solid currentColor;margin-left:2rem}.notification .notification__btns ::slotted(a),.notification .notification__btns ::slotted(button),.notification .notification__btns>*{margin:0 0 0 2rem !important}}.notification .notification__dismiss:empty{display:none}.notification .notification__dismiss{flex-grow:0;padding-left:1rem}.notification .notification__dismiss button{display:inline-block;position:relative;margin:0;color:currentColor}.notification .notification__dismiss button:hover{color:var(--colour-primary-theme)}.notification .notification__dismiss button:before{font-weight:lighter;font-size:1.5rem}@container (width > 23.4375em){.notification .notification__dismiss{padding-left:2rem;display:flex;align-items:center}}:host(.notification--no-icon) .notification__icon{display:none}:host(.notification--no-bg){box-shadow:none;background:none !important;padding:0;border:0 !important}/*# sourceMappingURL=assets/css/components/notification.css.map */
 
     ${this.hasAttribute("data-css")?`${this.getAttribute("data-css")}`:""}
     </style>
 
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
     <div class="notification">
       <div class="notification__icon"><slot name="icon"></slot></div>
       <div class="notification__inner"><div class="notification__text"><slot></slot></div><div class="notification__btns"><slot name="btns"></slot></div></div>
@@ -15,5 +16,5 @@
     </div>
     
     `,this.shadowRoot.appendChild(i.content.cloneNode(!0)),document.getElementById("notificationHolder")||document.head.insertAdjacentHTML("beforeend",`<style id="notificationHolder">.container.notification__holder{position:fixed;top:var(--nav-height);left:50%;transform:translate(-50%, 0);bottom:0;z-index:999999;pointer-events:none;padding-top:1rem;padding-bottom:1rem;display:flex;margin:0;width:100%;flex-wrap:wrap;align-content:flex-start;flex-direction:column;align-content:flex-end;align-items:flex-end}.container.notification__holder :is(.iam-notification,iam-notification){pointer-events:all;margin:.5rem 0 .5rem 0}.container.notification__holder.bottom{flex-direction:column-reverse}.container.notification__holder.left{align-content:flex-start;align-items:flex-start}.container.notification__holder.middle{align-content:space-around;align-items:center}/*# sourceMappingURL=assets/css/components/notification.global.css.map */
-</style>`)}connectedCallback(){var i,t,o,a;const n=this.hasAttribute("data-type")?"white":"info",s=this.hasAttribute("data-status")?this.getAttribute("data-status"):n;this.addColour(this,s),this.querySelector("i")||this.addIcon(this,s);const r=this.querySelectorAll("a,button");Array.from(r).forEach(c=>{c.setAttribute("slot","btns"),c.classList.add("link")}),(r.length||this.hasAttribute("data-dismiss"))&&this.classList.add("notification--dismissable"),r.length?(a=(o=this.shadowRoot)===null||o===void 0?void 0:o.querySelector(".notification__btns"))===null||a===void 0||a.classList.remove("empty"):(t=(i=this.shadowRoot)===null||i===void 0?void 0:i.querySelector(".notification__btns"))===null||t===void 0||t.classList.add("empty"),this.hasAttribute("data-dismiss")&&this.addDismissBtn(this),l(this),u(this,"iam-notification",["dismiss"])}static get observedAttributes(){return["data-status","data-dismiss"]}attributeChangedCallback(i,t,o){var a,n;switch(i){case"data-status":{t!=o&&(this.classList.remove("bg-danger"),this.classList.remove("bg-warning"),this.classList.remove("bg-success"),this.classList.remove("bg-white"),(a=this.querySelector("i"))===null||a===void 0||a.remove(),this.addColour(this,o),this.addIcon(this,o));break}case"data-dismiss":{t!=o&&(this.hasAttribute("data-dismiss")?this.addDismissBtn(this):(n=this.shadowRoot.querySelector(".notification__dismiss"))===null||n===void 0||(n.innerHTML=""));break}}}}export{h as default};
+</style>`)}connectedCallback(){var i,t,o,n;const a=this.hasAttribute("data-type")?"white":"info",r=this.hasAttribute("data-status")?this.getAttribute("data-status"):a;this.addColour(this,r),this.querySelector("i")||this.addIcon(this,r);const s=this.querySelectorAll("a,button");Array.from(s).forEach(d=>{d.setAttribute("slot","btns"),d.classList.add("link")}),(s.length||this.hasAttribute("data-dismiss"))&&this.classList.add("notification--dismissable"),s.length?(n=(o=this.shadowRoot)===null||o===void 0?void 0:o.querySelector(".notification__btns"))===null||n===void 0||n.classList.remove("empty"):(t=(i=this.shadowRoot)===null||i===void 0?void 0:i.querySelector(".notification__btns"))===null||t===void 0||t.classList.add("empty"),this.hasAttribute("data-dismiss")&&this.addDismissBtn(this),l(this),b(this,"iam-notification",["dismiss"])}static get observedAttributes(){return["data-status","data-dismiss"]}attributeChangedCallback(i,t,o){var n,a;switch(i){case"data-status":{t!=o&&(this.classList.remove("bg-danger"),this.classList.remove("bg-warning"),this.classList.remove("bg-success"),this.classList.remove("bg-white"),(n=this.querySelector("i"))===null||n===void 0||n.remove(),this.addColour(this,o),this.addIcon(this,o));break}case"data-dismiss":{t!=o&&(this.hasAttribute("data-dismiss")?this.addDismissBtn(this):(a=this.shadowRoot.querySelector(".notification__dismiss"))===null||a===void 0||(a.innerHTML=""));break}}}}export{h as default};
 //# sourceMappingURL=notification.component.min.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"notification.component.min.js","sources":["../../modules/notification.js","../_global.js","notification.component.js"],"sourcesContent":["function setupNotification(element) {\n    // Add toast to notification holder\n    if (element.hasAttribute('data-type') && element.getAttribute('data-type') == 'toast') {\n        let holder = document.querySelector('.notification__holder');\n        if (!holder) {\n            holder = document.createElement('div');\n            holder.classList.add('notification__holder');\n            holder.classList.add('container');\n            document.querySelector('body').appendChild(holder);\n        }\n        if (!element.closest('.notification__holder'))\n            holder.appendChild(element);\n    }\n    element.setAttribute('role', 'alert');\n    // Create a dissmissable button\n    element.addEventListener('click', function (e) {\n        if (event &&\n            event.target instanceof HTMLElement &&\n            (event.target.closest('[data-dismiss-button]') || event.target.matches('[data-dismiss-button]'))) {\n            e.preventDefault();\n            closeNotification(element);\n        }\n    }, false);\n    // Self disappearing alert\n    if (element.hasAttribute('data-timeout')) {\n        const timeOut = element.getAttribute('data-timeout');\n        const timer = new Timer(function () {\n            closeNotification(element);\n        }, timeOut);\n        element.addEventListener('mouseenter', () => {\n            timer.pause();\n        });\n        element.addEventListener('mouseleave', () => {\n            timer.resume();\n        });\n    }\n}\nfunction Timer(callback, delay) {\n    let timerId, start, remaining = delay;\n    this.pause = function () {\n        window.clearTimeout(timerId);\n        remaining -= new Date() - start;\n    };\n    this.resume = function () {\n        start = new Date();\n        window.clearTimeout(timerId);\n        timerId = window.setTimeout(callback, remaining);\n    };\n    this.resume();\n}\nexport const closeNotification = function (element) {\n    element.classList.add('d-none');\n};\nexport default setupNotification;\n","export const trackComponentRegistered = (componentName) => {\n    // Data layer Web component created\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'customElementRegistered',\n        element: componentName,\n    });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n    // Data layer Web component created\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'customElementAdded',\n        element: componentName,\n    });\n    trackEvents.forEach((eventName) => {\n        component.addEventListener(eventName, function (event) {\n            const eventDetails = {\n                event: eventName,\n                element: componentName,\n                target: event.target,\n            };\n            Object.keys(event.detail).forEach((eventKey) => {\n                const eventDetail = event.detail[eventKey];\n                eventDetails[eventKey] = eventDetail;\n            });\n            window.dataLayer.push(eventDetails);\n        });\n    });\n    return true;\n};\n","import setupNotification, { closeNotification } from '../../modules/notification';\nimport { trackComponent, trackComponentRegistered } from '../_global';\ntrackComponentRegistered('iam-notification');\nclass iamNotification extends HTMLElement {\n    constructor() {\n        super();\n        this.addColour = (component, status) => {\n            if (component.hasAttribute('data-type'))\n                component.classList.add(`bg-${status}`);\n            else\n                component.classList.add(`colour-${status}`);\n        };\n        this.addIcon = (component, status) => {\n            switch (status) {\n                case 'danger':\n                    component.insertAdjacentHTML('beforeend', '<i class=\"fa-solid fa-circle-exclamation\" aria-hidden=\"true\" slot=\"icon\"></i>');\n                    break;\n                case 'warning':\n                    component.insertAdjacentHTML('beforeend', '<i class=\"fa-solid fa-triangle-exclamation\" aria-hidden=\"true\" slot=\"icon\"></i>');\n                    break;\n                case 'success':\n                    component.insertAdjacentHTML('beforeend', '<i class=\"fa-solid fa-check-circle\" aria-hidden=\"true\" slot=\"icon\"></i>');\n                    break;\n                default:\n                    component.insertAdjacentHTML('beforeend', '<i class=\"fa-solid fa-circle-info\" aria-hidden=\"true\" slot=\"icon\"></i>');\n            }\n        };\n        this.addDismissBtn = (component) => {\n            var _a;\n            (_a = component.shadowRoot.querySelector('.notification__dismiss')) === null || _a === void 0 ? void 0 : _a.innerHTML = `<button data-dismiss-button part=\"dismiss-btn\">Dismiss</button>`;\n            component.shadowRoot.querySelector('.notification__dismiss [data-dismiss-button]').addEventListener('click', function () {\n                closeNotification(component);\n                const customEvent = new CustomEvent('dismiss', {\n                    detail: {\n                        class: component.classList,\n                    },\n                });\n                component.dispatchEvent(customEvent);\n            }, false);\n        };\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/notification.css\";`;\n        const loadExtraCSS = `@import \"${assetLocation}/css/components/notification.global.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\r\n    <style>\r\n    ${loadCSS}\r\n    ${this.hasAttribute('data-css') ? `${this.getAttribute('data-css')}` : ``}\r\n    </style>\r\n\r\n    <div class=\"notification\">\r\n      <div class=\"notification__icon\"><slot name=\"icon\"></slot></div>\r\n      <div class=\"notification__inner\"><div class=\"notification__text\"><slot></slot></div><div class=\"notification__btns\"><slot name=\"btns\"></slot></div></div>\r\n      <div class=\"notification__dismiss\"></div>\r\n    </div>\r\n    \r\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n        // insert extra CSS\n        if (!document.getElementById('notificationHolder'))\n            document.head.insertAdjacentHTML('beforeend', `<style id=\"notificationHolder\">${loadExtraCSS}</style>`);\n    }\n    connectedCallback() {\n        var _a, _b, _c, _d;\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const wrapper = this;\n        const defaultStatusBG = this.hasAttribute('data-type') ? 'white' : 'info';\n        const statusBG = this.hasAttribute('data-status') ? this.getAttribute('data-status') : defaultStatusBG;\n        this.addColour(this, statusBG);\n        if (!this.querySelector('i')) {\n            this.addIcon(this, statusBG);\n        }\n        const buttons = this.querySelectorAll('a,button');\n        Array.from(buttons).forEach((button) => {\n            button.setAttribute('slot', 'btns');\n            button.classList.add('link');\n        });\n        if (buttons.length || this.hasAttribute('data-dismiss')) {\n            this.classList.add('notification--dismissable');\n        }\n        if (!buttons.length) {\n            (_b = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.notification__btns')) === null || _b === void 0 ? void 0 : _b.classList.add('empty');\n        }\n        else {\n            (_d = (_c = this.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('.notification__btns')) === null || _d === void 0 ? void 0 : _d.classList.remove('empty');\n        }\n        if (this.hasAttribute('data-dismiss')) {\n            this.addDismissBtn(this);\n        }\n        setupNotification(this);\n        trackComponent(this, 'iam-notification', ['dismiss']);\n    }\n    static get observedAttributes() {\n        return ['data-status', 'data-dismiss'];\n    }\n    attributeChangedCallback(attrName, oldVal, newVal) {\n        var _a, _b;\n        switch (attrName) {\n            case 'data-status': {\n                if (oldVal != newVal) {\n                    this.classList.remove('bg-danger');\n                    this.classList.remove('bg-warning');\n                    this.classList.remove('bg-success');\n                    this.classList.remove('bg-white');\n                    (_a = this.querySelector('i')) === null || _a === void 0 ? void 0 : _a.remove();\n                    this.addColour(this, newVal);\n                    this.addIcon(this, newVal);\n                }\n                break;\n            }\n            case 'data-dismiss': {\n                if (oldVal != newVal) {\n                    if (this.hasAttribute('data-dismiss')) {\n                        this.addDismissBtn(this);\n                    }\n                    else {\n                        (_b = this.shadowRoot.querySelector('.notification__dismiss')) === null || _b === void 0 ? void 0 : _b.innerHTML = '';\n                    }\n                }\n                break;\n            }\n        }\n    }\n}\nexport default iamNotification;\n"],"names":["setupNotification","element","holder","e","closeNotification","timeOut","timer","Timer","callback","delay","timerId","start","remaining","trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","iamNotification","status","_a","customEvent","template","_b","_c","_d","defaultStatusBG","statusBG","buttons","button","attrName","oldVal","newVal"],"mappings":";;;IAAA,SAASA,EAAkBC,EAAS,CAEhC,GAAIA,EAAQ,aAAa,WAAW,GAAKA,EAAQ,aAAa,WAAW,GAAK,QAAS,CACnF,IAAIC,EAAS,SAAS,cAAc,uBAAuB,EACtDA,IACDA,EAAS,SAAS,cAAc,KAAK,EACrCA,EAAO,UAAU,IAAI,sBAAsB,EAC3CA,EAAO,UAAU,IAAI,WAAW,EAChC,SAAS,cAAc,MAAM,EAAE,YAAYA,CAAM,GAEhDD,EAAQ,QAAQ,uBAAuB,GACxCC,EAAO,YAAYD,CAAO,CAClC,CAYA,GAXAA,EAAQ,aAAa,OAAQ,OAAO,EAEpCA,EAAQ,iBAAiB,QAAS,SAAUE,EAAG,CACvC,OACA,MAAM,kBAAkB,cACvB,MAAM,OAAO,QAAQ,uBAAuB,GAAK,MAAM,OAAO,QAAQ,uBAAuB,KAC9FA,EAAE,eAAc,EAChBC,EAAkBH,CAAO,EAEjC,EAAG,EAAK,EAEJA,EAAQ,aAAa,cAAc,EAAG,CACtC,MAAMI,EAAUJ,EAAQ,aAAa,cAAc,EAC7CK,EAAQ,IAAIC,EAAM,UAAY,CAChCH,EAAkBH,CAAO,CAC7B,EAAGI,CAAO,EACVJ,EAAQ,iBAAiB,aAAc,IAAM,CACzCK,EAAM,MAAK,CACf,CAAC,EACDL,EAAQ,iBAAiB,aAAc,IAAM,CACzCK,EAAM,OAAM,CAChB,CAAC,CACL,CACJ,CACA,SAASC,EAAMC,EAAUC,EAAO,CAC5B,IAAIC,EAASC,EAAOC,EAAYH,EAChC,KAAK,MAAQ,UAAY,CACrB,OAAO,aAAaC,CAAO,EAC3BE,GAAa,IAAI,KAASD,CAC9B,EACA,KAAK,OAAS,UAAY,CACtBA,EAAQ,IAAI,KACZ,OAAO,aAAaD,CAAO,EAC3BA,EAAU,OAAO,WAAWF,EAAUI,CAAS,CACnD,EACA,KAAK,OAAM,CACf,CACO,MAAMR,EAAoB,SAAUH,EAAS,CAChDA,EAAQ,UAAU,IAAI,QAAQ,CAClC,ECpDaY,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,EACaC,EAAiB,CAACC,EAAWF,EAAeG,KAErD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,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,MAC9B,EACY,OAAO,KAAKA,EAAM,MAAM,EAAE,QAASE,GAAa,CAC5C,MAAMC,EAAcH,EAAM,OAAOE,CAAQ,EACzCD,EAAaC,CAAQ,EAAIC,CAC7B,CAAC,EACD,OAAO,UAAU,KAAKF,CAAY,CACtC,CAAC,CACL,CAAC,EACM,IC3BXP,EAAyB,kBAAkB,EAC3C,MAAMU,UAAwB,WAAY,CACtC,aAAc,CACV,MAAK,EACL,KAAK,UAAY,CAACP,EAAWQ,IAAW,CAChCR,EAAU,aAAa,WAAW,EAClCA,EAAU,UAAU,IAAI,MAAMQ,CAAM,EAAE,EAEtCR,EAAU,UAAU,IAAI,UAAUQ,CAAM,EAAE,CAClD,EACA,KAAK,QAAU,CAACR,EAAWQ,IAAW,CAClC,OAAQA,EAAM,CACV,IAAK,SACDR,EAAU,mBAAmB,YAAa,+EAA+E,EACzH,MACJ,IAAK,UACDA,EAAU,mBAAmB,YAAa,iFAAiF,EAC3H,MACJ,IAAK,UACDA,EAAU,mBAAmB,YAAa,yEAAyE,EACnH,MACJ,QACIA,EAAU,mBAAmB,YAAa,wEAAwE,CACtI,CACQ,EACA,KAAK,cAAiBA,GAAc,CAChC,IAAIS,GACHA,EAAKT,EAAU,WAAW,cAAc,wBAAwB,KAAO,MAAQS,IAAO,SAAkBA,EAAG,UAAY,mEACxHT,EAAU,WAAW,cAAc,8CAA8C,EAAE,iBAAiB,QAAS,UAAY,CACrHZ,EAAkBY,CAAS,EAC3B,MAAMU,EAAc,IAAI,YAAY,UAAW,CAC3C,OAAQ,CACJ,MAAOV,EAAU,SACzC,CACA,CAAiB,EACDA,EAAU,cAAcU,CAAW,CACvC,EAAG,EAAK,CACZ,EACA,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAIvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA,MAGvB,KAAK,aAAa,UAAU,EAAI,GAAG,KAAK,aAAa,UAAU,CAAC,GAAK,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAUrE,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,EAEvD,SAAS,eAAe,oBAAoB,GAC7C,SAAS,KAAK,mBAAmB,YAAa;AAAA,SAAwD,CAC9G,CACA,mBAAoB,CAChB,IAAIF,EAAIG,EAAIC,EAAIC,EAGhB,MAAMC,EAAkB,KAAK,aAAa,WAAW,EAAI,QAAU,OAC7DC,EAAW,KAAK,aAAa,aAAa,EAAI,KAAK,aAAa,aAAa,EAAID,EACvF,KAAK,UAAU,KAAMC,CAAQ,EACxB,KAAK,cAAc,GAAG,GACvB,KAAK,QAAQ,KAAMA,CAAQ,EAE/B,MAAMC,EAAU,KAAK,iBAAiB,UAAU,EAChD,MAAM,KAAKA,CAAO,EAAE,QAASC,GAAW,CACpCA,EAAO,aAAa,OAAQ,MAAM,EAClCA,EAAO,UAAU,IAAI,MAAM,CAC/B,CAAC,GACGD,EAAQ,QAAU,KAAK,aAAa,cAAc,IAClD,KAAK,UAAU,IAAI,2BAA2B,EAE7CA,EAAQ,QAIRH,GAAMD,EAAK,KAAK,cAAgB,MAAQA,IAAO,OAAS,OAASA,EAAG,cAAc,qBAAqB,KAAO,MAAQC,IAAO,QAAkBA,EAAG,UAAU,OAAO,OAAO,GAH1KF,GAAMH,EAAK,KAAK,cAAgB,MAAQA,IAAO,OAAS,OAASA,EAAG,cAAc,qBAAqB,KAAO,MAAQG,IAAO,QAAkBA,EAAG,UAAU,IAAI,OAAO,EAKxK,KAAK,aAAa,cAAc,GAChC,KAAK,cAAc,IAAI,EAE3B5B,EAAkB,IAAI,EACtBe,EAAe,KAAM,mBAAoB,CAAC,SAAS,CAAC,CACxD,CACA,WAAW,oBAAqB,CAC5B,MAAO,CAAC,cAAe,cAAc,CACzC,CACA,yBAAyBoB,EAAUC,EAAQC,EAAQ,CAC/C,IAAIZ,EAAIG,EACR,OAAQO,EAAQ,CACZ,IAAK,cAAe,CACZC,GAAUC,IACV,KAAK,UAAU,OAAO,WAAW,EACjC,KAAK,UAAU,OAAO,YAAY,EAClC,KAAK,UAAU,OAAO,YAAY,EAClC,KAAK,UAAU,OAAO,UAAU,GAC/BZ,EAAK,KAAK,cAAc,GAAG,KAAO,MAAQA,IAAO,QAAkBA,EAAG,OAAM,EAC7E,KAAK,UAAU,KAAMY,CAAM,EAC3B,KAAK,QAAQ,KAAMA,CAAM,GAE7B,KACJ,CACA,IAAK,eAAgB,CACbD,GAAUC,IACN,KAAK,aAAa,cAAc,EAChC,KAAK,cAAc,IAAI,GAGtBT,EAAK,KAAK,WAAW,cAAc,wBAAwB,KAAO,MAAQA,IAAO,SAAkBA,EAAG,UAAY,KAG3H,KACJ,CACZ,CACI,CACJ"}
+{"version":3,"file":"notification.component.min.js","sources":["../../modules/notification.js","../_global.js","notification.component.js"],"sourcesContent":["function setupNotification(element) {\n    // Add toast to notification holder\n    if (element.hasAttribute('data-type') && element.getAttribute('data-type') == 'toast') {\n        let holder = document.querySelector('.notification__holder');\n        if (!holder) {\n            holder = document.createElement('div');\n            holder.classList.add('notification__holder');\n            holder.classList.add('container');\n            document.querySelector('body').appendChild(holder);\n        }\n        if (!element.closest('.notification__holder'))\n            holder.appendChild(element);\n    }\n    element.setAttribute('role', 'alert');\n    // Create a dissmissable button\n    element.addEventListener('click', function (e) {\n        if (event &&\n            event.target instanceof HTMLElement &&\n            (event.target.closest('[data-dismiss-button]') || event.target.matches('[data-dismiss-button]'))) {\n            e.preventDefault();\n            closeNotification(element);\n        }\n    }, false);\n    // Self disappearing alert\n    if (element.hasAttribute('data-timeout')) {\n        const timeOut = element.getAttribute('data-timeout');\n        const timer = new Timer(function () {\n            closeNotification(element);\n        }, timeOut);\n        element.addEventListener('mouseenter', () => {\n            timer.pause();\n        });\n        element.addEventListener('mouseleave', () => {\n            timer.resume();\n        });\n    }\n}\nfunction Timer(callback, delay) {\n    let timerId, start, remaining = delay;\n    this.pause = function () {\n        window.clearTimeout(timerId);\n        remaining -= new Date() - start;\n    };\n    this.resume = function () {\n        start = new Date();\n        window.clearTimeout(timerId);\n        timerId = window.setTimeout(callback, remaining);\n    };\n    this.resume();\n}\nexport const closeNotification = function (element) {\n    element.classList.add('d-none');\n};\nexport default setupNotification;\n","export const trackComponentRegistered = (componentName) => {\n    // Data layer Web component created\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'customElementRegistered',\n        element: componentName,\n    });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n    // Data layer Web component created\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'customElementAdded',\n        element: componentName,\n    });\n    trackEvents.forEach((eventName) => {\n        component.addEventListener(eventName, function (event) {\n            const eventDetails = {\n                event: eventName,\n                element: componentName,\n                target: event.target,\n            };\n            Object.keys(event.detail).forEach((eventKey) => {\n                const eventDetail = event.detail[eventKey];\n                eventDetails[eventKey] = eventDetail;\n            });\n            window.dataLayer.push(eventDetails);\n        });\n    });\n    return true;\n};\n","import setupNotification, { closeNotification } from '../../modules/notification';\nimport { trackComponent, trackComponentRegistered } from '../_global';\ntrackComponentRegistered('iam-notification');\nclass iamNotification extends HTMLElement {\n    constructor() {\n        super();\n        this.addColour = (component, status) => {\n            if (component.hasAttribute('data-type'))\n                component.classList.add(`bg-${status}`);\n            else\n                component.classList.add(`colour-${status}`);\n        };\n        this.addIcon = (component, status) => {\n            switch (status) {\n                case 'danger':\n                    component.insertAdjacentHTML('beforeend', '<i class=\"fa-solid fa-circle-exclamation\" aria-hidden=\"true\" slot=\"icon\"></i>');\n                    break;\n                case 'warning':\n                    component.insertAdjacentHTML('beforeend', '<i class=\"fa-solid fa-triangle-exclamation\" aria-hidden=\"true\" slot=\"icon\"></i>');\n                    break;\n                case 'success':\n                    component.insertAdjacentHTML('beforeend', '<i class=\"fa-solid fa-check-circle\" aria-hidden=\"true\" slot=\"icon\"></i>');\n                    break;\n                default:\n                    component.insertAdjacentHTML('beforeend', '<i class=\"fa-solid fa-circle-info\" aria-hidden=\"true\" slot=\"icon\"></i>');\n            }\n        };\n        this.addDismissBtn = (component) => {\n            var _a;\n            (_a = component.shadowRoot.querySelector('.notification__dismiss')) === null || _a === void 0 ? void 0 : _a.innerHTML = `<button data-dismiss-button part=\"dismiss-btn\" class=\"btn btn-secondary btn-compact fa-xmark\">Dismiss</button>`;\n            component.shadowRoot.querySelector('.notification__dismiss [data-dismiss-button]').addEventListener('click', function () {\n                closeNotification(component);\n                const customEvent = new CustomEvent('dismiss', {\n                    detail: {\n                        class: component.classList,\n                    },\n                });\n                component.dispatchEvent(customEvent);\n            }, false);\n        };\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/notification.css\";`;\n        const loadExtraCSS = `@import \"${assetLocation}/css/components/notification.global.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${loadCSS}\n    ${this.hasAttribute('data-css') ? `${this.getAttribute('data-css')}` : ``}\n    </style>\n\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\">\n    <div class=\"notification\">\n      <div class=\"notification__icon\"><slot name=\"icon\"></slot></div>\n      <div class=\"notification__inner\"><div class=\"notification__text\"><slot></slot></div><div class=\"notification__btns\"><slot name=\"btns\"></slot></div></div>\n      <div class=\"notification__dismiss\"></div>\n    </div>\n    \n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n        // insert extra CSS\n        if (!document.getElementById('notificationHolder'))\n            document.head.insertAdjacentHTML('beforeend', `<style id=\"notificationHolder\">${loadExtraCSS}</style>`);\n    }\n    connectedCallback() {\n        var _a, _b, _c, _d;\n        // eslint-disable-next-line @typescript-eslint/no-this-alias\n        const wrapper = this;\n        const defaultStatusBG = this.hasAttribute('data-type') ? 'white' : 'info';\n        const statusBG = this.hasAttribute('data-status') ? this.getAttribute('data-status') : defaultStatusBG;\n        this.addColour(this, statusBG);\n        if (!this.querySelector('i')) {\n            this.addIcon(this, statusBG);\n        }\n        const buttons = this.querySelectorAll('a,button');\n        Array.from(buttons).forEach((button) => {\n            button.setAttribute('slot', 'btns');\n            button.classList.add('link');\n        });\n        if (buttons.length || this.hasAttribute('data-dismiss')) {\n            this.classList.add('notification--dismissable');\n        }\n        if (!buttons.length) {\n            (_b = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.notification__btns')) === null || _b === void 0 ? void 0 : _b.classList.add('empty');\n        }\n        else {\n            (_d = (_c = this.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('.notification__btns')) === null || _d === void 0 ? void 0 : _d.classList.remove('empty');\n        }\n        if (this.hasAttribute('data-dismiss')) {\n            this.addDismissBtn(this);\n        }\n        setupNotification(this);\n        trackComponent(this, 'iam-notification', ['dismiss']);\n    }\n    static get observedAttributes() {\n        return ['data-status', 'data-dismiss'];\n    }\n    attributeChangedCallback(attrName, oldVal, newVal) {\n        var _a, _b;\n        switch (attrName) {\n            case 'data-status': {\n                if (oldVal != newVal) {\n                    this.classList.remove('bg-danger');\n                    this.classList.remove('bg-warning');\n                    this.classList.remove('bg-success');\n                    this.classList.remove('bg-white');\n                    (_a = this.querySelector('i')) === null || _a === void 0 ? void 0 : _a.remove();\n                    this.addColour(this, newVal);\n                    this.addIcon(this, newVal);\n                }\n                break;\n            }\n            case 'data-dismiss': {\n                if (oldVal != newVal) {\n                    if (this.hasAttribute('data-dismiss')) {\n                        this.addDismissBtn(this);\n                    }\n                    else {\n                        (_b = this.shadowRoot.querySelector('.notification__dismiss')) === null || _b === void 0 ? void 0 : _b.innerHTML = '';\n                    }\n                }\n                break;\n            }\n        }\n    }\n}\nexport default iamNotification;\n"],"names":["setupNotification","element","holder","e","closeNotification","timeOut","timer","Timer","callback","delay","timerId","start","remaining","trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","iamNotification","status","_a","customEvent","template","_b","_c","_d","defaultStatusBG","statusBG","buttons","button","attrName","oldVal","newVal"],"mappings":"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"}

package/assets/js/components/pagination/pagination.component.js

@@ -7,42 +7,42 @@ class iamPagination extends HTMLElement {
             : '/assets';
         const loadCSS = `@import "${assetLocation}/css/components/pagination.css";`;
         const template = document.createElement('template');
-        template.innerHTML = `
-    <style>
-    ${loadCSS}
-    
-    ${this.hasAttribute('css') ? `@import "${this.getAttribute('css')}";` : ``}
-    </style>
-    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
-    <div class="pagination d-none">
-  
-      <div class="minimal" part="minimal">
-        <div class="page-jump">
-          <div><select class="select--minimal"></select></div>
-          <span class="total-pages"></span>
-        </div>
-        
-        <button class="prev" disabled>Prev</button>
-        <button class="next" disabled>Next</button>
-      </div>
-
-      <div class="item-count" part="item-count"></div>
-      <div class="per-page" part="per-page">
-        <div>
-          <select class="select--minimal">
-            <option value="15">15</option>
-            <option value="25">25</option>
-            <option value="40">40</option>
-            <option value="50">50</option>
-          </select>
-        </div>
-        <span> / page</span>
-      </div>
-      <div class="mobile-controls m-auto text-center">
-        <i class="fa-solid fa-spinner fa-spin"></i>
-        <button class="load-more btn btn-primary m-auto">Load more</a>
-      </div>
-    </div>
+        template.innerHTML = `
+    <style>
+    ${loadCSS}
+    
+    ${this.hasAttribute('css') ? `@import "${this.getAttribute('css')}";` : ``}
+    </style>
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
+    <div class="pagination d-none">
+  
+      <div class="minimal" part="minimal">
+        <div class="page-jump">
+          <div><select class="select--minimal"></select></div>
+          <span class="total-pages"></span>
+        </div>
+        
+        <button class="prev" disabled>Prev</button>
+        <button class="next" disabled>Next</button>
+      </div>
+
+      <div class="item-count" part="item-count"></div>
+      <div class="per-page" part="per-page">
+        <div>
+          <select class="select--minimal">
+            <option value="15">15</option>
+            <option value="25">25</option>
+            <option value="40">40</option>
+            <option value="50">50</option>
+          </select>
+        </div>
+        <span> / page</span>
+      </div>
+      <div class="mobile-controls m-auto text-center">
+        <i class="fa-solid fa-spinner fa-spin"></i>
+        <button class="load-more btn btn-primary m-auto">Load more</a>
+      </div>
+    </div>
     `;
         this.shadowRoot.appendChild(template.content.cloneNode(true));
     }
@@ -136,9 +136,9 @@ class iamPagination extends HTMLElement {
         const defaultValues = [15, 25, 40, 50];
         // Update the per page options if needed
         if (increment && perPage.value != increment && !defaultValues.includes(increment)) {
-            perPage.innerHTML = `<option value="${increment}">${increment}</option>
-      <option value="${increment * 2}">${increment * 2}</option>
-      <option value="${increment * 3}">${increment * 3}</option>
+            perPage.innerHTML = `<option value="${increment}">${increment}</option>
+      <option value="${increment * 2}">${increment * 2}</option>
+      <option value="${increment * 3}">${increment * 3}</option>
       <option value="${increment * 4}">${increment * 4}</option>`;
         }
         perPage.value = increment;

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

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.7.1--beta6
+  * iamKey v7.7.1--beta8
   * Copyright 2022-2026 iamproperty
   */class v extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const i=document.createElement("template");i.innerHTML=`
     <style>

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

@@ -1 +1 @@
-{"version":3,"file":"pagination.component.min.js","sources":["pagination.component.js"],"sourcesContent":["class iamPagination 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/pagination.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\r\n    <style>\r\n    ${loadCSS}\r\n    \r\n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\r\n    </style>\r\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\">\r\n    <div class=\"pagination d-none\">\r\n  \r\n      <div class=\"minimal\" part=\"minimal\">\r\n        <div class=\"page-jump\">\r\n          <div><select class=\"select--minimal\"></select></div>\r\n          <span class=\"total-pages\"></span>\r\n        </div>\r\n        \r\n        <button class=\"prev\" disabled>Prev</button>\r\n        <button class=\"next\" disabled>Next</button>\r\n      </div>\r\n\r\n      <div class=\"item-count\" part=\"item-count\"></div>\r\n      <div class=\"per-page\" part=\"per-page\">\r\n        <div>\r\n          <select class=\"select--minimal\">\r\n            <option value=\"15\">15</option>\r\n            <option value=\"25\">25</option>\r\n            <option value=\"40\">40</option>\r\n            <option value=\"50\">50</option>\r\n          </select>\r\n        </div>\r\n        <span> / page</span>\r\n      </div>\r\n      <div class=\"mobile-controls m-auto text-center\">\r\n        <i class=\"fa-solid fa-spinner fa-spin\"></i>\r\n        <button class=\"load-more btn btn-primary m-auto\">Load more</a>\r\n      </div>\r\n    </div>\r\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        // Set default attributes\n        const params = new URLSearchParams(window.location.search);\n        if (!this.hasAttribute('data-total'))\n            this.setAttribute('data-total', 15);\n        if (!this.hasAttribute('data-page'))\n            this.setAttribute('data-page', params.has('page') ? params.get('page') : 1);\n        if (!this.hasAttribute('data-show'))\n            this.setAttribute('data-show', params.has('show') ? params.get('show') : 15);\n        if (!this.hasAttribute('data-increment'))\n            this.setAttribute('data-increment', this.getAttribute('data-show'));\n        // Elements\n        const select = this.shadowRoot.querySelector('.page-jump select');\n        const prev = this.shadowRoot.querySelector('.prev');\n        const next = this.shadowRoot.querySelector('.next');\n        const perPage = this.shadowRoot.querySelector('.per-page select');\n        const loadMore = this.shadowRoot.querySelector('.load-more');\n        // Add the select inputs, enable or disable buttons, update the helper text\n        this.setup();\n        // Select on change will update the data-page attr which will dispatch an event\n        select.addEventListener('change', (event) => {\n            this.setAttribute('data-show', this.getAttribute('data-increment'));\n            this.setAttribute('data-page', event.target.value);\n        });\n        // Next and previous buttons will simply trigger and on change on the select which in turn will dispatch an event\n        next.addEventListener('click', () => {\n            console.log(parseInt(this.getAttribute('data-page')));\n            this.setAttribute('data-page', parseInt(this.getAttribute('data-page')) + 1);\n        });\n        prev.addEventListener('click', () => {\n            this.setAttribute('data-page', parseInt(this.getAttribute('data-page')) - 1);\n        });\n        // Update how many is shown\n        perPage.addEventListener('change', (event) => {\n            this.setAttribute('data-increment', event.target.value);\n        });\n        // Load more button\n        const increment = parseInt(this.getAttribute('data-increment'));\n        const show = parseInt(this.getAttribute('data-show'));\n        if (show >= parseInt(this.getAttribute('data-total'))) {\n            loadMore.remove();\n        }\n        loadMore.addEventListener('click', () => {\n            const newValue = show + increment;\n            this.setAttribute('data-show', newValue);\n            if (newValue > parseInt(this.getAttribute('data-total'))) {\n                loadMore.remove();\n            }\n        });\n    }\n    setup() {\n        // Elements\n        const wrapper = this.shadowRoot.querySelector('.pagination');\n        const select = this.shadowRoot.querySelector('.page-jump select');\n        const prev = this.shadowRoot.querySelector('.prev');\n        const next = this.shadowRoot.querySelector('.next');\n        const itemCount = this.shadowRoot.querySelector('.item-count');\n        const perPage = this.shadowRoot.querySelector('.per-page select');\n        const totalPages = this.shadowRoot.querySelector('.total-pages');\n        // Values\n        const currentPage = parseInt(this.getAttribute('data-page'));\n        const total = parseInt(this.getAttribute('data-total'));\n        const show = parseInt(this.getAttribute('data-show'));\n        const increment = parseInt(this.getAttribute('data-increment'));\n        const numberPages = Math.ceil(total / increment);\n        if (total > show)\n            wrapper.classList.remove('d-none');\n        // Populate the select input with the number of pages\n        let strOptions = '';\n        for (let i = 1; i <= numberPages; i++) {\n            strOptions += `<option value=\"${i}\" ${i == currentPage ? 'selected' : ''}>${i}</option>`;\n        }\n        select.innerHTML = strOptions;\n        totalPages.innerHTML = `of ${numberPages}`;\n        // Next button\n        if (currentPage == numberPages)\n            next.setAttribute('disabled', 'disabled');\n        else\n            next.removeAttribute('disabled');\n        if (currentPage == 1)\n            prev.setAttribute('disabled', 'disabled');\n        else\n            prev.removeAttribute('disabled');\n        // Update the item count text\n        const startPoint = currentPage == 1 ? 1 : (currentPage - 1) * show + 1;\n        const endPoint = currentPage == 1 ? show : currentPage * show;\n        itemCount.innerHTML = `${startPoint} - ${endPoint > total ? total : endPoint} of ${total} items`;\n        const defaultValues = [15, 25, 40, 50];\n        // Update the per page options if needed\n        if (increment && perPage.value != increment && !defaultValues.includes(increment)) {\n            perPage.innerHTML = `<option value=\"${increment}\">${increment}</option>\r\n      <option value=\"${increment * 2}\">${increment * 2}</option>\r\n      <option value=\"${increment * 3}\">${increment * 3}</option>\r\n      <option value=\"${increment * 4}\">${increment * 4}</option>`;\n        }\n        perPage.value = increment;\n    }\n    static get observedAttributes() {\n        return ['data-total', 'data-increment', 'data-page', 'data-show'];\n    }\n    attributeChangedCallback(attrName, oldVal, newVal) {\n        switch (attrName) {\n            case 'data-total': {\n                if (oldVal != newVal) {\n                    //this.setAttribute('data-page', 1);\n                    this.setup();\n                }\n                break;\n            }\n            case 'data-show': {\n                if (oldVal != newVal) {\n                    //this.setAttribute('data-page', 1);\n                    this.setup();\n                    this.dispatchEvent(new CustomEvent('update-show', { detail: { show: newVal } }));\n                }\n                break;\n            }\n            case 'data-increment': {\n                if (oldVal != newVal) {\n                    this.setAttribute('data-show', newVal);\n                    //this.setAttribute('data-page', 1);\n                    this.setup();\n                    this.dispatchEvent(new CustomEvent('update-show', { detail: { show: newVal } }));\n                }\n                break;\n            }\n            case 'data-page': {\n                if (oldVal && oldVal != newVal) {\n                    this.setup();\n                    // Dispact the event for other components to use as triggers\n                    this.dispatchEvent(new CustomEvent('update-page', { detail: { page: newVal } }));\n                }\n                break;\n            }\n        }\n    }\n}\nexport default iamPagination;\n"],"names":["iamPagination","template","params","select","prev","next","perPage","loadMore","event","increment","show","newValue","wrapper","itemCount","totalPages","currentPage","total","numberPages","strOptions","i","startPoint","endPoint","defaultValues","attrName","oldVal","newVal"],"mappings":"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"}
+{"version":3,"file":"pagination.component.min.js","sources":["pagination.component.js"],"sourcesContent":["class iamPagination 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/pagination.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${loadCSS}\n    \n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n    </style>\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\">\n    <div class=\"pagination d-none\">\n  \n      <div class=\"minimal\" part=\"minimal\">\n        <div class=\"page-jump\">\n          <div><select class=\"select--minimal\"></select></div>\n          <span class=\"total-pages\"></span>\n        </div>\n        \n        <button class=\"prev\" disabled>Prev</button>\n        <button class=\"next\" disabled>Next</button>\n      </div>\n\n      <div class=\"item-count\" part=\"item-count\"></div>\n      <div class=\"per-page\" part=\"per-page\">\n        <div>\n          <select class=\"select--minimal\">\n            <option value=\"15\">15</option>\n            <option value=\"25\">25</option>\n            <option value=\"40\">40</option>\n            <option value=\"50\">50</option>\n          </select>\n        </div>\n        <span> / page</span>\n      </div>\n      <div class=\"mobile-controls m-auto text-center\">\n        <i class=\"fa-solid fa-spinner fa-spin\"></i>\n        <button class=\"load-more btn btn-primary m-auto\">Load more</a>\n      </div>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        // Set default attributes\n        const params = new URLSearchParams(window.location.search);\n        if (!this.hasAttribute('data-total'))\n            this.setAttribute('data-total', 15);\n        if (!this.hasAttribute('data-page'))\n            this.setAttribute('data-page', params.has('page') ? params.get('page') : 1);\n        if (!this.hasAttribute('data-show'))\n            this.setAttribute('data-show', params.has('show') ? params.get('show') : 15);\n        if (!this.hasAttribute('data-increment'))\n            this.setAttribute('data-increment', this.getAttribute('data-show'));\n        // Elements\n        const select = this.shadowRoot.querySelector('.page-jump select');\n        const prev = this.shadowRoot.querySelector('.prev');\n        const next = this.shadowRoot.querySelector('.next');\n        const perPage = this.shadowRoot.querySelector('.per-page select');\n        const loadMore = this.shadowRoot.querySelector('.load-more');\n        // Add the select inputs, enable or disable buttons, update the helper text\n        this.setup();\n        // Select on change will update the data-page attr which will dispatch an event\n        select.addEventListener('change', (event) => {\n            this.setAttribute('data-show', this.getAttribute('data-increment'));\n            this.setAttribute('data-page', event.target.value);\n        });\n        // Next and previous buttons will simply trigger and on change on the select which in turn will dispatch an event\n        next.addEventListener('click', () => {\n            console.log(parseInt(this.getAttribute('data-page')));\n            this.setAttribute('data-page', parseInt(this.getAttribute('data-page')) + 1);\n        });\n        prev.addEventListener('click', () => {\n            this.setAttribute('data-page', parseInt(this.getAttribute('data-page')) - 1);\n        });\n        // Update how many is shown\n        perPage.addEventListener('change', (event) => {\n            this.setAttribute('data-increment', event.target.value);\n        });\n        // Load more button\n        const increment = parseInt(this.getAttribute('data-increment'));\n        const show = parseInt(this.getAttribute('data-show'));\n        if (show >= parseInt(this.getAttribute('data-total'))) {\n            loadMore.remove();\n        }\n        loadMore.addEventListener('click', () => {\n            const newValue = show + increment;\n            this.setAttribute('data-show', newValue);\n            if (newValue > parseInt(this.getAttribute('data-total'))) {\n                loadMore.remove();\n            }\n        });\n    }\n    setup() {\n        // Elements\n        const wrapper = this.shadowRoot.querySelector('.pagination');\n        const select = this.shadowRoot.querySelector('.page-jump select');\n        const prev = this.shadowRoot.querySelector('.prev');\n        const next = this.shadowRoot.querySelector('.next');\n        const itemCount = this.shadowRoot.querySelector('.item-count');\n        const perPage = this.shadowRoot.querySelector('.per-page select');\n        const totalPages = this.shadowRoot.querySelector('.total-pages');\n        // Values\n        const currentPage = parseInt(this.getAttribute('data-page'));\n        const total = parseInt(this.getAttribute('data-total'));\n        const show = parseInt(this.getAttribute('data-show'));\n        const increment = parseInt(this.getAttribute('data-increment'));\n        const numberPages = Math.ceil(total / increment);\n        if (total > show)\n            wrapper.classList.remove('d-none');\n        // Populate the select input with the number of pages\n        let strOptions = '';\n        for (let i = 1; i <= numberPages; i++) {\n            strOptions += `<option value=\"${i}\" ${i == currentPage ? 'selected' : ''}>${i}</option>`;\n        }\n        select.innerHTML = strOptions;\n        totalPages.innerHTML = `of ${numberPages}`;\n        // Next button\n        if (currentPage == numberPages)\n            next.setAttribute('disabled', 'disabled');\n        else\n            next.removeAttribute('disabled');\n        if (currentPage == 1)\n            prev.setAttribute('disabled', 'disabled');\n        else\n            prev.removeAttribute('disabled');\n        // Update the item count text\n        const startPoint = currentPage == 1 ? 1 : (currentPage - 1) * show + 1;\n        const endPoint = currentPage == 1 ? show : currentPage * show;\n        itemCount.innerHTML = `${startPoint} - ${endPoint > total ? total : endPoint} of ${total} items`;\n        const defaultValues = [15, 25, 40, 50];\n        // Update the per page options if needed\n        if (increment && perPage.value != increment && !defaultValues.includes(increment)) {\n            perPage.innerHTML = `<option value=\"${increment}\">${increment}</option>\n      <option value=\"${increment * 2}\">${increment * 2}</option>\n      <option value=\"${increment * 3}\">${increment * 3}</option>\n      <option value=\"${increment * 4}\">${increment * 4}</option>`;\n        }\n        perPage.value = increment;\n    }\n    static get observedAttributes() {\n        return ['data-total', 'data-increment', 'data-page', 'data-show'];\n    }\n    attributeChangedCallback(attrName, oldVal, newVal) {\n        switch (attrName) {\n            case 'data-total': {\n                if (oldVal != newVal) {\n                    //this.setAttribute('data-page', 1);\n                    this.setup();\n                }\n                break;\n            }\n            case 'data-show': {\n                if (oldVal != newVal) {\n                    //this.setAttribute('data-page', 1);\n                    this.setup();\n                    this.dispatchEvent(new CustomEvent('update-show', { detail: { show: newVal } }));\n                }\n                break;\n            }\n            case 'data-increment': {\n                if (oldVal != newVal) {\n                    this.setAttribute('data-show', newVal);\n                    //this.setAttribute('data-page', 1);\n                    this.setup();\n                    this.dispatchEvent(new CustomEvent('update-show', { detail: { show: newVal } }));\n                }\n                break;\n            }\n            case 'data-page': {\n                if (oldVal && oldVal != newVal) {\n                    this.setup();\n                    // Dispact the event for other components to use as triggers\n                    this.dispatchEvent(new CustomEvent('update-page', { detail: { page: newVal } }));\n                }\n                break;\n            }\n        }\n    }\n}\nexport default iamPagination;\n"],"names":["iamPagination","template","params","select","prev","next","perPage","loadMore","event","increment","show","newValue","wrapper","itemCount","totalPages","currentPage","total","numberPages","strOptions","i","startPoint","endPoint","defaultValues","attrName","oldVal","newVal"],"mappings":"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"}

package/assets/js/components/password/password.component.js

@@ -11,16 +11,16 @@ class iamPassword extends HTMLElement {
             : '/assets';
         const loadCSS = `@import "${assetLocation}/css/components/password.component.css";`;
         const template = document.createElement('template');
-        template.innerHTML = `
-      <style>
-      ${loadCSS}
-      </style>
-      <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
-      <div class="wrapper">
-        <slot></slot>
-        <button type="button" class="suffix fa-solid fa-eye-slash" data-alt-class="suffix fa-solid fa-eye" aria-hidden="true"><span class="visually-hidden">Show password</span></button>
-      </div>
-      <span class="pwd-checker"></span>
+        template.innerHTML = `
+      <style>
+      ${loadCSS}
+      </style>
+      <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
+      <div class="wrapper">
+        <slot></slot>
+        <button type="button" class="suffix fa-solid fa-eye-slash" data-alt-class="suffix fa-solid fa-eye" aria-hidden="true"><span class="visually-hidden">Show password</span></button>
+      </div>
+      <span class="pwd-checker"></span>
     `;
         (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));
     }

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

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.7.1--beta6
+  * iamKey v7.7.1--beta8
   * Copyright 2022-2026 iamproperty
   */const u=c=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:c})};function m(c){var r=new TextEncoder("utf-8").encode(c);return crypto.subtle.digest("SHA-1",r).then(function(e){for(var i=[],n=new DataView(e),o=0;o<n.byteLength;o+=4){var s=n.getUint32(o),a=s.toString(16),t="00000000",p=(t+a).slice(-t.length);i.push(p)}return i.join("")})}const b=(c,r)=>{m(c).then(function(e){const i=new XMLHttpRequest;i.addEventListener("load",function(){const n=this.responseText.split(`
 `),o=e.slice(5).toUpperCase();var s=!1;for(let t in n)if(n[t].substring(0,35)==o){s=!0;break}const a=new CustomEvent("hibpCheck",{detail:s});r.dispatchEvent(a)}),i.open("GET","https://api.pwnedpasswords.com/range/"+e.substr(0,5)),i.send()})};u("iam-password");class x extends HTMLElement{constructor(){var r;super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const e=document.createElement("template");e.innerHTML=`

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

@@ -1 +1 @@
-{"version":3,"file":"password.component.min.js","sources":["../_global.js","../../vendor/hibp.js","password.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","// @ts-nocheck\n/**\n * hibp.js\n * @version v1\n * @author Mehdi Bounya\n *\n * Report any bugs here: https://github.com/mehdibo/hibp-js\n *\n * The MIT License (http://www.opensource.org/licenses/mit-license.php)\n *\n * Permission is hereby granted, free of charge, to any person\n * obtaining a copy of this software and associated documentation\n * files (the \"Software\"), to deal in the Software without\n * restriction, including without limitation the rights to use,\n * copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the\n * Software is furnished to do so, subject to the following\n * conditions:\n *\n * The above copyright notice and this permission notice shall be\n * included in all copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND,\n * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES\n * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND\n * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT\n * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,\n * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR\n * OTHER DEALINGS IN THE SOFTWARE.\n */\nfunction sha1(string) {\n    var buffer = new TextEncoder('utf-8').encode(string);\n    return crypto.subtle.digest('SHA-1', buffer).then(function (buffer) {\n        // Get the hex code\n        var hexCodes = [];\n        var view = new DataView(buffer);\n        for (var i = 0; i < view.byteLength; i += 4) {\n            // Using getUint32 reduces the number of iterations needed (we process 4 bytes each time)\n            var value = view.getUint32(i);\n            // toString(16) will give the hex representation of the number without padding\n            var stringValue = value.toString(16);\n            // We use concatenation and slice for padding\n            var padding = '00000000';\n            var paddedValue = (padding + stringValue).slice(-padding.length);\n            hexCodes.push(paddedValue);\n        }\n        // Join all the hex strings into one\n        return hexCodes.join('');\n    });\n}\nconst hibpCheck = (pwd, input) => {\n    // We hash the pwd first\n    sha1(pwd).then(function (hash) {\n        // We send the first 5 chars of the hash to hibp's API\n        const req = new XMLHttpRequest();\n        req.addEventListener('load', function () {\n            // When we get back a response from the server\n            // We create an array of lines and loop through them\n            const resp = this.responseText.split('\\n');\n            const hashSub = hash.slice(5).toUpperCase();\n            var result = false;\n            for (let index in resp) {\n                // Check if the line matches the rest of the hash\n                if (resp[index].substring(0, 35) == hashSub) {\n                    result = true;\n                    break; // If found no need to continue the loop\n                }\n            }\n            // Trigger an event with the result\n            const event = new CustomEvent('hibpCheck', { detail: result });\n            input.dispatchEvent(event);\n        });\n        req.open('GET', 'https://api.pwnedpasswords.com/range/' + hash.substr(0, 5));\n        req.send();\n    });\n};\nexport default hibpCheck;\n","import { trackComponentRegistered } from '../_global';\nimport hibpCheck from '../../vendor/hibp.js';\ntrackComponentRegistered('iam-password');\nclass iamPassword extends HTMLElement {\n    constructor() {\n        var _a;\n        super();\n        this.attachShadow({ mode: 'open' });\n        const assetLocation = document.body.hasAttribute('data-assets-location')\n            ? document.body.getAttribute('data-assets-location')\n            : '/assets';\n        const loadCSS = `@import \"${assetLocation}/css/components/password.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\r\n      <style>\r\n      ${loadCSS}\r\n      </style>\r\n      <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\">\r\n      <div class=\"wrapper\">\r\n        <slot></slot>\r\n        <button type=\"button\" class=\"suffix fa-solid fa-eye-slash\" data-alt-class=\"suffix fa-solid fa-eye\" aria-hidden=\"true\"><span class=\"visually-hidden\">Show password</span></button>\r\n      </div>\r\n      <span class=\"pwd-checker\"></span>\r\n    `;\n        (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        var _a;\n        const input = this.querySelector('input');\n        const buttonEle = this.shadowRoot.querySelector('button');\n        const pwdChecker = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.pwd-checker');\n        // Switch icon and input type\n        buttonEle.addEventListener('click', (event) => {\n            const currentType = input.type;\n            const newType = currentType === 'password' ? 'text' : 'password';\n            const isPasswordType = currentType === 'password';\n            input.setAttribute('type', newType);\n            input.setAttribute('data-password-type', isPasswordType);\n            if (buttonEle.hasAttribute('data-alt-class')) {\n                const newClass = buttonEle.getAttribute('data-alt-class');\n                buttonEle.setAttribute('data-alt-class', buttonEle.getAttribute('class'));\n                buttonEle.setAttribute('class', newClass);\n            }\n        });\n        input.addEventListener('input', (event) => {\n            const password = input.value;\n            const minChars = input.hasAttribute('minlength') ? input.getAttribute('minlength') : 12;\n            let strength = 1;\n            const strengthName = ['Very weak', 'Weak', 'Average', 'Strong', 'Very strong'];\n            let extraMsg = '';\n            //has number\n            if (password.match(/(?=.*[0-9])/))\n                strength += 1;\n            // has special character\n            if (password.match(/(?=.*[!,%,&,#,$,^,*,?,_,~,<,>,])/))\n                strength += 1;\n            // has lowercase alpha\n            if (password.match(/(?=.*[a-z])/))\n                strength += 1;\n            // has uppercase alpha\n            if (password.match(/(?=.*[A-Z])/))\n                strength += 1;\n            if (password.length < minChars) {\n                strength = 1;\n                extraMsg = `(must be at least ${minChars} characters.)`;\n            }\n            // if the strength is above weak and above the minimum length do some kind of api call to check if its in a list of passwords\n            if (strength >= 3) {\n                hibpCheck(password, input);\n                input.addEventListener('hibpCheck', function (event) {\n                    checkhibpCheck(event, input);\n                });\n                function checkhibpCheck(event, input) {\n                    console.log(event.detail);\n                    if (event.detail) {\n                        // found\n                        strength = 3;\n                        extraMsg = `(this password is very common)`;\n                        pwdChecker.innerHTML = `Password strength: ${strengthName[strength - 1]} ${extraMsg}`;\n                    }\n                    input.removeEventListener('hibpCheck', checkhibpCheck); // Succeeds\n                }\n            }\n            if (strength <= 3)\n                pwdChecker.classList.add('invalid-feedback');\n            else\n                pwdChecker.classList.remove('invalid-feedback');\n            pwdChecker.setAttribute('data-strength', strength);\n            pwdChecker.innerHTML = `Password strength: ${strengthName[strength - 1]} ${extraMsg}`;\n        });\n    }\n}\nexport default iamPassword;\n"],"names":["trackComponentRegistered","componentName","sha1","string","buffer","hexCodes","view","i","value","stringValue","padding","paddedValue","hibpCheck","pwd","input","hash","req","resp","hashSub","result","index","event","iamPassword","_a","template","buttonEle","pwdChecker","currentType","newType","isPasswordType","newClass","password","minChars","strength","strengthName","extraMsg","checkhibpCheck"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,ECwBA,SAASC,EAAKC,EAAQ,CAClB,IAAIC,EAAS,IAAI,YAAY,OAAO,EAAE,OAAOD,CAAM,EACnD,OAAO,OAAO,OAAO,OAAO,QAASC,CAAM,EAAE,KAAK,SAAUA,EAAQ,CAIhE,QAFIC,EAAW,CAAA,EACXC,EAAO,IAAI,SAASF,CAAM,EACrBG,EAAI,EAAGA,EAAID,EAAK,WAAYC,GAAK,EAAG,CAEzC,IAAIC,EAAQF,EAAK,UAAUC,CAAC,EAExBE,EAAcD,EAAM,SAAS,EAAE,EAE/BE,EAAU,WACVC,GAAeD,EAAUD,GAAa,MAAM,CAACC,EAAQ,MAAM,EAC/DL,EAAS,KAAKM,CAAW,CAC7B,CAEA,OAAON,EAAS,KAAK,EAAE,CAC3B,CAAC,CACL,CACA,MAAMO,EAAY,CAACC,EAAKC,IAAU,CAE9BZ,EAAKW,CAAG,EAAE,KAAK,SAAUE,EAAM,CAE3B,MAAMC,EAAM,IAAI,eAChBA,EAAI,iBAAiB,OAAQ,UAAY,CAGrC,MAAMC,EAAO,KAAK,aAAa,MAAM;AAAA,CAAI,EACnCC,EAAUH,EAAK,MAAM,CAAC,EAAE,YAAW,EACzC,IAAII,EAAS,GACb,QAASC,KAASH,EAEd,GAAIA,EAAKG,CAAK,EAAE,UAAU,EAAG,EAAE,GAAKF,EAAS,CACzCC,EAAS,GACT,KACJ,CAGJ,MAAME,EAAQ,IAAI,YAAY,YAAa,CAAE,OAAQF,EAAQ,EAC7DL,EAAM,cAAcO,CAAK,CAC7B,CAAC,EACDL,EAAI,KAAK,MAAO,wCAA0CD,EAAK,OAAO,EAAG,CAAC,CAAC,EAC3EC,EAAI,KAAI,CACZ,CAAC,CACL,EC1EAhB,EAAyB,cAAc,EACvC,MAAMsB,UAAoB,WAAY,CAClC,aAAc,CACV,IAAIC,EACJ,MAAK,EACL,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAWpBD,EAAK,KAAK,cAAgB,MAAQA,IAAO,QAAkBA,EAAG,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC/G,CACA,mBAAoB,CAChB,IAAID,EACJ,MAAMT,EAAQ,KAAK,cAAc,OAAO,EAClCW,EAAY,KAAK,WAAW,cAAc,QAAQ,EAClDC,GAAcH,EAAK,KAAK,cAAgB,MAAQA,IAAO,OAAS,OAASA,EAAG,cAAc,cAAc,EAE9GE,EAAU,iBAAiB,QAAUJ,GAAU,CAC3C,MAAMM,EAAcb,EAAM,KACpBc,EAAUD,IAAgB,WAAa,OAAS,WAChDE,EAAiBF,IAAgB,WAGvC,GAFAb,EAAM,aAAa,OAAQc,CAAO,EAClCd,EAAM,aAAa,qBAAsBe,CAAc,EACnDJ,EAAU,aAAa,gBAAgB,EAAG,CAC1C,MAAMK,EAAWL,EAAU,aAAa,gBAAgB,EACxDA,EAAU,aAAa,iBAAkBA,EAAU,aAAa,OAAO,CAAC,EACxEA,EAAU,aAAa,QAASK,CAAQ,CAC5C,CACJ,CAAC,EACDhB,EAAM,iBAAiB,QAAUO,GAAU,CACvC,MAAMU,EAAWjB,EAAM,MACjBkB,EAAWlB,EAAM,aAAa,WAAW,EAAIA,EAAM,aAAa,WAAW,EAAI,GACrF,IAAImB,EAAW,EACf,MAAMC,EAAe,CAAC,YAAa,OAAQ,UAAW,SAAU,aAAa,EAC7E,IAAIC,EAAW,GAkBf,GAhBIJ,EAAS,MAAM,aAAa,IAC5BE,GAAY,GAEZF,EAAS,MAAM,kCAAkC,IACjDE,GAAY,GAEZF,EAAS,MAAM,aAAa,IAC5BE,GAAY,GAEZF,EAAS,MAAM,aAAa,IAC5BE,GAAY,GACZF,EAAS,OAASC,IAClBC,EAAW,EACXE,EAAW,qBAAqBH,CAAQ,iBAGxCC,GAAY,EAAG,CAKf,IAASG,EAAT,SAAwBf,EAAOP,EAAO,CAClC,QAAQ,IAAIO,EAAM,MAAM,EACpBA,EAAM,SAENY,EAAW,EACXE,EAAW,iCACXT,EAAW,UAAY,sBAAsBQ,EAAaD,EAAW,CAAC,CAAC,IAAIE,CAAQ,IAEvFrB,EAAM,oBAAoB,YAAasB,CAAc,CACzD,EAbAxB,EAAUmB,EAAUjB,CAAK,EACzBA,EAAM,iBAAiB,YAAa,SAAUO,EAAO,CACjDe,EAAef,EAAOP,CAAK,CAC/B,CAAC,CAWL,CACImB,GAAY,EACZP,EAAW,UAAU,IAAI,kBAAkB,EAE3CA,EAAW,UAAU,OAAO,kBAAkB,EAClDA,EAAW,aAAa,gBAAiBO,CAAQ,EACjDP,EAAW,UAAY,sBAAsBQ,EAAaD,EAAW,CAAC,CAAC,IAAIE,CAAQ,EACvF,CAAC,CACL,CACJ"}
+{"version":3,"file":"password.component.min.js","sources":["../_global.js","../../vendor/hibp.js","password.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","// @ts-nocheck\n/**\n * hibp.js\n * @version v1\n * @author Mehdi Bounya\n *\n * Report any bugs here: https://github.com/mehdibo/hibp-js\n *\n * The MIT License (http://www.opensource.org/licenses/mit-license.php)\n *\n * Permission is hereby granted, free of charge, to any person\n * obtaining a copy of this software and associated documentation\n * files (the \"Software\"), to deal in the Software without\n * restriction, including without limitation the rights to use,\n * copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the\n * Software is furnished to do so, subject to the following\n * conditions:\n *\n * The above copyright notice and this permission notice shall be\n * included in all copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND,\n * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES\n * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND\n * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT\n * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,\n * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR\n * OTHER DEALINGS IN THE SOFTWARE.\n */\nfunction sha1(string) {\n    var buffer = new TextEncoder('utf-8').encode(string);\n    return crypto.subtle.digest('SHA-1', buffer).then(function (buffer) {\n        // Get the hex code\n        var hexCodes = [];\n        var view = new DataView(buffer);\n        for (var i = 0; i < view.byteLength; i += 4) {\n            // Using getUint32 reduces the number of iterations needed (we process 4 bytes each time)\n            var value = view.getUint32(i);\n            // toString(16) will give the hex representation of the number without padding\n            var stringValue = value.toString(16);\n            // We use concatenation and slice for padding\n            var padding = '00000000';\n            var paddedValue = (padding + stringValue).slice(-padding.length);\n            hexCodes.push(paddedValue);\n        }\n        // Join all the hex strings into one\n        return hexCodes.join('');\n    });\n}\nconst hibpCheck = (pwd, input) => {\n    // We hash the pwd first\n    sha1(pwd).then(function (hash) {\n        // We send the first 5 chars of the hash to hibp's API\n        const req = new XMLHttpRequest();\n        req.addEventListener('load', function () {\n            // When we get back a response from the server\n            // We create an array of lines and loop through them\n            const resp = this.responseText.split('\\n');\n            const hashSub = hash.slice(5).toUpperCase();\n            var result = false;\n            for (let index in resp) {\n                // Check if the line matches the rest of the hash\n                if (resp[index].substring(0, 35) == hashSub) {\n                    result = true;\n                    break; // If found no need to continue the loop\n                }\n            }\n            // Trigger an event with the result\n            const event = new CustomEvent('hibpCheck', { detail: result });\n            input.dispatchEvent(event);\n        });\n        req.open('GET', 'https://api.pwnedpasswords.com/range/' + hash.substr(0, 5));\n        req.send();\n    });\n};\nexport default hibpCheck;\n","import { trackComponentRegistered } from '../_global';\nimport hibpCheck from '../../vendor/hibp.js';\ntrackComponentRegistered('iam-password');\nclass iamPassword extends HTMLElement {\n    constructor() {\n        var _a;\n        super();\n        this.attachShadow({ mode: 'open' });\n        const assetLocation = document.body.hasAttribute('data-assets-location')\n            ? document.body.getAttribute('data-assets-location')\n            : '/assets';\n        const loadCSS = `@import \"${assetLocation}/css/components/password.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n      <style>\n      ${loadCSS}\n      </style>\n      <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\">\n      <div class=\"wrapper\">\n        <slot></slot>\n        <button type=\"button\" class=\"suffix fa-solid fa-eye-slash\" data-alt-class=\"suffix fa-solid fa-eye\" aria-hidden=\"true\"><span class=\"visually-hidden\">Show password</span></button>\n      </div>\n      <span class=\"pwd-checker\"></span>\n    `;\n        (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        var _a;\n        const input = this.querySelector('input');\n        const buttonEle = this.shadowRoot.querySelector('button');\n        const pwdChecker = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.pwd-checker');\n        // Switch icon and input type\n        buttonEle.addEventListener('click', (event) => {\n            const currentType = input.type;\n            const newType = currentType === 'password' ? 'text' : 'password';\n            const isPasswordType = currentType === 'password';\n            input.setAttribute('type', newType);\n            input.setAttribute('data-password-type', isPasswordType);\n            if (buttonEle.hasAttribute('data-alt-class')) {\n                const newClass = buttonEle.getAttribute('data-alt-class');\n                buttonEle.setAttribute('data-alt-class', buttonEle.getAttribute('class'));\n                buttonEle.setAttribute('class', newClass);\n            }\n        });\n        input.addEventListener('input', (event) => {\n            const password = input.value;\n            const minChars = input.hasAttribute('minlength') ? input.getAttribute('minlength') : 12;\n            let strength = 1;\n            const strengthName = ['Very weak', 'Weak', 'Average', 'Strong', 'Very strong'];\n            let extraMsg = '';\n            //has number\n            if (password.match(/(?=.*[0-9])/))\n                strength += 1;\n            // has special character\n            if (password.match(/(?=.*[!,%,&,#,$,^,*,?,_,~,<,>,])/))\n                strength += 1;\n            // has lowercase alpha\n            if (password.match(/(?=.*[a-z])/))\n                strength += 1;\n            // has uppercase alpha\n            if (password.match(/(?=.*[A-Z])/))\n                strength += 1;\n            if (password.length < minChars) {\n                strength = 1;\n                extraMsg = `(must be at least ${minChars} characters.)`;\n            }\n            // if the strength is above weak and above the minimum length do some kind of api call to check if its in a list of passwords\n            if (strength >= 3) {\n                hibpCheck(password, input);\n                input.addEventListener('hibpCheck', function (event) {\n                    checkhibpCheck(event, input);\n                });\n                function checkhibpCheck(event, input) {\n                    console.log(event.detail);\n                    if (event.detail) {\n                        // found\n                        strength = 3;\n                        extraMsg = `(this password is very common)`;\n                        pwdChecker.innerHTML = `Password strength: ${strengthName[strength - 1]} ${extraMsg}`;\n                    }\n                    input.removeEventListener('hibpCheck', checkhibpCheck); // Succeeds\n                }\n            }\n            if (strength <= 3)\n                pwdChecker.classList.add('invalid-feedback');\n            else\n                pwdChecker.classList.remove('invalid-feedback');\n            pwdChecker.setAttribute('data-strength', strength);\n            pwdChecker.innerHTML = `Password strength: ${strengthName[strength - 1]} ${extraMsg}`;\n        });\n    }\n}\nexport default iamPassword;\n"],"names":["trackComponentRegistered","componentName","sha1","string","buffer","hexCodes","view","i","value","stringValue","padding","paddedValue","hibpCheck","pwd","input","hash","req","resp","hashSub","result","index","event","iamPassword","_a","template","buttonEle","pwdChecker","currentType","newType","isPasswordType","newClass","password","minChars","strength","strengthName","extraMsg","checkhibpCheck"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,ECwBA,SAASC,EAAKC,EAAQ,CAClB,IAAIC,EAAS,IAAI,YAAY,OAAO,EAAE,OAAOD,CAAM,EACnD,OAAO,OAAO,OAAO,OAAO,QAASC,CAAM,EAAE,KAAK,SAAUA,EAAQ,CAIhE,QAFIC,EAAW,CAAA,EACXC,EAAO,IAAI,SAASF,CAAM,EACrBG,EAAI,EAAGA,EAAID,EAAK,WAAYC,GAAK,EAAG,CAEzC,IAAIC,EAAQF,EAAK,UAAUC,CAAC,EAExBE,EAAcD,EAAM,SAAS,EAAE,EAE/BE,EAAU,WACVC,GAAeD,EAAUD,GAAa,MAAM,CAACC,EAAQ,MAAM,EAC/DL,EAAS,KAAKM,CAAW,CAC7B,CAEA,OAAON,EAAS,KAAK,EAAE,CAC3B,CAAC,CACL,CACA,MAAMO,EAAY,CAACC,EAAKC,IAAU,CAE9BZ,EAAKW,CAAG,EAAE,KAAK,SAAUE,EAAM,CAE3B,MAAMC,EAAM,IAAI,eAChBA,EAAI,iBAAiB,OAAQ,UAAY,CAGrC,MAAMC,EAAO,KAAK,aAAa,MAAM;AAAA,CAAI,EACnCC,EAAUH,EAAK,MAAM,CAAC,EAAE,YAAW,EACzC,IAAII,EAAS,GACb,QAASC,KAASH,EAEd,GAAIA,EAAKG,CAAK,EAAE,UAAU,EAAG,EAAE,GAAKF,EAAS,CACzCC,EAAS,GACT,KACJ,CAGJ,MAAME,EAAQ,IAAI,YAAY,YAAa,CAAE,OAAQF,EAAQ,EAC7DL,EAAM,cAAcO,CAAK,CAC7B,CAAC,EACDL,EAAI,KAAK,MAAO,wCAA0CD,EAAK,OAAO,EAAG,CAAC,CAAC,EAC3EC,EAAI,KAAI,CACZ,CAAC,CACL,EC1EAhB,EAAyB,cAAc,EACvC,MAAMsB,UAAoB,WAAY,CAClC,aAAc,CACV,IAAIC,EACJ,MAAK,EACL,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,OAWpBD,EAAK,KAAK,cAAgB,MAAQA,IAAO,QAAkBA,EAAG,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CAC/G,CACA,mBAAoB,CAChB,IAAID,EACJ,MAAMT,EAAQ,KAAK,cAAc,OAAO,EAClCW,EAAY,KAAK,WAAW,cAAc,QAAQ,EAClDC,GAAcH,EAAK,KAAK,cAAgB,MAAQA,IAAO,OAAS,OAASA,EAAG,cAAc,cAAc,EAE9GE,EAAU,iBAAiB,QAAUJ,GAAU,CAC3C,MAAMM,EAAcb,EAAM,KACpBc,EAAUD,IAAgB,WAAa,OAAS,WAChDE,EAAiBF,IAAgB,WAGvC,GAFAb,EAAM,aAAa,OAAQc,CAAO,EAClCd,EAAM,aAAa,qBAAsBe,CAAc,EACnDJ,EAAU,aAAa,gBAAgB,EAAG,CAC1C,MAAMK,EAAWL,EAAU,aAAa,gBAAgB,EACxDA,EAAU,aAAa,iBAAkBA,EAAU,aAAa,OAAO,CAAC,EACxEA,EAAU,aAAa,QAASK,CAAQ,CAC5C,CACJ,CAAC,EACDhB,EAAM,iBAAiB,QAAUO,GAAU,CACvC,MAAMU,EAAWjB,EAAM,MACjBkB,EAAWlB,EAAM,aAAa,WAAW,EAAIA,EAAM,aAAa,WAAW,EAAI,GACrF,IAAImB,EAAW,EACf,MAAMC,EAAe,CAAC,YAAa,OAAQ,UAAW,SAAU,aAAa,EAC7E,IAAIC,EAAW,GAkBf,GAhBIJ,EAAS,MAAM,aAAa,IAC5BE,GAAY,GAEZF,EAAS,MAAM,kCAAkC,IACjDE,GAAY,GAEZF,EAAS,MAAM,aAAa,IAC5BE,GAAY,GAEZF,EAAS,MAAM,aAAa,IAC5BE,GAAY,GACZF,EAAS,OAASC,IAClBC,EAAW,EACXE,EAAW,qBAAqBH,CAAQ,iBAGxCC,GAAY,EAAG,CAKf,IAASG,EAAT,SAAwBf,EAAOP,EAAO,CAClC,QAAQ,IAAIO,EAAM,MAAM,EACpBA,EAAM,SAENY,EAAW,EACXE,EAAW,iCACXT,EAAW,UAAY,sBAAsBQ,EAAaD,EAAW,CAAC,CAAC,IAAIE,CAAQ,IAEvFrB,EAAM,oBAAoB,YAAasB,CAAc,CACzD,EAbAxB,EAAUmB,EAAUjB,CAAK,EACzBA,EAAM,iBAAiB,YAAa,SAAUO,EAAO,CACjDe,EAAef,EAAOP,CAAK,CAC/B,CAAC,CAWL,CACImB,GAAY,EACZP,EAAW,UAAU,IAAI,kBAAkB,EAE3CA,EAAW,UAAU,OAAO,kBAAkB,EAClDA,EAAW,aAAa,gBAAiBO,CAAQ,EACjDP,EAAW,UAAY,sBAAsBQ,EAAaD,EAAW,CAAC,CAAC,IAAIE,CAAQ,EACvF,CAAC,CACL,CACJ"}

package/assets/js/components/popover/popover.component.js

@@ -9,13 +9,13 @@ class iamPopover extends HTMLElement {
             : '/assets';
         const loadCSS = `@import "${assetLocation}/css/components/popover.component.css";`;
         const template = document.createElement('template');
-        template.innerHTML = `
-    <style>
-    ${loadCSS}
-    </style>
-    <div>
-    <slot></slot>
-    </div>
+        template.innerHTML = `
+    <style>
+    ${loadCSS}
+    </style>
+    <div>
+    <slot></slot>
+    </div>
     `;
         this.shadowRoot.appendChild(template.content.cloneNode(true));
     }

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

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.7.1--beta6
+  * iamKey v7.7.1--beta8
   * Copyright 2022-2026 iamproperty
   */const a=o=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:o})};a("iam-popover");class s extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const e=document.createElement("template");e.innerHTML=`
     <style>

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

@@ -1 +1 @@
-{"version":3,"file":"popover.component.min.js","sources":["../_global.js","popover.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","import { trackComponentRegistered } from '../_global';\ntrackComponentRegistered('iam-popover');\nclass iamPopover 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/popover.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\r\n    <style>\r\n    ${loadCSS}\r\n    </style>\r\n    <div>\r\n    <slot></slot>\r\n    </div>\r\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        const id = this.getAttribute('id');\n        const button = document.querySelector(`[popovertarget=\"${id}\"]`);\n        this.setAttribute('popover', 'auto');\n        button === null || button === void 0 ? void 0 : button.addEventListener('click', () => {\n            if (this.matches(':popover-open')) {\n                button.removeAttribute('aria-pressed');\n            }\n            else {\n                button.setAttribute('aria-pressed', 'true');\n            }\n        });\n    }\n}\nexport default iamPopover;\n"],"names":["trackComponentRegistered","componentName","iamPopover","template","id","button"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,ECNAD,EAAyB,aAAa,EACtC,MAAME,UAAmB,WAAY,CACjC,aAAc,CACV,MAAK,EACL,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAQrB,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,MAAMC,EAAK,KAAK,aAAa,IAAI,EAC3BC,EAAS,SAAS,cAAc,mBAAmBD,CAAE,IAAI,EAC/D,KAAK,aAAa,UAAW,MAAM,EACaC,GAAO,iBAAiB,QAAS,IAAM,CAC/E,KAAK,QAAQ,eAAe,EAC5BA,EAAO,gBAAgB,cAAc,EAGrCA,EAAO,aAAa,eAAgB,MAAM,CAElD,CAAC,CACL,CACJ"}
+{"version":3,"file":"popover.component.min.js","sources":["../_global.js","popover.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","import { trackComponentRegistered } from '../_global';\ntrackComponentRegistered('iam-popover');\nclass iamPopover 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/popover.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${loadCSS}\n    </style>\n    <div>\n    <slot></slot>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        const id = this.getAttribute('id');\n        const button = document.querySelector(`[popovertarget=\"${id}\"]`);\n        this.setAttribute('popover', 'auto');\n        button === null || button === void 0 ? void 0 : button.addEventListener('click', () => {\n            if (this.matches(':popover-open')) {\n                button.removeAttribute('aria-pressed');\n            }\n            else {\n                button.setAttribute('aria-pressed', 'true');\n            }\n        });\n    }\n}\nexport default iamPopover;\n"],"names":["trackComponentRegistered","componentName","iamPopover","template","id","button"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,ECNAD,EAAyB,aAAa,EACtC,MAAME,UAAmB,WAAY,CACjC,aAAc,CACV,MAAK,EACL,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAQrB,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,MAAMC,EAAK,KAAK,aAAa,IAAI,EAC3BC,EAAS,SAAS,cAAc,mBAAmBD,CAAE,IAAI,EAC/D,KAAK,aAAa,UAAW,MAAM,EACaC,GAAO,iBAAiB,QAAS,IAAM,CAC/E,KAAK,QAAQ,eAAe,EAC5BA,EAAO,gBAAgB,cAAc,EAGrCA,EAAO,aAAa,eAAgB,MAAM,CAElD,CAAC,CACL,CACJ"}