@iamproperty/components 7.6.4--beta7 → 7.7.0

package/assets/js/components/filter-card/filter-card.component.min.js

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.6.4--beta7
+  * iamKey v7.7.0
   * Copyright 2022-2026 iamproperty
   */const h=a=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:a})},p=(a,t,o)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:t}),o.forEach(e=>{a.addEventListener(e,function(i){const r={event:e,element:t,target:i.target};Object.keys(i.detail).forEach(d=>{const s=i.detail[d];r[d]=s}),window.dataLayer.push(r)})}),!0),g=`<div class="card__head" part="head">
   <slot name="head"></slot>
@@ -19,7 +19,7 @@
     <style>
     ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
     
-    :host{--card-icon-right: 1rem;--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;--card-footer-bottom-padding: 1.5rem;--card-head-height: 6rem;box-shadow:var(--card-box-shadow);border-radius:var(--card-border-radius);position:relative;font-weight:bold;font-size:1.125rem;line-height:1.5rem;color:var(--colour-primary);width:100%;text-align:left;display:flex;flex-direction:column;overflow:hidden;z-index:0;background:var(--colour-canvas-2);outline:2px solid var(--outline-colour, --colour-canvas-2);outline-offset:-2px;margin-bottom:2rem}:host>*{width:100%;box-sizing:border-box}:host-context(:is(a,label,button)){margin-bottom:0 !important}:host(.border-0){box-shadow:none;--card-left-padding: 0rem;outline-offset:1px !important}.card__head:has(img){min-height:var(--card-head-height);position:relative;overflow:hidden;background:rgba(0,0,0,.1);z-index:-1}.card__head:has(img)>img{position:absolute;top:0;left:0;margin:-2px;width:calc(100% + 4px);height:calc(100% + 4px);object-fit:cover}.card__body{padding:var(--card-head-top-padding) var(--card-right-padding) var(--card-head-bottom-padding) var(--card-left-padding)}.card__footer{margin-top:0;padding:0 var(--card-right-padding) 0 var(--card-left-padding)}::slotted(i){font-size:1.5rem !important;margin:-3px var(--card-icon-right) 0 0 !important;vertical-align:middle !important}::slotted(i:not(.fa-light):not(.fa-bold)){font-weight:400 !important}::slotted(.badge){margin-bottom:.375rem !important}::slotted(span:not(.badge)){display:block !important;font-weight:normal !important;font-size:1rem !important}::slotted(small){padding-top:1rem !important;display:block !important;font-weight:normal !important;padding-bottom:0 !important;color:var(--colour-body)}::slotted(span:not(.badge):not([class*=pt-])){padding-top:1.5rem !important}::slotted(:is(a,button)[slot=footer]){margin-bottom:var(--card-footer-bottom-padding) !important}.card__body:has(.card__total){--card-head-top-padding: 1rem;--card-head-bottom-padding: 1.5rem}.card__total{font-size:3rem;line-height:3rem;padding-right:1rem;margin-top:.5rem}.card__total i{font-family:var(--fa-style-family, "Font Awesome 6 Pro");font-weight:var(--fa-style, 900);display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important}::slotted([slot=total-icon]){display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important;line-height:2.5rem}.card__head:has(img)~.card__badges{position:absolute;top:0;text-align:left;left:0;z-index:9}.card__badges:not(.empty){padding:var(--card-badges-top-padding, 1rem) var(--card-right-padding) 0 var(--card-left-padding);margin-bottom:-1.5rem}:host{--top-padding: 1.5rem;--right-padding: 1rem;--bottom-padding: 1.5rem;--left-padding: 1rem}:host:has(.card__total) .card__body{align-items:center;display:flex}:host:before,:host:after{display:none}:host.card--has-icon{--bottom-padding: 1rem;border:none}:host .icon{font-size:1.125rem !important;height:1.125rem !important;margin:0 0 .5rem 0 !important;font-weight:400 !important;display:block !important}:host .card__total{margin-top:0;order:-1}:host(:is(:hover,:focus,.hover)){outline:none}:host(:is(:hover,:focus,.hover)) :is(.card__body,.card__footer){background:light-dark(#eeeeee, var(--colour-canvas))}:host-context(:is(:checked,.checked)),:host(:is(:active,.active)){outline:2px solid var(--colour, var(--colour-primary));outline-offset:-2px}:host-context(:is(:checked,.checked)) .card__body,:host(:is(:active,.active)) .card__body{background:none}:host-context(:is(:checked,.checked)) .card__footer,:host(:is(:active,.active)) .card__footer{background:none}::slotted(i){display:block !important;font-size:1.125rem !important;margin:0 0 .5rem 0 !important}:host(.card--flag){position:relative}:host(.card--flag):after{content:var(--card-flag-icon, "\\f024");font-family:"Font Awesome 6 Pro";position:absolute;top:1rem;right:1rem;font-size:1rem;line-height:1;height:1rem;width:1rem;display:inline-block;font-weight:normal;color:var(--colour, var(--colour-primary))}.card__body:has(.card__total){--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;display:flex;align-items:center}.card__total{order:-1}/*# sourceMappingURL=assets/css/components/filter-card.component.css.map */
+    :host{--card-icon-right: 1rem;--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;--card-footer-bottom-padding: 1.5rem;--card-head-height: 6rem;box-shadow:var(--card-box-shadow);border-radius:var(--card-border-radius);position:relative;font-weight:bold;font-size:1.125rem;line-height:1.5rem;color:var(--colour-primary);width:100%;text-align:left;display:flex;flex-direction:column;overflow:hidden;z-index:0;background:var(--colour-canvas-2);outline:2px solid var(--outline-colour, --colour-canvas-2);outline-offset:-2px;margin-bottom:2rem}:host>*{width:100%;box-sizing:border-box}:host-context(:is(a,label,button)){margin-bottom:0 !important}:host(.border-0){box-shadow:none;--card-left-padding: 0rem;outline-offset:1px !important}.card__head:has(img){min-height:var(--card-head-height);position:relative;overflow:hidden;background:rgba(0,0,0,.1);z-index:-1}.card__head:has(img)>img{position:absolute;top:0;left:0;margin:-2px;width:calc(100% + 4px);height:calc(100% + 4px);object-fit:cover}.card__body{padding:var(--card-head-top-padding) var(--card-right-padding) var(--card-head-bottom-padding) var(--card-left-padding)}.card__footer{margin-top:0;padding:0 var(--card-right-padding) 0 var(--card-left-padding)}::slotted(i){font-size:1.5rem !important;margin:-3px var(--card-icon-right) 0 0 !important;vertical-align:middle !important}::slotted(i:not(.fa-light):not(.fa-bold)){font-weight:400 !important}::slotted(.badge){margin-bottom:.375rem !important}::slotted(span:not(.badge)){display:block !important;font-weight:normal !important;font-size:1rem !important}::slotted(small){padding-top:1rem !important;display:block !important;font-weight:normal !important;padding-bottom:0 !important;color:var(--colour-body)}::slotted(span:not(.badge):not([class*=pt-])){padding-top:1.5rem !important}::slotted(:is(a,button)[slot=footer]){margin-bottom:var(--card-footer-bottom-padding) !important}.card__body:has(.card__total){--card-head-top-padding: 1rem;--card-head-bottom-padding: 1.5rem}.card__total{font-size:3rem;line-height:3rem;padding-right:1rem;margin-top:.5rem}.card__total i{font-family:var(--fa-style-family, "Font Awesome 7 Pro");font-weight:var(--fa-style, 900);display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important}::slotted([slot=total-icon]){display:block !important;font-size:2.5rem !important;margin:.5rem 0 .5rem 0 !important;line-height:2.5rem}.card__head:has(img)~.card__badges{position:absolute;top:0;text-align:left;left:0;z-index:9}.card__badges:not(.empty){padding:var(--card-badges-top-padding, 1rem) var(--card-right-padding) 0 var(--card-left-padding);margin-bottom:-1.5rem}:host{--top-padding: 1.5rem;--right-padding: 1rem;--bottom-padding: 1.5rem;--left-padding: 1rem}:host:has(.card__total) .card__body{align-items:center;display:flex}:host:before,:host:after{display:none}:host.card--has-icon{--bottom-padding: 1rem;border:none}:host .icon{font-size:1.125rem !important;height:1.125rem !important;margin:0 0 .5rem 0 !important;font-weight:400 !important;display:block !important}:host .card__total{margin-top:0;order:-1}:host(:is(:hover,:focus,.hover)){outline:none}:host(:is(:hover,:focus,.hover)) :is(.card__body,.card__footer){background:light-dark(#eeeeee, var(--colour-canvas))}:host-context(:is(:checked,.checked)),:host(:is(:active,.active)){outline:2px solid var(--colour, var(--colour-primary));outline-offset:-2px}:host-context(:is(:checked,.checked)) .card__body,:host(:is(:active,.active)) .card__body{background:none}:host-context(:is(:checked,.checked)) .card__footer,:host(:is(:active,.active)) .card__footer{background:none}::slotted(i){display:block !important;font-size:1.125rem !important;margin:0 0 .5rem 0 !important}:host(.card--flag){position:relative}:host(.card--flag):after{content:var(--card-flag-icon, "\\f024");font-family:"Font Awesome 7 Pro";position:absolute;top:1rem;right:1rem;font-size:1rem;line-height:1;height:1rem;width:1rem;display:inline-block;font-weight:normal;color:var(--colour, var(--colour-primary))}.card__body:has(.card__total){--card-head-top-padding: 2rem;--card-head-bottom-padding: 2rem;display:flex;align-items:center}.card__total{order:-1}/*# sourceMappingURL=assets/css/components/filter-card.component.css.map */
 
     </style>
     ${g}

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

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.6.4--beta7
+  * iamKey v7.7.0
   * Copyright 2022-2026 iamproperty
   */function r(s,t){i(s,t)}function i(s,t){let e;t.addEventListener("keyup",()=>{clearTimeout(e),e=setTimeout(function(){o(s,t.value)},500)}),t.addEventListener("change",()=>{clearTimeout(e),o(s,t.value)})}const o=function(s,t){Array.from(s.querySelectorAll(":scope > li")).forEach(e=>{const a=e.textContent.toLowerCase();e.classList.add("d-none"),a.includes(t.toLowerCase())&&e.classList.remove("d-none")}),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"Filtered list",value:t})};window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"filterlist"});class n extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,a=document.createElement("template");a.innerHTML=`
     <style>

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

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.6.4--beta7
+  * iamKey v7.7.0
   * Copyright 2022-2026 iamproperty
   */const o=a=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:a})};o("iam-tag");class i extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const e=document.createElement("template");e.innerHTML=`
     <div class="wrapper">

package/assets/js/components/header/header.component.js

@@ -13,16 +13,52 @@ class iamHeader extends HTMLElement {
             : '/assets';
         const loadCSS = `@import "${assetLocation}/css/components/header.css";`;
         const template = document.createElement('template');
-        template.innerHTML = `
+        template.innerHTML = /*HTML*/ `
     <style>
     ${loadCSS}
     </style>
     <div class="header-banner">
+      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 776.72 776.73" class="gradient-background">
+        <defs>
+          <style>
+            .cls-1 {
+              fill: url(#linear-gradient-2);
+              opacity: .15;
+            }
+
+            .cls-2 {
+              fill: url(#linear-gradient-3);
+              opacity: .2;
+            }
+
+            .cls-3 {
+              fill: url(#linear-gradient);
+              opacity: .1;
+            }
+          </style>
+          <linearGradient id="linear-gradient" x1="113.75" y1="113.75" x2="662.98" y2="662.98" gradientUnits="userSpaceOnUse">
+            <stop offset="0" stop-color="#54ffff" stop-opacity="0"/>
+            <stop offset="1" stop-color="#54ffff"/>
+          </linearGradient>
+          <linearGradient id="linear-gradient-2" x1="610.21" y1="166.51" x2="166.51" y2="610.21" xlink:href="#linear-gradient"/>
+          <linearGradient id="linear-gradient-3" x1="388.36" y1="177.95" x2="388.36" y2="598.78" xlink:href="#linear-gradient"/>
+        </defs>
+        <g id="Layer_1-2" data-name="Layer 1">
+          <g>
+            <path class="cls-3" d="M113.75,662.98c151.66,151.67,397.56,151.66,549.23,0,151.67-151.67,151.66-397.56,0-549.23-151.67-151.66-397.56-151.66-549.23,0-151.66,151.67-151.66,397.56,0,549.23"/>
+            <path class="cls-1" d="M74.62,388.36c0,173.27,140.47,313.74,313.74,313.74s313.74-140.47,313.74-313.74S561.64,74.62,388.36,74.62,74.62,215.09,74.62,388.36"/>
+            <path class="cls-2" d="M239.58,239.58c-82.17,82.17-82.17,215.4,0,297.57,82.17,82.17,215.4,82.17,297.57,0,82.17-82.17,82.17-215.4,0-297.57-82.17-82.17-215.4-82.17-297.57,0"/>
+          </g>
+        </g>
+      </svg>
       <picture>
         <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" alt="" lazy="" />
       </picture>
       <div class="container">
+        <slot name="before"></slot>
         <slot></slot>
+        <slot name="badge"></slot>
+        <slot name="panel" class="admin-panel"></slot>
       </div>
     </div>
     `;
