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

package/assets/js/components/video-modal/video-modal.component.js

@@ -7,68 +7,32 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { trackComponentRegistered } from '../_global.js';
-import { loadYouTubeScripts, createYoutTubeVideo } from '../../modules/videos.js';
-import { openModal, closeModal, closeButtonHtml } from '../../modules/modal.js';
+import { trackComponentRegistered } from '../_global';
+import { videoHTML, openYoutubeVideo, openVimeoVideo } from '../../modules/videos';
+import { openModal, closeModal, closeButtonHtml } from '../../modules/modal';
 trackComponentRegistered('iam-video-modal');
 class iamVideoCard extends HTMLElement {
     constructor() {
         super();
-        this.openYoutubeVideo = (id, component) => __awaiter(this, void 0, void 0, function* () {
-            const embed = component.querySelector('.embed');
-            openModal(id, component);
-            const youtubeId = component.getAttribute('data-youtube');
-            let loaded;
-            if (!document.body.classList.contains('youtubeLoaded')) {
-                // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                loaded = yield loadYouTubeScripts();
-            }
-            const customEvent = new CustomEvent('play-video', {
-                detail: { 'Video Type': 'YoutTube', ID: youtubeId },
-            });
-            component.dispatchEvent(customEvent);
-            const interval = setInterval(() => {
-                if (typeof YT != "undefined") {
-                    clearInterval(interval);
-                    createYoutTubeVideo(embed, youtubeId);
-                }
-            }, 200);
-            // Limit the number of calls
-            setTimeout(function () {
-                clearInterval(interval);
-            }, 2000);
-        });
-        this.openVimeoVideo = (id, component) => __awaiter(this, void 0, void 0, function* () {
-            const embed = component.querySelector('.embed');
-            openModal(id, component);
-            const vimeoId = component.getAttribute('data-vimeo');
-            const customEvent = new CustomEvent('play-video', {
-                detail: { 'Video Type': 'Vimeo', ID: vimeoId },
-            });
-            component.dispatchEvent(customEvent);
-            window.dataLayer.push(customEvent.detail);
-            if (!embed.querySelector('iframe'))
-                embed.innerHTML = `<iframe src="https://player.vimeo.com/video/${vimeoId}?autoplay=1" width="100%" height="100%" frameborder="0" allow="autoplay; encrypted-media" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`;
-        });
         this.attachShadow({ mode: 'open' });
         const assetLocation = document.body.hasAttribute('data-assets-location')
             ? document.body.getAttribute('data-assets-location')
             : '/assets';
         const loadCSS = `@import "${assetLocation}/css/components/modal.component.css";`;
         const template = document.createElement('template');
-        template.innerHTML = `
-    <style>
-    ${this.hasAttribute('css') ? `@import "${this.getAttribute('css')}";` : ``}
-    
-    ${loadCSS}
-    </style>
-
-    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous" />
-
-    <dialog>
-      ${closeButtonHtml}
-      <slot></slot>
-    </dialog>
+        template.innerHTML = `
+    <style>
+    ${this.hasAttribute('css') ? `@import "${this.getAttribute('css')}";` : ``}
+    
+    ${loadCSS}
+    </style>
+
+    <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous" />
+
+    <dialog>
+      ${closeButtonHtml}
+      ${videoHTML}
+    </dialog>
     `;
         this.shadowRoot.appendChild(template.content.cloneNode(true));
     }
@@ -77,23 +41,25 @@ class iamVideoCard extends HTMLElement {
             var _a;
             const id = this.getAttribute('id');
             const closeButton = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('[data-close]');
-            this.innerHTML = `<div class="embed"></div>`;
+            this.innerHTML = `<div class="embed" slot="video"></div>`;
             const embed = this.querySelector('.embed');
-            document.addEventListener('click', (e) => __awaiter(this, void 0, void 0, function* () {
+            document.addEventListener('click', (e) => {
                 if (e.target.closest(`[command="show-modal"][commandfor="${id}"]`)) {
                     e.preventDefault();
                     if (this.hasAttribute('data-youtube')) {
                         const youtubeId = this.getAttribute('data-youtube');
                         embed === null || embed === void 0 ? void 0 : embed.setAttribute('id', youtubeId);
-                        this.openYoutubeVideo(id, this);
+                        openYoutubeVideo(this);
+                        openModal(this);
                     }
                     else if (this.hasAttribute('data-vimeo')) {
-                        this.openVimeoVideo(id, this);
+                        openVimeoVideo(this);
+                        openModal(this);
                     }
                 }
-            }));
+            });
             closeButton === null || closeButton === void 0 ? void 0 : closeButton.addEventListener('click', () => {
-                closeModal(id, this);
+                closeModal(this);
                 if (this.hasAttribute('data-youtube')) {
                     const youtubeId = this.getAttribute('data-youtube');
                     if (window.player[youtubeId] && typeof window.player[youtubeId].pauseVideo == 'function') {

package/assets/js/components/video-modal/video-modal.component.min.js

@@ -1,19 +1,25 @@
 /*!
-  * iamKey v7.7.1--beta4
+  * iamKey v7.7.1--beta6
   * Copyright 2022-2026 iamproperty
-  */const g=r=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:r})};var b=function(r,n,e,t){function a(o){return o instanceof e?o:new e(function(i){i(o)})}return new(e||(e=Promise))(function(o,i){function s(d){try{l(t.next(d))}catch(c){i(c)}}function p(d){try{l(t.throw(d))}catch(c){i(c)}}function l(d){d.done?o(d.value):a(d.value).then(s,p)}l((t=t.apply(r,n||[])).next())})};const u=()=>b(void 0,void 0,void 0,function*(){return new Promise((r,n)=>{const e=new Image;e.onload=function(){const t=document.createElement("script");t.src="https://www.youtube.com/iframe_api";const a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(t,a),document.body.classList.add("youtubeLoaded"),r(!0)},e.onerror=function(){n(!1)},e.src="https://youtube.com/favicon.ico"})}),v=(r,n)=>b(void 0,void 0,void 0,function*(){if(typeof window.player>"u"&&(window.player=[]),typeof window.player[n]<"u"&&typeof window.player[n].pauseVideo=="function")return window.player[n].playVideo(),!1;window.player[n]=new YT.Player(n,{height:"100%",width:"100%",videoId:n,playerVars:{modestbranding:1,playsinline:1,rel:0,showinfo:0},events:{onReady:e,onStateChange:a}});function e(o){o.target.playVideo()}let t=!1;function a(o){o.data==YT.PlayerState.PLAYING&&!t&&(document.getElementById(n).classList.add("player-ready"),t=!0)}}),h=(r,n)=>{var e;const t=(e=n.shadowRoot)===null||e===void 0?void 0:e.querySelector("dialog");t?.showModal(),t?.focus();const a=new CustomEvent("modal-opened",{bubbles:!0,cancelable:!0,detail:{modalId:r}});n.dispatchEvent(a),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"openModal",id:r})},f=(r,n)=>{var e;const t=(e=n.shadowRoot)===null||e===void 0?void 0:e.querySelector("dialog");t?.close();const a=new CustomEvent("modal-closed",{bubbles:!0,cancelable:!0,detail:{modalId:r}});n.dispatchEvent(a),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"closeModal",id:r})},w='<button class="btn btn-compact btn-secondary fa-xmark-large" data-close>Close</button>';var m=function(r,n,e,t){function a(o){return o instanceof e?o:new e(function(i){i(o)})}return new(e||(e=Promise))(function(o,i){function s(d){try{l(t.next(d))}catch(c){i(c)}}function p(d){try{l(t.throw(d))}catch(c){i(c)}}function l(d){d.done?o(d.value):a(d.value).then(s,p)}l((t=t.apply(r,n||[])).next())})};g("iam-video-modal");class y extends HTMLElement{constructor(){super(),this.openYoutubeVideo=(e,t)=>m(this,void 0,void 0,function*(){const a=t.querySelector(".embed");h(e,t);const o=t.getAttribute("data-youtube");document.body.classList.contains("youtubeLoaded")||(yield u());const i=new CustomEvent("play-video",{detail:{"Video Type":"YoutTube",ID:o}});t.dispatchEvent(i);const s=setInterval(()=>{typeof YT<"u"&&(clearInterval(s),v(a,o))},200);setTimeout(function(){clearInterval(s)},2e3)}),this.openVimeoVideo=(e,t)=>m(this,void 0,void 0,function*(){const a=t.querySelector(".embed");h(e,t);const o=t.getAttribute("data-vimeo"),i=new CustomEvent("play-video",{detail:{"Video Type":"Vimeo",ID:o}});t.dispatchEvent(i),window.dataLayer.push(i.detail),a.querySelector("iframe")||(a.innerHTML=`<iframe src="https://player.vimeo.com/video/${o}?autoplay=1" width="100%" height="100%" frameborder="0" allow="autoplay; encrypted-media" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`)}),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const n=document.createElement("template");n.innerHTML=`
+  */const b=r=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:r})};var s=function(r,t,o,e){function i(a){return a instanceof o?a:new o(function(c){c(a)})}return new(o||(o=Promise))(function(a,c){function m(n){try{l(e.next(n))}catch(d){c(d)}}function p(n){try{l(e.throw(n))}catch(d){c(d)}}function l(n){n.done?a(n.value):i(n.value).then(m,p)}l((e=e.apply(r,t||[])).next())})};const g=`<div class="video-wrapper">
+  <slot name="video"></slot>
+  <picture>
+    <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" alt="" lazy="" />
+  </picture>
+  <button class="btn btn-compact fa-play m-0 colour-success">Play</button>
+</div>`,h=()=>s(void 0,void 0,void 0,function*(){return new Promise((r,t)=>{const o=new Image;o.onload=function(){const e=document.createElement("script");e.src="https://www.youtube.com/iframe_api";const i=document.getElementsByTagName("script")[0];i.parentNode.insertBefore(e,i),document.body.classList.add("youtubeLoaded"),r(!0)},o.onerror=function(){t(!1)},o.src="https://youtube.com/favicon.ico"})}),v=(r,t)=>s(void 0,void 0,void 0,function*(){if(typeof window.player>"u"&&(window.player=[]),typeof window.player[t]<"u"&&typeof window.player[t].pauseVideo=="function")return window.player[t].playVideo(),!1;console.log("hi2"),window.player[t]=new YT.Player(t,{height:"100%",width:"100%",videoId:t,playerVars:{modestbranding:1,playsinline:1,rel:0,showinfo:0},events:{onReady:o,onStateChange:i}});function o(a){a.target.playVideo()}let e=!1;function i(a){a.data==YT.PlayerState.PLAYING&&!e&&(document.getElementById(t).classList.add("player-ready"),e=!0)}}),f=r=>s(void 0,void 0,void 0,function*(){const t=r.shadowRoot.querySelector(".embed"),o=r.getAttribute("data-youtube");document.body.classList.contains("youtubeLoaded")||(yield h());const e=new CustomEvent("play-video",{detail:{"Video Type":"YoutTube",ID:o}});r.dispatchEvent(e);const i=setInterval(()=>{typeof YT<"u"&&(clearInterval(i),v(t,o))},200);setTimeout(function(){clearInterval(i)},2e3)}),w=r=>s(void 0,void 0,void 0,function*(){const t=r.querySelector(".embed"),o=r.getAttribute("data-vimeo"),e=new CustomEvent("play-video",{detail:{"Video Type":"Vimeo",ID:o}});r.dispatchEvent(e),window.dataLayer.push(e.detail),t.querySelector("iframe")||(t.innerHTML=`<iframe src="https://player.vimeo.com/video/${o}?autoplay=1" width="100%" height="100%" frameborder="0" allow="autoplay; encrypted-media" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`)}),u=r=>{var t;const o=(t=r.shadowRoot)===null||t===void 0?void 0:t.querySelector("dialog"),e=r.hasAttribute("id")?r.getAttribute("id"):"unknown";o?.showModal(),o?.focus();const i=new CustomEvent("modal-opened",{bubbles:!0,cancelable:!0,detail:{modalId:e}});r.dispatchEvent(i),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"openModal",id:e})},y=r=>{var t;const o=(t=r.shadowRoot)===null||t===void 0?void 0:t.querySelector("dialog"),e=r.hasAttribute("id")?r.getAttribute("id"):"unknown";o?.close();const i=new CustomEvent("modal-closed",{bubbles:!0,cancelable:!0,detail:{modalId:e}});r.dispatchEvent(i),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"closeModal",id:e})},k='<button class="btn btn-compact btn-secondary fa-xmark-large" data-close>Close</button>';var x=function(r,t,o,e){function i(a){return a instanceof o?a:new o(function(c){c(a)})}return new(o||(o=Promise))(function(a,c){function m(n){try{l(e.next(n))}catch(d){c(d)}}function p(n){try{l(e.throw(n))}catch(d){c(d)}}function l(n){n.done?a(n.value):i(n.value).then(m,p)}l((e=e.apply(r,t||[])).next())})};b("iam-video-modal");class z 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>
     ${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
     
-    @layer elements{body:not(.js-enabled) dialog:not([open]):target{display:block}dialog,[popover]{--dialog-padding: 1.5rem;--mh-padding-inline: var(--dialog-padding);color:inherit;width:fit-content;height:fit-content;border:none;overscroll-behavior:contain;background:var(--colour-canvas-2);box-shadow:0px 2px 9px rgba(0,0,0,.11);border-radius:.625rem;padding:var(--dialog-padding);outline:var(--contrast-outline-width, 0px) solid var(--colour-primary)}dialog>*:last-child,[popover]>*:last-child{margin-bottom:0}dialog>:is(p):last-child,[popover]>:is(p):last-child{padding-bottom:0}dialog::backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px);overscroll-behavior:contain}dialog[open],[popover]:popover-open{display:flex;flex-direction:column}*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{overflow-y:auto;width:90vw;max-width:20.25rem;max-height:min(90vh,47rem);overscroll-behavior:contain}@media screen and (min-width: 36em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:20.9375rem;width:fit-content;max-width:42.875rem}}@media screen and (min-width: 62em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:28.375rem;width:fit-content;max-width:46rem}}details.bg-light{margin-inline:calc(var(--dialog-padding)*-1);padding-inline:var(--dialog-padding)}}@layer elements{*,*::before,*::after{box-sizing:border-box}button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}[role=button]{cursor:pointer}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit]){-webkit-appearance:button}:is(button,[type=button],[type=reset],[type=submit]):not(:disabled){cursor:pointer}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}.btn:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}.btn:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}.btn:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}.btn:not(:last-child){margin-right:var(--btn-margin)}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.colour-success{--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success:before,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active):before{content:"\uF00C";font-family:"Font Awesome 7 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 7 Pro"}.btn.btn[class*=fa-after]{padding-right:4rem}.btn.btn[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}.btn:not(.btn-compact):before{margin-right:1rem}.btn i[class*=fa-]{--fa-width: 1em;font-family:"Font Awesome 7 Pro";margin-right:1rem;line-height:1em;font-style:inherit}.btn i[class*=fa-]:not(:first-child){margin-left:1rem;margin-right:0}.btn.btn--prompt:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt:after,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active):after{margin-left:1.5rem;margin-right:-0.5rem}.btn-filter:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 7 Pro"}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary)}.btn-secondary:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:rgba(0,0,0,0);border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative}.btn.btn-tertiary:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}.btn.btn-tertiary.text-decoration-none:after{width:0%}.btn.btn-tertiary [class*=fa-]{margin-left:0;margin-right:.5rem}.btn.btn-tertiary [class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}.btn.btn-tertiary:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active):after{width:60% !important}.btn.btn-tertiary:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}@layer elements{.btn-action{--btn-border-width: 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 elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem);@container style(--theme: dark){color:white}}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2}.btn[popovertarget]>.fa-chevron-down{display:none}.btn[popovertarget]:not(:has(i)):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}.btn[popovertarget][aria-pressed]:after{transform:rotate(270deg)}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content}.btn:has(select) select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important}.btn:has(select) select option{font-size:1rem;text-align:left;color:var(--colour-primary);padding-inline:var(--menu-item-padding, 0.5rem);padding-block:var(--menu-item-padding, 0.5rem) !important;border-radius:.25rem !important}.btn:has(select) select option:not(:last-child){margin:var(--menu-item-margin, 0 0 0.25rem 0) !important}.btn:has(select) select option:hover{background:var(--colour-light) !important}.btn:has(select) select option:after{content:attr(data-email)}.btn:has(select) select::picker-icon{display:none}.btn:has(select) select::picker(select){appearance:base-select;background:var(--menu-bg, canvas);margin-block:var(--menu-margin, 0.25rem);padding:var(--menu-padding, 0.5rem) !important;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.1);font-size:1rem}.btn:has(select) hr{height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}.btn:has(select) select option::checkmark{display:none}.btn:has(select) select selectedcontent span{display:none}.btn:has(select):after{position:absolute;top:.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em}.btn-action:has(select) select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}.btn-action:has(select):after{top:.2rem;right:.5rem}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-block:0 !important;margin-inline:auto !important;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0 !important;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}:host{overscroll-behavior:contain;display:block;container-type:inline-size}::slotted(dialog){display:contents !important}::slotted(button){margin:0 !important}@layer components{dialog[open]{width:90vw;max-width:20.25rem;max-height:min(90vh,47rem);overscroll-behavior:contain;overflow-y:hidden}@media screen and (min-width: 36em){dialog[open]{--dialog-padding: 2rem;min-width:20.9375rem;width:fit-content;max-width:42.875rem}}@media screen and (min-width: 62em){dialog[open]{min-width:28.375rem;width:fit-content;max-width:46rem}}dialog[open]::before{content:"";top:.75rem;bottom:auto;left:0;right:.5rem;height:calc(var(--dialog-padding) - .75rem);position:absolute;display:block;background:linear-gradient(0deg, transparent 0%, var(--colour-canvas-2) 100%);z-index:2}dialog[open]::after{content:"";top:auto;bottom:.75rem;left:0;right:6px;height:calc(var(--dialog-padding) - .75rem);position:absolute;display:block;background:linear-gradient(180deg, transparent 0%, var(--colour-canvas-2) 100%);z-index:2}dialog[open] .scroll{margin-inline:calc(var(--dialog-padding)*-1);margin-block:calc((var(--dialog-padding) - .75rem)*-1);padding-inline:var(--dialog-padding);padding-block:calc(var(--dialog-padding) - .75rem);height:100%;max-height:100%;overflow:auto;overscroll-behavior:contain;position:relative;z-index:1}dialog[open] .scroll .fa-circle{display:none}dialog[open]>button:first-child{position:absolute;top:.5rem;right:.5rem;z-index:var(--index-floating);margin:0}dialog[open]>button:first-child:not(:hover,:focus,:active){background-color:var(--colour-canvas)}@container (min-width: 36em){dialog[open]>button:first-child{top:calc(var(--dialog-padding) - .75rem);right:calc(var(--dialog-padding) - .75rem)}}dialog[open]:has(.youtube-embed){padding:0 !important}dialog[open].dialog--fullwidth{max-width:69.5rem}dialog[open] .btn__group{display:none}@media screen and (min-width: 36em){:host(.modal--sm) dialog[open]{min-width:20.9375rem;width:20.9375rem;max-width:20.9375rem}}@media screen and (min-width: 62em){:host(.modal--sm) dialog[open]{min-width:28.375rem;width:28.375rem;max-width:28.375rem}}@media screen and (min-width: 36em){:host(.modal--lg) dialog[open]{min-width:42.875rem;width:42.875rem;max-width:42.875rem}}@media screen and (min-width: 62em){:host(.modal--lg) dialog[open]{min-width:46rem;width:46rem;max-width:46rem}}dialog::backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px);overscroll-behavior:contain}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background-color:rgba(0,0,0,0);border-top:4px solid rgba(0,0,0,0)}::-webkit-scrollbar-thumb{background-color:#c1c1c1;width:6px;border-radius:3px}::slotted(p:last-child){padding-bottom:0 !important}::slotted(p:last-child){padding-bottom:0 !important}::slotted(:last-child){margin-bottom:0 !important}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open]{text-align:center}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle{display:var(--fa-display, block);line-height:1;font-size:3rem;height:3rem;width:3rem;margin-top:0;margin-bottom:0;line-height:1;color:var(--colour-heading);margin-inline:auto}@media screen and (min-width: 62em){:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle{font-size:4rem;height:4rem;width:4rem}}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle:has(>i){position:relative}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle>i:before{position:absolute;top:0;left:50%;transform:scale(0.5) translate(-100%, 0)}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open]>button:first-child{display:none}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .btn__group{display:flex;justify-content:center;padding-top:2rem;margin-bottom:0}:host([data-type=acknowledgement]) dialog[open] .btn__group [data-cancel]{display:none}}@layer components{dialog{width:calc(100% - 6rem) !important;max-width:50rem !important;padding:0;aspect-ratio:16/9}dialog[open]::before{display:none}dialog[open]::after{display:none}::slotted(.embed){aspect-ratio:16/9;width:100%}}/*# sourceMappingURL=assets/css/components/video-modal.component.css.map */
+    @layer elements{body:not(.js-enabled) dialog:not([open]):target{display:block}dialog,[popover]{--dialog-padding: 1.5rem;--mh-padding-inline: var(--dialog-padding);color:inherit;width:fit-content;height:fit-content;border:none;overscroll-behavior:contain;background:var(--colour-canvas-2);box-shadow:0px 2px 9px rgba(0,0,0,.11);border-radius:.625rem;padding:var(--dialog-padding);outline:var(--contrast-outline-width, 0px) solid var(--colour-primary)}dialog>*:last-child,[popover]>*:last-child{margin-bottom:0}dialog>:is(p):last-child,[popover]>:is(p):last-child{padding-bottom:0}dialog::backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px);overscroll-behavior:contain}dialog[open],[popover]:popover-open{display:flex;flex-direction:column}*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{overflow-y:auto;width:90vw;max-width:20.25rem;max-height:min(90vh,47rem);overscroll-behavior:contain}@media screen and (min-width: 36em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:20.9375rem;width:fit-content;max-width:42.875rem}}@media screen and (min-width: 62em){*:not(.dialog__wrapper)>dialog[open],*:not(.dialog__wrapper)>[popover]:popover-open{min-width:28.375rem;width:fit-content;max-width:46rem}}details.bg-light{margin-inline:calc(var(--dialog-padding)*-1);padding-inline:var(--dialog-padding)}}@layer elements{button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit],[role=button]){-webkit-appearance:button;&:not(:disabled){cursor:pointer}}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap;&:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}&:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}&:not(:last-child){margin-right:var(--btn-margin)}}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.btn-complete{--colour: var(--colour-success);--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn-complete,.btn.btn-complete:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem;&:before{content:"\uF00C";font-family:"Font Awesome 7 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn{&[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 7 Pro"}&[class*=fa-after]{padding-right:4rem}&[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}&:not(.btn-compact):before{margin-right:1rem}i[class*=fa-]{--fa-width: 1em;font-family:"Font Awesome 7 Pro";margin-right:1rem;line-height:1em;font-style:inherit;&:not(:first-child){margin-left:1rem;margin-right:0}}}.btn.btn--prompt{&:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active){&:after{margin-left:1.5rem;margin-right:-0.5rem}}.btn-filter{&:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 7 Pro"}}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary);&:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:transparent;border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative;&:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}&.text-decoration-none:after{width:0%}&[class*=fa-]{margin-left:0;margin-right:.5rem}&[class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}&:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active){&:after{width:60% !important}}&:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}}@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}&.icon-only{position:relative;text-indent:-300vw;overflow:hidden;min-width:1.75rem;&:before{position:absolute;left:0;top:0;min-width:1.75rem;text-align:center;text-indent:0;padding-inline:.25rem;line-height:1.85rem}}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 elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem);@container style(--theme: dark){color:white}}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2;&>.fa-chevron-down{display:none}&:not(:has(i)):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}&[aria-pressed]:after{transform:rotate(270deg)}}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content;select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important;option{font-size:1rem;text-align:left;color:var(--colour-primary);padding-inline:var(--menu-item-padding, 0.5rem);padding-block:var(--menu-item-padding, 0.5rem) !important;border-radius:.25rem !important;&:not(:last-child){margin:var(--menu-item-margin, 0 0 0.25rem 0) !important}&:hover{background:var(--colour-light) !important}&:after{content:attr(data-email)}}}select::picker-icon{display:none}select::picker(select){appearance:base-select;background:var(--menu-bg, canvas);margin-block:var(--menu-margin, 0.25rem);padding:var(--menu-padding, 0.5rem) !important;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0, 0, 0, 0.1);font-size:1rem}hr{height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}select option::checkmark{display:none}select selectedcontent span{display:none}&:after{position:absolute;top:.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em;select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}&:after{top:.2rem;right:.5rem}}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-block:0 !important;margin-inline:auto !important;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0 !important;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}:host{overscroll-behavior:contain;display:block;container-type:inline-size}::slotted(dialog){display:contents !important}::slotted(button){margin:0 !important}@layer components{dialog[open]{width:90vw;max-width:20.25rem;max-height:min(90vh,47rem);overscroll-behavior:contain;overflow-y:hidden}@media screen and (min-width: 36em){dialog[open]{--dialog-padding: 2rem;min-width:20.9375rem;width:fit-content;max-width:42.875rem}}@media screen and (min-width: 62em){dialog[open]{min-width:28.375rem;width:fit-content;max-width:46rem}}dialog[open]::before{content:"";top:.75rem;bottom:auto;left:0;right:.5rem;height:calc(var(--dialog-padding) - .75rem);position:absolute;display:block;background:linear-gradient(0deg, transparent 0%, var(--colour-canvas-2) 100%);z-index:2}dialog[open]::after{content:"";top:auto;bottom:.75rem;left:0;right:6px;height:calc(var(--dialog-padding) - .75rem);position:absolute;display:block;background:linear-gradient(180deg, transparent 0%, var(--colour-canvas-2) 100%);z-index:2}dialog[open] .scroll{margin-inline:calc(var(--dialog-padding)*-1);margin-block:calc((var(--dialog-padding) - .75rem)*-1);padding-inline:var(--dialog-padding);padding-block:calc(var(--dialog-padding) - .75rem);height:100%;max-height:100%;overflow:auto;overscroll-behavior:contain;position:relative;z-index:1}dialog[open] .scroll .fa-circle{display:none}dialog[open]>button:first-child{position:absolute;top:.5rem;right:.5rem;z-index:var(--index-floating);margin:0}dialog[open]>button:first-child:not(:hover,:focus,:active){background-color:var(--colour-canvas)}@container (min-width: 36em){dialog[open]>button:first-child{top:calc(var(--dialog-padding) - .75rem);right:calc(var(--dialog-padding) - .75rem)}}dialog[open]:has(.youtube-embed){padding:0 !important}dialog[open].dialog--fullwidth{max-width:69.5rem}dialog[open] .btn__group{display:none}@media screen and (min-width: 36em){:host(.modal--sm) dialog[open]{min-width:20.9375rem;width:20.9375rem;max-width:20.9375rem}}@media screen and (min-width: 62em){:host(.modal--sm) dialog[open]{min-width:28.375rem;width:28.375rem;max-width:28.375rem}}@media screen and (min-width: 36em){:host(.modal--lg) dialog[open]{min-width:42.875rem;width:42.875rem;max-width:42.875rem}}@media screen and (min-width: 62em){:host(.modal--lg) dialog[open]{min-width:46rem;width:46rem;max-width:46rem}}dialog::backdrop{background:rgba(0,0,0,.3);backdrop-filter:blur(4px);overscroll-behavior:contain}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background-color:rgba(0,0,0,0);border-top:4px solid rgba(0,0,0,0)}::-webkit-scrollbar-thumb{background-color:#c1c1c1;width:6px;border-radius:3px}::slotted(p:last-child){padding-bottom:0 !important}::slotted(p:last-child){padding-bottom:0 !important}::slotted(:last-child){margin-bottom:0 !important}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open]{text-align:center}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle{display:var(--fa-display, block);line-height:1;font-size:3rem;height:3rem;width:3rem;margin-top:0;margin-bottom:0;line-height:1;color:var(--colour-heading);margin-inline:auto}@media screen and (min-width: 62em){:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle{font-size:4rem;height:4rem;width:4rem}}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle:has(>i){position:relative}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .scroll>.fa-circle>i:before{position:absolute;top:0;left:50%;transform:scale(0.5) translate(-100%, 0)}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open]>button:first-child{display:none}:host(:is([data-type=transactional],[data-type=acknowledgement])) dialog[open] .btn__group{display:flex;justify-content:center;padding-top:2rem;margin-bottom:0}:host([data-type=acknowledgement]) dialog[open] .btn__group [data-cancel]{display:none}}@keyframes spin{to{rotate:1turn}}@layer utilities{.text-heading{color:var(--colour-heading) !important}.text-primary{color:var(--colour-primary) !important}.bg-primary{--bg-colour: var(--colour-primary) !important;background-color:var(--colour-primary) !important}.hover-primary:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-primary) !important;background-color:var(--colour-primary) !important}.colour-primary{--colour: var(--colour-primary) !important}.text-secondary{color:var(--colour-secondary) !important}.bg-secondary{--bg-colour: var(--colour-secondary) !important;background-color:var(--colour-secondary) !important}.hover-secondary:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-secondary) !important;background-color:var(--colour-secondary) !important}.colour-secondary{--colour: var(--colour-secondary) !important}.text-info{color:var(--colour-info) !important}.bg-info{--bg-colour: var(--colour-info) !important;background-color:var(--colour-info) !important}.hover-info:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-info) !important;background-color:var(--colour-info) !important}.colour-info{--colour: var(--colour-info) !important}.text-warning{color:var(--colour-warning) !important}.bg-warning{--bg-colour: var(--colour-warning) !important;background-color:var(--colour-warning) !important}.hover-warning:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-warning) !important;background-color:var(--colour-warning) !important}.colour-warning{--colour: var(--colour-warning) !important}.text-success{color:var(--colour-success) !important}.bg-success{--bg-colour: var(--colour-success) !important;background-color:var(--colour-success) !important}.hover-success:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-success) !important;background-color:var(--colour-success) !important}.colour-success{--colour: var(--colour-success) !important}.text-complete{color:var(--colour-complete) !important}.bg-complete{--bg-colour: var(--colour-complete) !important;background-color:var(--colour-complete) !important}.hover-complete:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-complete) !important;background-color:var(--colour-complete) !important}.colour-complete{--colour: var(--colour-complete) !important}.text-danger{color:var(--colour-danger) !important}.bg-danger{--bg-colour: var(--colour-danger) !important;background-color:var(--colour-danger) !important}.hover-danger:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-danger) !important;background-color:var(--colour-danger) !important}.colour-danger{--colour: var(--colour-danger) !important}.text-dark{color:var(--colour-dark) !important}.bg-dark{--bg-colour: var(--colour-dark) !important;background-color:var(--colour-dark) !important}.hover-dark:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-dark) !important;background-color:var(--colour-dark) !important}.colour-dark{--colour: var(--colour-dark) !important}.text-light{color:var(--colour-light) !important}.bg-light{--bg-colour: var(--colour-light) !important;background-color:var(--colour-light) !important}.hover-light:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-light) !important;background-color:var(--colour-light) !important}.colour-light{--colour: var(--colour-light) !important}.text-canvas{color:var(--colour-canvas) !important}.bg-canvas{--bg-colour: var(--colour-canvas) !important;background-color:var(--colour-canvas) !important}.hover-canvas:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-canvas) !important;background-color:var(--colour-canvas) !important}.colour-canvas{--colour: var(--colour-canvas) !important}.text-white{color:var(--colour-white) !important}.bg-white{--bg-colour: var(--colour-white) !important;background-color:var(--colour-white) !important}.hover-white:is(:hover,:focus,:focus-within){--bg-colour: var(--colour-white) !important;background-color:var(--colour-white) !important}.colour-white{--colour: var(--colour-white) !important}.text-body{color:var(--colour-body)}}@layer components{.video-wrapper{display:block;position:relative;width:100%;height:auto;aspect-ratio:16/9;background-color:var(--colour-light);margin-bottom:2rem;cursor:pointer}.video-wrapper:before{font-family:"Font Awesome 7 Pro";content:"\uF3F4";position:absolute;font-weight:900;color:var(--colour-heading);animation:spin 1.5s infinite steps(10);font-size:1.5em;top:50%;left:50%;translate:-50% -50%;z-index:1}.video-wrapper img{position:absolute;inset:0;z-index:3;width:calc(100% + 2px);height:100%;object-fit:cover;margin-inline:-1px}.video-wrapper button{pointer-events:none;position:absolute;top:50%;left:50%;z-index:4;transform:translate(-50%, -50%)}.video-wrapper:is(:hover,:focus):not(:active) button{--colour-btn-bg: var(--colour-white)!important;--colour-btn-border: var(--colour-white)!important}.video-wrapper:is(:active) button{filter:brightness(85%)}dialog .video-wrapper{margin-bottom:0}}::slotted(.embed){position:absolute;inset:0;z-index:4;aspect-ratio:16/9;width:calc(100% + 2px);height:100%;margin-inline:-1px;margin-block:0}@layer components{dialog{width:calc(100% - 6rem) !important;max-width:50rem !important;padding:0;aspect-ratio:16/9;overflow:hidden}dialog[open]::before{display:none}dialog[open]::after{display:none}dialog .video-wrapper button{display:none}}/*# sourceMappingURL=assets/css/components/video-modal.component.css.map */
 
     </style>
 
     <link rel="stylesheet" href="https://kit.fontawesome.com/8bd0fca975.css" crossorigin="anonymous" />
 
     <dialog>
-      ${w}
-      <slot></slot>
+      ${k}
+      ${g}
     </dialog>
-    `,this.shadowRoot.appendChild(n.content.cloneNode(!0))}connectedCallback(){return m(this,void 0,void 0,function*(){var n;const e=this.getAttribute("id"),t=(n=this.shadowRoot)===null||n===void 0?void 0:n.querySelector("[data-close]");this.innerHTML='<div class="embed"></div>';const a=this.querySelector(".embed");document.addEventListener("click",o=>m(this,void 0,void 0,function*(){if(o.target.closest(`[command="show-modal"][commandfor="${e}"]`))if(o.preventDefault(),this.hasAttribute("data-youtube")){const i=this.getAttribute("data-youtube");a?.setAttribute("id",i),this.openYoutubeVideo(e,this)}else this.hasAttribute("data-vimeo")&&this.openVimeoVideo(e,this)})),t?.addEventListener("click",()=>{if(f(e,this),this.hasAttribute("data-youtube")){const o=this.getAttribute("data-youtube");window.player[o]&&typeof window.player[o].pauseVideo=="function"&&window.player[o].pauseVideo()}else if(this.hasAttribute("data-vimeo")){a.innerHTML="";const o=new CustomEvent("close-video",{detail:{"Video Type":"Vimeo",ID:this.getAttribute("data-vimeo")}});this.dispatchEvent(o),window.dataLayer.push(o.detail)}})})}}export{y as default};
+    `,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){return x(this,void 0,void 0,function*(){var t;const o=this.getAttribute("id"),e=(t=this.shadowRoot)===null||t===void 0?void 0:t.querySelector("[data-close]");this.innerHTML='<div class="embed" slot="video"></div>';const i=this.querySelector(".embed");document.addEventListener("click",a=>{if(a.target.closest(`[command="show-modal"][commandfor="${o}"]`))if(a.preventDefault(),this.hasAttribute("data-youtube")){const c=this.getAttribute("data-youtube");i?.setAttribute("id",c),f(this),u(this)}else this.hasAttribute("data-vimeo")&&(w(this),u(this))}),e?.addEventListener("click",()=>{if(y(this),this.hasAttribute("data-youtube")){const a=this.getAttribute("data-youtube");window.player[a]&&typeof window.player[a].pauseVideo=="function"&&window.player[a].pauseVideo()}else if(this.hasAttribute("data-vimeo")){i.innerHTML="";const a=new CustomEvent("close-video",{detail:{"Video Type":"Vimeo",ID:this.getAttribute("data-vimeo")}});this.dispatchEvent(a),window.dataLayer.push(a.detail)}})})}}export{z as default};
 //# sourceMappingURL=video-modal.component.min.js.map

