@iamproperty/components 7.3.0 → 7.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/css/components/actionbar.component.css +1 -1
- package/assets/css/components/actionbar.component.css.map +1 -1
- package/assets/css/components/actionbar.global.css +1 -1
- package/assets/css/components/actionbar.global.css.map +1 -1
- package/assets/css/components/barchart.component.css +1 -1
- package/assets/css/components/barchart.component.css.map +1 -1
- package/assets/css/components/calendar.component.css +1 -0
- package/assets/css/components/calendar.component.css.map +1 -0
- package/assets/css/components/calendar.config.css +1 -0
- package/assets/css/components/calendar.config.css.map +1 -0
- package/assets/css/components/card.component.css +1 -1
- package/assets/css/components/card.component.css.map +1 -1
- package/assets/css/components/carousel.component.css +1 -1
- package/assets/css/components/carousel.component.css.map +1 -1
- package/assets/css/components/collapsible-side.css +1 -1
- package/assets/css/components/collapsible-side.css.map +1 -1
- package/assets/css/components/content.component.css +1 -0
- package/assets/css/components/content.component.css.map +1 -0
- package/assets/css/components/doughnutchart.component.css +1 -1
- package/assets/css/components/doughnutchart.component.css.map +1 -1
- package/assets/css/components/fileupload.css.map +1 -1
- package/assets/css/components/inline-edit.css +1 -1
- package/assets/css/components/inline-edit.css.map +1 -1
- package/assets/css/components/marketing.component.css +1 -0
- package/assets/css/components/marketing.component.css.map +1 -0
- package/assets/css/components/menu.component.css.map +1 -1
- package/assets/css/components/milestone.css +1 -0
- package/assets/css/components/milestone.css.map +1 -0
- package/assets/css/components/multiselect.css +1 -1
- package/assets/css/components/multiselect.css.map +1 -1
- package/assets/css/components/nav.component.css +1 -1
- package/assets/css/components/nav.component.css.map +1 -1
- package/assets/css/components/nav.global.css +1 -1
- package/assets/css/components/nav.global.css.map +1 -1
- package/assets/css/components/pagination.css.map +1 -1
- package/assets/css/components/rank.component.css +1 -1
- package/assets/css/components/rank.component.css.map +1 -1
- package/assets/css/components/rankings.component.css +1 -1
- package/assets/css/components/rankings.component.css.map +1 -1
- package/assets/css/components/rankings.global.css +1 -1
- package/assets/css/components/rankings.global.css.map +1 -1
- package/assets/css/components/slider.css.map +1 -1
- package/assets/css/components/split-button.component.css +1 -0
- package/assets/css/components/split-button.component.css.map +1 -0
- package/assets/css/core.min.css +1 -1
- package/assets/css/core.min.css.map +1 -1
- package/assets/css/mobile-core.min.css +1 -1
- package/assets/css/mobile-core.min.css.map +1 -1
- package/assets/css/mobile.min.css +1 -1
- package/assets/css/mobile.min.css.map +1 -1
- package/assets/css/style.min.css +1 -1
- package/assets/css/style.min.css.map +1 -1
- package/assets/js/components/accordion/accordion.component.min.js +1 -1
- package/assets/js/components/actionbar/actionbar.component.js +51 -31
- package/assets/js/components/actionbar/actionbar.component.min.js +17 -17
- package/assets/js/components/actionbar/actionbar.component.min.js.map +1 -1
- package/assets/js/components/address-lookup/address-lookup.component.min.js +1 -1
- package/assets/js/components/advanced-select/advanced-select.component.js +63 -0
- package/assets/js/components/advanced-select/advanced-select.component.min.js +23 -0
- package/assets/js/components/advanced-select/advanced-select.component.min.js.map +1 -0
- package/assets/js/components/applied-filters/applied-filters.component.min.js +1 -1
- package/assets/js/components/barchart/barchart.component.min.js +2 -2
- package/assets/js/components/bento-grid/bento-grid.component.min.js +1 -1
- package/assets/js/components/calendar/calendar.component.js +1083 -0
- package/assets/js/components/calendar/calendar.component.min.js +170 -0
- package/assets/js/components/calendar/calendar.component.min.js.map +1 -0
- package/assets/js/components/card/card.component.js +20 -8
- package/assets/js/components/card/card.component.min.js +10 -10
- package/assets/js/components/card/card.component.min.js.map +1 -1
- package/assets/js/components/carousel/carousel.component.min.js +2 -2
- package/assets/js/components/collapsible-side/collapsible-side.component.js +47 -12
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js +6 -5
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js.map +1 -1
- package/assets/js/components/content/content.component.js +66 -0
- package/assets/js/components/content/content.component.min.js +15 -0
- package/assets/js/components/content/content.component.min.js.map +1 -0
- package/assets/js/components/doughnutchart/doughnutchart.component.min.js +2 -2
- package/assets/js/components/fileupload/fileupload.component.min.js +1 -1
- package/assets/js/components/filter-card/filter-card.component.min.js +1 -1
- package/assets/js/components/filterlist/filterlist.component.min.js +1 -1
- package/assets/js/components/header/header.component.min.js +1 -1
- package/assets/js/components/inline-edit/inline-edit.component.min.js +5 -5
- package/assets/js/components/marketing/marketing.component.js +1 -1
- package/assets/js/components/marketing/marketing.component.min.js +2 -2
- package/assets/js/components/marketing/marketing.component.min.js.map +1 -1
- package/assets/js/components/menu/menu.component.js +10 -2
- package/assets/js/components/menu/menu.component.min.js +2 -2
- package/assets/js/components/menu/menu.component.min.js.map +1 -1
- package/assets/js/components/milestone/milestone.component.js +38 -0
- package/assets/js/components/milestone/milestone.component.min.js +15 -0
- package/assets/js/components/milestone/milestone.component.min.js.map +1 -0
- package/assets/js/components/milestone-group/milestone-group.component.js +35 -0
- package/assets/js/components/milestone-group/milestone-group.component.min.js +13 -0
- package/assets/js/components/milestone-group/milestone-group.component.min.js.map +1 -0
- package/assets/js/components/multi-step/multi-step.component.min.js +1 -1
- package/assets/js/components/multiselect/multiselect.component.js +54 -2
- package/assets/js/components/multiselect/multiselect.component.min.js +5 -5
- package/assets/js/components/multiselect/multiselect.component.min.js.map +1 -1
- package/assets/js/components/nav/nav.component.js +19 -0
- package/assets/js/components/nav/nav.component.min.js +6 -6
- package/assets/js/components/nav/nav.component.min.js.map +1 -1
- package/assets/js/components/notification/notification.component.js +17 -11
- package/assets/js/components/notification/notification.component.min.js +4 -4
- package/assets/js/components/notification/notification.component.min.js.map +1 -1
- package/assets/js/components/pagination/pagination.component.min.js +1 -1
- package/assets/js/components/rank/rank.component.js +346 -210
- package/assets/js/components/rank/rank.component.min.js +346 -211
- package/assets/js/components/rank/rank.component.min.js.map +1 -1
- package/assets/js/components/rankings/rankings.component.js +17 -8
- package/assets/js/components/rankings/rankings.component.min.js +14 -8
- package/assets/js/components/rankings/rankings.component.min.js.map +1 -1
- package/assets/js/components/record-card/record-card.component.min.js +1 -1
- package/assets/js/components/search/search.component.js +5 -3
- package/assets/js/components/search/search.component.min.js +6 -6
- package/assets/js/components/search/search.component.min.js.map +1 -1
- package/assets/js/components/slider/slider.component.min.js +1 -1
- package/assets/js/components/split-button/split-button.component.js +60 -0
- package/assets/js/components/split-button/split-button.component.min.js +34 -0
- package/assets/js/components/split-button/split-button.component.min.js.map +1 -0
- package/assets/js/components/table/table.component.js +12 -0
- package/assets/js/components/table/table.component.min.js +3 -3
- package/assets/js/components/table/table.component.min.js.map +1 -1
- package/assets/js/components/table-ajax/table-ajax.component.js +12 -0
- package/assets/js/components/table-ajax/table-ajax.component.min.js +3 -3
- package/assets/js/components/table-ajax/table-ajax.component.min.js.map +1 -1
- package/assets/js/components/table-basic/table-basic.component.min.js +1 -1
- package/assets/js/components/table-basic/table-basic.component.min.js.map +1 -1
- package/assets/js/components/table-no-submit/table-no-submit.component.js +12 -0
- package/assets/js/components/table-no-submit/table-no-submit.component.min.js +3 -3
- package/assets/js/components/table-no-submit/table-no-submit.component.min.js.map +1 -1
- package/assets/js/components/table-submit/table-submit.component.js +12 -0
- package/assets/js/components/table-submit/table-submit.component.min.js +3 -3
- package/assets/js/components/table-submit/table-submit.component.min.js.map +1 -1
- package/assets/js/components/tabs/tabs.component.min.js +1 -1
- package/assets/js/components/video-card/video-card.component.min.js +1 -1
- package/assets/js/components/video-card/video-card.component.min.js.map +1 -1
- package/assets/js/components.js +58 -0
- package/assets/js/modules/advanced-select.js +106 -0
- package/assets/js/modules/dialogs.js +53 -51
- package/assets/js/modules/dynamicEvents.js +7 -0
- package/assets/js/modules/milestone-group.js +30 -0
- package/assets/js/modules/milestone.js +89 -0
- package/assets/js/modules/table.js +11 -1
- package/assets/js/modules/videos.js +1 -1
- package/assets/js/scripts.bundle.js +3 -3
- package/assets/js/scripts.bundle.js.map +1 -1
- package/assets/js/scripts.bundle.min.js +2 -2
- package/assets/js/scripts.bundle.min.js.map +1 -1
- package/assets/js/scripts.js +4 -0
- package/assets/sass/_components.scss +11 -0
- package/assets/sass/_functions/utility-mixins.scss +41 -0
- package/assets/sass/_functions/variables.scss +11 -5
- package/assets/sass/components/actionbar.component.scss +1 -1
- package/assets/sass/components/actionbar.global.scss +4 -4
- package/assets/sass/components/calendar.component.scss +1380 -0
- package/assets/sass/components/calendar.config.scss +476 -0
- package/assets/sass/components/card.component.scss +4 -34
- package/assets/sass/components/carousel.component.scss +5 -0
- package/assets/sass/components/collapsible-side.scss +91 -95
- package/assets/sass/components/content.component.scss +18 -0
- package/assets/sass/components/inline-edit.scss +2 -0
- package/assets/sass/components/{marketing.scss → marketing.component.scss} +2 -6
- package/assets/sass/components/menu.component.scss +3 -8
- package/assets/sass/components/milestone.scss +207 -0
- package/assets/sass/components/multiselect.scss +3 -0
- package/assets/sass/components/nav.component.scss +1 -0
- package/assets/sass/components/nav.global.scss +30 -0
- package/assets/sass/components/rank.component.scss +197 -24
- package/assets/sass/components/rankings.component.scss +38 -28
- package/assets/sass/components/rankings.global.scss +64 -2
- package/assets/sass/components/split-button.component.scss +77 -0
- package/assets/sass/elements/badge-tag.scss +5 -1
- package/assets/sass/elements/buttons--compact.scss +4 -0
- package/assets/sass/elements/details.scss +0 -1
- package/assets/sass/elements/forms.scss +130 -8
- package/assets/sass/elements/links.scss +132 -4
- package/assets/sass/elements/lists.scss +61 -0
- package/assets/sass/elements/popover.scss +64 -10
- package/assets/sass/elements/toggle-button.scss +7 -8
- package/assets/sass/elements/type.scss +7 -10
- package/assets/sass/templates/form.scss +0 -2
- package/assets/ts/components/actionbar/actionbar.component.ts +49 -23
- package/assets/ts/components/advanced-select/advanced-select.component.ts +74 -0
- package/assets/ts/components/calendar/calendar.component.ts +1460 -0
- package/assets/ts/components/card/card.component.ts +22 -14
- package/assets/ts/components/collapsible-side/collapsible-side.component.ts +53 -12
- package/assets/ts/components/content/content.component.ts +78 -0
- package/assets/ts/components/marketing/marketing.component.ts +1 -1
- package/assets/ts/components/menu/menu.component.ts +16 -8
- package/assets/ts/components/milestone/milestone.component.ts +45 -0
- package/assets/ts/components/milestone-group/milestone-group.component.ts +41 -0
- package/assets/ts/components/multiselect/multiselect.component.ts +69 -3
- package/assets/ts/components/nav/nav.component.ts +25 -0
- package/assets/ts/components/notification/notification.component.ts +34 -11
- package/assets/ts/components/rank/rank.component.ts +345 -209
- package/assets/ts/components/rankings/rankings.component.ts +27 -8
- package/assets/ts/components/search/search.component.ts +6 -4
- package/assets/ts/components/split-button/split-button.component.ts +69 -0
- package/assets/ts/components/table/table.component.ts +14 -0
- package/assets/ts/components/table-ajax/table-ajax.component.ts +14 -0
- package/assets/ts/components/table-no-submit/table-no-submit.component.ts +14 -0
- package/assets/ts/components/table-submit/table-submit.component.ts +14 -0
- package/assets/ts/components/video-card/video-card.component.ts +2 -3
- package/assets/ts/components.ts +63 -0
- package/assets/ts/modules/advanced-select.ts +125 -0
- package/assets/ts/modules/dialogs.ts +64 -61
- package/assets/ts/modules/dynamicEvents.ts +12 -1
- package/assets/ts/modules/milestone-group.ts +42 -0
- package/assets/ts/modules/milestone.ts +122 -0
- package/assets/ts/modules/table.ts +15 -1
- package/assets/ts/modules/videos.ts +19 -37
- package/assets/ts/scripts.ts +5 -3
- package/dist/components.es.js +41 -1923
- package/dist/components.umd.js +126 -105
- package/package.json +1 -1
- package/src/components/AdvancedSelect/AdvancedSelect.vue +23 -0
- package/src/components/Calendar/Calendar.vue +26 -0
- package/src/components/Card/Card.vue +1 -1
- package/src/components/CollapsibleSideMenu/CollapsibleSideMenu.vue +7 -13
- package/src/components/Content/Content.vue +23 -0
- package/src/components/Milestones/Milestone.vue +27 -0
- package/src/components/Milestones/MilestoneGroup.vue +27 -0
- package/src/components/SplitButton/README.md +19 -0
- package/src/components/SplitButton/SplitButton.vue +26 -0
- package/src/index.js +44 -41
- package/assets/css/components/marketing.css +0 -1
- package/assets/css/components/marketing.css.map +0 -1
- package/assets/css/components/nav.old.css +0 -1
- package/assets/css/components/nav.old.css.map +0 -1
- package/assets/sass/components/nav.old.scss +0 -891
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.4.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/const M=t=>t.charAt(0).toUpperCase()+t.slice(1),L=t=>t.replace(/_/g," "),E=(t,r)=>{for(let a=1;a<=10;a++){if(t.hasAttribute(`data-colour-${a}`)){const i=t.getAttribute(`data-colour-${a}`);t.style.setProperty(`--chart-colour-${a}`,`var(--chart-colour-${i})`),t.style.setProperty(`--chart-colour-${a}-hover`,`var(--chart-colour-${i}-hover)`)}Array.from(r.querySelectorAll(`[data-colour-${a}]`)).forEach(i=>{const o=i.getAttribute(`data-colour-${a}`);i.style.setProperty(`--chart-colour-${a}-set`,`var(--chart-colour-${o})`),i.style.setProperty(`--chart-colour-${a}-hover`,`var(--chart-colour-${o}-hover)`)})}return!0},w=(t,r,a)=>{if(t.tagName=="IAM-DOUGHNUTCHART")return P(t,r,a),!0;const i=r.querySelector(".chart__key");i.innerHTML="";const o=r.querySelector(".chart__guidelines");o.innerHTML="";const n=r.querySelector(".chart__yaxis");n.innerHTML="",Array.from(r.querySelectorAll(':scope > input[type="checkbox"],:scope > input[type="radio"]')).map(c=>{c.remove()});const{xaxis:e}=m(t);return A(t,a),T(r,a,i),j(t,o),I(t,n),e&&X(r),!0},P=(t,r,a)=>{const i=r.querySelector(".chart__key");return i.innerHTML="",Array.from(r.querySelectorAll(':scope > input[type="checkbox"],:scope > input[type="radio"]')).map(o=>{o.remove()}),A(t,a),T(r,a,i),F(r),!0},R=function(t,r){const a=r.querySelector(".chart");a.addEventListener("mousemove",e=>{if(e&&e.target instanceof HTMLElement&&e.target.closest("td:not(:first-child")){const l=e.target.closest("td:not(:first-child").getBoundingClientRect(),s=e.clientX-l.left,h=e.clientY-l.top;a.setAttribute("style",`--cursor-x: ${s}px; --cursor-y: ${h}px;`)}});const i=r.querySelectorAll("label");Array.from(i).forEach(e=>{r.querySelector(`input#${e.getAttribute("for")}`).checked?e.setAttribute("part","key-checked"):e.setAttribute("part","key-unchecked")});const o=t.querySelector("table"),n=r.querySelector("table");r.addEventListener("change",function(e){const c=e.target,l=new CustomEvent("view-change",{detail:{"data-dataset":c.getAttribute("data-dataset"),label:c.getAttribute("data-label"),checked:c.checked}});t.dispatchEvent(l),Array.from(i).forEach(s=>{var h;!((h=r.querySelector(`input#${s.getAttribute("for")}`))===null||h===void 0)&&h.checked?s.setAttribute("part","key-checked"):s.setAttribute("part","key-unchecked")}),n.innerHTML=o.innerHTML,A(t,n),t.tagName=="IAM-DOUGHNUTCHART"&&F(r)})},N=function(t,r){const a=t.querySelector("table"),i=r.querySelector("table"),o=(l,s)=>{s.disconnect(),c.disconnect();for(const h of l)(h.attributeName=="class"||h.type==="attributes"||h.type==="attributes")&&(i.innerHTML=a.innerHTML,w(t,r,i));s.observe(a,{characterData:!0,subtree:!0}),c.observe(t,{attributes:!0})},n=(l,s)=>{s.disconnect(),c.disconnect();for(const h of l)(h.type=="characterData"||h.type=="childList"&&h.addedNodes.length)&&(i.innerHTML=a.innerHTML,w(t,r,i));s.observe(a,{characterData:!0,subtree:!0}),c.observe(t,{attributes:!0})},e=new MutationObserver(n),c=new MutationObserver(o);return e.observe(a,{characterData:!0,subtree:!0}),c.observe(t,{attributes:!0}),!0};function q(t,r){r>1&&(t=t-.25);const a=Math.cos(2*Math.PI*t),i=Math.sin(2*Math.PI*t);return[a*100,i*100]}const m=function(t){const r=t.shadowRoot.querySelector(".chart__wrapper table"),a=t.hasAttribute("data-min")?t.getAttribute("data-min"):0,i=t.hasAttribute("data-max")?t.getAttribute("data-max"):U(t,r),o=t.hasAttribute("data-yaxis")?t.getAttribute("data-yaxis").split(","):[],n=t.hasAttribute("data-guidelines")?t.getAttribute("data-guidelines").split(","):[],e=t.hasAttribute("data-xaxis")?t.getAttribute("data-xaxis").split(","):null;return{min:a,max:i,yaxis:o,xaxis:e,guidelines:n}};function U(t,r){const a=t.classList.contains("chart--stacked")?"tbody tr":"tbody td:not(:first-child)",i=Array.from(r.querySelectorAll(a)).map(n=>n.getAttribute("data-numeric")),o=Math.max(...i);return Math.ceil(o)}const x=function(t,r,a,i){let o=String(t);o=o.replace("\xA3",""),o=o.replace("%",""),o=o.replace(",",""),o=Number.parseFloat(o);let n=(o-r)/(a-r)*100,e=n,c=0;return i&&i!=0&&(c=(i-r)/(a-r)*100),r<0&&(c=Math.abs(r/(a-r)*100),o<0?(n=c-n,c=c-n,e=c):(n=n-c,e=n+c)),{percent:n,axis:e,bottom:c}},A=function(t,r){Array.from(r.querySelectorAll("tbody tr")).forEach(o=>{let n=0;Array.from(o.querySelectorAll("td:not(:first-child)")).forEach(e=>{const c=e.cloneNode(!0);Array.from(c.querySelectorAll("*")).forEach(h=>{h.remove()});const l=parseFloat(c.textContent.replace("\xA3","").replace("%","").replace(",",""));e.setAttribute("data-numeric",l),e.setAttribute("data-value",c.textContent),getComputedStyle(e).display!="none"&&(n+=l),Array.from(e.querySelectorAll("a, button")).forEach((h,b)=>{b==0&&h.insertAdjacentHTML("beforeBegin","<hr/>"),h.classList.add("btn"),h.classList.add("btn-tertiary")})}),o.setAttribute("data-numeric",n)});const{min:a,max:i}=m(t);Array.from(r.querySelectorAll("tbody tr")).forEach((o,n)=>{const e=o.querySelector("td:first-child, th:first-child")?o.querySelector("td:first-child, th:first-child").textContent:"";o.setAttribute("part","group");const c=(o.getAttribute("data-numeric")-a)/(i-a)*100;o.style.setProperty("--percent",`${c}%`),Array.from(o.querySelectorAll("td:not([data-label])")).forEach((h,b)=>{b==0?h.setAttribute("part","xaxis-label"):h.setAttribute("part","value"),o.querySelectorAll("td").length>2&&h.setAttribute("data-label",r.querySelectorAll("thead th")[b].textContent)});const l=o.hasAttribute("data-min")?o.getAttribute("data-min"):a,s=o.hasAttribute("data-max")?o.getAttribute("data-max"):i;if(l<0){const h=Math.abs(l/(s-l)*100);t.setAttribute("style",`--min-bottom: ${h}%;`)}o.style.setProperty("--row-index",n+1),Array.from(o.querySelectorAll('td[data-numeric]:not([data-label="Min"]):not([data-label="Max"]):not(:first-child)')).forEach(h=>{if(getComputedStyle(h).display=="none")return;const g=h.innerHTML,_=Number.parseFloat(h.getAttribute("data-numeric")),d=Number.parseFloat(h.getAttribute("data-start"));if(h.querySelector("span[data-group]")||(h.innerHTML=`<span data-group="${e}" ${h.hasAttribute("data-label")?`data-label="${h.getAttribute("data-label")}"`:""} part="popover">${g}</span>`),!h.hasAttribute("style")){const{percent:v,bottom:y,axis:p}=x(_,l,s,d);h.setAttribute("data-percent",v),h.setAttribute("style",`--bottom:${y}%;--percent:${v}%;--axis:${p}%;`)}})})},T=function(t,r,a){const i=`chart-${Date.now()+(Math.floor(Math.random()*100)+1)}`;let o;const n=Array.from(r.querySelectorAll("thead th"));return n.forEach((e,c)=>{c!=0&&(o=V(i,c,e.textContent,a,t,o)),c==50&&(n.length=c+1)}),!0};function V(t,r,a,i,o,n){var e;const c=document.createElement("input");c.setAttribute("name",`${t}-dataset-${r}`),c.setAttribute("id",`${t}-dataset-${r}`),c.setAttribute("data-dataset",`${r}`),c.setAttribute("data-label",`${a}`),c.checked=!0,c.setAttribute("type","checkbox"),r==1?o.prepend(c):o.insertBefore(c,n.nextSibling),n=c;const l=document.createElement("label");l.setAttribute("class","key btn btn-action"),l.setAttribute("for",`${t}-dataset-${r}`),l.setAttribute("data-label",`${a}`),l.setAttribute("part","key");const s=(e=o.querySelector(`tbody tr td:nth-child(${r+1})`))===null||e===void 0?void 0:e.getAttribute("data-numeric");return l.setAttribute("data-numeric",s),l.innerHTML=`${a}`,i.append(l),n}const j=function(t,r){const{min:a,max:i,yaxis:o}=m(t);let{guidelines:n}=m(t);n.length||(n=o),r.innerHTML="";for(let e=0;e<n.length;e++){const c=parseFloat(n[e].replace("\xA3","").replace("%","").replace(",","")),{axis:l}=x(c,a,i);r.innerHTML+=`<div class="guideline" style="--percent:${l}%;">${o.indexOf(n[e])!=-1?`<span>${n[e]}</span>`:""}</div>`}},I=function(t,r){const{min:a,max:i,yaxis:o}=m(t);r.innerHTML="";for(let n=0;n<o.length;n++){const e=parseFloat(o[n].replace("\xA3","").replace("%","")),{axis:c}=x(e,a,i);r.innerHTML+=`<div class="axis__point" style="--percent:${c}%;"><span>${o[n]}</span></div>`}},X=function(t){const r=t.querySelector(".chart");let a=t.querySelector(".chart__xaxis");a||(a=document.createElement("div"),a.setAttribute("class","chart__xaxis")),r.prepend(a)},F=function(t){let r="";const a=t.querySelector(".chart");let i=t.querySelector(".doughnuts");i||(i=document.createElement("div"),i.setAttribute("class","doughnuts"),a.append(i)),Array.from(a.querySelectorAll("tbody tr")).forEach((o,n)=>{let e="",c="",l=0,s=0;const b=o.querySelectorAll("td")[0].innerHTML;let g=0;const _=o.getAttribute("data-numeric");Array.from(o.querySelectorAll("td")).forEach((d,v)=>{const y=getComputedStyle(d).display;if(v!=0&&y!="none"){let p=d.getAttribute("data-numeric");p=p.replace("\xA3",""),p=p.replace("%",""),p=p.replace(",",""),p=Number.parseInt(p),s+=p,g++}}),Array.from(o.querySelectorAll("td")).forEach((d,v)=>{var y,p;const f=getComputedStyle(d).display;if(v!=0&&g==1&&f!="none")e+=`<path d="M 0 0 L 100 0 A 100 100 0 1 1 100 -0.01 L 0 0" style="${d.getAttribute("style")} --path-index: ${v};"></path>`,c+=`<span class="h5 mb-0" part="popover">${M(L(d.getAttribute("data-label"))).trim()}<br/>${d.hasAttribute("data-second")?`${d.getAttribute("data-second-label")}: ${d.getAttribute("data-second")}<br/>`:""}${(y=d.querySelector('[part="popover"]'))===null||y===void 0?void 0:y.innerHTML}</span>`;else if(v!=0){let u=d.getAttribute("data-numeric");const H=f=="none"?"display: none;":"";u=u.replace("\xA3",""),u=u.replace("%",""),u=u.replace(",",""),u=Number.parseInt(u);const k=u/s,[$,z]=q(l,g),[C,S]=q(l+k,g),D=k>.5?1:0,B=["M 0 0",`L ${$?$.toFixed(0):0} ${z?z.toFixed(0):0}`,`A 100 100 0 ${D} 1 ${C?C.toFixed(0):0} ${S?S.toFixed(0):0}`,"L 0 0"].join(" ");e+=`<path d="${B}" style="${d.getAttribute("style")} --path-index: ${v};${H}"></path>`,c+=`<span class="h5 mb-0" part="popover">${M(L(d.getAttribute("data-label"))).trim()}<br/>${d.hasAttribute("data-second")?`${d.getAttribute("data-second-label")}: ${d.getAttribute("data-second")}<br/>`:""}${(p=d.querySelector('[part="popover"]'))===null||p===void 0?void 0:p.innerHTML}</span>`,f!="none"&&(l+=k)}}),r+=`<div class="doughnut">
|
|
5
5
|
<svg viewBox="-105 -105 210 210" preserveAspectRatio="none" style="--row-index: ${n+1};">${e}</svg>
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
<style>
|
|
10
10
|
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
11
11
|
|
|
12
|
-
:host{--chart-colour-1-set: var(--chart-colour-1, #BEE8F8);--chart-colour-2-set: var(--chart-colour-2, #A6DCC7);--chart-colour-3-set: var(--chart-colour-3, #FAD0DA);--chart-colour-4-set: var(--chart-colour-4, #AFCCF2);--chart-colour-5-set: var(--chart-colour-5, #FFD2B4);--chart-colour-6-set: var(--chart-colour-6, #CDF0F2);--chart-colour-7-set: var(--chart-colour-7, #FFABC2);--chart-colour-8-set: var(--chart-colour-8, #DCEAF2);--chart-colour-9-set: var(--chart-colour-9, #EEBCB3);--chart-colour-10-set: var(--chart-colour-10, #F0BDFF);--chart-colour-1-hover: var(--chart-colour-1, #B6DEED);--chart-colour-2-hover: var(--chart-colour-2, #98CBB7);--chart-colour-3-hover: var(--chart-colour-3, #EFC8D1);--chart-colour-4-hover: var(--chart-colour-4, #A6C1E5);--chart-colour-5-hover: var(--chart-colour-5, #F4CAAF);--chart-colour-6-hover: var(--chart-colour-6, #C2E3E5);--chart-colour-7-hover: var(--chart-colour-7, #F5A2B9);--chart-colour-8-hover: var(--chart-colour-8, #CFDCE3);--chart-colour-9-hover: var(--chart-colour-9, #E3B2A9);--chart-colour-10-hover: var(--chart-colour-10, #E3B2F2);--chart-colour-success: #d2f0c9 !important;--chart-colour-success-hover: #8ad873 !important;--chart-colour-danger: #f5c2c7 !important;--chart-colour-danger-hover: #f5c2e7 !important;--chart-colour-warning: #ffd280 !important;--chart-colour-warning-hover: #ffb020 !important}.chart__key .key:nth-child(11n-10),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-9){--chart-colour: var(--chart-colour-1-set);--chart-colour-hover: var(--chart-colour-1-hover)}.chart__outer table tbody tr:nth-child(1):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-1-set);--chart-colour-hover: var(--chart-colour-1-hover)}.chart__key .key:nth-child(11n-9),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-8){--chart-colour: var(--chart-colour-2-set);--chart-colour-hover: var(--chart-colour-2-hover)}.chart__outer table tbody tr:nth-child(2):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-2-set);--chart-colour-hover: var(--chart-colour-2-hover)}.chart__key .key:nth-child(11n-8),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-7){--chart-colour: var(--chart-colour-3-set);--chart-colour-hover: var(--chart-colour-3-hover)}.chart__outer table tbody tr:nth-child(3):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-3-set);--chart-colour-hover: var(--chart-colour-3-hover)}.chart__key .key:nth-child(11n-7),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-6){--chart-colour: var(--chart-colour-4-set);--chart-colour-hover: var(--chart-colour-4-hover)}.chart__outer table tbody tr:nth-child(4):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-4-set);--chart-colour-hover: var(--chart-colour-4-hover)}.chart__key .key:nth-child(11n-6),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-5){--chart-colour: var(--chart-colour-5-set);--chart-colour-hover: var(--chart-colour-5-hover)}.chart__outer table tbody tr:nth-child(5):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-5-set);--chart-colour-hover: var(--chart-colour-5-hover)}.chart__key .key:nth-child(11n-5),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-4){--chart-colour: var(--chart-colour-6-set);--chart-colour-hover: var(--chart-colour-6-hover)}.chart__outer table tbody tr:nth-child(6):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-6-set);--chart-colour-hover: var(--chart-colour-6-hover)}.chart__key .key:nth-child(11n-4),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-3){--chart-colour: var(--chart-colour-7-set);--chart-colour-hover: var(--chart-colour-7-hover)}.chart__outer table tbody tr:nth-child(7):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-7-set);--chart-colour-hover: var(--chart-colour-7-hover)}.chart__key .key:nth-child(11n-3),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-2){--chart-colour: var(--chart-colour-8-set);--chart-colour-hover: var(--chart-colour-8-hover)}.chart__outer table tbody tr:nth-child(8):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-8-set);--chart-colour-hover: var(--chart-colour-8-hover)}.chart__key .key:nth-child(11n-2),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-1){--chart-colour: var(--chart-colour-9-set);--chart-colour-hover: var(--chart-colour-9-hover)}.chart__outer table tbody tr:nth-child(9):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-9-set);--chart-colour-hover: var(--chart-colour-9-hover)}.chart__key .key:nth-child(11n-1),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-0){--chart-colour: var(--chart-colour-10-set);--chart-colour-hover: var(--chart-colour-10-hover)}.chart__outer table tbody tr:nth-child(10):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-10-set);--chart-colour-hover: var(--chart-colour-10-hover)}::slotted(table){display:none !important}:host{container-type:inline-size;margin-bottom:2rem;display:block}.chart__outer{display:flex;flex-direction:column;position:relative;font-weight:var(--chart-font-weight, bold);color:var(--chart-text-color, black);--body-colour-set: var(--body-colour, Canvas);--text-colour-set: var(--text-colour, black);--chart-height-set: var(--chart-height, 7.5rem);--chart-height-lg-set: var(--chart-height-lg, 12.5rem);--chart-height-resp: var(--chart-height-set);--index-below: -1;--index-base: 0;--index-focus: 2;--index-above: 10;--index-floating: 100;--index-menu: 200;--index-overlay: 1000;--key-label-width: 100%;--label-size: 0.75rem;--line-thickness: 1px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%);--bar-gap: min(10%, 0.75rem)}.chart__outer>*{display:block;order:2}.chart__outer tbody{--chart-direction: 360deg;--chart-day-bg-pos: 100% calc(var(--single-day) * 7)}@container (min-width: 23.4375em){.chart__outer :has(tr:nth-child(5) td:nth-child(4)),.chart__outer :has(tr:nth-child(10)){--yaxis-width: 0;--yaxis-point-display: none;--yaxis-last-point-transform: translate(0, -100%);--bar-gap: 0}.chart__outer .chart__wrapper{--chart-height-resp: var(--chart-height-lg-set);--line-thickness: 0.8px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%)}}@container (min-width: 48em){.chart__outer :has(tr:nth-child(10)){--bar-gap: 0}.chart__outer .chart__wrapper{--label-size: 0.875rem;--line-thickness: 0.5px}}.chart__outer .chart__spacer span{opacity:0}.chart__outer>input[type=checkbox]{opacity:0;position:absolute;pointer-events:none;bottom:50%;left:50%}.chart__key{padding:0 0 0 0;margin-bottom:1.5rem;display:flex;overflow:auto;scroll-snap-type:x mandatory;scroll-padding:.75rem;gap:.5rem}.chart__key:has(label:first-child:last-child){display:var(--single-key-display, none)}.chart__key .key{margin:0 !important}.chart__key .key:before{content:"";height:.8em;width:.8em;margin-right:.3em !important;background-color:var(--chart-colour);display:inline-block;border-radius:var(--key-border-radius, 4px)}.chart__key .key[data-label=Min],.chart__key .key[data-label=Max]{display:none}.chart__key .key .chart__total{display:none}.chart__outer input[type=checkbox]:focus:nth-child(1)~.chart__key .key:nth-child(1){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(2)~.chart__key .key:nth-child(2){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(3)~.chart__key .key:nth-child(3){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(4)~.chart__key .key:nth-child(4){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(5)~.chart__key .key:nth-child(5){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(6)~.chart__key .key:nth-child(6){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(7)~.chart__key .key:nth-child(7){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(8)~.chart__key .key:nth-child(8){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(9)~.chart__key .key:nth-child(9){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__key .key:nth-of-type(1){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__key .key:nth-of-type(2){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__key .key:nth-of-type(3){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__key .key:nth-of-type(4){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__key .key:nth-of-type(5){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__key .key:nth-of-type(6){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__key .key:nth-of-type(7){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__key .key:nth-of-type(8){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__key .key:nth-of-type(9){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__key .key:nth-of-type(10){opacity:.25}:host([data-yaxis]){--yaxis-display: flex}.chart__yaxis{display:var(--yaxis-display, none);flex-direction:column-reverse;width:var(--yaxis-width)}.chart__yaxis .axis__point{bottom:var(--percent);position:relative;height:0;white-space:nowrap}.chart__yaxis .axis__point:not(:last-child){display:var(--yaxis-point-display)}.chart__yaxis .axis__point span{display:block;transform:translate(0, -50%);padding-right:.25rem;text-align:right;font-weight:var(--chart-yaxis-fw, normal);font-size:var(--chart-yaxis-fs, 0.75rem);color:var(--colour-body)}.chart__yaxis .axis__point:last-child span{transform:var(--yaxis-last-point-transform)}.chart__xaxis{margin-bottom:1rem;display:flex;flex-direction:column-reverse;width:100%;position:absolute;left:0;bottom:-1rem}.chart__xaxis .axis__point{left:var(--percent);width:1px;position:absolute;height:0;white-space:nowrap}.chart__xaxis .axis__point span{display:block;transform:translate(-50%, 0%);text-align:center;font-size:var(--label-size);position:absolute;left:50%}.chart__guidelines{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column-reverse;pointer-events:none}.chart__guidelines .guideline{bottom:var(--percent);position:absolute;right:0;width:100%;height:0px;margin-bottom:-1px;border-bottom:1px dashed #eee;pointer-events:none;z-index:var(--index-below)}.chart__guidelines .guideline:not(.guideline--target) span{display:none}.chart__guidelines .guideline--target{border-bottom:1px dashed #000;z-index:var(--index-above);text-shadow:1px solid #fff;overflow:visible}.chart__guidelines .guideline--target span{position:absolute;bottom:0;font-size:var(--label-size);text-shadow:1px 1px 2px #fff;background:hsla(0,0%,100%,.6)}.chart__guidelines [data-value="0"]{border-bottom:1px solid var(--colour-primary)}.chart__guidelines [data-value="0"]:not(:first-child){border-bottom:1px dashed var(--colour-primary)}[part=popover]{position:absolute;top:var(--cursor-y, 50%);left:var(--cursor-x, 50%);font-size:var(--label-size);line-height:1.2;background:var(--chart-details-bg, var(--colour-canvas-2, Canvas));opacity:0;pointer-events:none;padding:.5rem;border-radius:.5rem;margin-bottom:.25rem;display:block;white-space:pre;text-align:left;box-shadow:var(--chart-details-shadow, 0 0.125rem 0.75rem rgba(0, 0, 0, 0.25));transform:translate(-50%, -100%)}[part=popover]::before{content:attr(data-group) "\\a"}[part=popover][data-label]::before{content:attr(data-group) "\\a" attr(data-label) "\\a"}[part=popover]:has(:is(a,button)){top:0;left:50%;transform:translate(-50%, -100%);font-size:.9rem}[part=popover] hr{margin:0;opacity:0}[part=popover] :is(a,button){display:inline-block !important;clear:both !important;float:left !important;margin-top:1rem !important;margin-right:1rem !important;margin-bottom:.25em !important;font-size:1em !important}[part=popover] :is(a,button)+:is(a,button){margin-top:0 !important}.chart__wrapper{display:block;display:flex;flex-direction:row;position:relative}.chart__wrapper .chart{position:relative;flex-grow:1}.chart__wrapper table{display:block;width:100% !important;padding-top:var(--chart-height-resp);position:relative;margin-bottom:0;overflow:visible}.chart__wrapper table thead{display:none}.chart__wrapper table tbody{display:flex;position:absolute;width:100%;height:100%;top:0;left:0;flex-direction:row;border:none}.chart__wrapper table tbody tr{display:flex;flex-direction:row;justify-content:var(--chart-bar-alignment, left);align-items:flex-end;border:none;width:100%;height:100%;position:relative;padding:0 2px;gap:var(--bar-gap)}.chart__wrapper table tbody tr td{font-weight:inherit}.chart__wrapper table tbody tr td:first-child{position:absolute;top:100%;left:0%;width:fit-content;padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--label-size);text-align:center}@container (min-width: 48em){.chart__wrapper table tbody tr td:first-child{display:block}}.chart__wrapper table tbody tr td:first-child button{all:unset;cursor:pointer}.chart__wrapper table tbody tr td[data-label=Min],.chart__wrapper table tbody tr td[data-label=Max]{display:none}.chart__wrapper table tbody tr:first-child td:first-child,.chart__wrapper table tbody tr:last-child td:first-child{display:block}.chart__wrapper table tbody tr td:not(:first-child){height:100%;height:var(--percent, 0%);bottom:var(--bottom, 0%);width:100%;max-width:7.5rem;position:relative;padding:0;background:var(--chart-colour);border-top-right-radius:4px;border-top-left-radius:4px}@media screen and (prefers-color-scheme: dark){.chart__wrapper table tbody tr td:not(:first-child){background:color-mix(in oklab, var(--chart-colour), black 20%)}}.chart__wrapper table tbody tr td:not(:first-child):hover{background:var(--chart-colour-hover)}.chart__wrapper table tbody tr td:not(:first-child):has(span:empty),.chart__wrapper table tbody tr td:not(:first-child):empty{display:none}.chart__wrapper table tbody tr td:not(:first-child)[data-label]:before{display:none}.chart__wrapper table tbody tr td:not(:first-child):hover [part=popover]{opacity:1;z-index:var(--index-above);pointer-events:all}.chart__wrapper table tbody tr td:first-child[data-label]:before{display:none}@container (min-width: 48em){.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr td:first-child{display:none}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:first-child td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:first-child td:first-child{left:0%;transform:translate(0, 0);display:block;text-align:left}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:last-child td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:last-child td:first-child{left:100%;transform:translate(-100%, 0);display:block;text-align:right}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:first-child td:not(:first-child) span,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:first-child td:not(:first-child) span{left:-20%;transform:translate(0%, 0);text-align:left}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:last-child td:not(:first-child) span,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:last-child td:not(:first-child) span{left:120%;transform:translate(-100%, 0);text-align:right}}@container (min-width: 23.4375em){.chart__wrapper table tbody:has(tr:nth-child(25)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(25)) tr:is(:first-child,:nth-child(2n+1)) td:first-child{display:block !important}.chart__wrapper table tbody:has(tr:nth-child(50)) tr:is(:first-child,:nth-child(2n+1)) td:first-child,.chart__wrapper table tbody:has(tr:nth-child(50)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(50)) tr:is(:first-child,:nth-child(10n+1)) td:first-child{display:block !important}.chart__wrapper table tbody:has(tr:nth-child(100)) tr:is(:first-child,:nth-child(10n+1)) td:first-child,.chart__wrapper table tbody:has(tr:nth-child(100)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(100)) tr:is(:first-child,:nth-child(20n+1)) td:first-child{display:block !important}}:host(.chart-colour--success) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--success,.chart-colour--success td{--chart-colour: var(--chart-colour-success) !important}:host(.chart-colour--success) td:hover,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--success:hover,.chart-colour--success td:hover{--chart-colour-hover: var(--chart-colour-success-hover) !important}:host(.chart-colour--danger) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--danger,.chart-colour--danger,.chart-colour--danger td{--chart-colour: var(--chart-colour-danger) !important}:host(.chart-colour--danger) td:hover,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--danger:hover,.chart-colour--danger:hover,.chart-colour--danger td:hover{--chart-colour-hover: var(--chart-colour-danger-hover) !important}:host(.chart-colour--warning) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--warning,.chart-colour--warning,.chart-colour--warning td{--chart-colour: var(--chart-colour-warning) !important}:host(.chart-colour--warning) td:hover,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--warning:hover,.chart-colour--warning:hover,.chart-colour--warning td:hover{--chart-colour-hover: var(--chart-colour-warning-hover) !important}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(2){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(3){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(4){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(5){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(6){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(7){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(8){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(9){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(10){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(11){display:none;opacity:0}@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}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 0.125rem;--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 6 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 6 Pro";line-height:1em}.btn.btn[class*=fa-after]{padding-right:4rem}.btn.btn[class*=fa-after]:before{margin-right:0;margin-right:0.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}.btn:not(.btn-compact):before{margin-right:1rem}.btn i[class*=fa-]{font-family:"Font Awesome 6 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:has(select){position:relative;padding-right:3.5rem}.btn:has(select):not(.mw-100){max-width:13rem}.btn:has(select) select{all:unset !important;margin:calc(-0.75rem) calc(-2.5rem) !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:3.5rem !important;margin-right:-3.5rem !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;max-width:100% !important;outline:none;font-weight:bold;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important}.btn:has(select) select option{padding:0;text-align:left;color:var(--colour-primary)}.btn:has(select):after{position:absolute;top:0.625rem;right:2rem;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:has(select).active:after{transform:rotate(-90deg)}.btn:has(select:focus):after{transform:rotate(-90deg)}.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 6 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: 0.0625rem;--btn-padding-block: 0.3125rem;--btn-padding-inline: 0.3125rem;--btn-margin: 0.5rem;border-radius:0.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem}.btn-action:not(.btn-primary){color:var(--colour-heading)}.btn-action:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}.btn-action.btn[class*=fa-]:before{content:var(--fa);margin-right:0.375rem}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) .btn-action,.btn-action:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:0.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;line-height:var(--compact-size) !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem}.btn-compact:not(:last-child){margin-right:0.5rem}.btn-compact:before{content:var(--fa);position:absolute;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - 0.25rem);font-weight:900}.btn-compact[class*=fa-]:before{line-height:calc(var(--compact-size) - 0.25rem)}.btn-compact.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}.btn-compact.btn-action{--compact-size: 2rem;font-size:1rem}.btn-compact.btn-action:before{font-size:1em;font-weight:400}.btn-compact.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:rgba(0,0,0,0)}.btn-compact.btn-secondary:not([class*=colour-]){--colour: var(--colour-light)}.btn-compact.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)}.btn-compact.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse):is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}.btn-compact[data-number]{position:relative}.btn-compact[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:#fff;letter-spacing:-0.1em;font-family:arial,sans-serif}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary:not(:hover,:focus,.hover,:focus-within):not(.btn-collapse),.invert-colours .btn-compact.btn-secondary:not(:hover,:focus,.hover,:focus-within):not(.btn-collapse){background-color:var(--colour-inverted) !important;border-color:var(--colour-inverted) !important;color:var(--colour-primary-theme)}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary:is(:hover,:focus,.hover,:focus-within):not([disabled]):not(.btn-collapse),.invert-colours .btn-compact.btn-secondary:is(:hover,:focus,.hover,:focus-within):not([disabled]):not(.btn-collapse){background-color:rgba(0,0,0,0);border-color:var(--colour-inverted) !important;color:var(--colour-inverted)}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary[disabled],.invert-colours .btn-compact.btn-secondary[disabled]{background-color:var(--colour-inverted) !important;border-color:var(--colour-inverted) !important;color:var(--colour-primary-theme) !important}}.d-block{display:block}.chart__wrapper .doughnut path:nth-child(11n-10){fill:var(--chart-colour-1-set)}.chart__wrapper .doughnut path:nth-child(11n-9){fill:var(--chart-colour-2-set)}.chart__wrapper .doughnut path:nth-child(11n-8){fill:var(--chart-colour-3-set)}.chart__wrapper .doughnut path:nth-child(11n-7){fill:var(--chart-colour-4-set)}.chart__wrapper .doughnut path:nth-child(11n-6){fill:var(--chart-colour-5-set)}.chart__wrapper .doughnut path:nth-child(11n-5){fill:var(--chart-colour-6-set)}.chart__wrapper .doughnut path:nth-child(11n-4){fill:var(--chart-colour-7-set)}.chart__wrapper .doughnut path:nth-child(11n-3){fill:var(--chart-colour-8-set)}.chart__wrapper .doughnut path:nth-child(11n-2){fill:var(--chart-colour-9-set)}.chart__wrapper .doughnut path:nth-child(11n-1){fill:var(--chart-colour-10-set)}.chart__wrapper{order:1}.chart__key{--key-border-radius: 50%;order:2;margin-bottom:0}.chart__key .btn-action{font-size:0.75rem;margin-right:-0.375rem !important;border-color:rgba(0,0,0,0) !important}.chart__key .btn-action:not(:hover):not(:focus){border-color:rgba(0,0,0,0) !important;background:rgba(0,0,0,0) !important}:host(.chart--horizontal) .chart__outer{flex-direction:row}:host(.chart--horizontal) .chart__outer .chart__key{flex-direction:column;justify-content:center;overflow:visible}:host(.chart--horizontal) .chart__outer .chart__key .btn-action{margin-right:0rem !important;margin-bottom:-0.75rem !important}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action{min-width:100%;display:flex;align-items:center;min-width:100%}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action[data-numeric]:before{flex-shrink:0}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action[data-numeric]:after{content:attr(data-numeric);display:inline-block;flex-grow:1;flex-shrink:0;min-width:6ch;text-align:right}:host(.chart--lg){--doughnut-size: 17.875rem}:host{--doughnut-size: 14.75rem}:host(.chart--sm){--doughnut-size: 11.875rem}.chart__outer .chart__yaxis,.chart__outer .line{display:none}.chart__outer table{display:none}.chart__outer .chart{display:flex;align-items:center}.chart__outer .doughnuts{display:flex;flex-direction:row;flex-wrap:wrap}.chart__outer .doughnut{position:relative;aspect-ratio:1/1;min-width:11.875rem;flex:1 1 auto;display:inline-block;max-width:var(--doughnut-size)}@container (min-width: 23.4375em){.chart__outer .doughnut{width:var(--doughnut-size)}}.chart__outer .doughnut:first-child{margin-left:0}.chart__outer .doughnut:last-child{margin-right:0}.chart__outer .doughnut svg{width:100%;height:100%}.chart__outer .doughnut>.doughnut__title{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:all;background:var(--bg-colour, var(--colour-canvas));border-radius:50%;z-index:var(--index-focus);padding:1rem;aspect-ratio:1/1;display:flex;justify-content:center;align-items:center;flex-direction:column;height:67%}.chart__outer .doughnut>.doughnut__title:before{content:attr(data-numeric);display:block;text-align:center;color:var(--colour-heading);font-size:3rem}.chart__outer .doughnut>.doughnut__title span{text-align:center;display:block}.chart__outer .doughnut svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1),.chart__outer .doughnut svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2),.chart__outer .doughnut svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3),.chart__outer .doughnut svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4),.chart__outer .doughnut svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5),.chart__outer .doughnut svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6),.chart__outer .doughnut svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7),.chart__outer .doughnut svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8),.chart__outer .doughnut svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9),.chart__outer .doughnut svg:has(path:nth-child(10):hover)~.tooltips>[part=popover]:nth-child(10),.chart__outer [part=popover]:hover{opacity:1;z-index:var(--index-above);pointer-events:all;z-index:99}.chart__outer .doughnut svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1):before,.chart__outer .doughnut svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2):before,.chart__outer .doughnut svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3):before,.chart__outer .doughnut svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4):before,.chart__outer .doughnut svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5):before,.chart__outer .doughnut svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6):before,.chart__outer .doughnut svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7):before,.chart__outer .doughnut svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8):before,.chart__outer .doughnut svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9):before,.chart__outer .doughnut svg:has(path:nth-child(10):hover)~.tooltips>[part=popover]:nth-child(10):before,.chart__outer [part=popover]:hover:before{display:none}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(1):hover{top:var(--middle-1-y, 50%);left:var(--middle-1-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(2):hover{top:var(--middle-2-y, 50%);left:var(--middle-2-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(3):hover{top:var(--middle-3-y, 50%);left:var(--middle-3-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(4):hover{top:var(--middle-4-y, 50%);left:var(--middle-4-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(5):hover{top:var(--middle-5-y, 50%);left:var(--middle-5-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(6):hover{top:var(--middle-6-y, 50%);left:var(--middle-6-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(7):hover{top:var(--middle-7-y, 50%);left:var(--middle-7-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(8):hover{top:var(--middle-8-y, 50%);left:var(--middle-8-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(9):hover{top:var(--middle-9-y, 50%);left:var(--middle-9-x, 50%);transform:translate(-50%, -50%)}/*# sourceMappingURL=assets/css/components/doughnutchart.component.css.map */
|
|
12
|
+
:host{--chart-colour-1-set: var(--chart-colour-1, #BEE8F8);--chart-colour-2-set: var(--chart-colour-2, #A6DCC7);--chart-colour-3-set: var(--chart-colour-3, #FAD0DA);--chart-colour-4-set: var(--chart-colour-4, #AFCCF2);--chart-colour-5-set: var(--chart-colour-5, #FFD2B4);--chart-colour-6-set: var(--chart-colour-6, #CDF0F2);--chart-colour-7-set: var(--chart-colour-7, #FFABC2);--chart-colour-8-set: var(--chart-colour-8, #DCEAF2);--chart-colour-9-set: var(--chart-colour-9, #EEBCB3);--chart-colour-10-set: var(--chart-colour-10, #F0BDFF);--chart-colour-1-hover: var(--chart-colour-1, #B6DEED);--chart-colour-2-hover: var(--chart-colour-2, #98CBB7);--chart-colour-3-hover: var(--chart-colour-3, #EFC8D1);--chart-colour-4-hover: var(--chart-colour-4, #A6C1E5);--chart-colour-5-hover: var(--chart-colour-5, #F4CAAF);--chart-colour-6-hover: var(--chart-colour-6, #C2E3E5);--chart-colour-7-hover: var(--chart-colour-7, #F5A2B9);--chart-colour-8-hover: var(--chart-colour-8, #CFDCE3);--chart-colour-9-hover: var(--chart-colour-9, #E3B2A9);--chart-colour-10-hover: var(--chart-colour-10, #E3B2F2);--chart-colour-success: #d2f0c9 !important;--chart-colour-success-hover: #8ad873 !important;--chart-colour-danger: #f5c2c7 !important;--chart-colour-danger-hover: #f5c2e7 !important;--chart-colour-warning: #ffd280 !important;--chart-colour-warning-hover: #ffb020 !important}.chart__key .key:nth-child(11n-10),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-9){--chart-colour: var(--chart-colour-1-set);--chart-colour-hover: var(--chart-colour-1-hover)}.chart__outer table tbody tr:nth-child(1):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-1-set);--chart-colour-hover: var(--chart-colour-1-hover)}.chart__key .key:nth-child(11n-9),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-8){--chart-colour: var(--chart-colour-2-set);--chart-colour-hover: var(--chart-colour-2-hover)}.chart__outer table tbody tr:nth-child(2):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-2-set);--chart-colour-hover: var(--chart-colour-2-hover)}.chart__key .key:nth-child(11n-8),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-7){--chart-colour: var(--chart-colour-3-set);--chart-colour-hover: var(--chart-colour-3-hover)}.chart__outer table tbody tr:nth-child(3):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-3-set);--chart-colour-hover: var(--chart-colour-3-hover)}.chart__key .key:nth-child(11n-7),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-6){--chart-colour: var(--chart-colour-4-set);--chart-colour-hover: var(--chart-colour-4-hover)}.chart__outer table tbody tr:nth-child(4):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-4-set);--chart-colour-hover: var(--chart-colour-4-hover)}.chart__key .key:nth-child(11n-6),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-5){--chart-colour: var(--chart-colour-5-set);--chart-colour-hover: var(--chart-colour-5-hover)}.chart__outer table tbody tr:nth-child(5):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-5-set);--chart-colour-hover: var(--chart-colour-5-hover)}.chart__key .key:nth-child(11n-5),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-4){--chart-colour: var(--chart-colour-6-set);--chart-colour-hover: var(--chart-colour-6-hover)}.chart__outer table tbody tr:nth-child(6):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-6-set);--chart-colour-hover: var(--chart-colour-6-hover)}.chart__key .key:nth-child(11n-4),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-3){--chart-colour: var(--chart-colour-7-set);--chart-colour-hover: var(--chart-colour-7-hover)}.chart__outer table tbody tr:nth-child(7):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-7-set);--chart-colour-hover: var(--chart-colour-7-hover)}.chart__key .key:nth-child(11n-3),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-2){--chart-colour: var(--chart-colour-8-set);--chart-colour-hover: var(--chart-colour-8-hover)}.chart__outer table tbody tr:nth-child(8):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-8-set);--chart-colour-hover: var(--chart-colour-8-hover)}.chart__key .key:nth-child(11n-2),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-1){--chart-colour: var(--chart-colour-9-set);--chart-colour-hover: var(--chart-colour-9-hover)}.chart__outer table tbody tr:nth-child(9):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-9-set);--chart-colour-hover: var(--chart-colour-9-hover)}.chart__key .key:nth-child(11n-1),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-0){--chart-colour: var(--chart-colour-10-set);--chart-colour-hover: var(--chart-colour-10-hover)}.chart__outer table tbody tr:nth-child(10):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-10-set);--chart-colour-hover: var(--chart-colour-10-hover)}::slotted(table){display:none !important}:host{container-type:inline-size;margin-bottom:2rem;display:block}.chart__outer{display:flex;flex-direction:column;position:relative;font-weight:var(--chart-font-weight, bold);color:var(--chart-text-color, black);--body-colour-set: var(--body-colour, Canvas);--text-colour-set: var(--text-colour, black);--chart-height-set: var(--chart-height, 7.5rem);--chart-height-lg-set: var(--chart-height-lg, 12.5rem);--chart-height-resp: var(--chart-height-set);--index-below: -1;--index-base: 0;--index-focus: 2;--index-above: 10;--index-floating: 100;--index-menu: 200;--index-overlay: 1000;--key-label-width: 100%;--label-size: 0.75rem;--line-thickness: 1px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%);--bar-gap: min(10%, 0.75rem)}.chart__outer>*{display:block;order:2}.chart__outer tbody{--chart-direction: 360deg;--chart-day-bg-pos: 100% calc(var(--single-day) * 7)}@container (min-width: 23.4375em){.chart__outer :has(tr:nth-child(5) td:nth-child(4)),.chart__outer :has(tr:nth-child(10)){--yaxis-width: 0;--yaxis-point-display: none;--yaxis-last-point-transform: translate(0, -100%);--bar-gap: 0}.chart__outer .chart__wrapper{--chart-height-resp: var(--chart-height-lg-set);--line-thickness: 0.8px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%)}}@container (min-width: 48em){.chart__outer :has(tr:nth-child(10)){--bar-gap: 0}.chart__outer .chart__wrapper{--label-size: 0.875rem;--line-thickness: 0.5px}}.chart__outer .chart__spacer span{opacity:0}.chart__outer>input[type=checkbox]{opacity:0;position:absolute;pointer-events:none;bottom:50%;left:50%}.chart__key{padding:0 0 0 0;margin-bottom:1.5rem;display:flex;overflow:auto;scroll-snap-type:x mandatory;scroll-padding:.75rem;gap:.5rem}.chart__key:has(label:first-child:last-child){display:var(--single-key-display, none)}.chart__key .key{margin:0 !important}.chart__key .key:before{content:"";height:.8em;width:.8em;margin-right:.3em !important;background-color:var(--chart-colour);display:inline-block;border-radius:var(--key-border-radius, 4px)}.chart__key .key[data-label=Min],.chart__key .key[data-label=Max]{display:none}.chart__key .key .chart__total{display:none}.chart__outer input[type=checkbox]:focus:nth-child(1)~.chart__key .key:nth-child(1){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(2)~.chart__key .key:nth-child(2){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(3)~.chart__key .key:nth-child(3){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(4)~.chart__key .key:nth-child(4){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(5)~.chart__key .key:nth-child(5){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(6)~.chart__key .key:nth-child(6){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(7)~.chart__key .key:nth-child(7){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(8)~.chart__key .key:nth-child(8){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(9)~.chart__key .key:nth-child(9){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__key .key:nth-of-type(1){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__key .key:nth-of-type(2){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__key .key:nth-of-type(3){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__key .key:nth-of-type(4){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__key .key:nth-of-type(5){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__key .key:nth-of-type(6){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__key .key:nth-of-type(7){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__key .key:nth-of-type(8){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__key .key:nth-of-type(9){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__key .key:nth-of-type(10){opacity:.25}:host([data-yaxis]){--yaxis-display: flex}.chart__yaxis{display:var(--yaxis-display, none);flex-direction:column-reverse;width:var(--yaxis-width)}.chart__yaxis .axis__point{bottom:var(--percent);position:relative;height:0;white-space:nowrap}.chart__yaxis .axis__point:not(:last-child){display:var(--yaxis-point-display)}.chart__yaxis .axis__point span{display:block;transform:translate(0, -50%);padding-right:.25rem;text-align:right;font-weight:var(--chart-yaxis-fw, normal);font-size:var(--chart-yaxis-fs, 0.75rem);color:var(--colour-body)}.chart__yaxis .axis__point:last-child span{transform:var(--yaxis-last-point-transform)}.chart__xaxis{margin-bottom:1rem;display:flex;flex-direction:column-reverse;width:100%;position:absolute;left:0;bottom:-1rem}.chart__xaxis .axis__point{left:var(--percent);width:1px;position:absolute;height:0;white-space:nowrap}.chart__xaxis .axis__point span{display:block;transform:translate(-50%, 0%);text-align:center;font-size:var(--label-size);position:absolute;left:50%}.chart__guidelines{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column-reverse;pointer-events:none}.chart__guidelines .guideline{bottom:var(--percent);position:absolute;right:0;width:100%;height:0px;margin-bottom:-1px;border-bottom:1px dashed #eee;pointer-events:none;z-index:var(--index-below)}.chart__guidelines .guideline:not(.guideline--target) span{display:none}.chart__guidelines .guideline--target{border-bottom:1px dashed #000;z-index:var(--index-above);text-shadow:1px solid #fff;overflow:visible}.chart__guidelines .guideline--target span{position:absolute;bottom:0;font-size:var(--label-size);text-shadow:1px 1px 2px #fff;background:hsla(0,0%,100%,.6)}.chart__guidelines [data-value="0"]{border-bottom:1px solid var(--colour-primary)}.chart__guidelines [data-value="0"]:not(:first-child){border-bottom:1px dashed var(--colour-primary)}[part=popover]{position:absolute;top:var(--cursor-y, 50%);left:var(--cursor-x, 50%);font-size:var(--label-size);line-height:1.2;background:var(--chart-details-bg, var(--colour-canvas-2, Canvas));opacity:0;pointer-events:none;padding:.5rem;border-radius:.5rem;margin-bottom:.25rem;display:block;white-space:pre;text-align:left;box-shadow:var(--chart-details-shadow, 0 0.125rem 0.75rem rgba(0, 0, 0, 0.25));transform:translate(-50%, -100%)}[part=popover]::before{content:attr(data-group) "\\a"}[part=popover][data-label]::before{content:attr(data-group) "\\a" attr(data-label) "\\a"}[part=popover]:has(:is(a,button)){top:0;left:50%;transform:translate(-50%, -100%);font-size:.9rem}[part=popover] hr{margin:0;opacity:0}[part=popover] :is(a,button){display:inline-block !important;clear:both !important;float:left !important;margin-top:1rem !important;margin-right:1rem !important;margin-bottom:.25em !important;font-size:1em !important}[part=popover] :is(a,button)+:is(a,button){margin-top:0 !important}.chart__wrapper{display:block;display:flex;flex-direction:row;position:relative}.chart__wrapper .chart{position:relative;flex-grow:1}.chart__wrapper table{display:block;width:100% !important;padding-top:var(--chart-height-resp);position:relative;margin-bottom:0;overflow:visible}.chart__wrapper table thead{display:none}.chart__wrapper table tbody{display:flex;position:absolute;width:100%;height:100%;top:0;left:0;flex-direction:row;border:none}.chart__wrapper table tbody tr{display:flex;flex-direction:row;justify-content:var(--chart-bar-alignment, left);align-items:flex-end;border:none;width:100%;height:100%;position:relative;padding:0 2px;gap:var(--bar-gap)}.chart__wrapper table tbody tr td{font-weight:inherit}.chart__wrapper table tbody tr td:first-child{position:absolute;top:100%;left:0%;width:fit-content;padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--label-size);text-align:center}@container (min-width: 48em){.chart__wrapper table tbody tr td:first-child{display:block}}.chart__wrapper table tbody tr td:first-child button{all:unset;cursor:pointer}.chart__wrapper table tbody tr td[data-label=Min],.chart__wrapper table tbody tr td[data-label=Max]{display:none}.chart__wrapper table tbody tr:first-child td:first-child,.chart__wrapper table tbody tr:last-child td:first-child{display:block}.chart__wrapper table tbody tr td:not(:first-child){height:100%;height:var(--percent, 0%);bottom:var(--bottom, 0%);width:100%;max-width:7.5rem;position:relative;padding:0;background:var(--chart-colour);border-top-right-radius:4px;border-top-left-radius:4px}@media screen and (prefers-color-scheme: dark){.chart__wrapper table tbody tr td:not(:first-child){background:color-mix(in oklab, var(--chart-colour), black 20%)}}.chart__wrapper table tbody tr td:not(:first-child):hover{background:var(--chart-colour-hover)}.chart__wrapper table tbody tr td:not(:first-child):has(span:empty),.chart__wrapper table tbody tr td:not(:first-child):empty{display:none}.chart__wrapper table tbody tr td:not(:first-child)[data-label]:before{display:none}.chart__wrapper table tbody tr td:not(:first-child):hover [part=popover]{opacity:1;z-index:var(--index-above);pointer-events:all}.chart__wrapper table tbody tr td:first-child[data-label]:before{display:none}@container (min-width: 48em){.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr td:first-child{display:none}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:first-child td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:first-child td:first-child{left:0%;transform:translate(0, 0);display:block;text-align:left}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:last-child td:first-child,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:last-child td:first-child{left:100%;transform:translate(-100%, 0);display:block;text-align:right}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:first-child td:not(:first-child) span,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:first-child td:not(:first-child) span{left:-20%;transform:translate(0%, 0);text-align:left}.chart__wrapper table tbody:has(tr:nth-child(5) td:nth-child(4)) tr:last-child td:not(:first-child) span,.chart__wrapper table tbody:has(tr:nth-child(10)) tr:last-child td:not(:first-child) span{left:120%;transform:translate(-100%, 0);text-align:right}}@container (min-width: 23.4375em){.chart__wrapper table tbody:has(tr:nth-child(25)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(25)) tr:is(:first-child,:nth-child(2n+1)) td:first-child{display:block !important}.chart__wrapper table tbody:has(tr:nth-child(50)) tr:is(:first-child,:nth-child(2n+1)) td:first-child,.chart__wrapper table tbody:has(tr:nth-child(50)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(50)) tr:is(:first-child,:nth-child(10n+1)) td:first-child{display:block !important}.chart__wrapper table tbody:has(tr:nth-child(100)) tr:is(:first-child,:nth-child(10n+1)) td:first-child,.chart__wrapper table tbody:has(tr:nth-child(100)) tr td:first-child{display:none !important}.chart__wrapper table tbody:has(tr:nth-child(100)) tr:is(:first-child,:nth-child(20n+1)) td:first-child{display:block !important}}:host(.chart-colour--success) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--success,.chart-colour--success td{--chart-colour: var(--chart-colour-success) !important}:host(.chart-colour--success) td:hover,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--success:hover,.chart-colour--success td:hover{--chart-colour-hover: var(--chart-colour-success-hover) !important}:host(.chart-colour--danger) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--danger,.chart-colour--danger,.chart-colour--danger td{--chart-colour: var(--chart-colour-danger) !important}:host(.chart-colour--danger) td:hover,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--danger:hover,.chart-colour--danger:hover,.chart-colour--danger td:hover{--chart-colour-hover: var(--chart-colour-danger-hover) !important}:host(.chart-colour--warning) td,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--warning,.chart-colour--warning,.chart-colour--warning td{--chart-colour: var(--chart-colour-warning) !important}:host(.chart-colour--warning) td:hover,:host(:is(.chart-colour--success,.chart-colour--danger,.chart-colour--wraning)) td.chart-colour--warning:hover,.chart-colour--warning:hover,.chart-colour--warning td:hover{--chart-colour-hover: var(--chart-colour-warning-hover) !important}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(2){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(3){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(4){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(5){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(6){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(7){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(8){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(9){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(10){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(11){display:none;opacity:0}@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}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 0.125rem;--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 6 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 6 Pro";line-height:1em}.btn.btn[class*=fa-after]{padding-right:4rem}.btn.btn[class*=fa-after]:before{margin-right:0;margin-right:0.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}.btn:not(.btn-compact):before{margin-right:1rem}.btn i[class*=fa-]{font-family:"Font Awesome 6 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:has(select){position:relative;padding-right:3.5rem}.btn:has(select):not(.mw-100){max-width:13rem}.btn:has(select) select{all:unset !important;margin:calc(-0.75rem) calc(-2.5rem) !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:3.5rem !important;margin-right:-3.5rem !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;max-width:100% !important;outline:none;font-weight:bold;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important}.btn:has(select) select option{padding:0;text-align:left;color:var(--colour-primary)}.btn:has(select):after{position:absolute;top:0.625rem;right:2rem;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:has(select).active:after{transform:rotate(-90deg)}.btn:has(select:focus):after{transform:rotate(-90deg)}.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 6 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: 0.0625rem;--btn-padding-block: 0.3125rem;--btn-padding-inline: 0.3125rem;--btn-margin: 0.5rem;border-radius:0.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem}.btn-action:not(.btn-primary){color:var(--colour-heading)}.btn-action:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}.btn-action.btn[class*=fa-]:before{content:var(--fa);margin-right:0.375rem}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn-action,.btn-action.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) .btn-action,.btn-action:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:0.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;line-height:var(--compact-size) !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem}.btn-compact:not(:last-child){margin-right:0.5rem}.btn-compact:before{content:var(--fa);position:absolute;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - 0.25rem);font-weight:900}.btn-compact[class*=fa-]:before{line-height:calc(var(--compact-size) - 0.25rem)}@media screen and (prefers-color-scheme: dark){.btn-compact[class*=fa-]:before{color:#fff}}.btn-compact.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}.btn-compact.btn-action{--compact-size: 2rem;font-size:1rem}.btn-compact.btn-action:before{font-size:1em;font-weight:400}.btn-compact.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:rgba(0,0,0,0)}.btn-compact.btn-secondary:not([class*=colour-]){--colour: var(--colour-light)}.btn-compact.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)}.btn-compact.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse):is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}.btn-compact[data-number]{position:relative}.btn-compact[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:#fff;letter-spacing:-0.1em;font-family:arial,sans-serif}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary:not(:hover,:focus,.hover,:focus-within):not(.btn-collapse),.invert-colours .btn-compact.btn-secondary:not(:hover,:focus,.hover,:focus-within):not(.btn-collapse){background-color:var(--colour-inverted) !important;border-color:var(--colour-inverted) !important;color:var(--colour-primary-theme)}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary:is(:hover,:focus,.hover,:focus-within):not([disabled]):not(.btn-collapse),.invert-colours .btn-compact.btn-secondary:is(:hover,:focus,.hover,:focus-within):not([disabled]):not(.btn-collapse){background-color:rgba(0,0,0,0);border-color:var(--colour-inverted) !important;color:var(--colour-inverted)}[class*=bg-]:not(.bg-info):not(.bg-success):not(.bg-light):not(.bg-warning):not(.bg-white):not(.bg-admin):not(.bg-canvas):not(.bg-canvas-2):not(.prevent-invert) .btn-compact.btn-secondary[disabled],.invert-colours .btn-compact.btn-secondary[disabled]{background-color:var(--colour-inverted) !important;border-color:var(--colour-inverted) !important;color:var(--colour-primary-theme) !important}}.d-block{display:block}.chart__wrapper .doughnut path:nth-child(11n-10){fill:var(--chart-colour-1-set)}.chart__wrapper .doughnut path:nth-child(11n-9){fill:var(--chart-colour-2-set)}.chart__wrapper .doughnut path:nth-child(11n-8){fill:var(--chart-colour-3-set)}.chart__wrapper .doughnut path:nth-child(11n-7){fill:var(--chart-colour-4-set)}.chart__wrapper .doughnut path:nth-child(11n-6){fill:var(--chart-colour-5-set)}.chart__wrapper .doughnut path:nth-child(11n-5){fill:var(--chart-colour-6-set)}.chart__wrapper .doughnut path:nth-child(11n-4){fill:var(--chart-colour-7-set)}.chart__wrapper .doughnut path:nth-child(11n-3){fill:var(--chart-colour-8-set)}.chart__wrapper .doughnut path:nth-child(11n-2){fill:var(--chart-colour-9-set)}.chart__wrapper .doughnut path:nth-child(11n-1){fill:var(--chart-colour-10-set)}.chart__wrapper{order:1}.chart__key{--key-border-radius: 50%;order:2;margin-bottom:0}.chart__key .btn-action{font-size:0.75rem;margin-right:-0.375rem !important;border-color:rgba(0,0,0,0) !important}.chart__key .btn-action:not(:hover):not(:focus){border-color:rgba(0,0,0,0) !important;background:rgba(0,0,0,0) !important}:host(.chart--horizontal) .chart__outer{flex-direction:row}:host(.chart--horizontal) .chart__outer .chart__key{flex-direction:column;justify-content:center;overflow:visible}:host(.chart--horizontal) .chart__outer .chart__key .btn-action{margin-right:0rem !important;margin-bottom:-0.75rem !important}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action{min-width:100%;display:flex;align-items:center;min-width:100%}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action[data-numeric]:before{flex-shrink:0}:host(.chart--horizontal.chart--show-totals) .chart__outer .chart__key .btn-action[data-numeric]:after{content:attr(data-numeric);display:inline-block;flex-grow:1;flex-shrink:0;min-width:6ch;text-align:right}:host(.chart--lg){--doughnut-size: 17.875rem}:host{--doughnut-size: 14.75rem}:host(.chart--sm){--doughnut-size: 11.875rem}.chart__outer .chart__yaxis,.chart__outer .line{display:none}.chart__outer table{display:none}.chart__outer .chart{display:flex;align-items:center}.chart__outer .doughnuts{display:flex;flex-direction:row;flex-wrap:wrap}.chart__outer .doughnut{position:relative;aspect-ratio:1/1;min-width:11.875rem;flex:1 1 auto;display:inline-block;max-width:var(--doughnut-size)}@container (min-width: 23.4375em){.chart__outer .doughnut{width:var(--doughnut-size)}}.chart__outer .doughnut:first-child{margin-left:0}.chart__outer .doughnut:last-child{margin-right:0}.chart__outer .doughnut svg{width:100%;height:100%}.chart__outer .doughnut>.doughnut__title{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:all;background:var(--bg-colour, var(--colour-canvas));border-radius:50%;z-index:var(--index-focus);padding:1rem;aspect-ratio:1/1;display:flex;justify-content:center;align-items:center;flex-direction:column;height:67%}.chart__outer .doughnut>.doughnut__title:before{content:attr(data-numeric);display:block;text-align:center;color:var(--colour-heading);font-size:3rem}.chart__outer .doughnut>.doughnut__title span{text-align:center;display:block}.chart__outer .doughnut svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1),.chart__outer .doughnut svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2),.chart__outer .doughnut svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3),.chart__outer .doughnut svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4),.chart__outer .doughnut svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5),.chart__outer .doughnut svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6),.chart__outer .doughnut svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7),.chart__outer .doughnut svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8),.chart__outer .doughnut svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9),.chart__outer .doughnut svg:has(path:nth-child(10):hover)~.tooltips>[part=popover]:nth-child(10),.chart__outer [part=popover]:hover{opacity:1;z-index:var(--index-above);pointer-events:all;z-index:99}.chart__outer .doughnut svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1):before,.chart__outer .doughnut svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2):before,.chart__outer .doughnut svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3):before,.chart__outer .doughnut svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4):before,.chart__outer .doughnut svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5):before,.chart__outer .doughnut svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6):before,.chart__outer .doughnut svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7):before,.chart__outer .doughnut svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8):before,.chart__outer .doughnut svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9):before,.chart__outer .doughnut svg:has(path:nth-child(10):hover)~.tooltips>[part=popover]:nth-child(10):before,.chart__outer [part=popover]:hover:before{display:none}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(1):hover)~.tooltips>[part=popover]:nth-child(1),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(1):hover{top:var(--middle-1-y, 50%);left:var(--middle-1-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(2):hover)~.tooltips>[part=popover]:nth-child(2),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(2):hover{top:var(--middle-2-y, 50%);left:var(--middle-2-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(3):hover)~.tooltips>[part=popover]:nth-child(3),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(3):hover{top:var(--middle-3-y, 50%);left:var(--middle-3-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(4):hover)~.tooltips>[part=popover]:nth-child(4),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(4):hover{top:var(--middle-4-y, 50%);left:var(--middle-4-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(5):hover)~.tooltips>[part=popover]:nth-child(5),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(5):hover{top:var(--middle-5-y, 50%);left:var(--middle-5-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(6):hover)~.tooltips>[part=popover]:nth-child(6),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(6):hover{top:var(--middle-6-y, 50%);left:var(--middle-6-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(7):hover)~.tooltips>[part=popover]:nth-child(7),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(7):hover{top:var(--middle-7-y, 50%);left:var(--middle-7-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(8):hover)~.tooltips>[part=popover]:nth-child(8),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(8):hover{top:var(--middle-8-y, 50%);left:var(--middle-8-x, 50%);transform:translate(-50%, -50%)}.chart__outer .doughnut:has([part=popover]>:is(button,a)) svg:has(path:nth-child(9):hover)~.tooltips>[part=popover]:nth-child(9),.chart__outer .doughnut:has([part=popover]>:is(button,a)) [part=popover]:nth-child(9):hover{top:var(--middle-9-y, 50%);left:var(--middle-9-x, 50%);transform:translate(-50%, -50%)}/*# sourceMappingURL=assets/css/components/doughnutchart.component.css.map */
|
|
13
13
|
|
|
14
14
|
</style>
|
|
15
15
|
<div class="chart__outer" part="outer">
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.4.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/function v(l,o){const r=o.querySelector(".files"),i=o.querySelector(".drop-area"),e=l.querySelector("input"),f=l.hasAttribute("data-maxsize")?l.getAttribute("data-maxsize"):0,u=o.querySelector(".invalid-feedback.size"),h=o.querySelector(".invalid-feedback.ext"),s=e.cloneNode();i.append(s);const b=function(t){if(!e.hasAttribute("accept"))return!0;const a=t.split(".").pop();return!!e.getAttribute("accept").includes(a)};if(o.addEventListener("click",t=>{t&&t.target instanceof HTMLElement&&t.target.closest(".btn-primary")&&(h.classList.remove("d-block"),u.classList.remove("d-block"),(e.hasAttribute("multiple")?s:e).click())}),o.addEventListener("click",t=>{if(t&&t.target instanceof HTMLElement&&t.target.closest(".files button")){const a=new DataTransfer,{files:d}=e,n=t.target.closest(".files button");for(let p=0;p<d.length;p++){const g=d[p];g.name!=n.getAttribute("data-file")&&a.items.add(g)}e.files=a.files;const m=new Event("change");e.dispatchEvent(m);const c=new CustomEvent("fileRemoved",{detail:{removedFile:n?.dataset.file}});l.dispatchEvent(c)}}),s.addEventListener("change",()=>{if(e.hasAttribute("multiple")){const a=[...e.files,...s.files],d=[],n=new DataTransfer;for(let m=0;m<a.length;m++){const c=a[m],p=c.size/1e3;!d.includes(c.name)&&(f==0||p<f)&&b(c.name)&&n.items.add(c),b(c.name)||h.classList.add("d-block"),p>f&&u.classList.add("d-block"),d.push(c.name)}e.files=n.files}else e.files=s.files;const t=new Event("change");e.dispatchEvent(t)}),s.addEventListener("dragenter",()=>{s.classList.add("focus")}),s.addEventListener("dragleave",()=>{s.classList.remove("focus")}),s.addEventListener("drop",()=>{s.classList.remove("focus")}),e.addEventListener("change",()=>{if(e.files.length==1){const a=e.files[0],d=a.size/1e3;if(!b(a.name)){h.classList.add("d-block");const n=new DataTransfer;e.files=n.files}if(d>f){u.classList.add("d-block");const n=new DataTransfer;e.files=n.files}}r.innerHTML="";for(const a of e.files)r.innerHTML+=`<span class="file" part="file">${a.name} <button data-file="${a.name}" part="file__remove">Remove</button></span>`;const t=new CustomEvent("elementchange",{detail:{files:e.files}});if(l.dispatchEvent(t),e.files.length==0){const a=new CustomEvent("empty");l.dispatchEvent(a)}}),l.hasAttribute("data-filename")){const t=l.getAttribute("data-filename");t&&(r.innerHTML=`<span class="file" part="file">${t} <button data-file="${t}" part="file__remove">Remove</button></span>`)}}window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"fileupload"});class y extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const o=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",r=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${o}/css/core.min.css`,i=document.createElement("template");i.innerHTML=`
|
|
5
5
|
<style>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.4.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/const p=e=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:e})},h=(e,t,a)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:t}),a.forEach(o=>{e.addEventListener(o,function(r){const i={event:o,element:t,target:r.target};Object.keys(r.detail).forEach(d=>{const s=r.detail[d];i[d]=s}),window.dataLayer.push(i)})}),!0),g=`<div class="card__head" part="head">
|
|
5
5
|
<slot name="head"></slot>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.4.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/function r(s,t){i(s,t)}function i(s,t){let e;t.addEventListener("keyup",()=>{clearTimeout(e),e=setTimeout(function(){o(s,t.value)},500)}),t.addEventListener("change",()=>{clearTimeout(e),o(s,t.value)})}const o=function(s,t){Array.from(s.querySelectorAll(":scope > li")).forEach(e=>{const a=e.textContent.toLowerCase();e.classList.add("d-none"),a.includes(t.toLowerCase())&&e.classList.remove("d-none")}),window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"Filtered list",value:t})};window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"filterlist"});class n extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,a=document.createElement("template");a.innerHTML=`
|
|
5
5
|
<style>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.4.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"header"});class o extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const t=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${t}/css/core.min.css`,a=document.createElement("template");a.innerHTML=`
|
|
5
5
|
<style>
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.4.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
|
-
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"inline edit"});class
|
|
4
|
+
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"inline edit"});class u extends HTMLElement{constructor(){super();const t=this.attachShadow({mode:"open"}),i=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",d=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${i}/css/core.min.css`,e=document.createElement("template");e.innerHTML=`
|
|
5
5
|
<style class="styles">
|
|
6
|
-
@import "${
|
|
7
|
-
:host{max-width:var(--input-max-width, 50rem);display:block;font-weight:normal;margin-bottom:2rem;position:relative}.btns,.status{justify-content:flex-end;gap:.5rem;position:absolute;top:calc(100% + .5rem);right:0}.btns{display:var(--display-btns, flex);justify-content:flex-end}.status{display:var(--display-status, flex)}.btn-action{margin:0}/*# sourceMappingURL=assets/css/components/inline-edit.css.map */
|
|
6
|
+
@import "${d}";
|
|
7
|
+
.d-inline{display:inline !important}.d-inline-block{display:inline-block !important}.d-block{display:block !important}.d-grid{display:grid !important}.d-table{display:table !important}.d-table-row{display:table-row !important}.d-table-cell{display:table-cell !important}.d-flex{display:flex !important}.d-inline-flex{display:inline-flex !important}.d-none{display:none !important}.d-inline{display:inline !important}.d-inline-block{display:inline-block !important}.d-block{display:block !important}.d-grid{display:grid !important}.d-table{display:table !important}.d-table-row{display:table-row !important}.d-table-cell{display:table-cell !important}.d-flex{display:flex !important}.d-inline-flex{display:inline-flex !important}.d-none{display:none !important}@media screen and (min-width: 36em){.d-sm-inline{display:inline !important}.d-sm-inline-block{display:inline-block !important}.d-sm-block{display:block !important}.d-sm-grid{display:grid !important}.d-sm-table{display:table !important}.d-sm-table-row{display:table-row !important}.d-sm-table-cell{display:table-cell !important}.d-sm-flex{display:flex !important}.d-sm-inline-flex{display:inline-flex !important}.d-sm-none{display:none !important}}@media screen and (min-width: 62em){.d-md-inline{display:inline !important}.d-md-inline-block{display:inline-block !important}.d-md-block{display:block !important}.d-md-grid{display:grid !important}.d-md-table{display:table !important}.d-md-table-row{display:table-row !important}.d-md-table-cell{display:table-cell !important}.d-md-flex{display:flex !important}.d-md-inline-flex{display:inline-flex !important}.d-md-none{display:none !important}}:host{max-width:var(--input-max-width, 50rem);display:block;font-weight:normal;margin-bottom:2rem;position:relative}.btns,.status{justify-content:flex-end;gap:.5rem;position:absolute;top:calc(100% + .5rem);right:0}.btns{display:var(--display-btns, flex);justify-content:flex-end}.status{display:var(--display-status, flex)}.btn-action{margin:0}/*# sourceMappingURL=assets/css/components/inline-edit.css.map */
|
|
8
8
|
|
|
9
9
|
</style>
|
|
10
10
|
<link rel="stylesheet" href="https://kit.fontawesome.com/26fdbf0179.css" crossorigin="anonymous">
|
|
@@ -18,5 +18,5 @@
|
|
|
18
18
|
<span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="saved"><i class="fa-regular fa-check me-1"></i> Saved</span>
|
|
19
19
|
<span class="btn btn-action border-0 bg-transparent prevent-invert d-none" id="notsaved"><i class="fa-regular fa-circle-info me-1"></i> Not Saved</span>
|
|
20
20
|
</div>
|
|
21
|
-
`,t.appendChild(e.content.cloneNode(!0))}connectedCallback(){const t=this,
|
|
21
|
+
`,t.appendChild(e.content.cloneNode(!0))}connectedCallback(){const t=this,i=this.shadowRoot.querySelector("#save"),d=this.shadowRoot.querySelector("#cancel"),e=this.querySelector("input, textarea, select"),s=this.querySelector(".preview"),l=this.shadowRoot.querySelector("#saving"),c=this.shadowRoot.querySelector("#saved"),o=this.shadowRoot.querySelector("#notsaved");let n=e.value;d.addEventListener("click",()=>{e.value=n,e.blur(),t.blur(),t.classList.remove("was-validated"),o.classList.add("d-none");const a=new CustomEvent("inline-edit-cancel",{detail:{name:e.getAttribute("name")}});t.dispatchEvent(a)}),i.addEventListener("click",()=>{if(t.querySelector(":invalid"))return t.classList.add("was-validated"),!1;n=e.value;const a=new CustomEvent("inline-edit-save",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(a),e.disabled=!0,e.blur(),t.blur(),l.classList.remove("d-none"),s&&(console.log(e.value),s.innerHTML=e.value)}),e.tagName==="INPUT"&&e.addEventListener("keydown",a=>{switch(a.key){case"Enter":a.stopPropagation(),a.preventDefault(),i.click();break}}),t.addEventListener("inline-edit-saved",()=>{setTimeout(()=>{l.classList.add("d-none"),c.classList.remove("d-none");const a=new CustomEvent("inline-edit-confirmed",{detail:{name:e.getAttribute("name")}});t.dispatchEvent(a)},100),setTimeout(()=>{e.disabled=!1,t.removeAttribute("data-saving"),l.classList.add("d-none"),c.classList.add("d-none"),o.classList.add("d-none")},1e3)}),e.tagName==="SELECT"&&e.addEventListener("change",()=>{n=e.value;const a=new CustomEvent("inline-edit-save",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(a),t.setAttribute("data-saving","true"),e.disabled=!0,e.blur()}),e.tagName!="SELECT"&&e.addEventListener("focus",()=>{e.select()}),e.addEventListener("blur",()=>{if(e.value!=n)if(t.hasAttribute("data-autosave")){n=e.value;const a=new CustomEvent("inline-edit-autosave",{detail:{name:e.getAttribute("name"),value:e.value}});t.dispatchEvent(a),l.classList.remove("d-none"),s&&(s.innerHTML=e.value)}else t.querySelector(".inline-feedback")||o.classList.remove("d-none")}),t.addEventListener("change",a=>{if(a&&a.target instanceof HTMLElement&&a.target.closest('input[type="checkbox"]')){let r="";Array.from(t.querySelectorAll('label input[type="checkbox"]:checked')).forEach((m,b)=>{b!=0&&(r+=", "),r+=m.value});const p=new CustomEvent("inline-edit-save",{detail:{name:a.target.closest('input[type="checkbox"]').getAttribute("name"),value:r}});t.dispatchEvent(p)}})}}export{u as default};
|
|
22
22
|
//# sourceMappingURL=inline-edit.component.min.js.map
|
|
@@ -14,7 +14,7 @@ class iamMarketing extends HTMLElement {
|
|
|
14
14
|
const coreCSS = document.body.hasAttribute('data-core-css')
|
|
15
15
|
? document.body.getAttribute('data-core-css')
|
|
16
16
|
: `${assetLocation}/css/core.min.css`;
|
|
17
|
-
const loadCSS = `@import "${assetLocation}/css/components/marketing.css";`;
|
|
17
|
+
const loadCSS = `@import "${assetLocation}/css/components/marketing.component.css";`;
|
|
18
18
|
const template = document.createElement('template');
|
|
19
19
|
template.innerHTML = `
|
|
20
20
|
<style>
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.4.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Marketing"});class o extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"});const e=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",i=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${e}/css/core.min.css`,t=document.createElement("template");t.innerHTML=`
|
|
5
5
|
<style>
|
|
6
6
|
@import "${i}";
|
|
7
|
-
figure{position:absolute;height:100%;width:100%;top:0;left:0}figure:after{content:"";inset:0;height:100%;width:100%;position:absolute;background-image:linear-gradient(15deg, #00313c 0%, #03404f 28.7%, #03404f 31.5%, #044353 60.1%, #1bb1dc 83.2%, rgba(28, 182, 226, 0.486) 100%);opacity:.85;z-index:1}img{pointer-events:none;position:absolute;inset:0;width:100%;max-height:auto;z-index:2;-webkit-mask-image:-webkit-gradient(linear, left top, left bottom, from(rgb(0, 0, 0)), to(rgba(0, 0, 0, 0)));mask-image:linear-gradient(to bottom, rgb(0, 0, 0), rgba(0, 0, 0, 0));mix-blend-mode:multiply}
|
|
7
|
+
:host{display:flex;position:relative;overflow:hidden;position:relative;overflow:hidden;margin-bottom:2rem;min-width:100%;padding:2rem;border-radius:.5rem;text-align:center;align-items:flex-end;padding-top:33%}figure{position:absolute;height:100%;width:100%;top:0;left:0;margin:0}figure:after{content:"";inset:0;height:100%;width:100%;position:absolute;background-image:linear-gradient(15deg, #00313c 0%, #03404f 28.7%, #03404f 31.5%, #044353 60.1%, #1bb1dc 83.2%, rgba(28, 182, 226, 0.486) 100%);opacity:.85;z-index:1}img{pointer-events:none;position:absolute;inset:0;width:100%;max-height:auto;z-index:2;-webkit-mask-image:-webkit-gradient(linear, left top, left bottom, from(rgb(0, 0, 0)), to(rgba(0, 0, 0, 0)));mask-image:linear-gradient(to bottom, rgb(0, 0, 0), rgba(0, 0, 0, 0));mix-blend-mode:multiply}::slotted(*){position:relative;z-index:2;text-align:center}/*# sourceMappingURL=assets/css/components/marketing.component.css.map */
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
</style>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"marketing.component.min.js","sources":["marketing.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n event: 'customElementRegistered',\n element: 'Marketing',\n});\nclass iamMarketing extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css')\n ? document.body.getAttribute('data-core-css')\n : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/marketing.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n \n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\" />\n <div class=\"marketing\">\n \n <slot></slot>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.classList.add('invert-colours');\n if (this.hasAttribute('data-img')) {\n this.shadowRoot\n .querySelector('.marketing')\n .insertAdjacentHTML('afterbegin', `<figure><img src=\"${this.getAttribute('data-img')}\" alt=\"\" /></figure>`);\n }\n }\n}\nexport default iamMarketing;\n"],"names":["iamMarketing","assetLocation","coreCSS","template"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAE,EACzC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,WACb,CAAC,EACD,MAAMA,UAAqB,WAAY,CACnC,aAAc,CACV,MAAO,EACP,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EACjE,SAAS,KAAK,aAAa,sBAAsB,EACjD,UACAC,EAAU,SAAS,KAAK,aAAa,eAAe,EACpD,SAAS,KAAK,aAAa,eAAe,EAC1C,GAAGD,CAAa,oBAEhBE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAUd,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CACpE,CACI,mBAAoB,CAChB,KAAK,UAAU,IAAI,gBAAgB,EAC/B,KAAK,aAAa,UAAU,GAC5B,KAAK,WACA,cAAc,YAAY,EAC1B,mBAAmB,aAAc,qBAAqB,KAAK,aAAa,UAAU,CAAC,sBAAsB,CAE1H,CACA"}
|
|
1
|
+
{"version":3,"file":"marketing.component.min.js","sources":["marketing.component.js"],"sourcesContent":["// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n event: 'customElementRegistered',\n element: 'Marketing',\n});\nclass iamMarketing extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css')\n ? document.body.getAttribute('data-core-css')\n : `${assetLocation}/css/core.min.css`;\n const loadCSS = `@import \"${assetLocation}/css/components/marketing.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n ${loadCSS}\n \n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/26fdbf0179.css\" crossorigin=\"anonymous\" />\n <div class=\"marketing\">\n \n <slot></slot>\n </div>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n this.classList.add('invert-colours');\n if (this.hasAttribute('data-img')) {\n this.shadowRoot\n .querySelector('.marketing')\n .insertAdjacentHTML('afterbegin', `<figure><img src=\"${this.getAttribute('data-img')}\" alt=\"\" /></figure>`);\n }\n }\n}\nexport default iamMarketing;\n"],"names":["iamMarketing","assetLocation","coreCSS","template"],"mappings":";;;IACA,OAAO,UAAY,OAAO,WAAa,CAAE,EACzC,OAAO,UAAU,KAAK,CAClB,MAAO,0BACP,QAAS,WACb,CAAC,EACD,MAAMA,UAAqB,WAAY,CACnC,aAAc,CACV,MAAO,EACP,KAAK,aAAa,CAAE,KAAM,MAAM,CAAE,EAClC,MAAMC,EAAgB,SAAS,KAAK,aAAa,sBAAsB,EACjE,SAAS,KAAK,aAAa,sBAAsB,EACjD,UACAC,EAAU,SAAS,KAAK,aAAa,eAAe,EACpD,SAAS,KAAK,aAAa,eAAe,EAC1C,GAAGD,CAAa,oBAEhBE,EAAW,SAAS,cAAc,UAAU,EAClDA,EAAS,UAAY;AAAA;AAAA,eAEdD,CAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAUd,KAAK,WAAW,YAAYC,EAAS,QAAQ,UAAU,EAAI,CAAC,CACpE,CACI,mBAAoB,CAChB,KAAK,UAAU,IAAI,gBAAgB,EAC/B,KAAK,aAAa,UAAU,GAC5B,KAAK,WACA,cAAc,YAAY,EAC1B,mBAAmB,aAAc,qBAAqB,KAAK,aAAa,UAAU,CAAC,sBAAsB,CAE1H,CACA"}
|
|
@@ -19,8 +19,12 @@ class iamMenu extends HTMLElement {
|
|
|
19
19
|
connectedCallback() {
|
|
20
20
|
const menuID = this.hasAttribute('id') ? this.getAttribute('id') : false;
|
|
21
21
|
const menuButton = document.querySelector(`[popovertarget="${menuID}"]`);
|
|
22
|
-
|
|
23
|
-
|
|
22
|
+
let topLevelmenuItems = this.querySelectorAll(':scope > a, :scope > button, :scope > details > summary');
|
|
23
|
+
let menuItems = this.querySelectorAll('a, button');
|
|
24
|
+
if (this.closest('.menu__wrapper')) {
|
|
25
|
+
menuItems = this.shadowRoot.querySelector('slot').assignedElements({ flatten: true });
|
|
26
|
+
topLevelmenuItems = menuItems;
|
|
27
|
+
}
|
|
24
28
|
const subMenus = this.querySelectorAll('details');
|
|
25
29
|
let subNextIndex;
|
|
26
30
|
let subPrevIndex;
|
|
@@ -120,6 +124,10 @@ class iamMenu extends HTMLElement {
|
|
|
120
124
|
var _a, _b, _c, _d;
|
|
121
125
|
const updateEvent = new CustomEvent(e.newState, { detail: { id: this.getAttribute('id'), target: e.target } });
|
|
122
126
|
this.dispatchEvent(updateEvent);
|
|
127
|
+
// Fix the focus
|
|
128
|
+
if (this.closest('.menu__wrapper')) {
|
|
129
|
+
menuItems[0].focus();
|
|
130
|
+
}
|
|
123
131
|
if (this.hasAttribute('popover-open')) {
|
|
124
132
|
e.preventDefault();
|
|
125
133
|
this.removeAttribute('popover-open');
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.
|
|
2
|
+
* iamKey v7.4.0
|
|
3
3
|
* Copyright 2022-2025 iamproperty
|
|
4
4
|
*/class d extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const n=document.createElement("template");n.innerHTML=`
|
|
5
5
|
<style>
|
|
@@ -8,5 +8,5 @@
|
|
|
8
8
|
</style>
|
|
9
9
|
<div class="menu--inner" part="inner">
|
|
10
10
|
<slot></slot>
|
|
11
|
-
</div>`,this.shadowRoot.appendChild(n.content.cloneNode(!0))}connectedCallback(){const n=this.hasAttribute("id")?this.getAttribute("id"):!1,
|
|
11
|
+
</div>`,this.shadowRoot.appendChild(n.content.cloneNode(!0))}connectedCallback(){const n=this.hasAttribute("id")?this.getAttribute("id"):!1,a=document.querySelector(`[popovertarget="${n}"]`);let r=this.querySelectorAll(":scope > a, :scope > button, :scope > details > summary"),l=this.querySelectorAll("a, button");this.closest(".menu__wrapper")&&(l=this.shadowRoot.querySelector("slot").assignedElements({flatten:!0}),r=l),this.querySelectorAll("details");let u,c;n&&a&&(this.setAttribute("role","menu"),this.style["position-anchor"]=`--${n}`,a?.setAttribute("aria-haspopup","true"),a==null||(a.style["anchor-name"]=`--${n}`),a?.setAttribute("aria-controls",n)),l.forEach((e,t)=>{e.setAttribute("role","menuitem"),e.setAttribute("tabindex","0"),t==0&&e.setAttribute("autofocus",!0)}),this.addEventListener("keydown",e=>{if(e&&e.target instanceof HTMLElement&&e.target.closest("a, button, summary")){const t=document.activeElement,s=Array.from(r).indexOf(t)-1,i=Array.from(r).indexOf(t)+1;switch(e.keyCode){case 27:t.closest("details")?(e.stopPropagation(),e.preventDefault(),t.closest("details").removeAttribute("open"),t.closest("details").querySelector(":scope summary").focus()):(e.stopPropagation(),a.focus());break;case 32:case 13:break;case 35:e.stopPropagation(),e.preventDefault(),this.querySelector("details[open]").removeAttribute("open"),Array.from(l)[l.length-1].focus();break;case 36:e.stopPropagation(),e.preventDefault(),this.querySelector("details[open]").removeAttribute("open"),Array.from(l)[0].focus();break;case 38:if(e.stopPropagation(),e.preventDefault(),Array.from(r).indexOf(t)>-1)Array.from(r)[s]!=null?Array.from(r)[s].focus():Array.from(r)[r.length-1].focus();else if(t.closest("details")){const o=t.closest("details").querySelectorAll("a, button, :scope details > summary");c=Array.from(o).indexOf(t)-1,Array.from(o)[c]!=null?Array.from(o)[c].focus():Array.from(o)[o.length-1].focus()}break;case 40:if(e.stopPropagation(),e.preventDefault(),Array.from(r).indexOf(t)>-1)Array.from(r)[i]!=null?Array.from(r)[i].focus():Array.from(r)[0].focus();else if(t.closest("details")){const o=t.closest("details").querySelectorAll("a, button, :scope details > summary");u=Array.from(o).indexOf(t)+1,Array.from(o)[u]!=null?Array.from(o)[u].focus():Array.from(o)[0].focus()}break}}}),this.addEventListener("toggle",e=>{var t,s,i,o;const m=new CustomEvent(e.newState,{detail:{id:this.getAttribute("id"),target:e.target}});this.dispatchEvent(m),this.closest(".menu__wrapper")&&l[0].focus(),this.hasAttribute("popover-open")&&(e.preventDefault(),this.removeAttribute("popover-open"),this.hidePopover()),this.matches(":popover-open")&&document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`)?((t=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||t===void 0||t.setAttribute("aria-pressed","true"),(s=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||s===void 0||s.classList.add("active")):((i=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||i===void 0||i.removeAttribute("aria-pressed"),(o=document.querySelector(`[popovertarget="${this.getAttribute("id")}"]`))===null||o===void 0||o.classList.remove("active"))}),this.addEventListener("click",e=>{if(e&&e.target instanceof HTMLElement&&e.target.closest("button:has(+ iam-menu:not([popover]))")){const t=e.target.closest("button:has(+ iam-menu)");t?.classList.toggle("open")}else if(e&&e.target instanceof HTMLElement&&e.target.closest("button.selectable")){const t=e.target.closest("button.selectable");this.hasAttribute("multiple")?t.classList.toggle("selected"):t?.classList.contains("selected")?this.querySelectorAll(".selected").forEach(s=>{s.classList.remove("selected")}):(this.querySelectorAll(".selected").forEach(s=>{s.classList.remove("selected")}),t.classList.add("selected"))}}),CSS.supports("top","anchor(top)")||document.addEventListener("click",e=>{if(e.originalTarget&&e.originalTarget.matches("[popovertarget]")){const t=e.originalTarget,s=t.getAttribute("popovertarget"),i=document.getElementById(s),o=t.getBoundingClientRect(),m=o.top,p=o.left;i.style.setProperty("top",m+"px"),i.style.setProperty("left",p+t.clientWidth+"px")}})}}export{d as default};
|
|
12
12
|
//# sourceMappingURL=menu.component.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.component.min.js","sources":["menu.component.js"],"sourcesContent":["class iamMenu extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/menu.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${loadCSS}\n </style>\n <div class=\"menu--inner\" part=\"inner\">\n <slot></slot>\n </div>`;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const menuID = this.hasAttribute('id') ? this.getAttribute('id') : false;\n const menuButton = document.querySelector(`[popovertarget=\"${menuID}\"]`);\n const topLevelmenuItems = this.querySelectorAll(':scope > a, :scope > button, :scope > details > summary');\n const menuItems = this.querySelectorAll('a, button');\n const subMenus = this.querySelectorAll('details');\n let subNextIndex;\n let subPrevIndex;\n // Set the needed CSS styles to connect the ID attribute to the anchor name\n if (menuID && menuButton) {\n this.setAttribute('role', 'menu');\n this.style['position-anchor'] = `--${menuID}`;\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-haspopup', 'true');\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.style['anchor-name'] = `--${menuID}`;\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-controls', menuID);\n }\n menuItems.forEach((item, index) => {\n item.setAttribute('role', 'menuitem');\n item.setAttribute('tabindex', '0');\n if (index == 0) {\n item.setAttribute('autofocus', true);\n }\n });\n this.addEventListener('keydown', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('a, button, summary')) {\n const activeItem = document.activeElement;\n const prevIndex = Array.from(topLevelmenuItems).indexOf(activeItem) - 1;\n const nextIndex = Array.from(topLevelmenuItems).indexOf(activeItem) + 1;\n switch (event.keyCode // change to event.key to key to use the above variable\n ) {\n case 27: // Esc\n if (activeItem.closest('details')) {\n event.stopPropagation();\n event.preventDefault();\n activeItem.closest('details').removeAttribute('open');\n activeItem.closest('details').querySelector(':scope summary').focus();\n }\n else {\n event.stopPropagation();\n menuButton.focus();\n }\n break;\n case 32: // Space\n case 13: // Enter\n break;\n case 35: // end\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[menuItems.length - 1].focus();\n break;\n case 36: // home\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[0].focus();\n break;\n case 38: // up\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[prevIndex] != undefined)\n Array.from(topLevelmenuItems)[prevIndex].focus();\n else\n Array.from(topLevelmenuItems)[topLevelmenuItems.length - 1].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subPrevIndex = Array.from(subMenuItems).indexOf(activeItem) - 1;\n if (Array.from(subMenuItems)[subPrevIndex] != undefined)\n Array.from(subMenuItems)[subPrevIndex].focus();\n else\n Array.from(subMenuItems)[subMenuItems.length - 1].focus();\n }\n break;\n case 40: // down\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[nextIndex] != undefined)\n Array.from(topLevelmenuItems)[nextIndex].focus();\n else\n Array.from(topLevelmenuItems)[0].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subNextIndex = Array.from(subMenuItems).indexOf(activeItem) + 1;\n if (Array.from(subMenuItems)[subNextIndex] != undefined)\n Array.from(subMenuItems)[subNextIndex].focus();\n else\n Array.from(subMenuItems)[0].focus();\n }\n break;\n }\n }\n });\n this.addEventListener('toggle', (e) => {\n var _a, _b, _c, _d;\n const updateEvent = new CustomEvent(e.newState, { detail: { id: this.getAttribute('id'), target: e.target } });\n this.dispatchEvent(updateEvent);\n if (this.hasAttribute('popover-open')) {\n e.preventDefault();\n this.removeAttribute('popover-open');\n this.hidePopover();\n }\n if (this.matches(':popover-open') && document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) {\n (_a = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-pressed', 'true');\n (_b = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _b === void 0 ? void 0 : _b.classList.add('active');\n }\n else {\n (_c = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _c === void 0 ? void 0 : _c.removeAttribute('aria-pressed');\n (_d = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _d === void 0 ? void 0 : _d.classList.remove('active');\n }\n });\n this.addEventListener('click', (event) => {\n if (event &&\n event.target instanceof HTMLElement &&\n event.target.closest('button:has(+ iam-menu:not([popover]))')) {\n const button = event.target.closest('button:has(+ iam-menu)');\n button === null || button === void 0 ? void 0 : button.classList.toggle('open');\n }\n else if (event && event.target instanceof HTMLElement && event.target.closest('button.selectable')) {\n const button = event.target.closest('button.selectable');\n if (this.hasAttribute('multiple')) {\n button.classList.toggle('selected');\n }\n else if (button === null || button === void 0 ? void 0 : button.classList.contains('selected')) {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n }\n else {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n button.classList.add('selected');\n }\n }\n });\n // safari and firefox anchor fix for cards\n if (!CSS.supports('top', 'anchor(top)')) {\n document.addEventListener('click', (event) => {\n if (event.originalTarget && event.originalTarget.matches('[popovertarget]')) {\n const button = event.originalTarget;\n const popoverID = button.getAttribute('popovertarget');\n const popover = document.getElementById(popoverID);\n const viewportOffset = button.getBoundingClientRect();\n const top = viewportOffset.top;\n const left = viewportOffset.left;\n popover.style.setProperty('top', top + 'px');\n popover.style.setProperty('left', left + button.clientWidth + 'px');\n }\n });\n }\n }\n}\nexport default iamMenu;\n"],"names":["iamMenu","template","menuID","menuButton","topLevelmenuItems","menuItems","subNextIndex","subPrevIndex","item","index","event","activeItem","prevIndex","nextIndex","subMenuItems","_a","_b","_c","_d","updateEvent","button","popoverID","popover","viewportOffset","top","left"],"mappings":";;;IAAA,MAAMA,UAAgB,WAAY,CAC9B,aAAc,CACV,MAAO,EACP,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,YAOrB,KAAK,WAAW,YAAYA,EAAS,QAAQ,UAAU,EAAI,CAAC,CACpE,CACI,mBAAoB,CAChB,MAAMC,EAAS,KAAK,aAAa,IAAI,EAAI,KAAK,aAAa,IAAI,EAAI,GAC7DC,EAAa,SAAS,cAAc,mBAAmBD,CAAM,IAAI,EACjEE,EAAoB,KAAK,iBAAiB,yDAAyD,EACnGC,EAAY,KAAK,iBAAiB,WAAW,EAClC,KAAK,iBAAiB,SAAS,EAChD,IAAIC,EACAC,EAEAL,GAAUC,IACV,KAAK,aAAa,OAAQ,MAAM,EAChC,KAAK,MAAM,iBAAiB,EAAI,KAAKD,CAAM,GACaC,GAAW,aAAa,gBAAiB,MAAM,EACvGA,GAAe,OAAyCA,EAAW,MAAM,aAAa,EAAI,KAAKD,CAAM,IAC7CC,GAAW,aAAa,gBAAiBD,CAAM,GAE3GG,EAAU,QAAQ,CAACG,EAAMC,IAAU,CAC/BD,EAAK,aAAa,OAAQ,UAAU,EACpCA,EAAK,aAAa,WAAY,GAAG,EAC7BC,GAAS,GACTD,EAAK,aAAa,YAAa,EAAI,CAEnD,CAAS,EACD,KAAK,iBAAiB,UAAYE,GAAU,CACxC,GAAIA,GAASA,EAAM,kBAAkB,aAAeA,EAAM,OAAO,QAAQ,oBAAoB,EAAG,CAC5F,MAAMC,EAAa,SAAS,cACtBC,EAAY,MAAM,KAAKR,CAAiB,EAAE,QAAQO,CAAU,EAAI,EAChEE,EAAY,MAAM,KAAKT,CAAiB,EAAE,QAAQO,CAAU,EAAI,EACtE,OAAQD,EAAM,QAC9B,CACoB,IAAK,IACGC,EAAW,QAAQ,SAAS,GAC5BD,EAAM,gBAAiB,EACvBA,EAAM,eAAgB,EACtBC,EAAW,QAAQ,SAAS,EAAE,gBAAgB,MAAM,EACpDA,EAAW,QAAQ,SAAS,EAAE,cAAc,gBAAgB,EAAE,MAAO,IAGrED,EAAM,gBAAiB,EACvBP,EAAW,MAAO,GAEtB,MACJ,IAAK,IACL,IAAK,IACD,MACJ,IAAK,IACDO,EAAM,gBAAiB,EACvBA,EAAM,eAAgB,EACtB,KAAK,cAAc,eAAe,EAAE,gBAAgB,MAAM,EAC1D,MAAM,KAAKL,CAAS,EAAEA,EAAU,OAAS,CAAC,EAAE,MAAO,EACnD,MACJ,IAAK,IACDK,EAAM,gBAAiB,EACvBA,EAAM,eAAgB,EACtB,KAAK,cAAc,eAAe,EAAE,gBAAgB,MAAM,EAC1D,MAAM,KAAKL,CAAS,EAAE,CAAC,EAAE,MAAO,EAChC,MACJ,IAAK,IAGD,GAFAK,EAAM,gBAAiB,EACvBA,EAAM,eAAgB,EAClB,MAAM,KAAKN,CAAiB,EAAE,QAAQO,CAAU,EAAI,GAChD,MAAM,KAAKP,CAAiB,EAAEQ,CAAS,GAAK,KAC5C,MAAM,KAAKR,CAAiB,EAAEQ,CAAS,EAAE,MAAO,EAEhD,MAAM,KAAKR,CAAiB,EAAEA,EAAkB,OAAS,CAAC,EAAE,MAAO,UAElEO,EAAW,QAAQ,SAAS,EAAG,CACpC,MAAMG,EAAeH,EAChB,QAAQ,SAAS,EACjB,iBAAiB,qCAAqC,EAC3DJ,EAAe,MAAM,KAAKO,CAAY,EAAE,QAAQH,CAAU,EAAI,EAC1D,MAAM,KAAKG,CAAY,EAAEP,CAAY,GAAK,KAC1C,MAAM,KAAKO,CAAY,EAAEP,CAAY,EAAE,MAAO,EAE9C,MAAM,KAAKO,CAAY,EAAEA,EAAa,OAAS,CAAC,EAAE,MAAO,CACzF,CACwB,MACJ,IAAK,IAGD,GAFAJ,EAAM,gBAAiB,EACvBA,EAAM,eAAgB,EAClB,MAAM,KAAKN,CAAiB,EAAE,QAAQO,CAAU,EAAI,GAChD,MAAM,KAAKP,CAAiB,EAAES,CAAS,GAAK,KAC5C,MAAM,KAAKT,CAAiB,EAAES,CAAS,EAAE,MAAO,EAEhD,MAAM,KAAKT,CAAiB,EAAE,CAAC,EAAE,MAAO,UAEvCO,EAAW,QAAQ,SAAS,EAAG,CACpC,MAAMG,EAAeH,EAChB,QAAQ,SAAS,EACjB,iBAAiB,qCAAqC,EAC3DL,EAAe,MAAM,KAAKQ,CAAY,EAAE,QAAQH,CAAU,EAAI,EAC1D,MAAM,KAAKG,CAAY,EAAER,CAAY,GAAK,KAC1C,MAAM,KAAKQ,CAAY,EAAER,CAAY,EAAE,MAAO,EAE9C,MAAM,KAAKQ,CAAY,EAAE,CAAC,EAAE,MAAO,CACnE,CACwB,KACxB,CACA,CACA,CAAS,EACD,KAAK,iBAAiB,SAAW,GAAM,CACnC,IAAIC,EAAIC,EAAIC,EAAIC,EAChB,MAAMC,EAAc,IAAI,YAAY,EAAE,SAAU,CAAE,OAAQ,CAAE,GAAI,KAAK,aAAa,IAAI,EAAG,OAAQ,EAAE,MAAM,EAAI,EAC7G,KAAK,cAAcA,CAAW,EAC1B,KAAK,aAAa,cAAc,IAChC,EAAE,eAAgB,EAClB,KAAK,gBAAgB,cAAc,EACnC,KAAK,YAAa,GAElB,KAAK,QAAQ,eAAe,GAAK,SAAS,cAAc,mBAAmB,KAAK,aAAa,IAAI,CAAC,IAAI,IACrGJ,EAAK,SAAS,cAAc,mBAAmB,KAAK,aAAa,IAAI,CAAC,IAAI,KAAO,MAAQA,IAAO,QAAkBA,EAAG,aAAa,eAAgB,MAAM,GACxJC,EAAK,SAAS,cAAc,mBAAmB,KAAK,aAAa,IAAI,CAAC,IAAI,KAAO,MAAQA,IAAO,QAAkBA,EAAG,UAAU,IAAI,QAAQ,KAG3IC,EAAK,SAAS,cAAc,mBAAmB,KAAK,aAAa,IAAI,CAAC,IAAI,KAAO,MAAQA,IAAO,QAAkBA,EAAG,gBAAgB,cAAc,GACnJC,EAAK,SAAS,cAAc,mBAAmB,KAAK,aAAa,IAAI,CAAC,IAAI,KAAO,MAAQA,IAAO,QAAkBA,EAAG,UAAU,OAAO,QAAQ,EAE/J,CAAS,EACD,KAAK,iBAAiB,QAAUR,GAAU,CACtC,GAAIA,GACAA,EAAM,kBAAkB,aACxBA,EAAM,OAAO,QAAQ,uCAAuC,EAAG,CAC/D,MAAMU,EAASV,EAAM,OAAO,QAAQ,wBAAwB,EACZU,GAAO,UAAU,OAAO,MAAM,CAC9F,SACqBV,GAASA,EAAM,kBAAkB,aAAeA,EAAM,OAAO,QAAQ,mBAAmB,EAAG,CAChG,MAAMU,EAASV,EAAM,OAAO,QAAQ,mBAAmB,EACnD,KAAK,aAAa,UAAU,EAC5BU,EAAO,UAAU,OAAO,UAAU,EAEmBA,GAAO,UAAU,SAAS,UAAU,EACzF,KAAK,iBAAiB,WAAW,EAAE,QAASZ,GAAS,CACjDA,EAAK,UAAU,OAAO,UAAU,CACxD,CAAqB,GAGD,KAAK,iBAAiB,WAAW,EAAE,QAASA,GAAS,CACjDA,EAAK,UAAU,OAAO,UAAU,CACxD,CAAqB,EACDY,EAAO,UAAU,IAAI,UAAU,EAEnD,CACA,CAAS,EAEI,IAAI,SAAS,MAAO,aAAa,GAClC,SAAS,iBAAiB,QAAUV,GAAU,CAC1C,GAAIA,EAAM,gBAAkBA,EAAM,eAAe,QAAQ,iBAAiB,EAAG,CACzE,MAAMU,EAASV,EAAM,eACfW,EAAYD,EAAO,aAAa,eAAe,EAC/CE,EAAU,SAAS,eAAeD,CAAS,EAC3CE,EAAiBH,EAAO,sBAAuB,EAC/CI,EAAMD,EAAe,IACrBE,EAAOF,EAAe,KAC5BD,EAAQ,MAAM,YAAY,MAAOE,EAAM,IAAI,EAC3CF,EAAQ,MAAM,YAAY,OAAQG,EAAOL,EAAO,YAAc,IAAI,CACtF,CACA,CAAa,CAEb,CACA"}
|
|
1
|
+
{"version":3,"file":"menu.component.min.js","sources":["menu.component.js"],"sourcesContent":["class iamMenu extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/menu.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${loadCSS}\n </style>\n <div class=\"menu--inner\" part=\"inner\">\n <slot></slot>\n </div>`;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const menuID = this.hasAttribute('id') ? this.getAttribute('id') : false;\n const menuButton = document.querySelector(`[popovertarget=\"${menuID}\"]`);\n let topLevelmenuItems = this.querySelectorAll(':scope > a, :scope > button, :scope > details > summary');\n let menuItems = this.querySelectorAll('a, button');\n if (this.closest('.menu__wrapper')) {\n menuItems = this.shadowRoot.querySelector('slot').assignedElements({ flatten: true });\n topLevelmenuItems = menuItems;\n }\n const subMenus = this.querySelectorAll('details');\n let subNextIndex;\n let subPrevIndex;\n // Set the needed CSS styles to connect the ID attribute to the anchor name\n if (menuID && menuButton) {\n this.setAttribute('role', 'menu');\n this.style['position-anchor'] = `--${menuID}`;\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-haspopup', 'true');\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.style['anchor-name'] = `--${menuID}`;\n menuButton === null || menuButton === void 0 ? void 0 : menuButton.setAttribute('aria-controls', menuID);\n }\n menuItems.forEach((item, index) => {\n item.setAttribute('role', 'menuitem');\n item.setAttribute('tabindex', '0');\n if (index == 0) {\n item.setAttribute('autofocus', true);\n }\n });\n this.addEventListener('keydown', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('a, button, summary')) {\n const activeItem = document.activeElement;\n const prevIndex = Array.from(topLevelmenuItems).indexOf(activeItem) - 1;\n const nextIndex = Array.from(topLevelmenuItems).indexOf(activeItem) + 1;\n switch (event.keyCode // change to event.key to key to use the above variable\n ) {\n case 27: // Esc\n if (activeItem.closest('details')) {\n event.stopPropagation();\n event.preventDefault();\n activeItem.closest('details').removeAttribute('open');\n activeItem.closest('details').querySelector(':scope summary').focus();\n }\n else {\n event.stopPropagation();\n menuButton.focus();\n }\n break;\n case 32: // Space\n case 13: // Enter\n break;\n case 35: // end\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[menuItems.length - 1].focus();\n break;\n case 36: // home\n event.stopPropagation();\n event.preventDefault();\n this.querySelector('details[open]').removeAttribute('open');\n Array.from(menuItems)[0].focus();\n break;\n case 38: // up\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[prevIndex] != undefined)\n Array.from(topLevelmenuItems)[prevIndex].focus();\n else\n Array.from(topLevelmenuItems)[topLevelmenuItems.length - 1].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subPrevIndex = Array.from(subMenuItems).indexOf(activeItem) - 1;\n if (Array.from(subMenuItems)[subPrevIndex] != undefined)\n Array.from(subMenuItems)[subPrevIndex].focus();\n else\n Array.from(subMenuItems)[subMenuItems.length - 1].focus();\n }\n break;\n case 40: // down\n event.stopPropagation();\n event.preventDefault();\n if (Array.from(topLevelmenuItems).indexOf(activeItem) > -1) {\n if (Array.from(topLevelmenuItems)[nextIndex] != undefined)\n Array.from(topLevelmenuItems)[nextIndex].focus();\n else\n Array.from(topLevelmenuItems)[0].focus();\n }\n else if (activeItem.closest('details')) {\n const subMenuItems = activeItem\n .closest('details')\n .querySelectorAll('a, button, :scope details > summary');\n subNextIndex = Array.from(subMenuItems).indexOf(activeItem) + 1;\n if (Array.from(subMenuItems)[subNextIndex] != undefined)\n Array.from(subMenuItems)[subNextIndex].focus();\n else\n Array.from(subMenuItems)[0].focus();\n }\n break;\n }\n }\n });\n this.addEventListener('toggle', (e) => {\n var _a, _b, _c, _d;\n const updateEvent = new CustomEvent(e.newState, { detail: { id: this.getAttribute('id'), target: e.target } });\n this.dispatchEvent(updateEvent);\n // Fix the focus\n if (this.closest('.menu__wrapper')) {\n menuItems[0].focus();\n }\n if (this.hasAttribute('popover-open')) {\n e.preventDefault();\n this.removeAttribute('popover-open');\n this.hidePopover();\n }\n if (this.matches(':popover-open') && document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) {\n (_a = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _a === void 0 ? void 0 : _a.setAttribute('aria-pressed', 'true');\n (_b = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _b === void 0 ? void 0 : _b.classList.add('active');\n }\n else {\n (_c = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _c === void 0 ? void 0 : _c.removeAttribute('aria-pressed');\n (_d = document.querySelector(`[popovertarget=\"${this.getAttribute('id')}\"]`)) === null || _d === void 0 ? void 0 : _d.classList.remove('active');\n }\n });\n this.addEventListener('click', (event) => {\n if (event &&\n event.target instanceof HTMLElement &&\n event.target.closest('button:has(+ iam-menu:not([popover]))')) {\n const button = event.target.closest('button:has(+ iam-menu)');\n button === null || button === void 0 ? void 0 : button.classList.toggle('open');\n }\n else if (event && event.target instanceof HTMLElement && event.target.closest('button.selectable')) {\n const button = event.target.closest('button.selectable');\n if (this.hasAttribute('multiple')) {\n button.classList.toggle('selected');\n }\n else if (button === null || button === void 0 ? void 0 : button.classList.contains('selected')) {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n }\n else {\n this.querySelectorAll('.selected').forEach((item) => {\n item.classList.remove('selected');\n });\n button.classList.add('selected');\n }\n }\n });\n // safari and firefox anchor fix for cards\n if (!CSS.supports('top', 'anchor(top)')) {\n document.addEventListener('click', (event) => {\n if (event.originalTarget && event.originalTarget.matches('[popovertarget]')) {\n const button = event.originalTarget;\n const popoverID = button.getAttribute('popovertarget');\n const popover = document.getElementById(popoverID);\n const viewportOffset = button.getBoundingClientRect();\n const top = viewportOffset.top;\n const left = viewportOffset.left;\n popover.style.setProperty('top', top + 'px');\n popover.style.setProperty('left', left + button.clientWidth + 'px');\n }\n });\n }\n }\n}\nexport default iamMenu;\n"],"names":["iamMenu","template","menuID","menuButton","topLevelmenuItems","menuItems","subNextIndex","subPrevIndex","item","index","event","activeItem","prevIndex","nextIndex","subMenuItems","_a","_b","_c","_d","updateEvent","button","popoverID","popover","viewportOffset","top","left"],"mappings":"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"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { trackComponent, trackComponentRegistered } from '../_global.js';
|
|
2
|
+
import milestone from '../../modules/milestone.js';
|
|
3
|
+
trackComponentRegistered('iam-milestone');
|
|
4
|
+
class iamMilestone extends HTMLElement {
|
|
5
|
+
constructor() {
|
|
6
|
+
var _a;
|
|
7
|
+
super();
|
|
8
|
+
this.attachShadow({ mode: 'open' });
|
|
9
|
+
const assetLocation = document.body.hasAttribute('data-assets-location')
|
|
10
|
+
? document.body.getAttribute('data-assets-location')
|
|
11
|
+
: '/assets';
|
|
12
|
+
const coreCSS = document.body.hasAttribute('data-core-css')
|
|
13
|
+
? document.body.getAttribute('data-core-css')
|
|
14
|
+
: `${assetLocation}/css/core.min.css`;
|
|
15
|
+
const template = document.createElement('template');
|
|
16
|
+
template.innerHTML = `
|
|
17
|
+
<style>
|
|
18
|
+
@import "${coreCSS}";
|
|
19
|
+
</style>
|
|
20
|
+
<div class="milestone-wrap" part="milestone-wrap">
|
|
21
|
+
<slot name="milestone-intro" class="milestone-intro" part="milestone-intro"></slot>
|
|
22
|
+
<slot>
|
|
23
|
+
<div class="task-wrap" part="milestone-task-wrap"></div>
|
|
24
|
+
</slot>
|
|
25
|
+
</div>
|
|
26
|
+
`;
|
|
27
|
+
(_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));
|
|
28
|
+
}
|
|
29
|
+
connectedCallback() {
|
|
30
|
+
const milestoneComponent = this;
|
|
31
|
+
trackComponent(milestoneComponent, 'iam-milestone', [
|
|
32
|
+
'milestone-item-closed',
|
|
33
|
+
'milestone-item-opened',
|
|
34
|
+
]);
|
|
35
|
+
milestone(this);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
export default iamMilestone;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* iamKey v7.4.0
|
|
3
|
+
* Copyright 2022-2025 iamproperty
|
|
4
|
+
*/const l=t=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:t})},m=(t,n,a)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:n}),a.forEach(e=>{t.addEventListener(e,function(s){const d={event:e,element:n,target:s.target};Object.keys(s.detail).forEach(o=>{const i=s.detail[o];d[o]=i}),window.dataLayer.push(d)})}),!0),p=function(t){const n=t.dataset.status;if(!n)return;const a=t.shadowRoot.querySelector(".milestone-wrap"),e=document.createElement("span");e.setAttribute("part","status"),e.classList.add("milestone-status"),e.innerHTML=`${n} Step`,n==="Current"&&t.classList.add("current"),a.insertAdjacentElement("afterbegin",e)},u=function(t){const n=t.shadowRoot.querySelector(".task-wrap"),a=t.dataset.items?JSON.parse(t.dataset.items):[];a.length&&(a.forEach(e=>{const s=document.createElement("details"),d=document.createElement("summary"),o=document.createElement("div"),i=document.createElement("p");o.classList.add("task-details"),d.innerHTML=e.name,e.date_completed&&d.classList.add("complete"),s.appendChild(d),e.description&&(i.innerHTML=e.description,o.appendChild(i)),e.actions.length&&o.appendChild(h(e.actions,d)),s.appendChild(o),n.insertAdjacentElement("beforeend",s),s.addEventListener("click",()=>{s?.hasAttribute("open")?r("milestone-item-closed",e.name,t):r("milestone-item-opened",e.name,t)})}),t.appendChild(n))},r=function(t,n,a){const e=new CustomEvent(t,{detail:{title:n}});a.dispatchEvent(e)},h=function(t,n){const a=document.createElement("ul"),e=t.length,d=t.filter(o=>o.date_completed).length||0;if(!(e<1))return n.innerHTML+=` (${d}/${e})`,t.forEach(o=>{const i=document.createElement("li"),c=document.createElement("span");o.date_completed&&(i.classList.add("complete"),c.classList.add("action-date"),c.innerHTML=o.date_completed),i.innerHTML=o.action,i.appendChild(c),a.appendChild(i)}),a},w=function(t){p(t),u(t)};l("iam-milestone");class L extends HTMLElement{constructor(){var n;super(),this.attachShadow({mode:"open"});const a=document.body.hasAttribute("data-assets-location")?document.body.getAttribute("data-assets-location"):"/assets",e=document.body.hasAttribute("data-core-css")?document.body.getAttribute("data-core-css"):`${a}/css/core.min.css`,s=document.createElement("template");s.innerHTML=`
|
|
5
|
+
<style>
|
|
6
|
+
@import "${e}";
|
|
7
|
+
</style>
|
|
8
|
+
<div class="milestone-wrap" part="milestone-wrap">
|
|
9
|
+
<slot name="milestone-intro" class="milestone-intro" part="milestone-intro"></slot>
|
|
10
|
+
<slot>
|
|
11
|
+
<div class="task-wrap" part="milestone-task-wrap"></div>
|
|
12
|
+
</slot>
|
|
13
|
+
</div>
|
|
14
|
+
`,(n=this.shadowRoot)===null||n===void 0||n.appendChild(s.content.cloneNode(!0))}connectedCallback(){m(this,"iam-milestone",["milestone-item-closed","milestone-item-opened"]),w(this)}}export{L as default};
|
|
15
|
+
//# sourceMappingURL=milestone.component.min.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"milestone.component.min.js","sources":["../_global.js","../../modules/milestone.js","milestone.component.js"],"sourcesContent":["export const trackComponentRegistered = (componentName) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementRegistered',\n element: componentName,\n });\n};\nexport const trackComponent = (component, componentName, trackEvents) => {\n // Data layer Web component created\n window.dataLayer = window.dataLayer || [];\n window.dataLayer.push({\n event: 'customElementAdded',\n element: componentName,\n });\n trackEvents.forEach((eventName) => {\n component.addEventListener(eventName, function (event) {\n const eventDetails = {\n event: eventName,\n element: componentName,\n target: event.target,\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","export const setStatus = function (milestoneElement) {\n const status = milestoneElement.dataset.status;\n if (!status) {\n return;\n }\n const milestoneWrap = milestoneElement.shadowRoot.querySelector('.milestone-wrap');\n const statusTag = document.createElement('span');\n statusTag.setAttribute('part', 'status');\n statusTag.classList.add('milestone-status');\n statusTag.innerHTML = `${status} Step`;\n if (status === 'Current') {\n milestoneElement.classList.add('current');\n }\n milestoneWrap.insertAdjacentElement('afterbegin', statusTag);\n};\nexport const getMilestoneTasks = function (milestoneElement) {\n const taskWrap = milestoneElement.shadowRoot.querySelector('.task-wrap');\n const tasks = milestoneElement.dataset.items ? JSON.parse(milestoneElement.dataset.items) : [];\n if (!tasks.length) {\n return;\n }\n tasks.forEach(task => {\n const taskItem = document.createElement('details');\n const taskName = document.createElement('summary');\n const detailsWrap = document.createElement('div');\n const taskDescription = document.createElement('p');\n detailsWrap.classList.add('task-details');\n taskName.innerHTML = task.name;\n if (task.date_completed) {\n taskName.classList.add('complete');\n }\n taskItem.appendChild(taskName);\n if (task.description) {\n taskDescription.innerHTML = task.description;\n detailsWrap.appendChild(taskDescription);\n }\n if (task.actions.length) {\n detailsWrap.appendChild(getSubtasks(task.actions, taskName));\n }\n taskItem.appendChild(detailsWrap);\n taskWrap.insertAdjacentElement('beforeend', taskItem);\n // Fire tracking events\n taskItem.addEventListener('click', () => {\n if (taskItem === null || taskItem === void 0 ? void 0 : taskItem.hasAttribute('open')) {\n itemInteractionEvent('milestone-item-closed', task.name, milestoneElement);\n }\n else {\n itemInteractionEvent('milestone-item-opened', task.name, milestoneElement);\n }\n });\n });\n milestoneElement.appendChild(taskWrap);\n};\nconst itemInteractionEvent = function (eventName, taskName, element) {\n const customEvent = new CustomEvent(eventName, {\n detail: {\n title: taskName,\n },\n });\n element.dispatchEvent(customEvent);\n};\nconst getSubtasks = function (actions, taskName) {\n const actionsWrap = document.createElement('ul');\n const totalCount = actions.length;\n const completed = actions.filter((action) => action.date_completed);\n const completedCount = completed.length || 0;\n if (totalCount < 1) {\n return;\n }\n taskName.innerHTML += ` (${completedCount}/${totalCount})`;\n actions.forEach(action => {\n const actionItem = document.createElement('li');\n const actionCompletedDate = document.createElement('span');\n if (action.date_completed) {\n actionItem.classList.add('complete');\n actionCompletedDate.classList.add('action-date');\n actionCompletedDate.innerHTML = action.date_completed;\n }\n actionItem.innerHTML = action.action;\n actionItem.appendChild(actionCompletedDate);\n actionsWrap.appendChild(actionItem);\n });\n return actionsWrap;\n};\nconst milestone = function (milestoneElement) {\n setStatus(milestoneElement);\n getMilestoneTasks(milestoneElement);\n};\nexport default milestone;\n","import { trackComponent, trackComponentRegistered } from '../_global.js';\nimport milestone from '../../modules/milestone.js';\ntrackComponentRegistered('iam-milestone');\nclass iamMilestone extends HTMLElement {\n constructor() {\n var _a;\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css')\n ? document.body.getAttribute('data-core-css')\n : `${assetLocation}/css/core.min.css`;\n const template = document.createElement('template');\n template.innerHTML = `\r\n <style>\r\n @import \"${coreCSS}\";\r\n </style>\r\n <div class=\"milestone-wrap\" part=\"milestone-wrap\">\r\n <slot name=\"milestone-intro\" class=\"milestone-intro\" part=\"milestone-intro\"></slot>\r\n <slot>\r\n <div class=\"task-wrap\" part=\"milestone-task-wrap\"></div>\r\n </slot>\r\n </div>\r\n `;\n (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const milestoneComponent = this;\n trackComponent(milestoneComponent, 'iam-milestone', [\n 'milestone-item-closed',\n 'milestone-item-opened',\n ]);\n milestone(this);\n }\n}\nexport default iamMilestone;\n"],"names":["trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","event","eventDetails","eventKey","eventDetail","setStatus","milestoneElement","status","milestoneWrap","statusTag","getMilestoneTasks","taskWrap","tasks","task","taskItem","taskName","detailsWrap","taskDescription","getSubtasks","itemInteractionEvent","element","customEvent","actions","actionsWrap","totalCount","completedCount","action","actionItem","actionCompletedDate","milestone","iamMilestone","_a","assetLocation","coreCSS","template"],"mappings":"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"}
|