@@ -36,6 +72,8 @@ class iamHeader extends HTMLElement {
             source.setAttribute('src', this.getAttribute('image'));
         else
             picture.remove();
+        if (this.querySelector('[slot="panel"]'))
+            this.classList.add('has-panel');
     }
 }
 export default iamHeader;

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

@@ -1,18 +1,54 @@
 /*!
-  * iamKey v7.6.4--beta7
+  * iamKey v7.7.0
   * Copyright 2022-2026 iamproperty
-  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"header"});class a extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const t=document.createElement("template");t.innerHTML=`
+  */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"header"});class o extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const a=document.createElement("template");a.innerHTML=`
     <style>
-    @layer elements{.container{display:block;margin-left:auto;margin-right:auto;container-type:inline-size;width:100%}.container:not([class*=col-]){grid-column:container !important;padding:var(--container-padding)}.container:not(:has(.row)):has([class*=col-]){display:grid;grid-template-columns:[content-start col-1-start] 1fr [col-1-end col-2-start] 1fr [col-2-end col-3-start] 1fr [col-3-end col-4-start] 1fr [col-4-end col-5-start] 1fr [col-5-end col-6-start] 1fr [col-6-end col-7-start] 1fr [col-7-end col-8-start] 1fr [col-8-end col-9-start] 1fr [col-9-end col-10-start] 1fr [col-10-end col-11-start] 1fr [col-11-end col-12-start] 1fr [col-12-end content-end];column-gap:1rem}.container [class*=col-span-]:not([class*=-col-span-]):not(:first-child){--col-start: auto}@media screen and (min-width: 36em){.container [class*=sm-col-span-]:not(:first-child){--col-start: auto}}@media screen and (min-width: 62em){.container [class*=md-col-span-]:not(:first-child){--col-start: auto}}.container:not(.container-fluid){max-width:var(--container-max-width)}.container .container:not(.container-xs-breakout){padding-left:0;padding-right:0;padding-bottom:0;padding-top:0}.container[class*=bg-]{padding-top:3rem;padding-bottom:2rem}.container[class*=bg-]+.container:not([class*=bg-]){padding-top:2rem}.container:before{display:table;clear:both;content:""}.container:after{display:table;clear:both;content:""}.container.container-xs-breakout{margin-left:-1.25rem;margin-right:-1.25rem;width:calc(100% + 2.5rem)}@media screen and (min-width: 36em){.container.container-xs-breakout{margin-left:auto;margin-right:auto;width:100%}}:host .container{display:block;margin-left:auto;margin-right:auto;padding:var(--container-padding);width:100%}main>.row{padding-bottom:1rem}main>.row[class*=bg-]{padding-top:3rem;padding-bottom:2rem}main>.row[class*=bg-]+:is(.row,.container):not([class*=bg-]){padding-top:2rem}.container:has(.circle){position:relative;z-index:1}.container>.circle{position:absolute;z-index:var(--index-below);border-width:3px}.container:not([class*=circle-pattern-])>.circle{font-size:18.75rem;top:-4.6875rem;left:-12.5rem}.container:not([class*=circle-pattern-])>.circle~.circle{font-size:21.875rem;top:auto;left:auto;right:-6.25rem;bottom:-12.5rem}}*,*::before,*::after{box-sizing:border-box}.container{box-sizing:border-box}:host{padding-top:0 !important;margin-bottom:2rem;background-color:rgba(0,0,0,0) !important;display:block !important}.header-banner{padding-top:2.75rem;max-width:120rem;min-height:25rem;margin-inline:auto;display:block;position:relative;height:auto}@media screen and (min-width: 62em){.header-banner{padding-top:5.25rem}}.header-banner>picture{display:block;position:absolute;top:0;left:0;height:100%;width:100%;pointer-events:none;overflow:hidden;min-height:25rem;max-height:25rem}.header-banner>picture:after{content:"";display:block;position:absolute;z-index:-1;inset:0;background:linear-gradient(300deg, rgb(30, 190, 230) 0%, rgb(0, 49, 60) 100%);opacity:.85}.header-banner>picture img{display:block;position:absolute;z-index:-2;inset:0;object-fit:cover;object-position:50% 50%;width:100%;height:100%}:host(.header--contain) .header-banner{padding-bottom:2rem}:host(.header--contain) .header-banner>picture{max-height:100%}::slotted(.breadcrumb){margin-top:1.5rem !important;margin-bottom:-0.5rem !important}@media screen and (min-width: 62em){::slotted(.breadcrumb){position:absolute !important;top:0 !important;left:5.25rem !important}}::slotted(*:last-child){padding-bottom:0 !important;margin-bottom:0 !important}/*# sourceMappingURL=assets/css/components/header.css.map */
+    @layer elements{.container{display:block;margin-left:auto;margin-right:auto;container-type:inline-size;width:100%}.container:not([class*=col-]){grid-column:container !important;padding:var(--container-padding)}.container:not(:has(.row)):has([class*=col-]){display:grid;grid-template-columns:[content-start col-1-start] 1fr [col-1-end col-2-start] 1fr [col-2-end col-3-start] 1fr [col-3-end col-4-start] 1fr [col-4-end col-5-start] 1fr [col-5-end col-6-start] 1fr [col-6-end col-7-start] 1fr [col-7-end col-8-start] 1fr [col-8-end col-9-start] 1fr [col-9-end col-10-start] 1fr [col-10-end col-11-start] 1fr [col-11-end col-12-start] 1fr [col-12-end content-end];column-gap:1rem}.container [class*=col-span-]:not([class*=-col-span-]):not(:first-child){--col-start: auto}@media screen and (min-width: 36em){.container [class*=sm-col-span-]:not(:first-child){--col-start: auto}}@media screen and (min-width: 62em){.container [class*=md-col-span-]:not(:first-child){--col-start: auto}}.container:not(.container-fluid){max-width:var(--container-max-width)}.container .container:not(.container-xs-breakout){padding-left:0;padding-right:0;padding-bottom:0;padding-top:0}.container[class*=bg-]{padding-top:3rem;padding-bottom:2rem}.container[class*=bg-]+.container:not([class*=bg-]){padding-top:2rem}.container:before{display:table;clear:both;content:""}.container:after{display:table;clear:both;content:""}.container.container-xs-breakout{margin-left:-1.25rem;margin-right:-1.25rem;width:calc(100% + 2.5rem)}@media screen and (min-width: 36em){.container.container-xs-breakout{margin-left:auto;margin-right:auto;width:100%}}:host .container{display:block;margin-left:auto;margin-right:auto;padding:var(--container-padding);width:100%}main>.row{padding-bottom:1rem}main>.row[class*=bg-]{padding-top:3rem;padding-bottom:2rem}main>.row[class*=bg-]+:is(.row,.container):not([class*=bg-]){padding-top:2rem}.container:has(.circle){position:relative;z-index:1}.container>.circle{position:absolute;z-index:var(--index-below);border-width:3px}.container:not([class*=circle-pattern-])>.circle{font-size:18.75rem;top:-4.6875rem;left:-12.5rem}.container:not([class*=circle-pattern-])>.circle~.circle{font-size:21.875rem;top:auto;left:auto;right:-6.25rem;bottom:-12.5rem}}@layer elements{.admin-panel{--padding-x: 1.5rem;--padding-top: 1rem;--padding-bottom: 1rem;--mh-modifier: 4.5rem;--mh-padding-inline: var(--padding-x);display:block;padding:var(--padding-top) var(--padding-x) var(--padding-bottom) var(--padding-x);box-shadow:0px 6px 12px rgba(0, 0, 0, 0.11);background-color:var(--colour-canvas-2);border-radius:.5rem;margin-bottom:1.5rem;outline:var(--contrast-outline-width, 0px) solid var(--colour-primary);overflow:hidden;&:has(:is([class*=cols-],[class*=col-start-],[class*=col-end-],[class*=col-span-])){display:grid;>*{grid-column:var(--col-start, col-1-start)/var(--col-end, col-12-end)}}&:empty{display:none}>:is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.admin-panel__heading):not(.lead):first-child{--gradient-direction: -90deg !important;background-color:var(--colour-success);&:not([class*=bg-]){color:var(--colour-primary-theme);background-image:linear-gradient(var(--gradient-direction), var(--colour-info) 0, transparent 100%)}margin:calc(var(--padding-top)*-1) calc(var(--padding-x)*-1) var(--padding-top) calc(var(--padding-x)*-1);display:block;border-top-left-radius:.5rem;border-top-right-radius:.5rem}>:is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6):not(.lead):first-child,.admin-panel__heading>:is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6):not(.lead){font-size:1.125rem;line-height:1.5rem;font-weight:bold;padding:1rem 1.5rem;max-width:unset}>:is(.admin-panel__heading):first-child{display:flex !important;flex-wrap:wrap;gap:1rem;align-items:center;padding:1rem 1.5rem;>:is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6){padding:0;margin-inline-end:auto}.btn{--btn-margin: 0;margin-bottom:0}.dialog__wrapper+.btn{--btn-margin: 0.25rem;margin-inline-end:0}}:is(iam-table,iam-table-basic,iam-table-no-submit,iam-table-submit,iam-table-ajax,.iam-table){margin:0 0 2rem 0;padding:0;box-shadow:none;background:none}&>*:not([class*=mb-]):not(.btn__group):last-child{margin-bottom:0 !important}&>*:is(p):last-child{padding-bottom:0 !important}& p{max-width:100%;padding-bottom:1.5rem}&>:is(.mh-sm,.mh-md,.mh-lg,.mh-sm-sm,.mh-sm-md,.mh-sm-lg,.mh-md-sm,.mh-md-md,.mh-md-lg,.mh-fluid){overflow:auto;&:before{top:100% !important}}&>:is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6):not(.lead):first-child+:is(.mh-sm,.mh-md,.mh-lg,.mh-sm-sm,.mh-sm-md,.mh-sm-lg,.mh-md-sm,.mh-md-md,.mh-md-lg,.mh-fluid){padding-top:var(--padding-top);margin-top:calc(var(--padding-top)*-1)}&>:is(.mh-sm,.mh-md,.mh-lg,.mh-sm-sm,.mh-sm-md,.mh-sm-lg,.mh-md-sm,.mh-md-md,.mh-md-lg,.mh-fluid):last-child{padding-bottom:var(--padding-bottom);margin-bottom:calc(var(--padding-bottom)*-1) !important;&>*:not([class*=mb-]):last-child{margin-bottom:0 !important}&>*:is(p):last-child{padding-bottom:0 !important}}&>iam-pagination{margin-top:-1rem}&:has(.mh-fluid){max-height:100%;display:flex;flex-direction:column}&.grid{display:grid !important;grid-template-columns:subgrid !important;>*:not(:first-child){grid-column:var(--col-start, col-1-start)/var(--col-end, col-12-end)}}}@container style(--theme: dark){.admin-panel{background-color:var(--colour-canvas-2);color:var(--colour-body);.bg-white{background-color:transparent !important;color:var(--white) !important}}}@media(prefers-color-scheme: light){>:is(.admin-panel__heading):first-child{.btn-action,.dialog__wrapper{--colour-canvas-2: #ffffff;--colour-heading: var(--colour-primary);--colour-btn-action-hover-bg: var(--colour-light);--colour-btn-hover: var(--colour-primary);--colour-border: #d8d8d8}}}[class*=col].admin-panel:first-child:last-child:not(:has(.mh-sm,.mh-md,.mh-lg,.mh-sm-sm,.mh-sm-md,.mh-sm-lg,.mh-md-sm,.mh-md-md,.mh-md-lg,.mh-fluid)){min-height:calc(100% - 1.5rem)}.admin-panel:has(iam-actionbar){&>:is(h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6):not(.lead):first-child{margin-bottom:0}iam-actionbar{background:var(--colour-canvas);margin-inline:calc(var(--padding-x)*-1);margin-bottom:var(--padding-top);&:first-child{margin-top:calc(var(--padding-top)*-1)}&:not(:first-child){border-radius:0}}&>:is(iam-table,iam-table-basic,iam-table-no-submit,iam-table-submit,iam-table-ajax){overflow:visible;&:first-child{margin-top:calc(var(--padding-top)*-1)}iam-actionbar{margin-top:0 !important;border-radius:0;box-shadow:none}}}details.admin-panel{summary:after{content:"\uF077";font-weight:bold;margin-left:0;height:2rem;width:2rem;text-align:center;line-height:2rem;margin-right:-0.5rem}summary:not(:has(.btn:hover)):hover:after{background:var(--colour-light);border-radius:50%}summary:not(:has(.btn:hover)):active:after{background:var(--colour-light);filter:brightness(85%);border-radius:50%}}details.admin-panel:not([open]){padding-bottom:0;summary:first-child{margin-bottom:0}summary:after{content:"\uF078"}}.admin-panel__footer:last-child{background-color:var(--wider-colour);padding-top:var(--padding-top);margin-inline:calc(var(--padding-x)*-1);padding-inline:var(--padding-x);padding-bottom:0;&>*:last-child{margin-bottom:0;padding-bottom:var(--padding-bottom);align-self:center}}.admin-panel__footer:not([class*=mb-]):last-child{margin-bottom:calc(var(--padding-bottom)*-1) !important}}*,*::before,*::after{box-sizing:border-box}.container{box-sizing:border-box;position:relative;z-index:4}:host{padding-top:0 !important;margin-bottom:2rem;display:block !important}.header-banner{padding-top:2.75rem;max-width:120rem;min-height:25rem;margin-inline:auto;display:block;position:relative;height:auto}.header-banner>picture{display:block;position:absolute;top:0;left:0;height:100%;width:100%;pointer-events:none;overflow:hidden;min-height:25rem;max-height:25rem;z-index:3}.header-banner>picture img{display:block;position:absolute;z-index:1;inset:0;object-fit:cover;object-position:50% 50%;width:100%;height:100%}.header-banner>picture:after{content:"";display:block;position:absolute;z-index:2;inset:0;background:linear-gradient(300deg, rgb(30, 190, 230) 0%, rgb(0, 49, 60) 100%);opacity:.85}:host(.header--contain) .header-banner{padding-bottom:2rem}:host(.header--contain) .header-banner>picture{max-height:100%}::slotted(.breadcrumb){margin-top:1.5rem !important;margin-bottom:-0.5rem !important}@media screen and (min-width: 62em){::slotted(.breadcrumb){position:absolute !important;top:0 !important;left:5.25rem !important}}::slotted(*:not(.btn__group):last-child){padding-bottom:0 !important;margin-bottom:0 !important}slot[name=badge]{display:block;position:absolute;top:0;left:0}:host(.has-panel) .admin-panel{display:block;text-align:center;margin-bottom:1rem}::slotted([slot=panel]){color-scheme:light !important;--colour-heading: var(--colour-primary-theme);--colour-body: var(--colour-primary-theme);--colour-underline: var(--colour-secondary-theme);color:var(--colour-primary-theme)}::slotted(img[slot=panel]){max-width:4.75rem !important}:host(.has-panel) slot[name=panel]{container-type:inline-size;anchor-name:--anchor}:host(.has-panel) slot[name=badge]{position-anchor:--anchor;top:calc(anchor(top) + 1rem);left:calc(anchor(left) + 1rem);z-index:999}@media screen and (min-width: 62em){:host(.has-panel) .container{display:grid;column-gap:var(--gap);grid-template-columns:repeat(12, 1fr)}:host(.has-panel) slot:not([name]){display:block;grid-column-start:1;grid-column-end:7}:host(.has-panel) slot[name=before]{display:block;grid-column-start:1;grid-column-end:13}:host(.has-panel) slot[name=panel]{display:block;grid-column-start:8;grid-column-end:13}:host(.has-panel) .admin-panel{text-align:center}}:host{overflow:hidden}.gradient-background{position:absolute;left:75%;top:50%;transform:translate(-50%, -50%);z-index:2;width:54rem;aspect-ratio:1/1}/*# sourceMappingURL=assets/css/components/header.css.map */
 
     </style>
     <div class="header-banner">
+      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 776.72 776.73" class="gradient-background">
+        <defs>
+          <style>
+            .cls-1 {
+              fill: url(#linear-gradient-2);
+              opacity: .15;
+            }
+
+            .cls-2 {
+              fill: url(#linear-gradient-3);
+              opacity: .2;
+            }
+
+            .cls-3 {
+              fill: url(#linear-gradient);
+              opacity: .1;
+            }
+          </style>
+          <linearGradient id="linear-gradient" x1="113.75" y1="113.75" x2="662.98" y2="662.98" gradientUnits="userSpaceOnUse">
+            <stop offset="0" stop-color="#54ffff" stop-opacity="0"/>
+            <stop offset="1" stop-color="#54ffff"/>
+          </linearGradient>
+          <linearGradient id="linear-gradient-2" x1="610.21" y1="166.51" x2="166.51" y2="610.21" xlink:href="#linear-gradient"/>
+          <linearGradient id="linear-gradient-3" x1="388.36" y1="177.95" x2="388.36" y2="598.78" xlink:href="#linear-gradient"/>
+        </defs>
+        <g id="Layer_1-2" data-name="Layer 1">
+          <g>
+            <path class="cls-3" d="M113.75,662.98c151.66,151.67,397.56,151.66,549.23,0,151.67-151.67,151.66-397.56,0-549.23-151.67-151.66-397.56-151.66-549.23,0-151.66,151.67-151.66,397.56,0,549.23"/>
+            <path class="cls-1" d="M74.62,388.36c0,173.27,140.47,313.74,313.74,313.74s313.74-140.47,313.74-313.74S561.64,74.62,388.36,74.62,74.62,215.09,74.62,388.36"/>
+            <path class="cls-2" d="M239.58,239.58c-82.17,82.17-82.17,215.4,0,297.57,82.17,82.17,215.4,82.17,297.57,0,82.17-82.17,82.17-215.4,0-297.57-82.17-82.17-215.4-82.17-297.57,0"/>
+          </g>
+        </g>
+      </svg>
       <picture>
         <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" alt="" lazy="" />
       </picture>
       <div class="container">
+        <slot name="before"></slot>
         <slot></slot>
+        <slot name="badge"></slot>
+        <slot name="panel" class="admin-panel"></slot>
       </div>
     </div>
-    `,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){this.classList.add("bg-primary");const t=this.shadowRoot.querySelector("picture"),e=this.shadowRoot.querySelector("picture img");this.hasAttribute("image")?e.setAttribute("src",this.getAttribute("image")):t.remove()}}export{a as default};
+    `,this.shadowRoot.appendChild(a.content.cloneNode(!0))}connectedCallback(){this.classList.add("bg-primary");const a=this.shadowRoot.querySelector("picture"),t=this.shadowRoot.querySelector("picture img");this.hasAttribute("image")?t.setAttribute("src",this.getAttribute("image")):a.remove(),this.querySelector('[slot="panel"]')&&this.classList.add("has-panel")}}export{o as default};
 //# sourceMappingURL=header.component.min.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"header.component.min.js","sources":["header.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'header',\n});\nclass iamHeader 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/header.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${loadCSS}\n    </style>\n    <div class=\"header-banner\">\n      <picture>\n        <img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\" alt=\"\" lazy=\"\" />\n      </picture>\n      <div class=\"container\">\n        <slot></slot>\n      </div>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        this.classList.add('bg-primary');\n        const picture = this.shadowRoot.querySelector('picture');\n        const source = this.shadowRoot.querySelector('picture img');\n        if (this.hasAttribute('image'))\n            source.setAttribute('src', this.getAttribute('image'));\n        else\n            picture.remove();\n    }\n}\nexport default iamHeader;\n"],"names":["iamHeader","template","picture","source"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,QACb,CAAC,EACD,MAAMA,UAAkB,WAAY,CAChC,aAAc,CACV,MAAK,EACL,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAarB,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,KAAK,UAAU,IAAI,YAAY,EAC/B,MAAMC,EAAU,KAAK,WAAW,cAAc,SAAS,EACjDC,EAAS,KAAK,WAAW,cAAc,aAAa,EACtD,KAAK,aAAa,OAAO,EACzBA,EAAO,aAAa,MAAO,KAAK,aAAa,OAAO,CAAC,EAErDD,EAAQ,OAAM,CACtB,CACJ"}
+{"version":3,"file":"header.component.min.js","sources":["header.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n    event: 'customElementRegistered',\n    element: 'header',\n});\nclass iamHeader 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/header.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = /*HTML*/ `\n    <style>\n    ${loadCSS}\n    </style>\n    <div class=\"header-banner\">\n      <svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 776.72 776.73\" class=\"gradient-background\">\n        <defs>\n          <style>\n            .cls-1 {\n              fill: url(#linear-gradient-2);\n              opacity: .15;\n            }\n\n            .cls-2 {\n              fill: url(#linear-gradient-3);\n              opacity: .2;\n            }\n\n            .cls-3 {\n              fill: url(#linear-gradient);\n              opacity: .1;\n            }\n          </style>\n          <linearGradient id=\"linear-gradient\" x1=\"113.75\" y1=\"113.75\" x2=\"662.98\" y2=\"662.98\" gradientUnits=\"userSpaceOnUse\">\n            <stop offset=\"0\" stop-color=\"#54ffff\" stop-opacity=\"0\"/>\n            <stop offset=\"1\" stop-color=\"#54ffff\"/>\n          </linearGradient>\n          <linearGradient id=\"linear-gradient-2\" x1=\"610.21\" y1=\"166.51\" x2=\"166.51\" y2=\"610.21\" xlink:href=\"#linear-gradient\"/>\n          <linearGradient id=\"linear-gradient-3\" x1=\"388.36\" y1=\"177.95\" x2=\"388.36\" y2=\"598.78\" xlink:href=\"#linear-gradient\"/>\n        </defs>\n        <g id=\"Layer_1-2\" data-name=\"Layer 1\">\n          <g>\n            <path class=\"cls-3\" d=\"M113.75,662.98c151.66,151.67,397.56,151.66,549.23,0,151.67-151.67,151.66-397.56,0-549.23-151.67-151.66-397.56-151.66-549.23,0-151.66,151.67-151.66,397.56,0,549.23\"/>\n            <path class=\"cls-1\" d=\"M74.62,388.36c0,173.27,140.47,313.74,313.74,313.74s313.74-140.47,313.74-313.74S561.64,74.62,388.36,74.62,74.62,215.09,74.62,388.36\"/>\n            <path class=\"cls-2\" d=\"M239.58,239.58c-82.17,82.17-82.17,215.4,0,297.57,82.17,82.17,215.4,82.17,297.57,0,82.17-82.17,82.17-215.4,0-297.57-82.17-82.17-215.4-82.17-297.57,0\"/>\n          </g>\n        </g>\n      </svg>\n      <picture>\n        <img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\" alt=\"\" lazy=\"\" />\n      </picture>\n      <div class=\"container\">\n        <slot name=\"before\"></slot>\n        <slot></slot>\n        <slot name=\"badge\"></slot>\n        <slot name=\"panel\" class=\"admin-panel\"></slot>\n      </div>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        this.classList.add('bg-primary');\n        const picture = this.shadowRoot.querySelector('picture');\n        const source = this.shadowRoot.querySelector('picture img');\n        if (this.hasAttribute('image'))\n            source.setAttribute('src', this.getAttribute('image'));\n        else\n            picture.remove();\n        if (this.querySelector('[slot=\"panel\"]'))\n            this.classList.add('has-panel');\n    }\n}\nexport default iamHeader;\n"],"names":["iamHeader","template","picture","source"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,QACb,CAAC,EACD,MAAMA,UAAkB,WAAY,CAChC,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,UAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAiD9B,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,KAAK,UAAU,IAAI,YAAY,EAC/B,MAAMC,EAAU,KAAK,WAAW,cAAc,SAAS,EACjDC,EAAS,KAAK,WAAW,cAAc,aAAa,EACtD,KAAK,aAAa,OAAO,EACzBA,EAAO,aAAa,MAAO,KAAK,aAAa,OAAO,CAAC,EAErDD,EAAQ,OAAM,EACd,KAAK,cAAc,gBAAgB,GACnC,KAAK,UAAU,IAAI,WAAW,CACtC,CACJ"}

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

@@ -18,7 +18,7 @@ class iamInlineEdit extends HTMLElement {
     
     ${loadCSS}
     </style>
-    <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
     
     <slot></slot>
     <div class="btns" part="btns">

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

@@ -1,13 +1,13 @@
 /*!
-  * iamKey v7.6.4--beta7
+  * iamKey v7.7.0
   * Copyright 2022-2026 iamproperty
   */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"inline edit"});class v extends HTMLElement{constructor(){super();const e=this.attachShadow({mode:"open"});document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const n=document.createElement("template");n.innerHTML=`
     <style class="styles">
     
-    @layer elements{.btn-action{--btn-border-width: 0.0625rem;--btn-padding-block: 0.3125rem;--btn-padding-inline: 0.3125rem;--btn-margin: 0.5rem}.btn-action:not(.btn-primary){color:var(--colour-heading)}.btn-action:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}.btn-action{border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem}.btn-action.btn[class*=fa-]:before{content:var(--fa);margin-right:0.375rem}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) .btn-action,.btn-action:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer utilities{.d-inline{display:inline !important}.d-inline-block{display:inline-block !important}.d-block{display:block !important}.d-grid{display:grid !important}.d-table{display:table !important}.d-table-row{display:table-row !important}.d-table-cell{display:table-cell !important}.d-flex{display:flex !important}.d-inline-flex{display:inline-flex !important}.d-none{display:none !important}@media screen and (min-width: 36em){.d-sm-inline{display:inline !important}.d-sm-inline-block{display:inline-block !important}.d-sm-block{display:block !important}.d-sm-grid{display:grid !important}.d-sm-table{display:table !important}.d-sm-table-row{display:table-row !important}.d-sm-table-cell{display:table-cell !important}.d-sm-flex{display:flex !important}.d-sm-inline-flex{display:inline-flex !important}.d-sm-none{display:none !important}}@media screen and (min-width: 62em){.d-md-inline{display:inline !important}.d-md-inline-block{display:inline-block !important}.d-md-block{display:block !important}.d-md-grid{display:grid !important}.d-md-table{display:table !important}.d-md-table-row{display:table-row !important}.d-md-table-cell{display:table-cell !important}.d-md-flex{display:flex !important}.d-md-inline-flex{display:inline-flex !important}.d-md-none{display:none !important}}}*,*::before,*::after{box-sizing:border-box}:host{max-width:var(--input-max-width, 50rem);display:block;font-weight:normal;margin-bottom:2rem;position:relative}.btns,.status{justify-content:flex-end;gap:.5rem;position:absolute;top:calc(100% + .5rem);right:0}.btns{display:var(--display-btns, flex);justify-content:flex-end}.status{display:var(--display-status, flex)}.btn-action{margin:0}/*# sourceMappingURL=assets/css/components/inline-edit.css.map */
+    @layer elements{.btn-action{--btn-border-width: 1px;--btn-padding-block: 0.3125rem /* 5px */;--btn-padding-inline: 0.3125rem /* 5px */;--btn-margin: 0.5rem;border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem;&:not(.btn-primary){color:var(--colour-heading)}&:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}&.btn[class*=fa-]:before{content:var(--fa);margin-right:.375rem}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) &,&:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer utilities{.d-inline{display:inline !important}.d-inline-block{display:inline-block !important}.d-block{display:block !important}.d-grid{display:grid !important}.d-table{display:table !important}.d-table-row{display:table-row !important}.d-table-cell{display:table-cell !important}.d-flex{display:flex !important}.d-inline-flex{display:inline-flex !important}.d-none{display:none !important}@media screen and (min-width: 36em){.d-sm-inline{display:inline !important}.d-sm-inline-block{display:inline-block !important}.d-sm-block{display:block !important}.d-sm-grid{display:grid !important}.d-sm-table{display:table !important}.d-sm-table-row{display:table-row !important}.d-sm-table-cell{display:table-cell !important}.d-sm-flex{display:flex !important}.d-sm-inline-flex{display:inline-flex !important}.d-sm-none{display:none !important}}@media screen and (min-width: 62em){.d-md-inline{display:inline !important}.d-md-inline-block{display:inline-block !important}.d-md-block{display:block !important}.d-md-grid{display:grid !important}.d-md-table{display:table !important}.d-md-table-row{display:table-row !important}.d-md-table-cell{display:table-cell !important}.d-md-flex{display:flex !important}.d-md-inline-flex{display:inline-flex !important}.d-md-none{display:none !important}}}*,*::before,*::after{box-sizing:border-box}:host{max-width:var(--input-max-width, 50rem);display:block;font-weight:normal;margin-bottom:2rem;position:relative}.btns,.status{justify-content:flex-end;gap:.5rem;position:absolute;top:calc(100% + .5rem);right:0}.btns{display:var(--display-btns, flex);justify-content:flex-end}.status{display:var(--display-status, flex)}.btn-action{margin:0}/*# sourceMappingURL=assets/css/components/inline-edit.css.map */
 
     </style>
-    <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
     
     <slot></slot>
     <div class="btns" part="btns">
@@ -18,5 +18,5 @@
       <span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="saved"><i class="fa-regular fa-check me-1"></i> Saved</span>
       <span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="notsaved"><i class="fa-regular fa-circle-info me-1"></i> Not Saved</span>
     </div>
-    `,e.appendChild(n.content.cloneNode(!0))}connectedCallback(){const e=this,n=this.shadowRoot.querySelector("#save"),c=this.shadowRoot.querySelector("#cancel"),t=this.querySelector("input, textarea, select"),s=this.querySelector(".preview"),o=this.shadowRoot.querySelector("#saving"),d=this.shadowRoot.querySelector("#saved"),l=this.shadowRoot.querySelector("#notsaved");let i=t?t.value:"";c.addEventListener("click",()=>{t&&(t.value=i,t.blur()),e.blur(),e.classList.remove("was-validated"),l.classList.add("d-none");const a=new CustomEvent("inline-edit-cancel",{detail:{name:t.getAttribute("name")}});e.dispatchEvent(a)}),n.addEventListener("click",()=>{if(e.querySelector(":invalid"))return e.classList.add("was-validated"),!1;i=t.value;const a=new CustomEvent("inline-edit-save",{detail:{name:t.getAttribute("name"),value:t.value}});e.dispatchEvent(a),e.blur(),o.classList.remove("d-none"),t&&(t.disabled=!0,t.blur(),s&&(s.innerHTML=t.value))}),t&&(t.tagName==="INPUT"&&t.addEventListener("keydown",a=>{switch(a.key){case"Enter":a.stopPropagation(),a.preventDefault(),n.click();break}}),t.tagName==="SELECT"&&t.addEventListener("change",()=>{i=t.value;const a=new CustomEvent("inline-edit-save",{detail:{name:t.getAttribute("name"),value:t.value}});e.dispatchEvent(a),e.setAttribute("data-saving","true"),t.disabled=!0,t.blur()}),t.tagName!="SELECT"&&t.addEventListener("focus",()=>{t.select()}),t.addEventListener("blur",()=>{if(t.value!=i)if(e.hasAttribute("data-autosave")){i=t.value;const a=new CustomEvent("inline-edit-autosave",{detail:{name:t.getAttribute("name"),value:t.value}});e.dispatchEvent(a),o.classList.remove("d-none"),s&&(s.innerHTML=t.value)}else e.querySelector(".inline-feedback")||l.classList.remove("d-none")})),e.addEventListener("inline-edit-saved",()=>{setTimeout(()=>{o.classList.add("d-none"),d.classList.remove("d-none");const a=new CustomEvent("inline-edit-confirmed",{detail:{name:t.getAttribute("name")}});e.dispatchEvent(a)},100),setTimeout(()=>{t.disabled=!1,e.removeAttribute("data-saving"),o.classList.add("d-none"),d.classList.add("d-none"),l.classList.add("d-none")},1e3)}),e.addEventListener("change",a=>{if(a&&a.target instanceof HTMLElement&&a.target.closest('input[type="checkbox"]')){let r="";Array.from(e.querySelectorAll('label input[type="checkbox"]:checked')).forEach((m,p)=>{p!=0&&(r+=", "),r+=m.value});const b=new CustomEvent("inline-edit-save",{detail:{name:a.target.closest('input[type="checkbox"]').getAttribute("name"),value:r}});e.dispatchEvent(b)}})}}export{v as default};
+    `,e.appendChild(n.content.cloneNode(!0))}connectedCallback(){const e=this,n=this.shadowRoot.querySelector("#save"),c=this.shadowRoot.querySelector("#cancel"),t=this.querySelector("input, textarea, select"),s=this.querySelector(".preview"),o=this.shadowRoot.querySelector("#saving"),d=this.shadowRoot.querySelector("#saved"),l=this.shadowRoot.querySelector("#notsaved");let i=t?t.value:"";c.addEventListener("click",()=>{t&&(t.value=i,t.blur()),e.blur(),e.classList.remove("was-validated"),l.classList.add("d-none");const a=new CustomEvent("inline-edit-cancel",{detail:{name:t.getAttribute("name")}});e.dispatchEvent(a)}),n.addEventListener("click",()=>{if(e.querySelector(":invalid"))return e.classList.add("was-validated"),!1;i=t.value;const a=new CustomEvent("inline-edit-save",{detail:{name:t.getAttribute("name"),value:t.value}});e.dispatchEvent(a),e.blur(),o.classList.remove("d-none"),t&&(t.disabled=!0,t.blur(),s&&(s.innerHTML=t.value))}),t&&(t.tagName==="INPUT"&&t.addEventListener("keydown",a=>{switch(a.key){case"Enter":a.stopPropagation(),a.preventDefault(),n.click();break}}),t.tagName==="SELECT"&&t.addEventListener("change",()=>{i=t.value;const a=new CustomEvent("inline-edit-save",{detail:{name:t.getAttribute("name"),value:t.value}});e.dispatchEvent(a),e.setAttribute("data-saving","true"),t.disabled=!0,t.blur()}),t.tagName!="SELECT"&&t.addEventListener("focus",()=>{t.select()}),t.addEventListener("blur",()=>{if(t.value!=i)if(e.hasAttribute("data-autosave")){i=t.value;const a=new CustomEvent("inline-edit-autosave",{detail:{name:t.getAttribute("name"),value:t.value}});e.dispatchEvent(a),o.classList.remove("d-none"),s&&(s.innerHTML=t.value)}else e.querySelector(".inline-feedback")||l.classList.remove("d-none")})),e.addEventListener("inline-edit-saved",()=>{setTimeout(()=>{o.classList.add("d-none"),d.classList.remove("d-none");const a=new CustomEvent("inline-edit-confirmed",{detail:{name:t.getAttribute("name")}});e.dispatchEvent(a)},100),setTimeout(()=>{t.disabled=!1,e.removeAttribute("data-saving"),o.classList.add("d-none"),d.classList.add("d-none"),l.classList.add("d-none")},1e3)}),e.addEventListener("change",a=>{if(a&&a.target instanceof HTMLElement&&a.target.closest('input[type="checkbox"]')){let r="";Array.from(e.querySelectorAll('label input[type="checkbox"]:checked')).forEach((b,p)=>{p!=0&&(r+=", "),r+=b.value});const m=new CustomEvent("inline-edit-save",{detail:{name:a.target.closest('input[type="checkbox"]').getAttribute("name"),value:r}});e.dispatchEvent(m)}})}}export{v as default};
 //# sourceMappingURL=inline-edit.component.min.js.map

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

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

package/assets/js/components/input/input.component.js

@@ -13,7 +13,7 @@ class iamInput extends HTMLElement {
     <style>
     ${loadCSS}
     </style>
-    <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
     <div class="wrapper" part="wrapper">
       <span part="prefix"><slot name="prefix"></slot></span>
       <slot part="input-wrapper"></slot>

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

@@ -1,12 +1,12 @@
 /*!
-  * iamKey v7.6.4--beta7
+  * iamKey v7.7.0
   * Copyright 2022-2026 iamproperty
   */const q=k=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:k})};q("iam-iamPrefix");class _ extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const s=document.createElement("template");s.innerHTML=`
     <style>