package/assets/js/components/video-modal/video-modal.component.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"video-modal.component.min.js","sources":["../_global.js","../../modules/videos.js","../../modules/modal.js","video-modal.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","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nconst videoSupport = (body) => __awaiter(void 0, void 0, void 0, function* () {\n    if (document.querySelector('.youtube-link[data-youtube]') && !document.body.classList.contains('youtubeLoaded')) {\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        const loaded = yield loadYouTubeScripts();\n    }\n    setTimeout(() => __awaiter(void 0, void 0, void 0, function* () {\n        if (document.querySelector('.youtube-link[data-youtube]') && !document.body.classList.contains('youtubeLoaded')) {\n            // eslint-disable-next-line @typescript-eslint/no-unused-vars\n            const loaded = yield loadYouTubeScripts();\n        }\n    }), '2000');\n    body.addEventListener('click', (event) => __awaiter(void 0, void 0, void 0, function* () {\n        let target = event.target.closest('.youtube-link[data-youtube]');\n        if (!target) {\n            target = event.target.closest('.vimeo-link[data-vimeo]');\n        }\n        if (target && target.hasAttribute('data-youtube')) {\n            event.preventDefault();\n            if (!document.body.classList.contains('youtubeLoaded')) {\n                // eslint-disable-next-line @typescript-eslint/no-unused-vars\n                const loaded = yield loadYouTubeScripts();\n            }\n            const link_id = 'youtube-' + target.getAttribute('data-youtube');\n            if (!document.getElementById(`${link_id}-dialog`)) {\n                document.body.insertAdjacentHTML('beforeend', `<dialog id=\"${link_id}-dialog\"><div class=\"embed\" id=\"${link_id}\"></div></dialog>`);\n            }\n            const dialog = document.getElementById(`${link_id}-dialog`);\n            const embed = document.getElementById(link_id);\n            const customEvent = new CustomEvent('play-video', {\n                detail: { 'Video Type': 'YoutTube', ID: target.getAttribute('data-youtube') },\n            });\n            target.dispatchEvent(customEvent);\n            window.dataLayer.push(customEvent.detail);\n            createYoutTubeVideo(embed, target.getAttribute('data-youtube'));\n            dialog.showModal();\n            dialog.addEventListener('close', () => {\n                if (window.player[embed.getAttribute('id')] &&\n                    typeof window.player[embed.getAttribute('id')].pauseVideo == 'function') {\n                    window.player[embed.getAttribute('id')].pauseVideo();\n                }\n                const customEvent = new CustomEvent('close-video', {\n                    detail: { 'Video Type': 'YoutTube', ID: target.getAttribute('data-youtube') },\n                });\n                target.dispatchEvent(customEvent);\n                window.dataLayer.push(customEvent.detail);\n            });\n        }\n        else if (target && target.hasAttribute('data-vimeo')) {\n            event.preventDefault();\n            const link_id = 'vimeo-' + target.getAttribute('data-youtube');\n            if (!document.getElementById(`${link_id}-dialog`)) {\n                document.body.insertAdjacentHTML('beforeend', `<dialog id=\"${link_id}-dialog\"><div class=\"embed\" id=\"${link_id}\"></div></dialog>`);\n            }\n            const dialog = document.getElementById(`${link_id}-dialog`);\n            const embed = document.getElementById(link_id);\n            const videoId = target.getAttribute('data-vimeo');\n            const customEvent = new CustomEvent('play-video', {\n                detail: { 'Video Type': 'Vimeo', ID: videoId },\n            });\n            target.dispatchEvent(customEvent);\n            window.dataLayer.push(customEvent.detail);\n            if (!embed.querySelector('iframe'))\n                embed.innerHTML = `<iframe src=\"https://player.vimeo.com/video/${videoId}?autoplay=1\" width=\"100%\" height=\"100%\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`;\n            dialog.showModal();\n            dialog.addEventListener('close', () => {\n                embed.innerHTML = ``; // Remove the video since we cant pause it\n                const customEvent = new CustomEvent('close-video', {\n                    detail: { 'Video Type': 'Vimeo', ID: target.getAttribute('data-vimeo') },\n                });\n                target.dispatchEvent(customEvent);\n                window.dataLayer.push(customEvent.detail);\n            });\n        }\n    }));\n});\nexport const loadYouTubeScripts = () => __awaiter(void 0, void 0, void 0, function* () {\n    return new Promise((resolve, reject) => {\n        const image = new Image();\n        image.onload = function () {\n            // This code loads the IFrame Player API code asynchronously.\n            const tag = document.createElement('script');\n            tag.src = 'https://www.youtube.com/iframe_api';\n            const firstScriptTag = document.getElementsByTagName('script')[0];\n            firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);\n            document.body.classList.add('youtubeLoaded');\n            resolve(true);\n        };\n        image.onerror = function () {\n            reject(false);\n        };\n        image.src = 'https://youtube.com/favicon.ico';\n    });\n});\nexport const createYoutTubeVideo = (target, video_id) => __awaiter(void 0, void 0, void 0, function* () {\n    if (typeof window.player == 'undefined') {\n        window.player = [];\n    }\n    //const link_id = target.getAttribute('id');\n    if (typeof window.player[video_id] != 'undefined' && typeof window.player[video_id].pauseVideo == 'function') {\n        window.player[video_id].playVideo();\n        return false;\n    }\n    // This function creates an <iframe> (and YouTube player) after the API code downloads.\n    //function onYouTubeIframeAPIReady() {\n    window.player[video_id] = new YT.Player(video_id, {\n        height: '100%',\n        width: '100%',\n        videoId: video_id,\n        playerVars: {\n            modestbranding: 1,\n            playsinline: 1,\n            rel: 0,\n            showinfo: 0,\n        },\n        events: {\n            onReady: onPlayerReady,\n            onStateChange: onPlayerStateChange,\n        },\n    });\n    //}\n    //onYouTubeIframeAPIReady();\n    // The API will call this function when the video player is ready.\n    function onPlayerReady(event) {\n        // Play the video straight away\n        event.target.playVideo();\n    }\n    // The API calls this function when the player's state changes.\n    // The function indicates that when playing a video (state=1)\n    let done = false;\n    function onPlayerStateChange(event) {\n        if (event.data == YT.PlayerState.PLAYING && !done) {\n            const link = document.getElementById(video_id);\n            link.classList.add('player-ready');\n            done = true;\n        }\n    }\n});\nexport default videoSupport;\n","export const openModal = (id, modal) => {\n    var _a;\n    const dialog = (_a = modal.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('dialog');\n    dialog === null || dialog === void 0 ? void 0 : dialog.showModal();\n    dialog === null || dialog === void 0 ? void 0 : dialog.focus();\n    const closeEvent = new CustomEvent('modal-opened', {\n        bubbles: true,\n        cancelable: true,\n        detail: { modalId: id },\n    });\n    modal.dispatchEvent(closeEvent);\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'openModal',\n        id: id,\n    });\n};\nexport const closeModal = (id, modal) => {\n    var _a;\n    const dialog = (_a = modal.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('dialog');\n    dialog === null || dialog === void 0 ? void 0 : dialog.close();\n    const closeEvent = new CustomEvent('modal-closed', {\n        bubbles: true,\n        cancelable: true,\n        detail: { modalId: id },\n    });\n    modal.dispatchEvent(closeEvent);\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'closeModal',\n        id: id,\n    });\n};\nexport const closeButtonHtml = `<button class=\"btn btn-compact btn-secondary fa-xmark-large\" data-close>Close</button>`;\n","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nimport { trackComponentRegistered } from '../_global.js';\nimport { loadYouTubeScripts, createYoutTubeVideo } from '../../modules/videos.js';\nimport { openModal, closeModal, closeButtonHtml } from '../../modules/modal.js';\ntrackComponentRegistered('iam-video-modal');\nclass iamVideoCard extends HTMLElement {\n    constructor() {\n        super();\n        this.openYoutubeVideo = (id, component) => __awaiter(this, void 0, void 0, function* () {\n            const embed = component.querySelector('.embed');\n            openModal(id, component);\n            const youtubeId = component.getAttribute('data-youtube');\n            let loaded;\n            if (!document.body.classList.contains('youtubeLoaded')) {\n                // eslint-disable-next-line @typescript-eslint/no-unused-vars\n                loaded = yield loadYouTubeScripts();\n            }\n            const customEvent = new CustomEvent('play-video', {\n                detail: { 'Video Type': 'YoutTube', ID: youtubeId },\n            });\n            component.dispatchEvent(customEvent);\n            const interval = setInterval(() => {\n                if (typeof YT != \"undefined\") {\n                    clearInterval(interval);\n                    createYoutTubeVideo(embed, youtubeId);\n                }\n            }, 200);\n            // Limit the number of calls\n            setTimeout(function () {\n                clearInterval(interval);\n            }, 2000);\n        });\n        this.openVimeoVideo = (id, component) => __awaiter(this, void 0, void 0, function* () {\n            const embed = component.querySelector('.embed');\n            openModal(id, component);\n            const vimeoId = component.getAttribute('data-vimeo');\n            const customEvent = new CustomEvent('play-video', {\n                detail: { 'Video Type': 'Vimeo', ID: vimeoId },\n            });\n            component.dispatchEvent(customEvent);\n            window.dataLayer.push(customEvent.detail);\n            if (!embed.querySelector('iframe'))\n                embed.innerHTML = `<iframe src=\"https://player.vimeo.com/video/${vimeoId}?autoplay=1\" width=\"100%\" height=\"100%\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`;\n        });\n        this.attachShadow({ mode: 'open' });\n        const assetLocation = document.body.hasAttribute('data-assets-location')\n            ? document.body.getAttribute('data-assets-location')\n            : '/assets';\n        const loadCSS = `@import \"${assetLocation}/css/components/modal.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n    \n    ${loadCSS}\n    </style>\n\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\" />\n\n    <dialog>\n      ${closeButtonHtml}\n      <slot></slot>\n    </dialog>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        return __awaiter(this, void 0, void 0, function* () {\n            var _a;\n            const id = this.getAttribute('id');\n            const closeButton = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('[data-close]');\n            this.innerHTML = `<div class=\"embed\"></div>`;\n            const embed = this.querySelector('.embed');\n            document.addEventListener('click', (e) => __awaiter(this, void 0, void 0, function* () {\n                if (e.target.closest(`[command=\"show-modal\"][commandfor=\"${id}\"]`)) {\n                    e.preventDefault();\n                    if (this.hasAttribute('data-youtube')) {\n                        const youtubeId = this.getAttribute('data-youtube');\n                        embed === null || embed === void 0 ? void 0 : embed.setAttribute('id', youtubeId);\n                        this.openYoutubeVideo(id, this);\n                    }\n                    else if (this.hasAttribute('data-vimeo')) {\n                        this.openVimeoVideo(id, this);\n                    }\n                }\n            }));\n            closeButton === null || closeButton === void 0 ? void 0 : closeButton.addEventListener('click', () => {\n                closeModal(id, this);\n                if (this.hasAttribute('data-youtube')) {\n                    const youtubeId = this.getAttribute('data-youtube');\n                    if (window.player[youtubeId] && typeof window.player[youtubeId].pauseVideo == 'function') {\n                        window.player[youtubeId].pauseVideo();\n                    }\n                }\n                else if (this.hasAttribute('data-vimeo')) {\n                    embed.innerHTML = ``; // Remove the video since we cant pause it\n                    const customEvent = new CustomEvent('close-video', {\n                        detail: { 'Video Type': 'Vimeo', ID: this.getAttribute('data-vimeo') },\n                    });\n                    this.dispatchEvent(customEvent);\n                    window.dataLayer.push(customEvent.detail);\n                }\n            });\n        });\n    }\n}\nexport default iamVideoCard;\n"],"names":["trackComponentRegistered","componentName","__awaiter","thisArg","_arguments","P","generator","adopt","value","resolve","reject","fulfilled","step","e","rejected","result","loadYouTubeScripts","image","tag","firstScriptTag","createYoutTubeVideo","target","video_id","onPlayerReady","onPlayerStateChange","event","done","openModal","id","modal","_a","dialog","closeEvent","closeModal","closeButtonHtml","iamVideoCard","component","embed","youtubeId","customEvent","interval","vimeoId","template","closeButton"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,ECPA,IAAIC,EAAwC,SAAUC,EAASC,EAAYC,EAAGC,EAAW,CACrF,SAASC,EAAMC,EAAO,CAAE,OAAOA,aAAiBH,EAAIG,EAAQ,IAAIH,EAAE,SAAUI,EAAS,CAAEA,EAAQD,CAAK,CAAG,CAAC,CAAG,CAC3G,OAAO,IAAKH,IAAMA,EAAI,UAAU,SAAUI,EAASC,EAAQ,CACvD,SAASC,EAAUH,EAAO,CAAE,GAAI,CAAEI,EAAKN,EAAU,KAAKE,CAAK,CAAC,CAAG,OAASK,EAAG,CAAEH,EAAOG,CAAC,CAAG,CAAE,CAC1F,SAASC,EAASN,EAAO,CAAE,GAAI,CAAEI,EAAKN,EAAU,MAASE,CAAK,CAAC,CAAG,OAASK,EAAG,CAAEH,EAAOG,CAAC,CAAG,CAAE,CAC7F,SAASD,EAAKG,EAAQ,CAAEA,EAAO,KAAON,EAAQM,EAAO,KAAK,EAAIR,EAAMQ,EAAO,KAAK,EAAE,KAAKJ,EAAWG,CAAQ,CAAG,CAC7GF,GAAMN,EAAYA,EAAU,MAAMH,EAASC,GAAc,CAAA,CAAE,GAAG,MAAM,CACxE,CAAC,CACL,EA4EO,MAAMY,EAAqB,IAAMd,EAAU,OAAQ,OAAQ,OAAQ,WAAa,CACnF,OAAO,IAAI,QAAQ,CAACO,EAASC,IAAW,CACpC,MAAMO,EAAQ,IAAI,MAClBA,EAAM,OAAS,UAAY,CAEvB,MAAMC,EAAM,SAAS,cAAc,QAAQ,EAC3CA,EAAI,IAAM,qCACV,MAAMC,EAAiB,SAAS,qBAAqB,QAAQ,EAAE,CAAC,EAChEA,EAAe,WAAW,aAAaD,EAAKC,CAAc,EAC1D,SAAS,KAAK,UAAU,IAAI,eAAe,EAC3CV,EAAQ,EAAI,CAChB,EACAQ,EAAM,QAAU,UAAY,CACxBP,EAAO,EAAK,CAChB,EACAO,EAAM,IAAM,iCAChB,CAAC,CACL,CAAC,EACYG,EAAsB,CAACC,EAAQC,IAAapB,EAAU,OAAQ,OAAQ,OAAQ,WAAa,CAKpG,GAJI,OAAO,OAAO,OAAU,MACxB,OAAO,OAAS,CAAA,GAGhB,OAAO,OAAO,OAAOoB,CAAQ,EAAK,KAAe,OAAO,OAAO,OAAOA,CAAQ,EAAE,YAAc,WAC9F,cAAO,OAAOA,CAAQ,EAAE,UAAS,EAC1B,GAIX,OAAO,OAAOA,CAAQ,EAAI,IAAI,GAAG,OAAOA,EAAU,CAC9C,OAAQ,OACR,MAAO,OACP,QAASA,EACT,WAAY,CACR,eAAgB,EAChB,YAAa,EACb,IAAK,EACL,SAAU,CACtB,EACQ,OAAQ,CACJ,QAASC,EACT,cAAeC,CAC3B,CACA,CAAK,EAID,SAASD,EAAcE,EAAO,CAE1BA,EAAM,OAAO,UAAS,CAC1B,CAGA,IAAIC,EAAO,GACX,SAASF,EAAoBC,EAAO,CAC5BA,EAAM,MAAQ,GAAG,YAAY,SAAW,CAACC,IAC5B,SAAS,eAAeJ,CAAQ,EACxC,UAAU,IAAI,cAAc,EACjCI,EAAO,GAEf,CACJ,CAAC,ECjJYC,EAAY,CAACC,EAAIC,IAAU,CACpC,IAAIC,EACJ,MAAMC,GAAUD,EAAKD,EAAM,cAAgB,MAAQC,IAAO,OAAS,OAASA,EAAG,cAAc,QAAQ,EACrDC,GAAO,UAAS,EAChBA,GAAO,MAAK,EAC5D,MAAMC,EAAa,IAAI,YAAY,eAAgB,CAC/C,QAAS,GACT,WAAY,GACZ,OAAQ,CAAE,QAASJ,CAAE,CAC7B,CAAK,EACDC,EAAM,cAAcG,CAAU,EAC9B,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,YACP,GAAIJ,CACZ,CAAK,CACL,EACaK,EAAa,CAACL,EAAIC,IAAU,CACrC,IAAIC,EACJ,MAAMC,GAAUD,EAAKD,EAAM,cAAgB,MAAQC,IAAO,OAAS,OAASA,EAAG,cAAc,QAAQ,EACrDC,GAAO,MAAK,EAC5D,MAAMC,EAAa,IAAI,YAAY,eAAgB,CAC/C,QAAS,GACT,WAAY,GACZ,OAAQ,CAAE,QAASJ,CAAE,CAC7B,CAAK,EACDC,EAAM,cAAcG,CAAU,EAC9B,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,aACP,GAAIJ,CACZ,CAAK,CACL,EACaM,EAAkB,yFCjC/B,IAAIhC,EAAwC,SAAUC,EAASC,EAAYC,EAAGC,EAAW,CACrF,SAASC,EAAMC,EAAO,CAAE,OAAOA,aAAiBH,EAAIG,EAAQ,IAAIH,EAAE,SAAUI,EAAS,CAAEA,EAAQD,CAAK,CAAG,CAAC,CAAG,CAC3G,OAAO,IAAKH,IAAMA,EAAI,UAAU,SAAUI,EAASC,EAAQ,CACvD,SAASC,EAAUH,EAAO,CAAE,GAAI,CAAEI,EAAKN,EAAU,KAAKE,CAAK,CAAC,CAAG,OAASK,EAAG,CAAEH,EAAOG,CAAC,CAAG,CAAE,CAC1F,SAASC,EAASN,EAAO,CAAE,GAAI,CAAEI,EAAKN,EAAU,MAASE,CAAK,CAAC,CAAG,OAASK,EAAG,CAAEH,EAAOG,CAAC,CAAG,CAAE,CAC7F,SAASD,EAAKG,EAAQ,CAAEA,EAAO,KAAON,EAAQM,EAAO,KAAK,EAAIR,EAAMQ,EAAO,KAAK,EAAE,KAAKJ,EAAWG,CAAQ,CAAG,CAC7GF,GAAMN,EAAYA,EAAU,MAAMH,EAASC,GAAc,CAAA,CAAE,GAAG,MAAM,CACxE,CAAC,CACL,EAIAJ,EAAyB,iBAAiB,EAC1C,MAAMmC,UAAqB,WAAY,CACnC,aAAc,CACV,MAAK,EACL,KAAK,iBAAmB,CAACP,EAAIQ,IAAclC,EAAU,KAAM,OAAQ,OAAQ,WAAa,CACpF,MAAMmC,EAAQD,EAAU,cAAc,QAAQ,EAC9CT,EAAUC,EAAIQ,CAAS,EACvB,MAAME,EAAYF,EAAU,aAAa,cAAc,EAElD,SAAS,KAAK,UAAU,SAAS,eAAe,IAExC,MAAMpB,EAAkB,GAErC,MAAMuB,EAAc,IAAI,YAAY,aAAc,CAC9C,OAAQ,CAAE,aAAc,WAAY,GAAID,CAAS,CACjE,CAAa,EACDF,EAAU,cAAcG,CAAW,EACnC,MAAMC,EAAW,YAAY,IAAM,CAC3B,OAAO,GAAM,MACb,cAAcA,CAAQ,EACtBpB,EAAoBiB,EAAOC,CAAS,EAE5C,EAAG,GAAG,EAEN,WAAW,UAAY,CACnB,cAAcE,CAAQ,CAC1B,EAAG,GAAI,CACX,CAAC,EACD,KAAK,eAAiB,CAACZ,EAAIQ,IAAclC,EAAU,KAAM,OAAQ,OAAQ,WAAa,CAClF,MAAMmC,EAAQD,EAAU,cAAc,QAAQ,EAC9CT,EAAUC,EAAIQ,CAAS,EACvB,MAAMK,EAAUL,EAAU,aAAa,YAAY,EAC7CG,EAAc,IAAI,YAAY,aAAc,CAC9C,OAAQ,CAAE,aAAc,QAAS,GAAIE,CAAO,CAC5D,CAAa,EACDL,EAAU,cAAcG,CAAW,EACnC,OAAO,UAAU,KAAKA,EAAY,MAAM,EACnCF,EAAM,cAAc,QAAQ,IAC7BA,EAAM,UAAY,+CAA+CI,CAAO,+JAChF,CAAC,EACD,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,MAEvB,KAAK,aAAa,KAAK,EAAI,YAAY,KAAK,aAAa,KAAK,CAAC,KAAO,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAQtER,CAAe;AAAA;AAAA;AAAA,MAIf,KAAK,WAAW,YAAYQ,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,OAAOxC,EAAU,KAAM,OAAQ,OAAQ,WAAa,CAChD,IAAI4B,EACJ,MAAMF,EAAK,KAAK,aAAa,IAAI,EAC3Be,GAAeb,EAAK,KAAK,cAAgB,MAAQA,IAAO,OAAS,OAASA,EAAG,cAAc,cAAc,EAC/G,KAAK,UAAY,4BACjB,MAAMO,EAAQ,KAAK,cAAc,QAAQ,EACzC,SAAS,iBAAiB,QAAUxB,GAAMX,EAAU,KAAM,OAAQ,OAAQ,WAAa,CACnF,GAAIW,EAAE,OAAO,QAAQ,sCAAsCe,CAAE,IAAI,EAE7D,GADAf,EAAE,eAAc,EACZ,KAAK,aAAa,cAAc,EAAG,CACnC,MAAMyB,EAAY,KAAK,aAAa,cAAc,EACJD,GAAM,aAAa,KAAMC,CAAS,EAChF,KAAK,iBAAiBV,EAAI,IAAI,CAClC,MACS,KAAK,aAAa,YAAY,GACnC,KAAK,eAAeA,EAAI,IAAI,CAGxC,CAAC,CAAC,EACwDe,GAAY,iBAAiB,QAAS,IAAM,CAElG,GADAV,EAAWL,EAAI,IAAI,EACf,KAAK,aAAa,cAAc,EAAG,CACnC,MAAMU,EAAY,KAAK,aAAa,cAAc,EAC9C,OAAO,OAAOA,CAAS,GAAK,OAAO,OAAO,OAAOA,CAAS,EAAE,YAAc,YAC1E,OAAO,OAAOA,CAAS,EAAE,WAAU,CAE3C,SACS,KAAK,aAAa,YAAY,EAAG,CACtCD,EAAM,UAAY,GAClB,MAAME,EAAc,IAAI,YAAY,cAAe,CAC/C,OAAQ,CAAE,aAAc,QAAS,GAAI,KAAK,aAAa,YAAY,CAAC,CAC5F,CAAqB,EACD,KAAK,cAAcA,CAAW,EAC9B,OAAO,UAAU,KAAKA,EAAY,MAAM,CAC5C,CACJ,CAAC,CACL,CAAC,CACL,CACJ"}
+{"version":3,"file":"video-modal.component.min.js","sources":["../_global.js","../../modules/videos.js","../../modules/modal.js","video-modal.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","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nconst videoSupport = (body) => __awaiter(void 0, void 0, void 0, function* () {\n    if (document.querySelector('.youtube-link[data-youtube]') && !document.body.classList.contains('youtubeLoaded')) {\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        const loaded = yield loadYouTubeScripts();\n    }\n    setTimeout(() => __awaiter(void 0, void 0, void 0, function* () {\n        if (document.querySelector('.youtube-link[data-youtube]') && !document.body.classList.contains('youtubeLoaded')) {\n            // eslint-disable-next-line @typescript-eslint/no-unused-vars\n            const loaded = yield loadYouTubeScripts();\n        }\n    }), '2000');\n    body.addEventListener('click', (event) => __awaiter(void 0, void 0, void 0, function* () {\n        let target = event.target.closest('.youtube-link[data-youtube]');\n        if (!target) {\n            target = event.target.closest('.vimeo-link[data-vimeo]');\n        }\n        if (target && target.hasAttribute('data-youtube')) {\n            event.preventDefault();\n            if (!document.body.classList.contains('youtubeLoaded')) {\n                // eslint-disable-next-line @typescript-eslint/no-unused-vars\n                const loaded = yield loadYouTubeScripts();\n            }\n            const link_id = 'youtube-' + target.getAttribute('data-youtube');\n            if (!document.getElementById(`${link_id}-dialog`)) {\n                document.body.insertAdjacentHTML('beforeend', `<dialog id=\"${link_id}-dialog\"><div class=\"embed\" id=\"${link_id}\"></div></dialog>`);\n            }\n            const dialog = document.getElementById(`${link_id}-dialog`);\n            const embed = document.getElementById(link_id);\n            const customEvent = new CustomEvent('play-video', {\n                detail: { 'Video Type': 'YoutTube', ID: target.getAttribute('data-youtube') },\n            });\n            target.dispatchEvent(customEvent);\n            window.dataLayer.push(customEvent.detail);\n            createYoutTubeVideo(embed, target.getAttribute('data-youtube'));\n            dialog.showModal();\n            dialog.addEventListener('close', () => {\n                if (window.player[embed.getAttribute('id')] &&\n                    typeof window.player[embed.getAttribute('id')].pauseVideo == 'function') {\n                    window.player[embed.getAttribute('id')].pauseVideo();\n                }\n                const customEvent = new CustomEvent('close-video', {\n                    detail: { 'Video Type': 'YoutTube', ID: target.getAttribute('data-youtube') },\n                });\n                target.dispatchEvent(customEvent);\n                window.dataLayer.push(customEvent.detail);\n            });\n        }\n        else if (target && target.hasAttribute('data-vimeo')) {\n            event.preventDefault();\n            const link_id = 'vimeo-' + target.getAttribute('data-youtube');\n            if (!document.getElementById(`${link_id}-dialog`)) {\n                document.body.insertAdjacentHTML('beforeend', `<dialog id=\"${link_id}-dialog\"><div class=\"embed\" id=\"${link_id}\"></div></dialog>`);\n            }\n            const dialog = document.getElementById(`${link_id}-dialog`);\n            const embed = document.getElementById(link_id);\n            const videoId = target.getAttribute('data-vimeo');\n            const customEvent = new CustomEvent('play-video', {\n                detail: { 'Video Type': 'Vimeo', ID: videoId },\n            });\n            target.dispatchEvent(customEvent);\n            window.dataLayer.push(customEvent.detail);\n            if (!embed.querySelector('iframe'))\n                embed.innerHTML = `<iframe src=\"https://player.vimeo.com/video/${videoId}?autoplay=1\" width=\"100%\" height=\"100%\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`;\n            dialog.showModal();\n            dialog.addEventListener('close', () => {\n                embed.innerHTML = ``; // Remove the video since we cant pause it\n                const customEvent = new CustomEvent('close-video', {\n                    detail: { 'Video Type': 'Vimeo', ID: target.getAttribute('data-vimeo') },\n                });\n                target.dispatchEvent(customEvent);\n                window.dataLayer.push(customEvent.detail);\n            });\n        }\n    }));\n});\nexport const videoHTML = `<div class=\"video-wrapper\">\r\n  <slot name=\"video\"></slot>\r\n  <picture>\r\n    <img src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\" alt=\"\" lazy=\"\" />\r\n  </picture>\r\n  <button class=\"btn btn-compact fa-play m-0 colour-success\">Play</button>\r\n</div>`;\nexport const loadYouTubeScripts = () => __awaiter(void 0, void 0, void 0, function* () {\n    return new Promise((resolve, reject) => {\n        const image = new Image();\n        image.onload = function () {\n            // This code loads the IFrame Player API code asynchronously.\n            const tag = document.createElement('script');\n            tag.src = 'https://www.youtube.com/iframe_api';\n            const firstScriptTag = document.getElementsByTagName('script')[0];\n            firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);\n            document.body.classList.add('youtubeLoaded');\n            resolve(true);\n        };\n        image.onerror = function () {\n            reject(false);\n        };\n        image.src = 'https://youtube.com/favicon.ico';\n    });\n});\nexport const createYoutTubeVideo = (target, video_id) => __awaiter(void 0, void 0, void 0, function* () {\n    if (typeof window.player == 'undefined') {\n        window.player = [];\n    }\n    //const link_id = target.getAttribute('id');\n    if (typeof window.player[video_id] != 'undefined' && typeof window.player[video_id].pauseVideo == 'function') {\n        window.player[video_id].playVideo();\n        return false;\n    }\n    console.log('hi2');\n    // This function creates an <iframe> (and YouTube player) after the API code downloads.\n    //function onYouTubeIframeAPIReady() {\n    window.player[video_id] = new YT.Player(video_id, {\n        height: '100%',\n        width: '100%',\n        videoId: video_id,\n        playerVars: {\n            modestbranding: 1,\n            playsinline: 1,\n            rel: 0,\n            showinfo: 0,\n        },\n        events: {\n            onReady: onPlayerReady,\n            onStateChange: onPlayerStateChange,\n        },\n    });\n    //}\n    //onYouTubeIframeAPIReady();\n    // The API will call this function when the video player is ready.\n    function onPlayerReady(event) {\n        // Play the video straight away\n        event.target.playVideo();\n    }\n    // The API calls this function when the player's state changes.\n    // The function indicates that when playing a video (state=1)\n    let done = false;\n    function onPlayerStateChange(event) {\n        if (event.data == YT.PlayerState.PLAYING && !done) {\n            const link = document.getElementById(video_id);\n            link.classList.add('player-ready');\n            done = true;\n        }\n    }\n});\nexport const openYoutubeVideo = (component) => __awaiter(void 0, void 0, void 0, function* () {\n    const embed = component.shadowRoot.querySelector('.embed');\n    const youtubeId = component.getAttribute('data-youtube');\n    let loaded;\n    if (!document.body.classList.contains('youtubeLoaded')) {\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        loaded = yield loadYouTubeScripts();\n    }\n    const customEvent = new CustomEvent('play-video', {\n        detail: { 'Video Type': 'YoutTube', ID: youtubeId },\n    });\n    component.dispatchEvent(customEvent);\n    const interval = setInterval(() => {\n        if (typeof YT != \"undefined\") {\n            clearInterval(interval);\n            createYoutTubeVideo(embed, youtubeId);\n        }\n    }, 200);\n    // Limit the number of calls\n    setTimeout(function () {\n        clearInterval(interval);\n    }, 2000);\n});\nexport const openVimeoVideo = (component) => __awaiter(void 0, void 0, void 0, function* () {\n    const embed = component.querySelector('.embed');\n    const vimeoId = component.getAttribute('data-vimeo');\n    const customEvent = new CustomEvent('play-video', {\n        detail: { 'Video Type': 'Vimeo', ID: vimeoId },\n    });\n    component.dispatchEvent(customEvent);\n    window.dataLayer.push(customEvent.detail);\n    if (!embed.querySelector('iframe'))\n        embed.innerHTML = `<iframe src=\"https://player.vimeo.com/video/${vimeoId}?autoplay=1\" width=\"100%\" height=\"100%\" frameborder=\"0\" allow=\"autoplay; encrypted-media\" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>`;\n});\nexport default videoSupport;\n","export const openModal = (modal) => {\n    var _a;\n    const dialog = (_a = modal.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('dialog');\n    const id = modal.hasAttribute('id') ? modal.getAttribute('id') : 'unknown';\n    dialog === null || dialog === void 0 ? void 0 : dialog.showModal();\n    dialog === null || dialog === void 0 ? void 0 : dialog.focus();\n    const closeEvent = new CustomEvent('modal-opened', {\n        bubbles: true,\n        cancelable: true,\n        detail: { modalId: id },\n    });\n    modal.dispatchEvent(closeEvent);\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'openModal',\n        id: id,\n    });\n};\nexport const closeModal = (modal) => {\n    var _a;\n    const dialog = (_a = modal.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('dialog');\n    const id = modal.hasAttribute('id') ? modal.getAttribute('id') : 'unknown';\n    dialog === null || dialog === void 0 ? void 0 : dialog.close();\n    const closeEvent = new CustomEvent('modal-closed', {\n        bubbles: true,\n        cancelable: true,\n        detail: { modalId: id },\n    });\n    modal.dispatchEvent(closeEvent);\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'closeModal',\n        id: id,\n    });\n};\nexport const closeButtonHtml = `<button class=\"btn btn-compact btn-secondary fa-xmark-large\" data-close>Close</button>`;\n","var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {\n    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }\n    return new (P || (P = Promise))(function (resolve, reject) {\n        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\n        function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\n        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }\n        step((generator = generator.apply(thisArg, _arguments || [])).next());\n    });\n};\nimport { trackComponentRegistered } from '../_global';\nimport { videoHTML, openYoutubeVideo, openVimeoVideo } from '../../modules/videos';\nimport { openModal, closeModal, closeButtonHtml } from '../../modules/modal';\ntrackComponentRegistered('iam-video-modal');\nclass iamVideoCard 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/modal.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\r\n    <style>\r\n    ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\r\n    \r\n    ${loadCSS}\r\n    </style>\r\n\r\n    <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\" />\r\n\r\n    <dialog>\r\n      ${closeButtonHtml}\r\n      ${videoHTML}\r\n    </dialog>\r\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        return __awaiter(this, void 0, void 0, function* () {\n            var _a;\n            const id = this.getAttribute('id');\n            const closeButton = (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('[data-close]');\n            this.innerHTML = `<div class=\"embed\" slot=\"video\"></div>`;\n            const embed = this.querySelector('.embed');\n            document.addEventListener('click', (e) => {\n                if (e.target.closest(`[command=\"show-modal\"][commandfor=\"${id}\"]`)) {\n                    e.preventDefault();\n                    if (this.hasAttribute('data-youtube')) {\n                        const youtubeId = this.getAttribute('data-youtube');\n                        embed === null || embed === void 0 ? void 0 : embed.setAttribute('id', youtubeId);\n                        openYoutubeVideo(this);\n                        openModal(this);\n                    }\n                    else if (this.hasAttribute('data-vimeo')) {\n                        openVimeoVideo(this);\n                        openModal(this);\n                    }\n                }\n            });\n            closeButton === null || closeButton === void 0 ? void 0 : closeButton.addEventListener('click', () => {\n                closeModal(this);\n                if (this.hasAttribute('data-youtube')) {\n                    const youtubeId = this.getAttribute('data-youtube');\n                    if (window.player[youtubeId] && typeof window.player[youtubeId].pauseVideo == 'function') {\n                        window.player[youtubeId].pauseVideo();\n                    }\n                }\n                else if (this.hasAttribute('data-vimeo')) {\n                    embed.innerHTML = ``; // Remove the video since we cant pause it\n                    const customEvent = new CustomEvent('close-video', {\n                        detail: { 'Video Type': 'Vimeo', ID: this.getAttribute('data-vimeo') },\n                    });\n                    this.dispatchEvent(customEvent);\n                    window.dataLayer.push(customEvent.detail);\n                }\n            });\n        });\n    }\n}\nexport default iamVideoCard;\n"],"names":["trackComponentRegistered","componentName","__awaiter","thisArg","_arguments","P","generator","adopt","value","resolve","reject","fulfilled","step","e","rejected","result","videoHTML","loadYouTubeScripts","image","tag","firstScriptTag","createYoutTubeVideo","target","video_id","onPlayerReady","onPlayerStateChange","event","done","openYoutubeVideo","component","embed","youtubeId","customEvent","interval","openVimeoVideo","vimeoId","openModal","modal","_a","dialog","id","closeEvent","closeModal","closeButtonHtml","iamVideoCard","template","closeButton"],"mappings":"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"}

package/assets/js/components/word-count/word-count.component.js

@@ -1,4 +1,4 @@
-import { trackComponentRegistered } from '../_global.js';
+import { trackComponentRegistered } from '../_global';
 trackComponentRegistered('iam-word-count');
 class iamCard extends HTMLElement {
     constructor() {

package/assets/js/components/word-count/word-count.component.min.js

@@ -1,5 +1,5 @@
 /*!
-  * iamKey v7.7.1--beta4
+  * iamKey v7.7.1--beta6
   * Copyright 2022-2026 iamproperty
   */const o=i=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:i})};o("iam-word-count");class n 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>

package/assets/js/components/word-count/word-count.component.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"word-count.component.min.js","sources":["../_global.js","word-count.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-word-count');\nclass iamCard 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/word-count.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n\n    ${loadCSS}\n    </style>\n    <slot></slot>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        const input = this.querySelector('input,textarea,select');\n        let span = this.querySelector('[data-count]');\n        if (!span) {\n            span = document.createElement('span');\n            this.append(span);\n        }\n        console.log(input.value.split(' ').length);\n        if (this.hasAttribute('data-character'))\n            span.setAttribute('data-count', input.value ? input.value.length : '0');\n        else\n            span.setAttribute('data-count', input.value ? input.value.split(' ').length : '0');\n        const maxlength = this.getAttribute('data-max');\n        this.style.setProperty('--maxlength', maxlength);\n        span.setAttribute('data-max', this.getAttribute('data-max'));\n        input.addEventListener('input', (event) => {\n            if (this.hasAttribute('data-max') && span && this.hasAttribute('data-character')) {\n                input === null || input === void 0 ? void 0 : input.setAttribute('maxlength', this.getAttribute('data-max'));\n                span.setAttribute('data-count', input === null || input === void 0 ? void 0 : input.value.length);\n            }\n            else if (this.hasAttribute('data-max') && span) {\n                if ((input === null || input === void 0 ? void 0 : input.value.split(' ').length) >= this.getAttribute('data-max')) {\n                    event === null || event === void 0 ? void 0 : event.preventDefault();\n                    input === null || input === void 0 ? void 0 : input.setAttribute('maxlength', input === null || input === void 0 ? void 0 : input.value.length);\n                }\n                else {\n                    input === null || input === void 0 ? void 0 : input.removeAttribute('maxlength');\n                }\n                span.setAttribute('data-count', input === null || input === void 0 ? void 0 : input.value.split(' ').length);\n                span.setAttribute('data-max', this.getAttribute('data-max'));\n            }\n        });\n        /*\n    \n        // maxlength counter init\n        Array.from(document.querySelectorAll('input[maxlength],textarea[maxlength]')).forEach((input) => {\n          const wrapper = input.parentElement;\n          setMaxlengthVars(input, wrapper);\n        });\n    \n    \n    \n    const wrapper = input.parentElement;\n      const maxlength = input.getAttribute('maxlength');\n    \n      wrapper.style.setProperty('--maxlength', maxlength);\n    \n      let span = input.nextElementSibling;\n    \n      if (!span || (span && span.classList.contains('invalid-feedback'))) {\n        span = document.createElement('span');\n        wrapper.insertBefore(span, input.nextSibling);\n      }\n     v\n      span.setAttribute('data-count', input.value.length);\n    \n    \n    */\n    }\n}\nexport default iamCard;\n"],"names":["trackComponentRegistered","componentName","iamCard","template","input","span","maxlength","event"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,ECNAD,EAAyB,gBAAgB,EACzC,MAAME,UAAgB,WAAY,CAC9B,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,MAOrB,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,MAAMC,EAAQ,KAAK,cAAc,uBAAuB,EACxD,IAAIC,EAAO,KAAK,cAAc,cAAc,EACvCA,IACDA,EAAO,SAAS,cAAc,MAAM,EACpC,KAAK,OAAOA,CAAI,GAEpB,QAAQ,IAAID,EAAM,MAAM,MAAM,GAAG,EAAE,MAAM,EACrC,KAAK,aAAa,gBAAgB,EAClCC,EAAK,aAAa,aAAcD,EAAM,MAAQA,EAAM,MAAM,OAAS,GAAG,EAEtEC,EAAK,aAAa,aAAcD,EAAM,MAAQA,EAAM,MAAM,MAAM,GAAG,EAAE,OAAS,GAAG,EACrF,MAAME,EAAY,KAAK,aAAa,UAAU,EAC9C,KAAK,MAAM,YAAY,cAAeA,CAAS,EAC/CD,EAAK,aAAa,WAAY,KAAK,aAAa,UAAU,CAAC,EAC3DD,EAAM,iBAAiB,QAAUG,GAAU,CACnC,KAAK,aAAa,UAAU,GAAKF,GAAQ,KAAK,aAAa,gBAAgB,GAC7BD,GAAM,aAAa,YAAa,KAAK,aAAa,UAAU,CAAC,EAC3GC,EAAK,aAAa,aAA4DD,GAAM,MAAM,MAAM,GAE3F,KAAK,aAAa,UAAU,GAAKC,IACaD,GAAM,MAAM,MAAM,GAAG,EAAE,QAAW,KAAK,aAAa,UAAU,GAC/DG,GAAM,eAAc,EACpBH,GAAM,aAAa,YAA2DA,GAAM,MAAM,MAAM,GAGhGA,GAAM,gBAAgB,WAAW,EAEnFC,EAAK,aAAa,aAA4DD,GAAM,MAAM,MAAM,GAAG,EAAE,MAAM,EAC3GC,EAAK,aAAa,WAAY,KAAK,aAAa,UAAU,CAAC,EAEnE,CAAC,CA2BL,CACJ"}
+{"version":3,"file":"word-count.component.min.js","sources":["../_global.js","word-count.component.js"],"sourcesContent":["export const trackComponentRegistered = (componentName) => {\n    // Data layer Web component created\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'customElementRegistered',\n        element: componentName,\n    });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n    // Data layer Web component created\n    window.dataLayer = window.dataLayer || [];\n    window.dataLayer.push({\n        event: 'customElementAdded',\n        element: componentName,\n    });\n    trackEvents.forEach((eventName) => {\n        component.addEventListener(eventName, function (event) {\n            const eventDetails = {\n                event: eventName,\n                element: componentName,\n                target: event.target,\n            };\n            Object.keys(event.detail).forEach((eventKey) => {\n                const eventDetail = event.detail[eventKey];\n                eventDetails[eventKey] = eventDetail;\n            });\n            window.dataLayer.push(eventDetails);\n        });\n    });\n    return true;\n};\n","import { trackComponentRegistered } from '../_global';\ntrackComponentRegistered('iam-word-count');\nclass iamCard 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/word-count.component.css\";`;\n        const template = document.createElement('template');\n        template.innerHTML = `\n    <style>\n\n    ${loadCSS}\n    </style>\n    <slot></slot>\n    `;\n        this.shadowRoot.appendChild(template.content.cloneNode(true));\n    }\n    connectedCallback() {\n        const input = this.querySelector('input,textarea,select');\n        let span = this.querySelector('[data-count]');\n        if (!span) {\n            span = document.createElement('span');\n            this.append(span);\n        }\n        console.log(input.value.split(' ').length);\n        if (this.hasAttribute('data-character'))\n            span.setAttribute('data-count', input.value ? input.value.length : '0');\n        else\n            span.setAttribute('data-count', input.value ? input.value.split(' ').length : '0');\n        const maxlength = this.getAttribute('data-max');\n        this.style.setProperty('--maxlength', maxlength);\n        span.setAttribute('data-max', this.getAttribute('data-max'));\n        input.addEventListener('input', (event) => {\n            if (this.hasAttribute('data-max') && span && this.hasAttribute('data-character')) {\n                input === null || input === void 0 ? void 0 : input.setAttribute('maxlength', this.getAttribute('data-max'));\n                span.setAttribute('data-count', input === null || input === void 0 ? void 0 : input.value.length);\n            }\n            else if (this.hasAttribute('data-max') && span) {\n                if ((input === null || input === void 0 ? void 0 : input.value.split(' ').length) >= this.getAttribute('data-max')) {\n                    event === null || event === void 0 ? void 0 : event.preventDefault();\n                    input === null || input === void 0 ? void 0 : input.setAttribute('maxlength', input === null || input === void 0 ? void 0 : input.value.length);\n                }\n                else {\n                    input === null || input === void 0 ? void 0 : input.removeAttribute('maxlength');\n                }\n                span.setAttribute('data-count', input === null || input === void 0 ? void 0 : input.value.split(' ').length);\n                span.setAttribute('data-max', this.getAttribute('data-max'));\n            }\n        });\n        /*\n    \n        // maxlength counter init\n        Array.from(document.querySelectorAll('input[maxlength],textarea[maxlength]')).forEach((input) => {\n          const wrapper = input.parentElement;\n          setMaxlengthVars(input, wrapper);\n        });\n    \n    \n    \n    const wrapper = input.parentElement;\n      const maxlength = input.getAttribute('maxlength');\n    \n      wrapper.style.setProperty('--maxlength', maxlength);\n    \n      let span = input.nextElementSibling;\n    \n      if (!span || (span && span.classList.contains('invalid-feedback'))) {\n        span = document.createElement('span');\n        wrapper.insertBefore(span, input.nextSibling);\n      }\n     v\n      span.setAttribute('data-count', input.value.length);\n    \n    \n    */\n    }\n}\nexport default iamCard;\n"],"names":["trackComponentRegistered","componentName","iamCard","template","input","span","maxlength","event"],"mappings":";;;IAAO,MAAMA,EAA4BC,GAAkB,CAEvD,OAAO,UAAY,OAAO,WAAa,CAAA,EACvC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAASA,CACjB,CAAK,CACL,ECNAD,EAAyB,gBAAgB,EACzC,MAAME,UAAgB,WAAY,CAC9B,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,MAOrB,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CAChE,CACA,mBAAoB,CAChB,MAAMC,EAAQ,KAAK,cAAc,uBAAuB,EACxD,IAAIC,EAAO,KAAK,cAAc,cAAc,EACvCA,IACDA,EAAO,SAAS,cAAc,MAAM,EACpC,KAAK,OAAOA,CAAI,GAEpB,QAAQ,IAAID,EAAM,MAAM,MAAM,GAAG,EAAE,MAAM,EACrC,KAAK,aAAa,gBAAgB,EAClCC,EAAK,aAAa,aAAcD,EAAM,MAAQA,EAAM,MAAM,OAAS,GAAG,EAEtEC,EAAK,aAAa,aAAcD,EAAM,MAAQA,EAAM,MAAM,MAAM,GAAG,EAAE,OAAS,GAAG,EACrF,MAAME,EAAY,KAAK,aAAa,UAAU,EAC9C,KAAK,MAAM,YAAY,cAAeA,CAAS,EAC/CD,EAAK,aAAa,WAAY,KAAK,aAAa,UAAU,CAAC,EAC3DD,EAAM,iBAAiB,QAAUG,GAAU,CACnC,KAAK,aAAa,UAAU,GAAKF,GAAQ,KAAK,aAAa,gBAAgB,GAC7BD,GAAM,aAAa,YAAa,KAAK,aAAa,UAAU,CAAC,EAC3GC,EAAK,aAAa,aAA4DD,GAAM,MAAM,MAAM,GAE3F,KAAK,aAAa,UAAU,GAAKC,IACaD,GAAM,MAAM,MAAM,GAAG,EAAE,QAAW,KAAK,aAAa,UAAU,GAC/DG,GAAM,eAAc,EACpBH,GAAM,aAAa,YAA2DA,GAAM,MAAM,MAAM,GAGhGA,GAAM,gBAAgB,WAAW,EAEnFC,EAAK,aAAa,aAA4DD,GAAM,MAAM,MAAM,GAAG,EAAE,MAAM,EAC3GC,EAAK,aAAa,WAAY,KAAK,aAAa,UAAU,CAAC,EAEnE,CAAC,CA2BL,CACJ"}

package/assets/js/modules/card.module.js

@@ -1,17 +1,17 @@
-export const cardHTML = `<div class="card__head" part="head">
-  <slot name="head"></slot>
-</div>
-<div class="card__badges"><slot name="badges"></slot></div>
-<slot name="checkbox" class="activate-prevent-hover"></slot>
-<div class="card__body" part="body">
-  <slot></slot>
-  <slot name="secondary" part="secondary"></slot>
-</div>
-<div class="card__details" part="details">
-  <slot name="details"></slot>
-</div>
-<div class="card__footer" part="footer">
-  <slot name="footer"></slot>
+export const cardHTML = `<div class="card__head" part="head">
+  <slot name="head"></slot>
+</div>
+<div class="card__badges"><slot name="badges"></slot></div>
+<slot name="checkbox" class="activate-prevent-hover"></slot>
+<div class="card__body" part="body">
+  <slot></slot>
+  <slot name="secondary" part="secondary"></slot>
+</div>
+<div class="card__details" part="details">
+  <slot name="details"></slot>
+</div>
+<div class="card__footer" part="footer">
+  <slot name="footer"></slot>
 </div>`;
 export const setupCard = (cardComponent) => {
     var _a;

package/assets/js/modules/chart.js

@@ -1,4 +1,4 @@
-import { ucfirst, unsnake, numberOfDays } from './helpers.js';
+import { ucfirst, unsnake, numberOfDays } from './helpers';
 // #region Functions that setup and trigger other functions
 export const setupChart = (chartElement, chartOuter, tableElement) => {
     // #region Reset the chart

package/assets/js/modules/chart.module.js

@@ -1,4 +1,4 @@
-import { ucfirst, unsnake } from './helpers.js';
+import { ucfirst, unsnake } from './helpers';
 // #region Functions that setup and trigger other functions
 export const addClasses = (chartElement, chartOuter) => {
     // add colour classes
@@ -450,10 +450,10 @@ export const createdoughnuts = function (chartOuter) {
                     cumulativePercent += percent;
             }
         });
-        returnString += `<div class="doughnut">
-  <svg viewBox="-105 -105 210 210" preserveAspectRatio="none" style="--row-index: ${index + 1};">${paths}</svg>
-  <div class="doughnut__title" data-numeric="${rowTotal}"><span class="h5 mb-0">${title}</span></div>
-  <div class="tooltips">${tooltips}</div>
+        returnString += `<div class="doughnut">
+  <svg viewBox="-105 -105 210 210" preserveAspectRatio="none" style="--row-index: ${index + 1};">${paths}</svg>
+  <div class="doughnut__title" data-numeric="${rowTotal}"><span class="h5 mb-0">${title}</span></div>
+  <div class="tooltips">${tooltips}</div>
 </div>`;
     });
     doughnutWrapper.innerHTML = returnString;