-    @layer elements{:is(.prefix,.suffix){display:none}:is(.prefix,.suffix){--fa-display: flex;display:inline-block;display:flex;flex-direction:column;justify-content:center;align-items:center;width:auto;padding:0 .75rem;font-size:var(--input-fs, 1rem);line-height:var(--input-lh, 1.25rem);color:var(--colour-body);background-color:var(--colour-primary-theme);border:2px solid var(--colour-primary);color:var(--colour-white);margin:0 !important;border-end-start-radius:.5rem;border-start-start-radius:.5rem;min-width:calc(2.75rem + 4px);overflow:hidden;white-space:nowrap;text-align:center;text-overflow:ellipsis;position:relative;height:calc(var(--input-padding-block, 0.75rem) + var(--input-padding-block, 0.75rem) + var(--input-lh, 1.25rem) + 4px)}@supports(height: stretch){:is(.prefix,.suffix){height:stretch}}:is(.prefix,.suffix){flex-shrink:0}:is(.prefix,.suffix):after{display:inline-block;max-width:1.25rem}:is(.prefix,.suffix)[class*=fa-]{width:calc(2.75rem + 4px);padding-inline:0}:is(.prefix,.suffix) select{position:absolute;inset:0;opacity:0;cursor:pointer}:is(.prefix,.suffix) span{display:none}:is(.prefix,.suffix) select:has(option:nth-child(1):checked)~span:nth-of-type(1),:is(.prefix,.suffix) select:has(option:nth-child(2):checked)~span:nth-of-type(2),:is(.prefix,.suffix) select:has(option:nth-child(3):checked)~span:nth-of-type(3),:is(.prefix,.suffix) select:has(option:nth-child(4):checked)~span:nth-of-type(4),:is(.prefix,.suffix) select:has(option:nth-child(5):checked)~span:nth-of-type(5),:is(.prefix,.suffix) select:has(option:nth-child(6):checked)~span:nth-of-type(6),:is(.prefix,.suffix) select:has(option:nth-child(7):checked)~span:nth-of-type(7),:is(.prefix,.suffix) select:has(option:nth-child(8):checked)~span:nth-of-type(8),:is(.prefix,.suffix) select:has(option:nth-child(9):checked)~span:nth-of-type(9),:is(.prefix,.suffix) select:has(option:nth-child(10):checked)~span:nth-of-type(10){display:block}:is(.prefix,.suffix) select~span:after{content:" \uF078";font-family:"Font Awesome 6 Pro";font-size:.8em;display:inline-block;padding-left:1em}:is(.prefix,.suffix) select:focus-visible~span:after{content:"\uF077"}.prefix{border-right:none}.suffix{border-left:none;border-end-start-radius:0;border-start-start-radius:0;border-start-end-radius:.5rem !important;border-end-end-radius:.5rem !important;order:2}.prefix span{display:none}.prefix span small{font-size:.8em}.prefix~:is(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]),textarea,output){border-end-start-radius:0 !important;border-start-start-radius:0 !important}}*,*::before,*::after{box-sizing:border-box}.wrapper{display:flex;margin-top:.5rem}:host{display:block;max-width:var(--input-max-width, 50rem)}::slotted(input){margin:0 !important}::slotted(input.has-prefix){margin:0 !important;border-start-start-radius:0 !important;border-end-start-radius:0 !important}::slotted(input.has-suffix){border-start-end-radius:0 !important;border-end-end-radius:0 !important}::slotted(input[type=color]){width:3rem !important;flex-shrink:0 !important;flex-grow:0 !important;border-start-end-radius:0 !important;border-end-end-radius:0 !important;padding:0 !important;overflow:hidden}::slotted(input[type=color])::-webkit-color-swatch{border-radius:0;border:none}::slotted(output){border-left:none !important;border-end-start-radius:0 !important;border-start-start-radius:0 !important;margin:0 !important}@layer elements{::slotted(select:is([slot=prefix],[slot=suffix])){--option-colour: red;margin:0 !important;padding-top:0 !important;padding-left:.25rem !important;padding-bottom:0 !important;padding-right:2rem !important;margin-right:0rem !important;border:none !important;height:100% !important;max-height:100% !important;min-height:100% !important;background:var(--icon-select) !important;background-position:center right !important;background-size:1.25rem !important;background-repeat:no-repeat !important;background-color:var(--colour-primary) !important;color:var(--colour-white) !important;field-sizing:content !important}}.suffix[role=button]{cursor:pointer}/*# sourceMappingURL=assets/css/components/input.component.css.map */
+    @layer elements{:is(.prefix,.suffix){display:none}:is(.prefix,.suffix){--fa-display: flex;display:flex;flex-direction:column;justify-content:center;align-items:center;width:auto;padding:0 .75rem;font-size:var(--input-fs, 1rem);line-height:var(--input-lh, 1.25rem);color:var(--colour-body);background-color:var(--colour-primary-theme);border:2px solid var(--colour-primary);color:var(--colour-white);margin:0 !important;border-end-start-radius:.5rem;border-start-start-radius:.5rem;min-width:calc(2.75rem + 4px);overflow:hidden;white-space:nowrap;text-align:center;text-overflow:ellipsis;position:relative;height:calc(var(--input-padding-block, 0.75rem) + var(--input-padding-block, 0.75rem) + var(--input-lh, 1.25rem) + 4px)}@supports(height: stretch){:is(.prefix,.suffix){height:stretch}}:is(.prefix,.suffix){flex-shrink:0}:is(.prefix,.suffix):after{display:inline-block;max-width:1.25rem}:is(.prefix,.suffix)[class*=fa-]{width:calc(2.75rem + 4px);padding-inline:0}:is(.prefix,.suffix) select{position:absolute;inset:0;opacity:0;cursor:pointer}:is(.prefix,.suffix) span{display:none}:is(.prefix,.suffix) select:has(option:nth-child(1):checked)~span:nth-of-type(1),:is(.prefix,.suffix) select:has(option:nth-child(2):checked)~span:nth-of-type(2),:is(.prefix,.suffix) select:has(option:nth-child(3):checked)~span:nth-of-type(3),:is(.prefix,.suffix) select:has(option:nth-child(4):checked)~span:nth-of-type(4),:is(.prefix,.suffix) select:has(option:nth-child(5):checked)~span:nth-of-type(5),:is(.prefix,.suffix) select:has(option:nth-child(6):checked)~span:nth-of-type(6),:is(.prefix,.suffix) select:has(option:nth-child(7):checked)~span:nth-of-type(7),:is(.prefix,.suffix) select:has(option:nth-child(8):checked)~span:nth-of-type(8),:is(.prefix,.suffix) select:has(option:nth-child(9):checked)~span:nth-of-type(9),:is(.prefix,.suffix) select:has(option:nth-child(10):checked)~span:nth-of-type(10){display:block}:is(.prefix,.suffix) select~span:after{content:" \uF078";font-family:"Font Awesome 7 Pro";font-size:.8em;display:inline-block;padding-left:1em}:is(.prefix,.suffix) select:focus-visible~span:after{content:"\uF077"}@container style(--font-body){:is(.prefix,.suffix)::before{content:var(--iso) !important}}@container style(--fa-font-regular){:is(.prefix,.suffix)::before{content:var(--fa) !important}}.prefix{border-right:none}.suffix{border-left:none;border-end-start-radius:0;border-start-start-radius:0;border-start-end-radius:.5rem !important;border-end-end-radius:.5rem !important;order:2}.prefix span{display:none}.prefix span small{font-size:.8em}.prefix~:is(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]),textarea,output){border-end-start-radius:0 !important;border-start-start-radius:0 !important}}@layer utilities{.fa-right{--iso: "\u2192"}.fa-chevron-right{--iso: ">"}.fa-left{--iso: "\u2190"}.fa-chevron-left{--iso: "<"}.fa-up{--iso: "\u2191"}.fa-chevron-up{--iso: "\u2227"}.fa-down{--iso: "\u2193"}.fa-chevron-down{--iso: "\u2228"}.fa-plus{--iso: "+"}.fa-bars{--iso: "\u039E"}.fa-bars{--iso: "\u039E"}.fa-edit{--iso: "\u270E"}.fa-envelope{--iso: "\u2709"}.fa-calendar{--iso: "\u2636"}}*,*::before,*::after{box-sizing:border-box}.wrapper{display:flex;margin-top:.5rem}:host{display:block;max-width:var(--input-max-width, 50rem)}::slotted(input){margin:0 !important}::slotted(input.has-prefix){margin:0 !important;border-start-start-radius:0 !important;border-end-start-radius:0 !important}::slotted(input.has-suffix){border-start-end-radius:0 !important;border-end-end-radius:0 !important}::slotted(input[type=color]){width:3rem !important;flex-shrink:0 !important;flex-grow:0 !important;border-start-end-radius:0 !important;border-end-end-radius:0 !important;padding:0 !important;overflow:hidden}::slotted(input[type=color])::-webkit-color-swatch{border-radius:0;border:none}::slotted(output){border-left:none !important;border-end-start-radius:0 !important;border-start-start-radius:0 !important;margin:0 !important}@layer elements{::slotted(select:is([slot=prefix],[slot=suffix])){--option-colour: red;margin:0 !important;padding-top:0 !important;padding-left:.25rem !important;padding-bottom:0 !important;padding-right:2rem !important;margin-right:0rem !important;border:none !important;height:100% !important;max-height:100% !important;min-height:100% !important;background:var(--icon-select) !important;background-position:center right !important;background-size:1.25rem !important;background-repeat:no-repeat !important;background-color:var(--colour-primary) !important;color:var(--colour-white) !important;field-sizing:content !important}}.suffix[role=button]{cursor:pointer}/*# sourceMappingURL=assets/css/components/input.component.css.map */
 
     </style>