package/assets/js/modules/helper.test.js

@@ -1,5 +1,5 @@
-import { describe, it, expect } from './test.js';
-import { isValidPostcode } from './helpers.js';
+import { describe, it, expect } from './test.ts';
+import { isValidPostcode } from './helpers.ts';
 describe("MathUtils Tests", function () {
     it('should pass', function () {
         expect(1 === 1);

package/assets/js/modules/integration-tests.js

@@ -385,9 +385,9 @@ const integrationTests = () => {
     if (integrationTestsArr.length != 0) {
         let displayComp = document.querySelector('#vmtests-display');
         if (displayComp != null) {
-            displayComp.innerHTML = `<div class="container">
-      <h2>Integration notes</h2>
-      <ul id="integrationTests"></ul>
+            displayComp.innerHTML = `<div class="container">
+      <h2>Integration notes</h2>
+      <ul id="integrationTests"></ul>
       </div>`;
             let integrationTests = document.getElementById('integrationTests');
             if (integrationTests != null) {

package/assets/js/modules/modal.js

@@ -1,6 +1,7 @@
-export const openModal = (id, modal) => {
+export const openModal = (modal) => {
     var _a;
     const dialog = (_a = modal.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('dialog');
+    const id = modal.hasAttribute('id') ? modal.getAttribute('id') : 'unknown';
     dialog === null || dialog === void 0 ? void 0 : dialog.showModal();
     dialog === null || dialog === void 0 ? void 0 : dialog.focus();
     const closeEvent = new CustomEvent('modal-opened', {
@@ -15,9 +16,10 @@ export const openModal = (id, modal) => {
         id: id,
     });
 };
-export const closeModal = (id, modal) => {
+export const closeModal = (modal) => {
     var _a;
     const dialog = (_a = modal.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('dialog');
+    const id = modal.hasAttribute('id') ? modal.getAttribute('id') : 'unknown';
     dialog === null || dialog === void 0 ? void 0 : dialog.close();
     const closeEvent = new CustomEvent('modal-closed', {
         bubbles: true,

package/assets/js/modules/table.js

@@ -7,7 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { zeroPad, isNumeric, ucfirst, resolvePath, uniqueID } from './helpers.js';
+import { zeroPad, isNumeric, ucfirst, resolvePath, uniqueID } from './helpers';
 // #region Helpers
 export const formatCell = (format, cellOutput) => {
     switch (format) {
@@ -152,8 +152,8 @@ export const setupBasicTable = (component, table, form, pagination) => {
 // #region Basic table fnctions
 export const highlightRows = (component) => {
     Array.from(component.querySelectorAll('tr[data-highlight]')).forEach((row) => {
-        row.insertAdjacentHTML('afterend', `<tr role="presentation" class="tr--highlight">
-          <td colspan="100%"><i class="fa-solid fa-star"></i> ${row.getAttribute('data-highlight')}</td>
+        row.insertAdjacentHTML('afterend', `<tr role="presentation" class="tr--highlight">
+          <td colspan="100%"><i class="fa-solid fa-star"></i> ${row.getAttribute('data-highlight')}</td>
         </tr>`);
     });
 };

package/assets/js/modules/tabs.js

@@ -1,4 +1,4 @@
-import { getSwipeDirection } from './helpers.js';
+import { getSwipeDirection } from './helpers';
 export const createTabsLinks = function (tabsElement) {
     const detailsORLinks = tabsElement.querySelectorAll(':scope > details, :scope > a');
     let tabLinks = tabsElement.querySelector(':scope > .tabs__links');