-    <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
     <div class="wrapper" part="wrapper">
       <span part="prefix"><slot name="prefix"></slot></span>
       <slot part="input-wrapper"></slot>

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

@@ -1 +1 @@
-{"version":3,"file":"input.component.min.js","sources":["../_global.js","input.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.js';\ntrackComponentRegistered('iam-iamPrefix');\nclass iamInput 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/input.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/26fdbf0179.css\" crossorigin=\"anonymous\">\n    <div class=\"wrapper\" part=\"wrapper\">\n      <span part=\"prefix\"><slot name=\"prefix\"></slot></span>\n      <slot part=\"input-wrapper\"></slot>\n      <slot part=\"suffix\"><slot name=\"suffix\"></slot></slot>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;\n        const component = this;\n        const input = this.querySelector('input');\n        const inputType = (input === null || input === void 0 ? void 0 : input.hasAttribute('type')) ? input === null || input === void 0 ? void 0 : input.getAttribute('type') : 'text';\n        const prefixIcon = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('[part=\"prefix\"]');\n        const suffixIcon = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('[part=\"suffix\"]');\n        if (this.closest('label'))\n            this.classList.add('mb-0');\n        const setIcon = (inputType) => {\n            // Pre set the icons\n            switch (inputType) {\n                case \"date\":\n                case \"datetime-local\":\n                case \"year\":\n                case \"month\":\n                case \"week\":\n                    this.setAttribute('data-suffix-icon', 'calendar');\n                    suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.setAttribute('role', 'button');\n                    break;\n                case \"time\":\n                    this.setAttribute('data-suffix-icon', 'clock');\n                    suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.setAttribute('role', 'button');\n                    break;\n                default:\n                    this.removeAttribute('data-suffix-icon');\n                    suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.removeAttribute('role');\n                    break;\n            }\n        };\n        setIcon(inputType);\n        const setCurrencyRules = () => {\n            let originalValue = input.value.replace(',', '');\n            input === null || input === void 0 ? void 0 : input.setAttribute('data-value', originalValue);\n            input.setAttribute('type', 'text');\n            originalValue = new Intl.NumberFormat(\"en-GB\", {\n                style: \"currency\",\n                currency: \"GBP\",\n                minimumFractionDigits: Number.isInteger(originalValue) ? 0 : 2,\n                maximumFractionDigits: Number.isInteger(originalValue) ? 0 : 2,\n                trailingZeroDisplay: 'stripIfInteger' // Strip zeros if it's an integer\n            }).format(originalValue).replace(\"£\", \"\");\n            input.value = originalValue;\n        };\n        // Currency type\n        if (component === null || component === void 0 ? void 0 : component.hasAttribute('data-currency')) {\n            // Pre set the icons\n            switch (component === null || component === void 0 ? void 0 : component.hasAttribute('data-currency')) {\n                case \"dollar\":\n                    component.setAttribute('data-prefix-icon', 'dollar-sign');\n                    break;\n                case \"euro\":\n                    component.setAttribute('data-prefix-icon', 'euro-sign');\n                    break;\n                default:\n                    component.setAttribute('data-prefix-icon', 'sterling-sign');\n                    break;\n            }\n            setCurrencyRules();\n            input === null || input === void 0 ? void 0 : input.addEventListener('focus', (event) => {\n                input.setAttribute('type', 'number');\n                input.value = input.getAttribute('data-value');\n                input.setAttribute('value', input.getAttribute('data-value'));\n            });\n            input === null || input === void 0 ? void 0 : input.addEventListener('input', (event) => {\n                input === null || input === void 0 ? void 0 : input.setAttribute('data-value', input.value);\n            });\n            input === null || input === void 0 ? void 0 : input.addEventListener('blur', (event) => {\n                setCurrencyRules();\n            });\n        }\n        // Colour input field\n        if (input === null || input === void 0 ? void 0 : input.matches('[type=\"color\"]')) {\n            this.insertAdjacentHTML('beforeend', `<output></output>`);\n            input.addEventListener('input', () => {\n                input.nextElementSibling.value = input.value;\n            });\n        }\n        if (this.hasAttribute('data-prefix-icon')) {\n            prefixIcon === null || prefixIcon === void 0 ? void 0 : prefixIcon.className = `prefix fa-${this.hasAttribute('data-prefix-weight') ? this.getAttribute('data-prefix-weight') : 'regular'} fa-${this.getAttribute('data-prefix-icon')}`;\n            (_c = this.querySelector('input')) === null || _c === void 0 ? void 0 : _c.classList.add('has-prefix');\n        }\n        if (this.hasAttribute('data-suffix-icon')) {\n            suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.className = `suffix fa-${this.hasAttribute('data-suffix-weight') ? this.getAttribute('data-suffix-weight') : 'regular'} fa-${this.getAttribute('data-suffix-icon')}`;\n            (_d = this.querySelector('input')) === null || _d === void 0 ? void 0 : _d.classList.add('has-suffix');\n        }\n        if ((_e = this.shadowRoot.querySelector('[name=\"prefix\"]')) === null || _e === void 0 ? void 0 : _e.assignedElements().length) {\n            (_f = this.shadowRoot.querySelector('[name=\"prefix\"]')) === null || _f === void 0 ? void 0 : _f.classList.add('prefix');\n            (_g = this.querySelector('input')) === null || _g === void 0 ? void 0 : _g.classList.add('has-prefix');\n        }\n        if ((_h = this.shadowRoot.querySelector('[name=\"suffix\"]')) === null || _h === void 0 ? void 0 : _h.assignedElements().length) {\n            (_j = this.shadowRoot.querySelector('[name=\"suffix\"]')) === null || _j === void 0 ? void 0 : _j.classList.add('suffix');\n            (_k = this.querySelector('input')) === null || _k === void 0 ? void 0 : _k.classList.add('has-suffix');\n        }\n        // Change type\n        if (this.querySelector('[data-change-type]')) {\n            const select = this.querySelector('[data-change-type]');\n            select.addEventListener('change', () => {\n                input.setAttribute('type', select.value);\n                setIcon(select.value);\n                if (this.getAttribute('data-suffix-icon')) {\n                    suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.className = `suffix fa-${this.hasAttribute('data-suffix-weight') ? this.getAttribute('data-suffix-weight') : 'regular'} fa-${this.getAttribute('data-suffix-icon')}`;\n                    input === null || input === void 0 ? void 0 : input.classList.add('has-suffix');\n                }\n                else {\n                    suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.removeAttribute('class');\n                    input === null || input === void 0 ? void 0 : input.classList.remove('has-suffix');\n                }\n            });\n        }\n        // #region Date restrictions\n        const today = new Date();\n        function formatDate(date, type = \"date\") {\n            const year = date.getFullYear();\n            const month = String(date.getMonth() + 1).padStart(2, '0');\n            const day = String(date.getDate()).padStart(2, '0');\n            if (type == \"datetime-local\")\n                return `${year}-${month}-${day}T00:00:00`;\n            return `${year}-${month}-${day}`;\n        }\n        const checkDayAllowed = (input, allowedDays) => {\n            const day = new Date(input.value).getUTCDay();\n            if (allowedDays.includes(day))\n                input.setCustomValidity('');\n            else\n                input.setCustomValidity('That day of the week is not allowed');\n        };\n        if ((input === null || input === void 0 ? void 0 : input.matches('[type=\"date\"], [type=\"datetime-local\"]')) && this.hasAttribute('data-allowed-days')) {\n            const allowedDays = JSON.parse(`[${this.getAttribute('data-allowed-days')}]`);\n            checkDayAllowed(input, allowedDays);\n            input.addEventListener('input', () => { checkDayAllowed(input, allowedDays); });\n        }\n        // #endregion\n        suffixIcon.addEventListener('click', function () {\n            if (!(component === null || component === void 0 ? void 0 : component.querySelector('select[data-change-type][slot=\"suffix\"]')))\n                input.showPicker();\n        });\n        prefixIcon.addEventListener('click', function () {\n            if (!(component === null || component === void 0 ? void 0 : component.querySelector('select[data-change-type][slot=\"prefix\"]')))\n                input.showPicker();\n        });\n        // Duplicate input watches\n        if (component.hasAttribute('data-duplicate')) {\n            const id = component.getAttribute('data-duplicate');\n            const watchedInputs = document.querySelectorAll(`[name=\"${id}\"], [id=\"${id}\"]`);\n            input.addEventListener('change', (event) => {\n                var _a;\n                if (input.closest('iam-modal'))\n                    return false;\n                if ((input === null || input === void 0 ? void 0 : input.matches('[type=\"checkbox\"]')) && (watchedInput === null || watchedInput === void 0 ? void 0 : watchedInput.matches('[type=\"checkbox\"]'))) {\n                    watchedInput.checked = event.target.checked;\n                    if (!event.detail && !((_a = event.detail) === null || _a === void 0 ? void 0 : _a.triggered)) {\n                        const changeEvent = new CustomEvent('change', { detail: { triggered: true } });\n                        watchedInput === null || watchedInput === void 0 ? void 0 : watchedInput.dispatchEvent(changeEvent);\n                    }\n                }\n            });\n            Array.from(watchedInputs).forEach((watchedInput) => {\n                watchedInput === null || watchedInput === void 0 ? void 0 : watchedInput.addEventListener('change', (event) => {\n                    var _a, _b;\n                    // If both the duplicate input and the watched input are checkboxes\n                    if ((input === null || input === void 0 ? void 0 : input.matches('[type=\"checkbox\"]')) && (watchedInput === null || watchedInput === void 0 ? void 0 : watchedInput.matches('[type=\"checkbox\"]'))) {\n                        input.checked = event.target.checked;\n                        if (!event.detail && !((_a = event.detail) === null || _a === void 0 ? void 0 : _a.triggered)) {\n                            const changeEvent = new CustomEvent('change', { detail: { triggered: true } });\n                            input === null || input === void 0 ? void 0 : input.dispatchEvent(changeEvent);\n                        }\n                    }\n                    // if input is not a checkbox BUT the watched input is\n                    // Then we need to create the input's value\n                    if (!(input === null || input === void 0 ? void 0 : input.matches('[type=\"checkbox\"]')) && (watchedInput === null || watchedInput === void 0 ? void 0 : watchedInput.matches('[type=\"checkbox\"]'))) {\n                        let computedValue = '';\n                        Array.from(document.querySelectorAll(`[name=\"${id}\"]:checked`)).forEach((loopInput) => {\n                            computedValue += (computedValue == '' ? '' : ',') + loopInput.value;\n                        });\n                        input.value = computedValue;\n                        if (!event.detail && !((_b = event.detail) === null || _b === void 0 ? void 0 : _b.triggered)) {\n                            const changeEvent = new CustomEvent('change', { detail: { triggered: true } });\n                            input === null || input === void 0 ? void 0 : input.dispatchEvent(changeEvent);\n                        }\n                    }\n                });\n            });\n        }\n    }\n}\nexport default iamInput;\n"],"names":["trackComponentRegistered","componentName","iamInput","template","_a","_b","_c","_d","_e","_f","_g","_h","_j","_k","component","input","inputType","prefixIcon","suffixIcon","setIcon","setCurrencyRules","originalValue","event","select","checkDayAllowed","allowedDays","day","id","watchedInputs","changeEvent","watchedInput","computedValue","loopInput"],"mappings":"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"}
+{"version":3,"file":"input.component.min.js","sources":["../_global.js","input.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.js';\ntrackComponentRegistered('iam-iamPrefix');\nclass iamInput 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/input.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\" part=\"wrapper\">\n      <span part=\"prefix\"><slot name=\"prefix\"></slot></span>\n      <slot part=\"input-wrapper\"></slot>\n      <slot part=\"suffix\"><slot name=\"suffix\"></slot></slot>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;\n        const component = this;\n        const input = this.querySelector('input');\n        const inputType = (input === null || input === void 0 ? void 0 : input.hasAttribute('type')) ? input === null || input === void 0 ? void 0 : input.getAttribute('type') : 'text';\n        const prefixIcon = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('[part=\"prefix\"]');\n        const suffixIcon = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('[part=\"suffix\"]');\n        if (this.closest('label'))\n            this.classList.add('mb-0');\n        const setIcon = (inputType) => {\n            // Pre set the icons\n            switch (inputType) {\n                case \"date\":\n                case \"datetime-local\":\n                case \"year\":\n                case \"month\":\n                case \"week\":\n                    this.setAttribute('data-suffix-icon', 'calendar');\n                    suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.setAttribute('role', 'button');\n                    break;\n                case \"time\":\n                    this.setAttribute('data-suffix-icon', 'clock');\n                    suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.setAttribute('role', 'button');\n                    break;\n                default:\n                    this.removeAttribute('data-suffix-icon');\n                    suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.removeAttribute('role');\n                    break;\n            }\n        };\n        setIcon(inputType);\n        const setCurrencyRules = () => {\n            let originalValue = input.value.replace(',', '');\n            input === null || input === void 0 ? void 0 : input.setAttribute('data-value', originalValue);\n            input.setAttribute('type', 'text');\n            originalValue = new Intl.NumberFormat(\"en-GB\", {\n                style: \"currency\",\n                currency: \"GBP\",\n                minimumFractionDigits: Number.isInteger(originalValue) ? 0 : 2,\n                maximumFractionDigits: Number.isInteger(originalValue) ? 0 : 2,\n                trailingZeroDisplay: 'stripIfInteger' // Strip zeros if it's an integer\n            }).format(originalValue).replace(\"£\", \"\");\n            input.value = originalValue;\n        };\n        // Currency type\n        if (component === null || component === void 0 ? void 0 : component.hasAttribute('data-currency')) {\n            // Pre set the icons\n            switch (component === null || component === void 0 ? void 0 : component.hasAttribute('data-currency')) {\n                case \"dollar\":\n                    component.setAttribute('data-prefix-icon', 'dollar-sign');\n                    break;\n                case \"euro\":\n                    component.setAttribute('data-prefix-icon', 'euro-sign');\n                    break;\n                default:\n                    component.setAttribute('data-prefix-icon', 'sterling-sign');\n                    break;\n            }\n            setCurrencyRules();\n            input === null || input === void 0 ? void 0 : input.addEventListener('focus', (event) => {\n                input.setAttribute('type', 'number');\n                input.value = input.getAttribute('data-value');\n                input.setAttribute('value', input.getAttribute('data-value'));\n            });\n            input === null || input === void 0 ? void 0 : input.addEventListener('input', (event) => {\n                input === null || input === void 0 ? void 0 : input.setAttribute('data-value', input.value);\n            });\n            input === null || input === void 0 ? void 0 : input.addEventListener('blur', (event) => {\n                setCurrencyRules();\n            });\n        }\n        // Colour input field\n        if (input === null || input === void 0 ? void 0 : input.matches('[type=\"color\"]')) {\n            this.insertAdjacentHTML('beforeend', `<output></output>`);\n            input.addEventListener('input', () => {\n                input.nextElementSibling.value = input.value;\n            });\n        }\n        if (this.hasAttribute('data-prefix-icon')) {\n            prefixIcon === null || prefixIcon === void 0 ? void 0 : prefixIcon.className = `prefix fa-${this.hasAttribute('data-prefix-weight') ? this.getAttribute('data-prefix-weight') : 'regular'} fa-${this.getAttribute('data-prefix-icon')}`;\n            (_c = this.querySelector('input')) === null || _c === void 0 ? void 0 : _c.classList.add('has-prefix');\n        }\n        if (this.hasAttribute('data-suffix-icon')) {\n            suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.className = `suffix fa-${this.hasAttribute('data-suffix-weight') ? this.getAttribute('data-suffix-weight') : 'regular'} fa-${this.getAttribute('data-suffix-icon')}`;\n            (_d = this.querySelector('input')) === null || _d === void 0 ? void 0 : _d.classList.add('has-suffix');\n        }\n        if ((_e = this.shadowRoot.querySelector('[name=\"prefix\"]')) === null || _e === void 0 ? void 0 : _e.assignedElements().length) {\n            (_f = this.shadowRoot.querySelector('[name=\"prefix\"]')) === null || _f === void 0 ? void 0 : _f.classList.add('prefix');\n            (_g = this.querySelector('input')) === null || _g === void 0 ? void 0 : _g.classList.add('has-prefix');\n        }\n        if ((_h = this.shadowRoot.querySelector('[name=\"suffix\"]')) === null || _h === void 0 ? void 0 : _h.assignedElements().length) {\n            (_j = this.shadowRoot.querySelector('[name=\"suffix\"]')) === null || _j === void 0 ? void 0 : _j.classList.add('suffix');\n            (_k = this.querySelector('input')) === null || _k === void 0 ? void 0 : _k.classList.add('has-suffix');\n        }\n        // Change type\n        if (this.querySelector('[data-change-type]')) {\n            const select = this.querySelector('[data-change-type]');\n            select.addEventListener('change', () => {\n                input.setAttribute('type', select.value);\n                setIcon(select.value);\n                if (this.getAttribute('data-suffix-icon')) {\n                    suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.className = `suffix fa-${this.hasAttribute('data-suffix-weight') ? this.getAttribute('data-suffix-weight') : 'regular'} fa-${this.getAttribute('data-suffix-icon')}`;\n                    input === null || input === void 0 ? void 0 : input.classList.add('has-suffix');\n                }\n                else {\n                    suffixIcon === null || suffixIcon === void 0 ? void 0 : suffixIcon.removeAttribute('class');\n                    input === null || input === void 0 ? void 0 : input.classList.remove('has-suffix');\n                }\n            });\n        }\n        // #region Date restrictions\n        const today = new Date();\n        function formatDate(date, type = \"date\") {\n            const year = date.getFullYear();\n            const month = String(date.getMonth() + 1).padStart(2, '0');\n            const day = String(date.getDate()).padStart(2, '0');\n            if (type == \"datetime-local\")\n                return `${year}-${month}-${day}T00:00:00`;\n            return `${year}-${month}-${day}`;\n        }\n        const checkDayAllowed = (input, allowedDays) => {\n            const day = new Date(input.value).getUTCDay();\n            if (allowedDays.includes(day))\n                input.setCustomValidity('');\n            else\n                input.setCustomValidity('That day of the week is not allowed');\n        };\n        if ((input === null || input === void 0 ? void 0 : input.matches('[type=\"date\"], [type=\"datetime-local\"]')) && this.hasAttribute('data-allowed-days')) {\n            const allowedDays = JSON.parse(`[${this.getAttribute('data-allowed-days')}]`);\n            checkDayAllowed(input, allowedDays);\n            input.addEventListener('input', () => { checkDayAllowed(input, allowedDays); });\n        }\n        // #endregion\n        suffixIcon.addEventListener('click', function () {\n            if (!(component === null || component === void 0 ? void 0 : component.querySelector('select[data-change-type][slot=\"suffix\"]')))\n                input.showPicker();\n        });\n        prefixIcon.addEventListener('click', function () {\n            if (!(component === null || component === void 0 ? void 0 : component.querySelector('select[data-change-type][slot=\"prefix\"]')))\n                input.showPicker();\n        });\n        // Duplicate input watches\n        if (component.hasAttribute('data-duplicate')) {\n            const id = component.getAttribute('data-duplicate');\n            const watchedInputs = document.querySelectorAll(`[name=\"${id}\"], [id=\"${id}\"]`);\n            input.addEventListener('change', (event) => {\n                var _a;\n                if (input.closest('iam-modal'))\n                    return false;\n                if ((input === null || input === void 0 ? void 0 : input.matches('[type=\"checkbox\"]')) && (watchedInput === null || watchedInput === void 0 ? void 0 : watchedInput.matches('[type=\"checkbox\"]'))) {\n                    watchedInput.checked = event.target.checked;\n                    if (!event.detail && !((_a = event.detail) === null || _a === void 0 ? void 0 : _a.triggered)) {\n                        const changeEvent = new CustomEvent('change', { detail: { triggered: true } });\n                        watchedInput === null || watchedInput === void 0 ? void 0 : watchedInput.dispatchEvent(changeEvent);\n                    }\n                }\n            });\n            Array.from(watchedInputs).forEach((watchedInput) => {\n                watchedInput === null || watchedInput === void 0 ? void 0 : watchedInput.addEventListener('change', (event) => {\n                    var _a, _b;\n                    // If both the duplicate input and the watched input are checkboxes\n                    if ((input === null || input === void 0 ? void 0 : input.matches('[type=\"checkbox\"]')) && (watchedInput === null || watchedInput === void 0 ? void 0 : watchedInput.matches('[type=\"checkbox\"]'))) {\n                        input.checked = event.target.checked;\n                        if (!event.detail && !((_a = event.detail) === null || _a === void 0 ? void 0 : _a.triggered)) {\n                            const changeEvent = new CustomEvent('change', { detail: { triggered: true } });\n                            input === null || input === void 0 ? void 0 : input.dispatchEvent(changeEvent);\n                        }\n                    }\n                    // if input is not a checkbox BUT the watched input is\n                    // Then we need to create the input's value\n                    if (!(input === null || input === void 0 ? void 0 : input.matches('[type=\"checkbox\"]')) && (watchedInput === null || watchedInput === void 0 ? void 0 : watchedInput.matches('[type=\"checkbox\"]'))) {\n                        let computedValue = '';\n                        Array.from(document.querySelectorAll(`[name=\"${id}\"]:checked`)).forEach((loopInput) => {\n                            computedValue += (computedValue == '' ? '' : ',') + loopInput.value;\n                        });\n                        input.value = computedValue;\n                        if (!event.detail && !((_b = event.detail) === null || _b === void 0 ? void 0 : _b.triggered)) {\n                            const changeEvent = new CustomEvent('change', { detail: { triggered: true } });\n                            input === null || input === void 0 ? void 0 : input.dispatchEvent(changeEvent);\n                        }\n                    }\n                });\n            });\n        }\n    }\n}\nexport default iamInput;\n"],"names":["trackComponentRegistered","componentName","iamInput","template","_a","_b","_c","_d","_e","_f","_g","_h","_j","_k","component","input","inputType","prefixIcon","suffixIcon","setIcon","setCurrencyRules","originalValue","event","select","checkDayAllowed","allowedDays","day","id","watchedInputs","changeEvent","watchedInput","computedValue","loopInput"],"mappings":"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"}

package/assets/js/components/input-range/input-range.component.js

@@ -13,7 +13,7 @@ class iamDaterange extends HTMLElement {
     <style>
       ${loadCSS}
     </style>
-    <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
     <div class="wrapper" part="wrapper">
       <slot></slot>
     </div>

package/assets/js/components/input-range/input-range.component.min.js

@@ -1,12 +1,12 @@
 /*!
-  * iamKey v7.6.4--beta7
+  * iamKey v7.7.0
   * Copyright 2022-2026 iamproperty
   */const o=s=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:s})};o("iam-iamPrefix");class i 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>
       :host{margin-bottom:1.5rem;display:block}.wrapper{display:flex;max-width:var(--input-max-width, 50rem);gap:calc(var(--gap, 1rem)/2);flex-direction:column}@media screen and (min-width: 36em){.wrapper{flex-direction:row;align-items:center}}::slotted(*){flex-grow:1 !important;flex-shrink:1 !important;flex-basis:50% !important;margin-bottom:0 !important}::slotted(:first-child){order:1}::slotted(:last-child){order:3}@media screen and (min-width: 36em){.wrapper:before{content:"";order:2;width:calc(var(--gap, 1rem)*1.5);height:2px;background-color:var(--colour-border);margin-top:.5rem}}/*# sourceMappingURL=assets/css/components/input-range.component.css.map */
 
     </style>
-    <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous">
     <div class="wrapper" part="wrapper">
       <slot></slot>
     </div>

package/assets/js/components/input-range/input-range.component.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-range.component.min.js","sources":["../_global.js","input-range.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.js';\ntrackComponentRegistered('iam-iamPrefix');\nclass iamDaterange 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/input-range.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/26fdbf0179.css\" crossorigin=\"anonymous\">\n    <div class=\"wrapper\" part=\"wrapper\">\n      <slot></slot>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        const inputs = this.querySelectorAll('input,select');\n        if (inputs.length > 1) {\n            const setMinMax = () => {\n                const min = inputs[0].value;\n                let max = inputs[1].value;\n                // Make sure the second input/select is always higher than the first input/select\n                if (parseInt(inputs[1].value) < parseInt(inputs[0].value)) {\n                    max = min;\n                    inputs[1].value = min;\n                }\n                // First input/select\n                if (inputs[0].matches('input'))\n                    inputs[0].setAttribute('max', max);\n                if (inputs[0].matches('select')) {\n                    Array.from(inputs[0].querySelectorAll('option')).forEach((option) => {\n                        if (parseInt(option.getAttribute('value')) > max)\n                            option.classList.add('d-none');\n                        else\n                            option.classList.remove('d-none');\n                    });\n                }\n                // Second input/select\n                if (inputs[1].matches('input'))\n                    inputs[1].setAttribute('min', min);\n                Array.from(inputs[1].querySelectorAll('option')).forEach((option) => {\n                    if (parseInt(option.getAttribute('value')) < min)\n                        option.classList.add('d-none');\n                    else\n                        option.classList.remove('d-none');\n                });\n            };\n            setMinMax();\n            this.addEventListener('change', () => {\n                setMinMax();\n            });\n        }\n    }\n}\nexport default iamDaterange;\n"],"names":["trackComponentRegistered","componentName","iamDaterange","template","inputs","setMinMax","min","max","option"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,ECNAD,EAAyB,eAAe,EACxC,MAAME,UAAqB,WAAY,CACnC,aAAc,CACV,MAAK,EACL,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MASrB,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,MAAMC,EAAS,KAAK,iBAAiB,cAAc,EACnD,GAAIA,EAAO,OAAS,EAAG,CACnB,MAAMC,EAAY,IAAM,CACpB,MAAMC,EAAMF,EAAO,CAAC,EAAE,MACtB,IAAIG,EAAMH,EAAO,CAAC,EAAE,MAEhB,SAASA,EAAO,CAAC,EAAE,KAAK,EAAI,SAASA,EAAO,CAAC,EAAE,KAAK,IACpDG,EAAMD,EACNF,EAAO,CAAC,EAAE,MAAQE,GAGlBF,EAAO,CAAC,EAAE,QAAQ,OAAO,GACzBA,EAAO,CAAC,EAAE,aAAa,MAAOG,CAAG,EACjCH,EAAO,CAAC,EAAE,QAAQ,QAAQ,GAC1B,MAAM,KAAKA,EAAO,CAAC,EAAE,iBAAiB,QAAQ,CAAC,EAAE,QAASI,GAAW,CAC7D,SAASA,EAAO,aAAa,OAAO,CAAC,EAAID,EACzCC,EAAO,UAAU,IAAI,QAAQ,EAE7BA,EAAO,UAAU,OAAO,QAAQ,CACxC,CAAC,EAGDJ,EAAO,CAAC,EAAE,QAAQ,OAAO,GACzBA,EAAO,CAAC,EAAE,aAAa,MAAOE,CAAG,EACrC,MAAM,KAAKF,EAAO,CAAC,EAAE,iBAAiB,QAAQ,CAAC,EAAE,QAASI,GAAW,CAC7D,SAASA,EAAO,aAAa,OAAO,CAAC,EAAIF,EACzCE,EAAO,UAAU,IAAI,QAAQ,EAE7BA,EAAO,UAAU,OAAO,QAAQ,CACxC,CAAC,CACL,EACAH,EAAS,EACT,KAAK,iBAAiB,SAAU,IAAM,CAClCA,EAAS,CACb,CAAC,CACL,CACJ,CACJ"}
+{"version":3,"file":"input-range.component.min.js","sources":["../_global.js","input-range.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.js';\ntrackComponentRegistered('iam-iamPrefix');\nclass iamDaterange 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/input-range.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\" part=\"wrapper\">\n      <slot></slot>\n    </div>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        const inputs = this.querySelectorAll('input,select');\n        if (inputs.length > 1) {\n            const setMinMax = () => {\n                const min = inputs[0].value;\n                let max = inputs[1].value;\n                // Make sure the second input/select is always higher than the first input/select\n                if (parseInt(inputs[1].value) < parseInt(inputs[0].value)) {\n                    max = min;\n                    inputs[1].value = min;\n                }\n                // First input/select\n                if (inputs[0].matches('input'))\n                    inputs[0].setAttribute('max', max);\n                if (inputs[0].matches('select')) {\n                    Array.from(inputs[0].querySelectorAll('option')).forEach((option) => {\n                        if (parseInt(option.getAttribute('value')) > max)\n                            option.classList.add('d-none');\n                        else\n                            option.classList.remove('d-none');\n                    });\n                }\n                // Second input/select\n                if (inputs[1].matches('input'))\n                    inputs[1].setAttribute('min', min);\n                Array.from(inputs[1].querySelectorAll('option')).forEach((option) => {\n                    if (parseInt(option.getAttribute('value')) < min)\n                        option.classList.add('d-none');\n                    else\n                        option.classList.remove('d-none');\n                });\n            };\n            setMinMax();\n            this.addEventListener('change', () => {\n                setMinMax();\n            });\n        }\n    }\n}\nexport default iamDaterange;\n"],"names":["trackComponentRegistered","componentName","iamDaterange","template","inputs","setMinMax","min","max","option"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,ECNAD,EAAyB,eAAe,EACxC,MAAME,UAAqB,WAAY,CACnC,aAAc,CACV,MAAK,EACL,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EACZ,SAAS,KAAK,aAAa,sBAAsB,GACjE,SAAS,KAAK,aAAa,sBAAsB,EAGvD,MAAMC,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MASrB,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,MAAMC,EAAS,KAAK,iBAAiB,cAAc,EACnD,GAAIA,EAAO,OAAS,EAAG,CACnB,MAAMC,EAAY,IAAM,CACpB,MAAMC,EAAMF,EAAO,CAAC,EAAE,MACtB,IAAIG,EAAMH,EAAO,CAAC,EAAE,MAEhB,SAASA,EAAO,CAAC,EAAE,KAAK,EAAI,SAASA,EAAO,CAAC,EAAE,KAAK,IACpDG,EAAMD,EACNF,EAAO,CAAC,EAAE,MAAQE,GAGlBF,EAAO,CAAC,EAAE,QAAQ,OAAO,GACzBA,EAAO,CAAC,EAAE,aAAa,MAAOG,CAAG,EACjCH,EAAO,CAAC,EAAE,QAAQ,QAAQ,GAC1B,MAAM,KAAKA,EAAO,CAAC,EAAE,iBAAiB,QAAQ,CAAC,EAAE,QAASI,GAAW,CAC7D,SAASA,EAAO,aAAa,OAAO,CAAC,EAAID,EACzCC,EAAO,UAAU,IAAI,QAAQ,EAE7BA,EAAO,UAAU,OAAO,QAAQ,CACxC,CAAC,EAGDJ,EAAO,CAAC,EAAE,QAAQ,OAAO,GACzBA,EAAO,CAAC,EAAE,aAAa,MAAOE,CAAG,EACrC,MAAM,KAAKF,EAAO,CAAC,EAAE,iBAAiB,QAAQ,CAAC,EAAE,QAASI,GAAW,CAC7D,SAASA,EAAO,aAAa,OAAO,CAAC,EAAIF,EACzCE,EAAO,UAAU,IAAI,QAAQ,EAE7BA,EAAO,UAAU,OAAO,QAAQ,CACxC,CAAC,CACL,EACAH,EAAS,EACT,KAAK,iBAAiB,SAAU,IAAM,CAClCA,EAAS,CACb,CAAC,CACL,CACJ,CACJ"}

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

@@ -18,7 +18,7 @@ class iamMarketing extends HTMLElement {
     ${loadCSS}
     
     </style>
-    <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous" />
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous" />
     <div class="marketing">
       
       <slot></slot>

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

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.6.4--beta7
+  * iamKey v7.7.0
   * Copyright 2022-2026 iamproperty
   */window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Marketing"});class e extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const t=document.createElement("template");t.innerHTML=`
     <style>
@@ -7,7 +7,7 @@
 
     
     </style>
-    <link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous" />
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous" />
     <div class="marketing">
       
       <slot></slot>