@iamproperty/components 5.7.1-beta6 → 6.1.0--beta
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/bootstrap/README.md +8 -7
- package/assets/bootstrap/js/index.esm.js +19 -0
- package/assets/bootstrap/js/index.umd.js +34 -0
- package/assets/bootstrap/js/src/alert.js +1 -1
- package/assets/bootstrap/js/src/base-component.js +2 -2
- package/assets/bootstrap/js/src/button.js +1 -1
- package/assets/bootstrap/js/src/carousel.js +1 -1
- package/assets/bootstrap/js/src/collapse.js +1 -1
- package/assets/bootstrap/js/src/dom/data.js +1 -1
- package/assets/bootstrap/js/src/dom/event-handler.js +1 -1
- package/assets/bootstrap/js/src/dom/manipulator.js +1 -1
- package/assets/bootstrap/js/src/dom/selector-engine.js +1 -1
- package/assets/bootstrap/js/src/dropdown.js +3 -12
- package/assets/bootstrap/js/src/modal.js +13 -17
- package/assets/bootstrap/js/src/offcanvas.js +1 -1
- package/assets/bootstrap/js/src/popover.js +1 -1
- package/assets/bootstrap/js/src/scrollspy.js +10 -14
- package/assets/bootstrap/js/src/tab.js +4 -2
- package/assets/bootstrap/js/src/toast.js +4 -9
- package/assets/bootstrap/js/src/tooltip.js +50 -32
- package/assets/bootstrap/js/src/util/backdrop.js +1 -1
- package/assets/bootstrap/js/src/util/component-functions.js +1 -1
- package/assets/bootstrap/js/src/util/config.js +1 -1
- package/assets/bootstrap/js/src/util/focustrap.js +1 -1
- package/assets/bootstrap/js/src/util/index.js +1 -1
- package/assets/bootstrap/js/src/util/sanitizer.js +1 -1
- package/assets/bootstrap/js/src/util/scrollbar.js +1 -1
- package/assets/bootstrap/js/src/util/swipe.js +1 -1
- package/assets/bootstrap/js/src/util/template-factory.js +1 -1
- package/assets/bootstrap/package.json +27 -28
- package/assets/bootstrap/scss/_accordion.scss +4 -7
- package/assets/bootstrap/scss/_button-group.scss +1 -1
- package/assets/bootstrap/scss/_buttons.scss +7 -28
- package/assets/bootstrap/scss/_carousel.scss +3 -0
- package/assets/bootstrap/scss/_dropdown.scss +1 -2
- package/assets/bootstrap/scss/_functions.scss +2 -2
- package/assets/bootstrap/scss/_list-group.scss +5 -6
- package/assets/bootstrap/scss/_modal.scss +1 -1
- package/assets/bootstrap/scss/_nav.scss +2 -2
- package/assets/bootstrap/scss/_navbar.scss +0 -2
- package/assets/bootstrap/scss/_offcanvas.scss +4 -5
- package/assets/bootstrap/scss/_pagination.scss +1 -1
- package/assets/bootstrap/scss/_popover.scss +5 -5
- package/assets/bootstrap/scss/_toasts.scss +2 -5
- package/assets/bootstrap/scss/_variables-dark.scss +87 -0
- package/assets/bootstrap/scss/_variables.scss +17 -18
- package/assets/bootstrap/scss/bootstrap-utilities.scss +0 -3
- package/assets/bootstrap/scss/forms/_floating-labels.scss +0 -1
- package/assets/bootstrap/scss/forms/_input-group.scss +4 -7
- package/assets/bootstrap/scss/helpers/_focus-ring.scss +5 -0
- package/assets/bootstrap/scss/helpers/_icon-link.scss +25 -0
- package/assets/bootstrap/scss/mixins/_banner.scss +2 -2
- package/assets/bootstrap/scss/mixins/_color-mode.scss +21 -0
- package/assets/bootstrap/scss/mixins/_forms.scss +10 -10
- package/assets/bootstrap/scss/mixins/_table-variants.scss +2 -2
- package/assets/bootstrap/scss/mixins/_utilities.scss +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/card.component.css +1 -0
- package/assets/css/components/card.component.css.map +1 -0
- package/assets/css/components/card.module.css +1 -0
- package/assets/css/components/card.module.css.map +1 -0
- package/assets/css/components/charts.config.css +1 -1
- package/assets/css/components/charts.config.css.map +1 -1
- package/assets/css/components/charts.css +1 -1
- package/assets/css/components/charts.css.map +1 -1
- package/assets/css/components/charts.module.css +1 -1
- package/assets/css/components/charts.module.css.map +1 -1
- package/assets/css/components/filter-card.component.css +1 -0
- package/assets/css/components/filter-card.component.css.map +1 -0
- package/assets/css/components/multiselect.preload.css +1 -1
- package/assets/css/components/multiselect.preload.css.map +1 -1
- package/assets/css/components/record-card.component.css +1 -0
- package/assets/css/components/record-card.component.css.map +1 -0
- package/assets/css/components/timeline.css +1 -1
- package/assets/css/components/timeline.css.map +1 -1
- package/assets/css/components/video-card.component.css +1 -0
- package/assets/css/components/video-card.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/style.min.css +1 -1
- package/assets/css/style.min.css.map +1 -1
- package/assets/js/components/_global.js +32 -0
- package/assets/js/components/accordion/accordion.component.min.js +1 -1
- package/assets/js/components/actionbar/actionbar.component.min.js +5 -5
- 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/address-lookup/address-lookup.component.min.js.map +1 -1
- package/assets/js/components/applied-filters/applied-filters.component.min.js +1 -1
- package/assets/js/components/applied-filters/applied-filters.component.min.js.map +1 -1
- package/assets/js/components/barchart/barchart.component.js +8 -7
- package/assets/js/components/barchart/barchart.component.min.js +6 -4
- package/assets/js/components/barchart/barchart.component.min.js.map +1 -1
- package/assets/js/components/card/card.component.js +92 -154
- package/assets/js/components/card/card.component.min.js +26 -31
- package/assets/js/components/card/card.component.min.js.map +1 -1
- package/assets/js/components/carousel/carousel.component.min.js +1 -1
- package/assets/js/components/carousel/carousel.component.min.js.map +1 -1
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js +1 -1
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js.map +1 -1
- package/assets/js/components/fileupload/fileupload.component.min.js +1 -1
- package/assets/js/components/fileupload/fileupload.component.min.js.map +1 -1
- package/assets/js/components/filter-card/filter-card.component.js +71 -0
- package/assets/js/components/filter-card/filter-card.component.min.js +27 -0
- package/assets/js/components/filter-card/filter-card.component.min.js.map +1 -0
- 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/header/header.component.min.js.map +1 -1
- package/assets/js/components/inline-edit/inline-edit.component.min.js +1 -1
- package/assets/js/components/inline-edit/inline-edit.component.min.js.map +1 -1
- package/assets/js/components/marketing/marketing.component.min.js +1 -1
- package/assets/js/components/marketing/marketing.component.min.js.map +1 -1
- package/assets/js/components/multiselect/multiselect.component.min.js +1 -1
- package/assets/js/components/multiselect/multiselect.component.min.js.map +1 -1
- package/assets/js/components/nav/nav.component.min.js +1 -1
- package/assets/js/components/nav/nav.component.min.js.map +1 -1
- package/assets/js/components/notification/notification.component.min.js +1 -1
- 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/pagination/pagination.component.min.js.map +1 -1
- package/assets/js/components/record-card/record-card.component.js +69 -0
- package/assets/js/components/record-card/record-card.component.min.js +27 -0
- package/assets/js/components/record-card/record-card.component.min.js.map +1 -0
- package/assets/js/components/search/search.component.min.js +1 -1
- package/assets/js/components/slider/slider.component.min.js +1 -1
- package/assets/js/components/slider/slider.component.min.js.map +1 -1
- package/assets/js/components/table/table.component.min.js +2 -2
- package/assets/js/components/table/table.component.min.js.map +1 -1
- package/assets/js/components/tabs/tabs.component.min.js +1 -1
- package/assets/js/components/tabs/tabs.component.min.js.map +1 -1
- package/assets/js/components/video-card/video-card.component.js +176 -0
- package/assets/js/components/video-card/video-card.component.min.js +30 -0
- package/assets/js/components/video-card/video-card.component.min.js.map +1 -0
- package/assets/js/components.bundle.js +5 -0
- package/assets/js/components.bundle.js.map +1 -0
- package/assets/js/components.js +30 -0
- package/assets/js/modules/card.module.js +33 -0
- package/assets/js/modules/chart.js +2 -2
- package/assets/js/modules/chart.module.js +25 -60
- package/assets/js/modules/dialogs.js +0 -6
- package/assets/js/modules/table.js +1 -1
- package/assets/js/scripts.bundle.js +3 -194
- 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 +17 -0
- package/assets/js/tests/chart.spec.js +57 -0
- package/assets/js/tests/filterlist.spec.js +1 -1
- package/assets/sass/_components.scss +81 -1
- package/assets/sass/_corefiles.scss +4 -10
- package/assets/sass/_elements.scss +2 -0
- package/assets/sass/components/card.component.scss +229 -0
- package/assets/sass/components/card.module.scss +154 -0
- package/assets/sass/components/charts.config.scss +3 -0
- package/assets/sass/components/charts.module.scss +18 -7
- package/assets/sass/components/filter-card.component.scss +106 -0
- package/assets/sass/components/multiselect.preload.scss +7 -0
- package/assets/sass/components/record-card.component.scss +204 -0
- package/assets/sass/components/video-card.component.scss +80 -0
- package/assets/sass/components.reset.scss +5 -43
- package/assets/sass/elements/badge-tag.scss +5 -1
- package/assets/sass/elements/buttons.scss +3 -0
- package/assets/sass/elements/dialog.scss +2 -744
- package/assets/sass/elements/forms.scss +5 -0
- package/assets/sass/elements/media.scss +0 -38
- package/assets/sass/elements/modal.scss +553 -0
- package/assets/sass/elements/popover.scss +207 -0
- package/assets/sass/foundations/reboot.scss +2 -2
- package/assets/sass/foundations/root.scss +0 -1
- package/assets/ts/components/_global.ts +40 -0
- package/assets/ts/components/barchart/barchart.component.ts +9 -17
- package/assets/ts/components/card/card.component.ts +94 -192
- package/assets/ts/components/filter-card/filter-card.component.ts +81 -0
- package/assets/ts/components/record-card/record-card.component.ts +82 -0
- package/assets/ts/components/video-card/video-card.component.ts +227 -0
- package/assets/ts/components.ts +38 -0
- package/assets/ts/modules/card.module.ts +43 -0
- package/assets/ts/modules/chart.module.ts +25 -74
- package/assets/ts/modules/dialogs.ts +0 -8
- package/assets/ts/modules/table.ts +1 -1
- package/assets/ts/scripts.ts +22 -0
- package/assets/ts/tests/chart.spec.ts +77 -0
- package/assets/ts/tests/filterlist.spec.ts +1 -1
- package/dist/components.es.js +201 -201
- package/dist/components.umd.js +76 -81
- package/package.json +8 -7
- package/src/components/BarChart/BarChart.vue +2 -2
- package/src/components/FilterCard/FilterCard.vue +25 -0
- package/src/components/RecordCard/RecordCard.vue +25 -0
- package/src/components/VideoCard/VideoCard.vue +25 -0
- package/assets/css/components/card.css +0 -1
- package/assets/css/components/card.css.map +0 -1
- package/assets/css/components/card.global.css +0 -1
- package/assets/css/components/card.global.css.map +0 -1
- package/assets/css/components/card.preload.css +0 -1
- package/assets/css/components/card.preload.css.map +0 -1
- package/assets/js/bundle.js +0 -74
- package/assets/js/dynamic.js +0 -80
- package/assets/js/dynamic.min.js +0 -18
- package/assets/js/dynamic.min.js.map +0 -1
- package/assets/js/flat-components.js +0 -84
- package/assets/js/modules/youtubevideo.js +0 -106
- package/assets/sass/components/card.global.scss +0 -102
- package/assets/sass/components/card.preload.scss +0 -8
- package/assets/sass/components/card.scss +0 -606
- package/assets/ts/bundle.ts +0 -94
- package/assets/ts/components/barchart/README.md +0 -37
- package/assets/ts/components/card/README.md +0 -39
- package/assets/ts/dynamic.ts +0 -107
- package/assets/ts/flat-components.ts +0 -106
- package/assets/ts/modules/youtubevideo.ts +0 -141
- package/src/foundations/YoutubeVideo/README.md +0 -11
- package/src/foundations/YoutubeVideo/YoutubeVideo.vue +0 -24
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey
|
|
2
|
+
* iamKey v6.1.0--beta
|
|
3
3
|
* Copyright 2022-2024 iamproperty
|
|
4
|
-
*/const
|
|
4
|
+
*/const x=(e,t)=>{for(let a=1;a<=10;a++){if(e.hasAttribute(`data-colour-${a}`)){let i=e.getAttribute(`data-colour-${a}`);e.style.setProperty(`--chart-colour-${a}`,`var(--chart-colour-${i})`),e.style.setProperty(`--chart-colour-${a}-hover`,`var(--chart-colour-${i}-hover)`)}Array.from(t.querySelectorAll(`[data-colour-${a}]`)).forEach(i=>{let r=i.getAttribute(`data-colour-${a}`);i.style.setProperty(`--chart-colour-${a}-set`,`var(--chart-colour-${r})`),i.style.setProperty(`--chart-colour-${a}-hover`,`var(--chart-colour-${r}-hover)`)})}return!0},u=(e,t,a)=>{const i=t.querySelector(".chart__key");i.innerHTML="";const r=t.querySelector(".chart__guidelines");r.innerHTML="";const o=t.querySelector(".chart__yaxis");o.innerHTML="",Array.from(t.querySelectorAll(':scope > input[type="checkbox"],:scope > input[type="radio"]')).map(n=>{n.remove()});let{xaxis:c}=d(e);return _(e,a),S(t,a,i),q(e,r),M(e,o),c&&F(t),!0},k=function(e,t){let a=t.querySelector(".chart");a.addEventListener("mousemove",c=>{if(c&&c.target instanceof HTMLElement&&c.target.closest("td:not(:first-child")){var n=c.target.closest("td:not(:first-child").getBoundingClientRect();let s=c.clientX-n.left,l=c.clientY-n.top;a.setAttribute("style",`--cursor-x: ${s}px; --cursor-y: ${l}px;`)}});let i=t.querySelectorAll("label");Array.from(i).forEach(c=>{t.querySelector(`input#${c.getAttribute("for")}`).checked?c.setAttribute("part","key-checked"):c.setAttribute("part","key-unchecked")});let r=e.querySelector("table"),o=t.querySelector("table");t.addEventListener("change",function(c){let n=c.target;const h=new CustomEvent("view-change",{detail:{"data-dataset":n.getAttribute("data-dataset"),label:n.getAttribute("data-label"),checked:n.checked}});e.dispatchEvent(h),Array.from(i).forEach(s=>{var l;!((l=t.querySelector(`input#${s.getAttribute("for")}`))===null||l===void 0)&&l.checked?s.setAttribute("part","key-checked"):s.setAttribute("part","key-unchecked")}),o.innerHTML=r.innerHTML,_(e,o)})},A=function(e,t){let a=e.querySelector("table"),i=t.querySelector("table");const r=(h,s)=>{s.disconnect(),n.disconnect();for(const l of h)(l.attributeName=="class"||l.type==="attributes"||l.type==="attributes")&&(i.innerHTML=a.innerHTML,u(e,t,i));s.observe(a,{characterData:!0,subtree:!0}),n.observe(e,{attributes:!0})},o=(h,s)=>{s.disconnect(),n.disconnect();for(const l of h)(l.type=="characterData"||l.type=="childList"&&l.addedNodes.length)&&(i.innerHTML=a.innerHTML,u(e,t,i));s.observe(a,{characterData:!0,subtree:!0}),n.observe(e,{attributes:!0})};let c=new MutationObserver(o),n=new MutationObserver(r);return c.observe(a,{characterData:!0,subtree:!0}),n.observe(e,{attributes:!0}),!0},d=function(e){let t=e.shadowRoot.querySelector(".chart__wrapper table"),a=e.hasAttribute("data-min")?e.getAttribute("data-min"):0,i=e.hasAttribute("data-max")?e.getAttribute("data-max"):z(e,t),r=e.hasAttribute("data-yaxis")?e.getAttribute("data-yaxis").split(","):[],o=e.hasAttribute("data-guidelines")?e.getAttribute("data-guidelines").split(","):[],c=e.hasAttribute("data-xaxis")?e.getAttribute("data-xaxis").split(","):null;return{min:a,max:i,yaxis:r,xaxis:c,guidelines:o}};function z(e,t){const a=e.classList.contains("chart--stacked")?"tbody tr":"tbody td:not(:first-child)";let i=Array.from(t.querySelectorAll(a)).map(o=>o.getAttribute("data-numeric")),r=Math.max(...i);return Math.ceil(r)}const b=function(e,t,a,i){let r=String(e);r=r.replace("\xA3",""),r=r.replace("%",""),r=r.replace(",",""),r=Number.parseFloat(r);let o=(r-t)/(a-t)*100,c=o,n=0;return i&&i!=0&&(n=(i-t)/(a-t)*100),t<0&&(n=Math.abs(t/(a-t)*100),r<0?(o=n-o,n=n-o,c=n):(o=o-n,c=o+n)),{percent:o,axis:c,bottom:n}},_=function(e,t){Array.from(t.querySelectorAll("tbody tr")).forEach(r=>{let o=0;Array.from(r.querySelectorAll("td:not(:first-child)")).forEach(c=>{let n=parseFloat(c.textContent.replace("\xA3","").replace("%","").replace(",",""));c.setAttribute("data-numeric",n),c.setAttribute("data-value",c.textContent),getComputedStyle(c).display!="none"&&(o+=n)}),r.setAttribute("data-numeric",o)});let{min:a,max:i}=d(e);Array.from(t.querySelectorAll("tbody tr")).forEach((r,o)=>{let c=r.querySelector("td:first-child, th:first-child")?r.querySelector("td:first-child, th:first-child").textContent:"";r.setAttribute("part","group");let n=(r.getAttribute("data-numeric")-a)/(i-a)*100;r.style.setProperty("--percent",`${n}%`),Array.from(r.querySelectorAll("td:not([data-label])")).forEach((l,p)=>{p==0?l.setAttribute("part","xaxis-label"):l.setAttribute("part","value"),r.querySelectorAll("td").length>2&&l.setAttribute("data-label",t.querySelectorAll("thead th")[p].textContent)});let h=r.hasAttribute("data-min")?r.getAttribute("data-min"):a,s=r.hasAttribute("data-max")?r.getAttribute("data-max"):i;if(h<0){let l=Math.abs(h/(s-h)*100);e.setAttribute("style",`--min-bottom: ${l}%;`)}r.style.setProperty("--row-index",o+1),Array.from(r.querySelectorAll('td[data-numeric]:not([data-label="Min"]):not([data-label="Max"]):not(:first-child)')).forEach(l=>{if(getComputedStyle(l).display=="none")return;const f=l.innerHTML,v=Number.parseFloat(l.getAttribute("data-numeric")),m=Number.parseFloat(l.getAttribute("data-start"));if(l.querySelector("span[data-group]")||(l.innerHTML=`<span data-group="${c}" ${l.hasAttribute("data-label")?`data-label="${l.getAttribute("data-label")}"`:""} part="popover">${f}</span>`),!l.hasAttribute("style")){let{percent:y,bottom:g,axis:w}=b(v,h,s,m);l.setAttribute("data-percent",y),l.setAttribute("style",`--bottom:${g}%;--percent:${y}%;--axis:${w}%;`)}})})},C=function(e){let t=e.querySelector(".chart__wrapper"),a=e.querySelector(".chart__spacer span"),i=e.querySelector(".chart table"),r="";Array.from(i.querySelectorAll("tbody tr td:first-child")).forEach(o=>{typeof o.textContent<"u"&&o.textContent.length>r.length&&(r=o.textContent)}),t.setAttribute("data-longest-label",r),a.innerHTML=r},$=function(e){let t=e.querySelector(".chart__wrapper"),a=e.querySelector(".chart table"),i="";Array.from(a.querySelectorAll("tbody tr td:not(:first-child) span")).forEach(r=>{typeof r.textContent<"u"&&r.textContent.length>i.length&&(i=r.textContent)}),t.setAttribute("data-longest-value",i)},S=function(e,t,a){const i=`chart-${Date.now()+(Math.floor(Math.random()*100)+1)}`;let r,o=Array.from(t.querySelectorAll("thead th"));return o.forEach((c,n)=>{n!=0&&(r=L(i,n,c.textContent,a,e,r)),n==50&&(o.length=n+1)}),!0};function L(e,t,a,i,r,o){let c=document.createElement("input");c.setAttribute("name",`${e}-dataset-${t}`),c.setAttribute("id",`${e}-dataset-${t}`),c.setAttribute("data-dataset",`${t}`),c.setAttribute("data-label",`${a}`),c.checked=!0,c.setAttribute("type","checkbox"),t==1?r.prepend(c):r.insertBefore(c,o.nextSibling),o=c;let n=document.createElement("label");return n.setAttribute("class","key btn btn-action"),n.setAttribute("for",`${e}-dataset-${t}`),n.setAttribute("data-label",`${a}`),n.setAttribute("part","key"),n.innerHTML=`${a}`,i.append(n),o}const q=function(e,t){let{min:a,max:i,yaxis:r,guidelines:o}=d(e);o.length||(o=r),t.innerHTML="";for(var c=0;c<o.length;c++){let n=parseFloat(o[c].replace("\xA3","").replace("%","").replace(",","")),{axis:h}=b(n,a,i);t.innerHTML+=`<div class="guideline" style="--percent:${h}%;">${r.indexOf(o[c])!=-1?`<span>${o[c]}</span>`:""}</div>`}},M=function(e,t){let{min:a,max:i,yaxis:r}=d(e);t.innerHTML="";for(var o=0;o<r.length;o++){let c=parseFloat(r[o].replace("\xA3","").replace("%","")),{axis:n}=b(c,a,i);t.innerHTML+=`<div class="axis__point" style="--percent:${n}%;"><span>${r[o]}</span></div>`}},F=function(e){const t=e.querySelector(".chart");let a=e.querySelector(".chart__xaxis");a||(a=document.createElement("div"),a.setAttribute("class","chart__xaxis")),t.prepend(a)},T=function(e){const t=e.querySelectorAll("thead th[title], tbody th[title]:first-child, tbody td[title]:first-child");Array.from(t).forEach(a=>{let i=`tooltip-${Date.now()}-${Math.floor(Math.random()*100)}`;a.innerHTML=`<button class="tooltip" popovertarget="${i}" part="tooltip" style="anchor-name: --${i};">${a.textContent}</button><span id="${i}" style="position-anchor: --${i};" popover part="tooltip__content" class="tooltip__content">${a.getAttribute("title")}</span>`})},D=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(i=>{e.addEventListener(i,function(r){let o={event:i,element:t,target:r.target};Object.keys(r.detail).forEach(c=>{const n=r.detail[c];o[c]=n}),window.dataLayer.push(o)})}),!0);D("iam-barchart");class E extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const t=document.createElement("template");t.innerHTML=`
|
|
5
5
|
<style>
|
|
6
|
-
: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(10n-9),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-8){--chart-colour: var(--chart-colour-1-set);--chart-colour-hover: var(--chart-colour-1-hover)}.chart__key .key:nth-child(10n-8),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-7){--chart-colour: var(--chart-colour-2-set);--chart-colour-hover: var(--chart-colour-2-hover)}.chart__key .key:nth-child(10n-7),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-6){--chart-colour: var(--chart-colour-3-set);--chart-colour-hover: var(--chart-colour-3-hover)}.chart__key .key:nth-child(10n-6),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-5){--chart-colour: var(--chart-colour-4-set);--chart-colour-hover: var(--chart-colour-4-hover)}.chart__key .key:nth-child(10n-5),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-4){--chart-colour: var(--chart-colour-5-set);--chart-colour-hover: var(--chart-colour-5-hover)}.chart__key .key:nth-child(10n-4),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-3){--chart-colour: var(--chart-colour-6-set);--chart-colour-hover: var(--chart-colour-6-hover)}.chart__key .key:nth-child(10n-3),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-2){--chart-colour: var(--chart-colour-7-set);--chart-colour-hover: var(--chart-colour-7-hover)}.chart__key .key:nth-child(10n-2),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-1){--chart-colour: var(--chart-colour-8-set);--chart-colour-hover: var(--chart-colour-8-hover)}.chart__key .key:nth-child(10n-1),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-0){--chart-colour: var(--chart-colour-9-set);--chart-colour-hover: var(--chart-colour-9-hover)}::slotted(table){display:none !important}:host{container-type:inline-size;margin-bottom:2rem;display:block}.chart__outer{display:flex;flex-direction:column;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;--pie-size: calc(50% - 1.4rem);--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);--pie-size: calc(33.333% - 1.4rem);--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;--pie-size: calc(25% - 1.5rem);--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}.chart__key .key:before{content:"";height:.8em;width:.8em;margin-right:.3em;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]: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}: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:rgba(255,255,255,.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)}.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, center);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) span{position:absolute;top:var(--cursor-y, 50%);left:var(--cursor-x, 50%);font-size:var(--label-size);line-height:1.2;transform:translate(-50%, 0);background:var(--chart-details-bg, var(--colour-canvas-2, Canvas));opacity:0;pointer-events:none;padding:.5rem;border-radius:.5rem;margin-bottom:.25rem;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%)}.chart__wrapper table tbody tr td:not(:first-child) span::before{content:attr(data-group) "\\a"}.chart__wrapper table tbody tr td:not(:first-child) span[data-label]::before{content:attr(data-group) "\\a" attr(data-label) "\\a"}.chart__wrapper table tbody tr td:not(:first-child):hover span{opacity:1;z-index:var(--index-above)}.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}:host(.chart--horizontal) .chart__outer tbody{--chart-direction: 90deg;--chart-day-bg-pos: calc(var(--single-day) * 7) 100%;--bar-gap: 0}:host(.chart--horizontal) .chart__outer .chart__guidelines{position:absolute}:host(.chart--horizontal) .chart__outer .chart__guidelines .guideline{bottom:auto;left:var(--percent);height:100%;border-left:1px dashed #eee;width:0}:host(.chart--horizontal) .chart__outer .chart__guidelines .guideline span{display:block;font-size:var(--label-size);position:absolute;top:100%;transform:translate(-50%, 0.2em);opacity:1}:host(.chart--horizontal) .chart__outer .chart__yaxis{display:none}:host(.chart--horizontal) .chart__outer table{padding-top:0}:host(.chart--horizontal) .chart__outer table tbody{flex-direction:column;position:relative}:host(.chart--horizontal) .chart__outer table tbody tr{flex-direction:column;align-items:flex-start;margin-bottom:.5rem;padding:0}:host(.chart--horizontal) .chart__outer table tbody tr td{height:var(--bar-height, 1.5rem);bottom:0;left:var(--bottom, 0%);width:var(--comparison, var(--percent));max-width:100%;border-top-left-radius:0;border-bottom-right-radius:4px}:host(.chart--horizontal) .chart__outer table tbody tr td:first-child{position:static;transform:none;display:block !important;height:var(--bar-height, 1.5rem);line-height:var(--bar-height, 1.5rem);max-width:var(--xaxis-max-width, none)}:host(.chart--horizontal) .chart__outer table tbody tr td:first-child>*:not([popover]){max-width:100%;text-overflow:ellipsis;overflow:hidden}:host(.chart--horizontal) .chart__outer .chart__wrapper[data-longest-label]:before{display:block;content:attr(data-longest-label);font-size:var(--label-size);padding-right:.5em;opacity:0;pointer-events:none;white-space:nowrap;width:var(--xaxis-max-width, none)}:host(.chart--horizontal) .chart__outer:has(td .tooltip) .chart__wrapper[data-longest-label]:before{padding-right:2em;width:calc(var(--xaxis-max-width, none) - 1rem)}:host(.chart--horizontal) .chart__outer .chart__wrapper[data-longest-label] table tbody tr td:first-child{position:absolute;display:block !important;max-height:1.5rem;z-index:var(--index-above);top:0%;left:auto !important;right:100% !important;padding-right:.5em;width:fit-content}:host(.chart--horizontal) .chart__outer .chart__spacer span{display:none !important}:host(.chart--stacked) .chart__wrapper table tbody tr{--bar-gap: 0;flex-direction:column-reverse;justify-content:flex-start;align-items:center}:host(.chart--stacked) .chart__wrapper table tbody tr td{border-radius:0 !important}:host(.chart--stacked.chart--horizontal) .chart__wrapper table tbody tr{flex-direction:row}:host(.chart--stacked.chart--horizontal) .chart__wrapper table tbody tr::after{content:attr(data-numeric);position:absolute;opacity:1 !important;bottom:100%;left:50%;transform:translate(-50%, 0);display:block !important;height:fit-content;margin:0;bottom:50%;left:calc(var(--percent) + .5rem);transform:translate(0, 50%)}:host(.chart--stacked.chart--horizontal) .chart__wrapper table tbody tr td:after{content:none}.chart--animate.animating.inview{--animation-left: 2s}.chart--animate.animating.inview table tbody tr td:not(:first-child){transition:height 2s ease-out,width 2s ease-out,bottom 2s ease-out,left var(--animation-left) ease-out;transition-delay:calc(var(--row-index)*.1s)}.chart--animate:not(.inview) table tbody tr td:not(:first-child){--bottom: var(--min-bottom, 0%)!important;--percent: 0%!important;--axis: 0%!important;--comparison: 0%!important}.chart--animate.animating table tbody tr td:not(:first-child){overflow:hidden}:host(.chart--display-data) table tbody tr td:not(:first-child):after{content:attr(data-value);position:absolute;opacity:1 !important;bottom:100%;left:50%;transform:translate(-50%, 0);display:block !important;height:fit-content;margin:0}:host(.chart--display-data.chart--horizontal) table tbody tr td:not(:first-child):after{bottom:50%;left:calc(100% + .5rem);transform:translate(0, 50%)}:host(.chart--display-data.chart--horizontal) .chart__wrapper[data-longest-value]:after{display:block;content:attr(data-longest-value);font-size:var(--label-size);padding-left:.5em;opacity:0;pointer-events:none;white-space:nowrap}:host(.chart--display-data.chart--fit-content:not(.chart--horizontal)) .chart__outer{padding-top:1rem}:host(.chart--fit-content:not(.chart--horizontal)){width:100%;display:block}:host(.chart--fit-content:not(.chart--horizontal)) .chart__wrapper{width:fit-content}:host(.chart--fit-content:not(.chart--horizontal)) table{width:fit-content !important;padding-top:0;height:var(--chart-height-resp, 7.5rem)}:host(.chart--fit-content:not(.chart--horizontal)) tbody{position:relative}:host(.chart--fit-content:not(.chart--horizontal)) [part=group]{min-width:fit-content;width:fit-content;max-width:fit-content;padding-right:var(--fc-group-width, 1rem)}:host(.chart--fit-content:not(.chart--horizontal)) [part=value]{min-width:var(--fc-value-width, 0.75rem);width:var(--fc-value-width, 0.75rem);max-width:var(--fc-value-width, 0.75rem)}:host(.chart--fit-content:not(.chart--horizontal).chart--no-scale){--fc-group-width: 1.375rem;--fc-value-width: 1.5rem}:host(.chart--fit-content:not(.chart--horizontal).chart--no-scale) table{height:var(--chart-height-lg-set, 7.5rem)}@container (min-width: 23.4375em){.chart__wrapper{--fc-group-width: 1.375rem;--fc-value-width: 1.5rem}}button.tooltip:after{content:"?";margin-left:.25rem;display:inline-block;border:1px solid currentColor}.tooltip__content[popover]{z-index:var(--index-floating);background:var(--colour-primary);color:var(--colour-white);padding:1.5rem;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.11);white-space:normal;position:fixed;border:none;margin:0;box-sizing:border-box;inset-area:bottom center;overflow:visible;width:calc(anchor-size(width) + var(--container-padding-x) + var(--container-padding-x) + 1.5rem) !important}.tooltip__content[popover]::after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-0.25rem;border-width:.5rem;border-style:solid;border-color:rgba(0,0,0,0) rgba(0,0,0,0) var(--colour-primary) rgba(0,0,0,0);margin-bottom:-1px}/*# sourceMappingURL=assets/css/components/barchart.component.css.map */
|
|
6
|
+
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
7
|
+
|
|
8
|
+
: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(10n-9),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-8){--chart-colour: var(--chart-colour-1-set);--chart-colour-hover: var(--chart-colour-1-hover)}.chart__key .key:nth-child(10n-8),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-7){--chart-colour: var(--chart-colour-2-set);--chart-colour-hover: var(--chart-colour-2-hover)}.chart__key .key:nth-child(10n-7),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-6){--chart-colour: var(--chart-colour-3-set);--chart-colour-hover: var(--chart-colour-3-hover)}.chart__key .key:nth-child(10n-6),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-5){--chart-colour: var(--chart-colour-4-set);--chart-colour-hover: var(--chart-colour-4-hover)}.chart__key .key:nth-child(10n-5),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-4){--chart-colour: var(--chart-colour-5-set);--chart-colour-hover: var(--chart-colour-5-hover)}.chart__key .key:nth-child(10n-4),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-3){--chart-colour: var(--chart-colour-6-set);--chart-colour-hover: var(--chart-colour-6-hover)}.chart__key .key:nth-child(10n-3),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-2){--chart-colour: var(--chart-colour-7-set);--chart-colour-hover: var(--chart-colour-7-hover)}.chart__key .key:nth-child(10n-2),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-1){--chart-colour: var(--chart-colour-8-set);--chart-colour-hover: var(--chart-colour-8-hover)}.chart__key .key:nth-child(10n-1),.chart__outer table tbody tr td:not(:first-child):nth-child(10n-0){--chart-colour: var(--chart-colour-9-set);--chart-colour-hover: var(--chart-colour-9-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;--pie-size: calc(50% - 1.4rem);--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);--pie-size: calc(33.333% - 1.4rem);--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;--pie-size: calc(25% - 1.5rem);--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}.chart__key .key:before{content:"";height:.8em;width:.8em;margin-right:.3em;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}: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)}.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) span{position:absolute;top:var(--cursor-y, 50%);left:var(--cursor-x, 50%);font-size:var(--label-size);line-height:1.2;transform:translate(-50%, 0);background:var(--chart-details-bg, var(--colour-canvas-2, Canvas));opacity:0;pointer-events:none;padding:.5rem;border-radius:.5rem;margin-bottom:.25rem;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%)}.chart__wrapper table tbody tr td:not(:first-child) span::before{content:attr(data-group) "\\a"}.chart__wrapper table tbody tr td:not(:first-child) span[data-label]::before{content:attr(data-group) "\\a" attr(data-label) "\\a"}.chart__wrapper table tbody tr td:not(:first-child):hover span{opacity:1;z-index:var(--index-above)}.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}:host(.chart--horizontal) .chart__outer tbody{--chart-direction: 90deg;--chart-day-bg-pos: calc(var(--single-day) * 7) 100%;--bar-gap: 0}:host(.chart--horizontal) .chart__outer .chart__guidelines{position:absolute}:host(.chart--horizontal) .chart__outer .chart__guidelines .guideline{bottom:auto;left:var(--percent);height:100%;border-left:1px dashed #eee;width:0}:host(.chart--horizontal) .chart__outer .chart__guidelines .guideline span{display:block;font-size:var(--label-size);position:absolute;top:100%;transform:translate(-50%, 0.2em);opacity:1}:host(.chart--horizontal) .chart__outer .chart__yaxis{display:none}:host(.chart--horizontal) .chart__outer table{padding-top:0}:host(.chart--horizontal) .chart__outer table tbody{flex-direction:column;position:relative}:host(.chart--horizontal) .chart__outer table tbody tr{flex-direction:column;align-items:flex-start;margin-bottom:.5rem;padding:0}:host(.chart--horizontal) .chart__outer table tbody tr td{height:var(--bar-height, 1.5rem);bottom:0;left:var(--bottom, 0%);width:var(--comparison, var(--percent));max-width:100%;border-top-left-radius:0;border-bottom-right-radius:4px}:host(.chart--horizontal) .chart__outer table tbody tr td:first-child{position:static;transform:none;display:block !important;height:var(--bar-height, 1.5rem);line-height:var(--bar-height, 1.5rem);max-width:var(--xaxis-max-width, none)}:host(.chart--horizontal) .chart__outer table tbody tr td:first-child>*:not([popover]){max-width:100%;text-overflow:ellipsis;overflow:hidden}:host(.chart--horizontal) .chart__outer .chart__wrapper[data-longest-label]:before{display:block;content:attr(data-longest-label);font-size:var(--label-size);padding-right:.5em;opacity:0;pointer-events:none;white-space:nowrap;width:var(--xaxis-max-width, none)}:host(.chart--horizontal) .chart__outer:has(td .tooltip) .chart__wrapper[data-longest-label]:before{padding-right:2em;width:calc(var(--xaxis-max-width, none) - 1rem)}:host(.chart--horizontal) .chart__outer .chart__wrapper[data-longest-label] table tbody tr td:first-child{position:absolute;display:block !important;max-height:1.5rem;z-index:var(--index-above);top:0%;left:auto !important;right:100% !important;padding-right:.5em;width:fit-content}:host(.chart--horizontal) .chart__outer .chart__spacer span{display:none !important}:host(.chart--stacked) .chart__wrapper table tbody tr{--bar-gap: 0;flex-direction:column-reverse;justify-content:flex-start;align-items:center}:host(.chart--stacked) .chart__wrapper table tbody tr td{border-radius:0 !important}:host(.chart--stacked.chart--horizontal) .chart__wrapper table tbody tr{flex-direction:row}:host(.chart--stacked.chart--horizontal) .chart__wrapper table tbody tr::after{content:attr(data-numeric);position:absolute;opacity:1 !important;bottom:100%;left:50%;transform:translate(-50%, 0);display:block !important;height:fit-content;margin:0;bottom:50%;left:calc(var(--percent) + .5rem);transform:translate(0, 50%)}:host(.chart--stacked.chart--horizontal) .chart__wrapper table tbody tr td:after{content:none}.chart--animate.animating.inview{--animation-left: 2s}.chart--animate.animating.inview table tbody tr td:not(:first-child){transition:height 2s ease-out,width 2s ease-out,bottom 2s ease-out,left var(--animation-left) ease-out;transition-delay:calc(var(--row-index)*.1s)}.chart--animate:not(.inview) table tbody tr td:not(:first-child){--bottom: var(--min-bottom, 0%)!important;--percent: 0%!important;--axis: 0%!important;--comparison: 0%!important}.chart--animate.animating table tbody tr td:not(:first-child){overflow:hidden}:host(.chart--display-data) table tbody tr td:not(:first-child):after{content:attr(data-value);position:absolute;opacity:1 !important;bottom:100%;left:50%;transform:translate(-50%, 0);display:block !important;height:fit-content;margin:0}:host(.chart--display-data.chart--horizontal) table tbody tr td:not(:first-child):after{bottom:50%;left:calc(100% + .5rem);transform:translate(0, 50%)}:host(.chart--display-data.chart--horizontal) .chart__wrapper[data-longest-value]:after{display:block;content:attr(data-longest-value);font-size:var(--label-size);padding-left:.5em;opacity:0;pointer-events:none;white-space:nowrap}:host(.chart--display-data.chart--fit-content:not(.chart--horizontal)) .chart__outer{padding-top:1rem}:host(.chart--fit-content:not(.chart--horizontal)){width:100%;display:block}:host(.chart--fit-content:not(.chart--horizontal)) .chart__wrapper{width:fit-content}:host(.chart--fit-content:not(.chart--horizontal)) table{width:fit-content !important;padding-top:0;height:var(--chart-height-resp, 7.5rem)}:host(.chart--fit-content:not(.chart--horizontal)) tbody{position:relative}:host(.chart--fit-content:not(.chart--horizontal)) [part=group]{min-width:fit-content;width:fit-content;max-width:fit-content;padding-right:var(--fc-group-width, 1rem)}:host(.chart--fit-content:not(.chart--horizontal)) [part=value]{min-width:var(--fc-value-width, 0.75rem);width:var(--fc-value-width, 0.75rem);max-width:var(--fc-value-width, 0.75rem)}:host(.chart--fit-content:not(.chart--horizontal).chart--no-scale){--fc-group-width: 1.375rem;--fc-value-width: 1.5rem}:host(.chart--fit-content:not(.chart--horizontal).chart--no-scale) table{height:var(--chart-height-lg-set, 7.5rem)}@container (min-width: 23.4375em){.chart__wrapper{--fc-group-width: 1.375rem;--fc-value-width: 1.5rem}}button.tooltip:after{content:"?";margin-left:.25rem;display:inline-block;border:1px solid currentColor}.tooltip__content[popover]{z-index:var(--index-floating);background:var(--colour-primary);color:var(--colour-white);padding:1.5rem;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.11);white-space:normal;position:fixed;border:none;margin:0;box-sizing:border-box;inset-area:bottom center;overflow:visible;width:calc(anchor-size(width) + var(--container-padding-x) + var(--container-padding-x) + 1.5rem) !important}.tooltip__content[popover]::after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-0.25rem;border-width:.5rem;border-style:solid;border-color:rgba(0,0,0,0) rgba(0,0,0,0) var(--colour-primary) rgba(0,0,0,0);margin-bottom:-1px}/*# sourceMappingURL=assets/css/components/barchart.component.css.map */
|
|
7
9
|
|
|
8
10
|
</style>
|
|
9
11
|
<div class="chart__outer" part="outer">
|
|
@@ -15,5 +17,5 @@
|
|
|
15
17
|
</div>
|
|
16
18
|
</div>
|
|
17
19
|
<div class="chart__spacer"><span part="spacer"></span</div>
|
|
18
|
-
</div>`,this.shadowRoot.appendChild(
|
|
20
|
+
</div>`,this.shadowRoot.appendChild(t.content.cloneNode(!0))}connectedCallback(){const t=this,i=this.querySelector("table").cloneNode(!0),r=this.shadowRoot.querySelector(".chart"),o=this.shadowRoot.querySelector(".chart__outer"),c=r.querySelectorAll("td:not(:first-child)").length;r.appendChild(i),x(t,o),c<=10&&t.classList.add("chart--fit-content"),c<=5&&t.classList.add("chart--no-scale"),u(t,o,i),A(t,o),k(t,o),C(o),$(o),T(o),H(t,"iam-barchart",["view-change"])}attributeChangedCallback(t,a,i){}}export{E as default};
|
|
19
21
|
//# sourceMappingURL=barchart.component.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"barchart.component.min.js","sources":["../../modules/helpers.js","../../modules/chart.module.js","barchart.component.js"],"sourcesContent":["// @ts-nocheck\n/**\n * Global helper functions to help maintain and enhance framework elements.\n * @module Helpers\n */\n/**\n * Add global classes used by the CSS and later JavaScript.\n * @param {HTMLElement} body Dom element, this doesn't have to be the body but it is recommended.\n */\nexport const addBodyClasses = (body) => {\n body.classList.add(\"js-enabled\");\n if (navigator.userAgent.indexOf('MSIE') !== -1 || navigator.appVersion.indexOf('Trident/') > 0) {\n body.classList.add(\"ie\");\n }\n return null;\n};\n/**\n * Add global events.\n * @param {HTMLElement} body Dom element, this doesn't have to be the body but it is recommended.\n */\nexport const addGlobalEvents = (body) => {\n const checkElements = function (hash) {\n const label = document.querySelector(`label[for=\"${hash.replace('#', '')}\"]`);\n const summary = document.querySelector(hash + ' summary');\n const dialog = document.querySelector(`dialog${hash}`);\n const detail = document.querySelector(`detail${hash}`);\n if (label instanceof HTMLElement)\n label.click();\n else if (summary instanceof HTMLElement)\n summary.click();\n else if (dialog instanceof HTMLElement)\n dialog.showModal();\n else if (detail instanceof HTMLElement)\n detail.addAttribute('open');\n };\n if (location.hash)\n checkElements(location.hash);\n window.addEventListener('hashchange', function () { checkElements(location.hash); }, false);\n addEventListener(\"popstate\", (event) => {\n if (event && event.state && event.state.type && event.state.type == \"pagination\") {\n let form = document.querySelector(`#${event.state.form}`);\n let pageInput = document.querySelector(`#${event.state.form} [data-pagination]`);\n if (pageInput)\n pageInput.value = event.state.page;\n else\n form.innerHTML += `<input name=\"page\" type=\"hidden\" data-pagination=\"true\" value=\"${event.state.page}\" />`;\n form.dispatchEvent(new Event(\"submit\"));\n }\n });\n document.addEventListener(\"submit\", (event) => {\n if (event && event.target instanceof HTMLElement && event.target.matches('form')) {\n let form = event.target;\n // Reset password types\n Array.from(form.querySelectorAll('[data-password-type]')).forEach((input, index) => {\n input.setAttribute('type', 'password');\n });\n if (form.querySelector(':invalid') || form.querySelector('.pwd-checker[data-strength=\"1\"]') || form.querySelector('.pwd-checker[data-strength=\"2\"]')) {\n form.classList.add('was-validated');\n event.preventDefault();\n }\n if (form.querySelector('iam-multiselect[data-is-required][data-error]')) {\n form.classList.add('was-validated');\n event.preventDefault();\n }\n }\n });\n document.addEventListener(\"keydown\", (e) => {\n if (e.key === \"Escape\") {\n if (document.querySelector('.dialog--transactional[open], .dialog--acknowledgement[open]')) {\n e.preventDefault();\n e.stopPropagation();\n }\n }\n });\n Array.from(document.querySelectorAll('label progress')).forEach((progress, index) => {\n let label = progress.closest('label');\n label.setAttribute('data-percent', progress.getAttribute('value'));\n });\n return null;\n};\nexport const isNumeric = function (str) {\n if (typeof str != \"string\")\n return false; // we only process strings! \n return !isNaN(str) && // use type coercion to parse the _entirety_ of the string (`parseFloat` alone does not do this)...\n !isNaN(parseFloat(str)); // ...and ensure strings of whitespace fail\n};\nexport const zeroPad = (num, places) => String(num).padStart(places, '0');\nexport const ucfirst = (str) => str.charAt(0).toUpperCase() + str.slice(1);\nexport const ucwords = (str) => str.split(' ').map(s => ucfirst(s)).join(' ');\nexport const unsnake = (str) => str.replace(/_/g, ' ');\nexport const snake = (str) => str.replace(/ /g, '_');\nexport const safeID = function (str) {\n str = str.toLowerCase();\n str = snake(str);\n str = str.replace(/\\W/g, '');\n return str;\n};\nexport const numberOfDays = function (startDateString, endDateString) {\n let convertStart = startDateString.split('/');\n let convertEnd = endDateString.split('/');\n let dateStart = new Date(convertStart[1] + '/' + convertStart[0] + '/' + convertStart[2]);\n let dateEnd = new Date(convertEnd[1] + '/' + convertEnd[0] + '/' + convertEnd[2]);\n if (dateStart == \"Invalid Date\")\n throw \"Start date is not a valid date\";\n if (dateEnd == \"Invalid Date\")\n throw \"End date is not a valid date\";\n // To calculate the time difference of two dates\n let diffTime = dateEnd.getTime() - dateStart.getTime();\n let numberOfDays = (diffTime / (1000 * 3600 * 24) + 1);\n if (numberOfDays < 0)\n throw \"The start date should be before the end date\";\n return numberOfDays;\n};\n// Used to get values from nested json objects\nexport const resolvePath = (object, path, defaultValue) => path.split(/[\\.\\[\\]\\'\\\"]/).filter(p => p).reduce((o, p) => o ? o[p] : defaultValue, object);\nexport const isTraversable = o => Array.isArray(o) || o !== null && ['function', 'object'].includes(typeof o);\nexport const getSwipeDirection = (touchstartX, touchstartY, touchendX, touchendY) => {\n const limit = Math.tan(45 * 1.5 / 180 * Math.PI);\n let pageWidth = window.innerWidth || document.body.clientWidth;\n let treshold = Math.max(1, Math.floor(0.01 * (pageWidth)));\n let x = touchendX - touchstartX;\n let y = touchendY - touchstartY;\n let xy = Math.abs(x / y);\n let yx = Math.abs(y / x);\n if (Math.abs(x) > treshold || Math.abs(y) > treshold) {\n if (yx <= limit) {\n if (x < 0) {\n return \"left\";\n }\n else {\n return \"right\";\n }\n }\n if (xy <= limit) {\n if (y < 0) {\n return \"top\";\n }\n else {\n return \"bottom\";\n }\n }\n }\n else {\n return \"tap\";\n }\n};\n","import { numberOfDays } from './helpers.js';\n// #region Functions that setup and trigger other functions \nexport const addClasses = (chartElement, chartOuter) => {\n // add colour classes\n for (let i = 1; i <= 10; i++) {\n if (chartElement.hasAttribute(`data-colour-${i}`)) {\n let colour = chartElement.getAttribute(`data-colour-${i}`);\n chartElement.style.setProperty(`--chart-colour-${i}`, `var(--chart-colour-${colour})`);\n chartElement.style.setProperty(`--chart-colour-${i}-hover`, `var(--chart-colour-${colour}-hover)`);\n }\n Array.from(chartOuter.querySelectorAll(`[data-colour-${i}]`)).forEach((element) => {\n let colour = element.getAttribute(`data-colour-${i}`);\n element.style.setProperty(`--chart-colour-${i}-set`, `var(--chart-colour-${colour})`);\n element.style.setProperty(`--chart-colour-${i}-hover`, `var(--chart-colour-${colour}-hover)`);\n });\n }\n return true;\n};\nexport const setupChart = (chartElement, chartOuter, tableElement) => {\n // #region Reset the chart\n // empty divs to re-populate\n const chartKey = chartOuter.querySelector('.chart__key');\n chartKey.innerHTML = '';\n const chartGuidelines = chartOuter.querySelector('.chart__guidelines');\n chartGuidelines.innerHTML = ``;\n const chartYaxis = chartOuter.querySelector('.chart__yaxis');\n chartYaxis.innerHTML = ``;\n // Remove old input fields\n Array.from(chartOuter.querySelectorAll(':scope > input[type=\"checkbox\"],:scope > input[type=\"radio\"]')).map((element) => { element.remove(); });\n // #endregion\n let { xaxis } = getChartData(chartElement, chartOuter);\n setCellData(chartElement, chartOuter, tableElement);\n createChartKey(chartOuter, tableElement, chartKey);\n createChartGuidelines(chartElement, chartOuter, chartGuidelines);\n createChartYaxis(chartElement, chartOuter, chartYaxis);\n if (xaxis) {\n createXaxis(chartElement, chartOuter, xaxis);\n }\n return true;\n};\n// #endregion\n// #region Event handlers and observers\nexport const setEventListener = function (chartElement, chartOuter) {\n let chart = chartOuter.querySelector('.chart');\n chart.addEventListener('mousemove', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('td:not(:first-child')) {\n let column = event.target.closest('td:not(:first-child');\n var rect = column.getBoundingClientRect();\n let x = event.clientX - rect.left;\n let y = event.clientY - rect.top;\n chart.setAttribute('style', `--cursor-x: ${x}px; --cursor-y: ${y}px;`);\n }\n });\n // Use the part for the chart items to pass through states to the pages CSS\n let labels = chartOuter.querySelectorAll('label');\n Array.from(labels).forEach((label) => {\n if (chartOuter.querySelector(`input#${label.getAttribute('for')}`).checked)\n label.setAttribute('part', 'key-checked');\n else\n label.setAttribute('part', 'key-unchecked');\n });\n let table = chartElement.querySelector('table');\n let shadowTable = chartOuter.querySelector('table');\n chartOuter.addEventListener('change', function (event) {\n let eventTarget = event.target;\n const customEvent = new CustomEvent(\"view-change\", { detail: {\n 'data-dataset': eventTarget.getAttribute('data-dataset'),\n 'label': eventTarget.getAttribute('data-label'),\n 'checked': eventTarget.checked\n }\n });\n chartElement.dispatchEvent(customEvent);\n Array.from(labels).forEach((label) => {\n var _a;\n if ((_a = chartOuter.querySelector(`input#${label.getAttribute('for')}`)) === null || _a === void 0 ? void 0 : _a.checked)\n label.setAttribute('part', 'key-checked');\n else\n label.setAttribute('part', 'key-unchecked');\n });\n shadowTable.innerHTML = table.innerHTML;\n setCellData(chartElement, chartOuter, shadowTable);\n });\n};\nexport const setEventObservers = function (chartElement, chartOuter) {\n let table = chartElement.querySelector('table');\n let shadowTable = chartOuter.querySelector('table');\n const attributesUpdated = (mutationList, observer) => {\n observer.disconnect();\n observer2.disconnect();\n for (const mutation of mutationList) {\n if (mutation.attributeName == 'class' || (mutation.type === 'attributes' && mutation.attributeName === 'data-total') || mutation.type === 'attributes') {\n shadowTable.innerHTML = table.innerHTML;\n setupChart(chartElement, chartOuter, shadowTable);\n }\n }\n observer.observe(table, { characterData: true, subtree: true });\n observer2.observe(chartElement, { attributes: true });\n };\n const tableUpdated = (mutationList, observer) => {\n observer.disconnect();\n observer2.disconnect();\n for (const mutation of mutationList) {\n if (mutation.type == \"characterData\" || (mutation.type == \"childList\" && mutation.addedNodes.length)) {\n shadowTable.innerHTML = table.innerHTML;\n setupChart(chartElement, chartOuter, shadowTable);\n }\n }\n observer.observe(table, { characterData: true, subtree: true });\n observer2.observe(chartElement, { attributes: true });\n };\n let observer = new MutationObserver(tableUpdated);\n let observer2 = new MutationObserver(attributesUpdated);\n observer.observe(table, { characterData: true, subtree: true });\n observer2.observe(chartElement, { attributes: true });\n return true;\n};\n// #endregion\n// #region GET functions\nexport const getChartData = function (chartElement, chartOuter) {\n let table = chartOuter.querySelector('.chart__wrapper table');\n let min = chartElement.hasAttribute('data-min') ? chartElement.getAttribute('data-min') : 0;\n let max = chartElement.hasAttribute('data-max') ? chartElement.getAttribute('data-max') : getLargestValue(chartElement, table);\n let type = chartElement.hasAttribute('data-type') ? chartElement.getAttribute('data-type') : 'column';\n let yaxis = chartElement.hasAttribute('data-yaxis') ? chartElement.getAttribute('data-yaxis').split(',') : [];\n let guidelines = chartElement.hasAttribute('data-guidelines') ? chartElement.getAttribute('data-guidelines').split(',') : [];\n let targets = chartElement.hasAttribute('data-targets') ? JSON.parse(chartElement.getAttribute('data-targets')) : null;\n let events = chartElement.hasAttribute('data-events') ? JSON.parse(chartElement.getAttribute('data-events')) : null;\n let xaxis = chartElement.hasAttribute('data-xaxis') ? chartElement.getAttribute('data-xaxis').split(',') : null;\n let increment = chartElement.hasAttribute('data-increment') ? chartElement.getAttribute('data-increment') : null;\n let start = chartElement.hasAttribute('data-start') ? chartElement.getAttribute('data-start') : 0;\n let end = chartElement.hasAttribute('data-end') ? chartElement.getAttribute('data-end') : getLargestValue(chartElement, table); // TODO - get largest value from the data-xaxis\n let slope = chartElement.hasAttribute('data-slope') ? chartElement.getAttribute('data-slope') : null;\n let yInt = chartElement.hasAttribute('data-yint') ? chartElement.getAttribute('data-yint') : null;\n return { min, max, type, yaxis, targets, events, xaxis, increment, start, end, slope, yInt, guidelines };\n};\nfunction getLargestValue(chartElement, table) {\n const selector = chartElement.classList.contains('chart--stacked') ? 'tbody tr' : 'tbody td:not(:first-child)';\n let values = Array.from(table.querySelectorAll(selector)).map((element) => {\n let currentValue = element.getAttribute('data-numeric');\n return currentValue;\n });\n let largestValue = Math.max(...values);\n // TO DO round to the nearest 10, 100, 1000 and so on\n return Math.ceil(largestValue);\n}\nconst getValues = function (value, min, max, start) {\n let cleanValue = String(value);\n cleanValue = cleanValue.replace('£', '');\n cleanValue = cleanValue.replace('%', '');\n cleanValue = cleanValue.replace(',', '');\n cleanValue = Number.parseFloat(cleanValue);\n let percent = ((cleanValue - min) / (max - min)) * 100;\n let axis = percent;\n let bottom = 0;\n if (start && start != 0) {\n bottom = ((start - min) / (max - min)) * 100;\n }\n // If the value is negative the position below the 0 line\n if (min < 0) {\n bottom = Math.abs(((min) / (max - min)) * 100);\n if (cleanValue < 0) {\n percent = bottom - percent;\n bottom = bottom - percent;\n axis = bottom;\n }\n else {\n percent = percent - bottom;\n axis = percent + bottom;\n }\n }\n return { percent, axis, bottom };\n};\n// #endregion\n// #region SET functions - set data attributes and classes\nexport const setCellData = function (chartElement, chartOuter, table) {\n Array.from(table.querySelectorAll('tbody tr')).forEach((tr) => {\n let rowValue = 0;\n // Set the data numeric value if not set\n Array.from(tr.querySelectorAll('td:not(:first-child)')).forEach((td) => {\n let value = parseFloat(td.textContent.replace('£', '').replace('%', '').replace(',', ''));\n td.setAttribute('data-numeric', value);\n td.setAttribute('data-value', td.textContent);\n let display = getComputedStyle(td).display;\n if (display != 'none')\n rowValue += value;\n });\n tr.setAttribute('data-numeric', rowValue);\n });\n let { min, max } = getChartData(chartElement, chartOuter);\n Array.from(table.querySelectorAll('tbody tr')).forEach((tr, index) => {\n let group = tr.querySelector('td:first-child, th:first-child') ? tr.querySelector('td:first-child, th:first-child').textContent : '';\n tr.setAttribute('part', 'group');\n let percent = ((tr.getAttribute('data-numeric') - min) / (max - min)) * 100;\n tr.style.setProperty('--percent', `${percent}%`);\n // Set the data label value if not set\n Array.from(tr.querySelectorAll('td:not([data-label])')).forEach((td, index) => {\n if (index == 0)\n td.setAttribute('part', 'xaxis-label'); // PART\n else\n td.setAttribute('part', 'value');\n if (tr.querySelectorAll('td').length > 2)\n td.setAttribute('data-label', table.querySelectorAll('thead th')[index].textContent);\n });\n /*\n if(tr.querySelector('[data-label=\"Total\"]')){\n tr.setAttribute('data-total',tr.querySelector('[data-label=\"Total\"][data-numeric]').getAttribute('data-numeric'));\n }\n \n if(tr.querySelector('[data-label=\"Min\"]')){\n tr.setAttribute('data-min',tr.querySelector('[data-label=\"Min\"][data-numeric]').getAttribute('data-numeric'));\n }\n if(tr.querySelector('[data-label=\"Max\"]')){\n tr.setAttribute('data-max',tr.querySelector('[data-label=\"Max\"][data-numeric]').getAttribute('data-numeric'));\n }\n \n */\n let rowMin = tr.hasAttribute('data-min') ? tr.getAttribute('data-min') : min;\n let rowMax = tr.hasAttribute('data-max') ? tr.getAttribute('data-max') : max;\n if (rowMin < 0) {\n let minBottom = Math.abs(((rowMin) / (rowMax - rowMin)) * 100);\n chartElement.setAttribute('style', `--min-bottom: ${minBottom}%;`);\n }\n // Add a useful index css var for the use of animatons.\n tr.style.setProperty('--row-index', index + 1);\n // Add css vars to cells\n Array.from(tr.querySelectorAll('td[data-numeric]:not([data-label=\"Min\"]):not([data-label=\"Max\"]):not(:first-child)')).forEach((td) => {\n let display = getComputedStyle(td).display;\n if (display == 'none')\n return;\n const content = td.innerHTML;\n const value = Number.parseFloat(td.getAttribute('data-numeric'));\n const start = Number.parseFloat(td.getAttribute('data-start'));\n if (!td.querySelector('span[data-group]'))\n td.innerHTML = `<span data-group=\"${group}\" ${td.hasAttribute('data-label') ? `data-label=\"${td.getAttribute('data-label')}\"` : ''} part=\"popover\">${content}</span>`;\n if (!td.hasAttribute('style')) {\n let { percent, bottom, axis } = getValues(value, rowMin, rowMax, start);\n td.setAttribute('data-percent', percent);\n td.setAttribute(\"style\", `--bottom:${bottom}%;--percent:${percent}%;--axis:${axis}%;`);\n }\n });\n });\n};\nexport const setLongestLabel = function (chartOuter) {\n let chartWrapper = chartOuter.querySelector('.chart__wrapper');\n let chartSpacer = chartOuter.querySelector('.chart__spacer span');\n let table = chartOuter.querySelector('.chart table');\n // set the longest label attr so that the bar chart knows what margin to set on the left\n let longestLabel = '';\n Array.from(table.querySelectorAll('tbody tr td:first-child')).forEach((td) => {\n if (typeof td.textContent != \"undefined\" && td.textContent.length > longestLabel.length) {\n longestLabel = td.textContent;\n }\n });\n chartWrapper.setAttribute('data-longest-label', longestLabel);\n chartSpacer.innerHTML = longestLabel;\n};\nexport const setLongestValue = function (chartOuter) {\n let chartWrapper = chartOuter.querySelector('.chart__wrapper');\n let table = chartOuter.querySelector('.chart table');\n let longestValue = '';\n Array.from(table.querySelectorAll('tbody tr td:not(:first-child) span')).forEach((td) => {\n if (typeof td.textContent != \"undefined\" && td.textContent.length > longestValue.length)\n longestValue = td.textContent;\n });\n chartWrapper.setAttribute('data-longest-value', longestValue);\n};\n// #endregion\n// #region CREATE function\nexport const createChartKey = function (chartOuter, tableElement, chartKey) {\n const chartID = `chart-${Date.now() + (Math.floor(Math.random() * 100) + 1)}`;\n //const chartOuter = chartElement.querySelector('.chart__outer');\n let previousInput;\n let headings = Array.from(tableElement.querySelectorAll('thead th'));\n headings.forEach((arrayElement, index) => {\n if (index != 0) {\n previousInput = createChartKeyItem(chartID, index, arrayElement.textContent, chartKey, chartOuter, previousInput);\n }\n if (index == 50) {\n headings.length = index + 1;\n }\n });\n return true;\n};\nfunction createChartKeyItem(chartID, index, text, chartKey, chartOuter, previousInput) {\n let input = document.createElement('input');\n input.setAttribute('name', `${chartID}-dataset-${index}`);\n input.setAttribute('id', `${chartID}-dataset-${index}`);\n input.setAttribute('data-dataset', `${index}`);\n input.setAttribute('data-label', `${text}`);\n input.checked = true;\n input.setAttribute('type', `checkbox`);\n if (index == 1)\n chartOuter.prepend(input);\n else\n chartOuter.insertBefore(input, previousInput.nextSibling);\n previousInput = input;\n let label = document.createElement('label');\n label.setAttribute('class', `key btn btn-action`);\n label.setAttribute('for', `${chartID}-dataset-${index}`);\n label.setAttribute('data-label', `${text}`);\n label.setAttribute('part', `key`);\n label.innerHTML = `${text}`;\n chartKey.append(label);\n return previousInput;\n}\nexport const createChartGuidelines = function (chartElement, chartOuter, chartGuidelines) {\n let { min, max, yaxis, increment, guidelines } = getChartData(chartElement, chartOuter);\n if (!guidelines.length)\n guidelines = yaxis;\n if (increment == \"days\") {\n max = numberOfDays(min, max);\n min = 0;\n }\n chartGuidelines.innerHTML = '';\n for (var i = 0; i < guidelines.length; i++) {\n let value = parseFloat(guidelines[i].replace('£', '').replace('%', '').replace(',', ''));\n let { axis } = getValues(value, min, max);\n chartGuidelines.innerHTML += `<div class=\"guideline\" style=\"--percent:${axis}%;\">${yaxis.indexOf(guidelines[i]) != -1 ? `<span>${guidelines[i]}</span>` : ''}</div>`;\n }\n};\nexport const createChartYaxis = function (chartElement, chartOuter, chartYaxis) {\n let { min, max, yaxis, increment } = getChartData(chartElement, chartOuter);\n let startDay = min;\n if (increment == \"days\") {\n max = numberOfDays(min, max);\n min = 0;\n }\n chartYaxis.innerHTML = '';\n for (var i = 0; i < yaxis.length; i++) {\n let value = parseFloat(yaxis[i].replace('£', '').replace('%', ''));\n if (increment == \"days\") {\n value = numberOfDays(startDay, yaxis[i]);\n }\n let { axis } = getValues(value, min, max);\n chartYaxis.innerHTML += `<div class=\"axis__point\" style=\"--percent:${axis}%;\"><span>${yaxis[i]}</span></div>`;\n }\n};\nexport const createXaxis = function (chartElement, chartOuter, xaxis) {\n const chart = chartOuter.querySelector('.chart');\n let chartXaxis = chartOuter.querySelector('.chart__xaxis');\n let { increment, start, end } = getChartData(chartElement, chartOuter);\n if (!chartXaxis) {\n chartXaxis = document.createElement('div');\n chartXaxis.setAttribute('class', 'chart__xaxis');\n }\n if (increment && start && end) {\n chartXaxis.innerHTML = '';\n for (var i = 0; i < xaxis.length; i++) {\n let value = parseFloat(xaxis[i].replace('£', '').replace('%', ''));\n let position = ((value - start) / (end - start)) * 100;\n chartXaxis.innerHTML += `<div class=\"axis__point\" style=\"--percent:${position}%;\"><span>${xaxis[i]}</span></div>`;\n }\n }\n chart.prepend(chartXaxis);\n};\nexport const createTooltips = function (chartOuter) {\n const titles = chartOuter.querySelectorAll('thead th[title], tbody th[title]:first-child, tbody td[title]:first-child');\n Array.from(titles).forEach((title) => {\n let tooltipId = `tooltip-${Date.now()}-${Math.floor(Math.random() * 100)}`;\n title.innerHTML = `<button class=\"tooltip\" popovertarget=\"${tooltipId}\" part=\"tooltip\" style=\"anchor-name: --${tooltipId};\">${title.textContent}</button><span id=\"${tooltipId}\" style=\"position-anchor: --${tooltipId};\" popover part=\"tooltip__content\" class=\"tooltip__content\">${title.getAttribute('title')}</span>`;\n //title.removeAttribute('title'); // TODO add a supports query for anchor positioning\n });\n};\n// #endregion\nexport default setupChart;\n","// @ts-nocheck\nimport { addClasses, setupChart, setEventListener, setEventObservers, setLongestLabel, setLongestValue, createTooltips } from \"../../modules/chart.module.js\";\n// TODO: tooltip\n// TODO: responsive 'fit-content' classes done through JS\nclass iamBarChart extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/barchart.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${loadCSS}\n </style>\n <div class=\"chart__outer\" part=\"outer\">\n <div class=\"chart__key\" part=\"chart-key\"></div>\n <div class=\"chart__wrapper\" part=\"wrapper\">\n <div class=\"chart__yaxis\" part=\"yaxis\"></div>\n <div class=\"chart\" part=\"chart\">\n <div class=\"chart__guidelines\" part=\"guidelines\"></div>\n </div>\n </div>\n <div class=\"chart__spacer\"><span part=\"spacer\"></span</div>\n </div>`;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const chartComponent = this;\n const chartID = `chart-${Date.now() + (Math.floor(Math.random() * 100) + 1)}`;\n const orginalTable = this.querySelector('table');\n const clonedTable = orginalTable.cloneNode(true);\n const chart = this.shadowRoot.querySelector('.chart');\n const chartOuter = this.shadowRoot.querySelector('.chart__outer');\n chart.appendChild(clonedTable);\n addClasses(chartComponent, chartOuter);\n const barCount = chart.querySelectorAll('td:not(:first-child)').length;\n if (barCount < 10) {\n chartComponent.classList.add('chart--fit-content');\n //chartComponent.classList.add('chart--display-data');\n }\n if (barCount < 5) {\n chartComponent.classList.add('chart--no-scale');\n //chartComponent.classList.add('chart--display-data');\n }\n setupChart(chartComponent, chartOuter, clonedTable);\n setEventObservers(chartComponent, chartOuter);\n setEventListener(chartComponent, chartOuter);\n setLongestLabel(chartOuter);\n setLongestValue(chartOuter);\n createTooltips(chartOuter);\n }\n attributeChangedCallback(attrName, oldVal, newVal) {\n }\n}\nexport default iamBarChart;\n"],"names":["numberOfDays","startDateString","endDateString","convertStart","convertEnd","dateStart","dateEnd","addClasses","chartElement","chartOuter","i","colour","element","setupChart","tableElement","chartKey","chartGuidelines","chartYaxis","xaxis","getChartData","setCellData","createChartKey","createChartGuidelines","createChartYaxis","createXaxis","setEventListener","chart","event","rect","x","y","labels","label","table","shadowTable","eventTarget","customEvent","_a","setEventObservers","attributesUpdated","mutationList","observer","observer2","mutation","tableUpdated","min","max","getLargestValue","type","yaxis","guidelines","targets","events","increment","start","end","slope","yInt","selector","values","largestValue","getValues","value","cleanValue","percent","axis","bottom","tr","rowValue","td","index","group","rowMin","rowMax","minBottom","content","setLongestLabel","chartWrapper","chartSpacer","longestLabel","setLongestValue","longestValue","chartID","previousInput","headings","arrayElement","createChartKeyItem","text","input","startDay","chartXaxis","position","createTooltips","titles","title","tooltipId","iamBarChart","template","chartComponent","clonedTable","barCount","attrName","oldVal","newVal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"barchart.component.min.js","sources":["../../modules/chart.module.js","../_global.js","barchart.component.js"],"sourcesContent":["// #region Functions that setup and trigger other functions \nexport const addClasses = (chartElement, chartOuter) => {\n // add colour classes\n for (let i = 1; i <= 10; i++) {\n if (chartElement.hasAttribute(`data-colour-${i}`)) {\n let colour = chartElement.getAttribute(`data-colour-${i}`);\n chartElement.style.setProperty(`--chart-colour-${i}`, `var(--chart-colour-${colour})`);\n chartElement.style.setProperty(`--chart-colour-${i}-hover`, `var(--chart-colour-${colour}-hover)`);\n }\n Array.from(chartOuter.querySelectorAll(`[data-colour-${i}]`)).forEach((element) => {\n let colour = element.getAttribute(`data-colour-${i}`);\n element.style.setProperty(`--chart-colour-${i}-set`, `var(--chart-colour-${colour})`);\n element.style.setProperty(`--chart-colour-${i}-hover`, `var(--chart-colour-${colour}-hover)`);\n });\n }\n return true;\n};\nexport const setupChart = (chartElement, chartOuter, tableElement) => {\n // #region Reset the chart\n // empty divs to re-populate\n const chartKey = chartOuter.querySelector('.chart__key');\n chartKey.innerHTML = '';\n const chartGuidelines = chartOuter.querySelector('.chart__guidelines');\n chartGuidelines.innerHTML = ``;\n const chartYaxis = chartOuter.querySelector('.chart__yaxis');\n chartYaxis.innerHTML = ``;\n // Remove old input fields\n Array.from(chartOuter.querySelectorAll(':scope > input[type=\"checkbox\"],:scope > input[type=\"radio\"]')).map((element) => { element.remove(); });\n // #endregion\n let { xaxis } = getChartData(chartElement);\n setCellData(chartElement, tableElement);\n createChartKey(chartOuter, tableElement, chartKey);\n createChartGuidelines(chartElement, chartGuidelines);\n createChartYaxis(chartElement, chartYaxis);\n if (xaxis) {\n createXaxis(chartOuter);\n }\n return true;\n};\n// #endregion\n// #region Event handlers and observers\nexport const setEventListener = function (chartElement, chartOuter) {\n let chart = chartOuter.querySelector('.chart');\n chart.addEventListener('mousemove', (event) => {\n if (event && event.target instanceof HTMLElement && event.target.closest('td:not(:first-child')) {\n let column = event.target.closest('td:not(:first-child');\n var rect = column.getBoundingClientRect();\n let x = event.clientX - rect.left;\n let y = event.clientY - rect.top;\n chart.setAttribute('style', `--cursor-x: ${x}px; --cursor-y: ${y}px;`);\n }\n });\n // Use the part for the chart items to pass through states to the pages CSS\n let labels = chartOuter.querySelectorAll('label');\n Array.from(labels).forEach((label) => {\n if (chartOuter.querySelector(`input#${label.getAttribute('for')}`).checked)\n label.setAttribute('part', 'key-checked');\n else\n label.setAttribute('part', 'key-unchecked');\n });\n let table = chartElement.querySelector('table');\n let shadowTable = chartOuter.querySelector('table');\n chartOuter.addEventListener('change', function (event) {\n let eventTarget = event.target;\n const customEvent = new CustomEvent(\"view-change\", { detail: {\n 'data-dataset': eventTarget.getAttribute('data-dataset'),\n 'label': eventTarget.getAttribute('data-label'),\n 'checked': eventTarget.checked\n }\n });\n chartElement.dispatchEvent(customEvent);\n Array.from(labels).forEach((label) => {\n var _a;\n if ((_a = chartOuter.querySelector(`input#${label.getAttribute('for')}`)) === null || _a === void 0 ? void 0 : _a.checked)\n label.setAttribute('part', 'key-checked');\n else\n label.setAttribute('part', 'key-unchecked');\n });\n shadowTable.innerHTML = table.innerHTML;\n setCellData(chartElement, shadowTable);\n });\n};\nexport const setEventObservers = function (chartElement, chartOuter) {\n let table = chartElement.querySelector('table');\n let shadowTable = chartOuter.querySelector('table');\n const attributesUpdated = (mutationList, observer) => {\n observer.disconnect();\n observer2.disconnect();\n for (const mutation of mutationList) {\n if (mutation.attributeName == 'class' || (mutation.type === 'attributes') || mutation.type === 'attributes') {\n shadowTable.innerHTML = table.innerHTML;\n setupChart(chartElement, chartOuter, shadowTable);\n }\n }\n observer.observe(table, { characterData: true, subtree: true });\n observer2.observe(chartElement, { attributes: true });\n };\n const tableUpdated = (mutationList, observer) => {\n observer.disconnect();\n observer2.disconnect();\n for (const mutation of mutationList) {\n if (mutation.type == \"characterData\" || (mutation.type == \"childList\" && mutation.addedNodes.length)) {\n shadowTable.innerHTML = table.innerHTML;\n setupChart(chartElement, chartOuter, shadowTable);\n }\n }\n observer.observe(table, { characterData: true, subtree: true });\n observer2.observe(chartElement, { attributes: true });\n };\n let observer = new MutationObserver(tableUpdated);\n let observer2 = new MutationObserver(attributesUpdated);\n observer.observe(table, { characterData: true, subtree: true });\n observer2.observe(chartElement, { attributes: true });\n return true;\n};\n// #endregion\n// #region GET functions\nexport const getChartData = function (chartElement) {\n let table = chartElement.shadowRoot.querySelector('.chart__wrapper table');\n let min = chartElement.hasAttribute('data-min') ? chartElement.getAttribute('data-min') : 0;\n let max = chartElement.hasAttribute('data-max') ? chartElement.getAttribute('data-max') : getLargestValue(chartElement, table);\n //let type:string = chartElement.hasAttribute('data-type') ? chartElement.getAttribute('data-type') : 'column';\n let yaxis = chartElement.hasAttribute('data-yaxis') ? chartElement.getAttribute('data-yaxis').split(',') : [];\n let guidelines = chartElement.hasAttribute('data-guidelines') ? chartElement.getAttribute('data-guidelines').split(',') : [];\n //let targets:any = chartElement.hasAttribute('data-targets') ? JSON.parse(chartElement.getAttribute('data-targets')) : null;\n //let events:any = chartElement.hasAttribute('data-events') ? JSON.parse(chartElement.getAttribute('data-events')) : null;\n let xaxis = chartElement.hasAttribute('data-xaxis') ? chartElement.getAttribute('data-xaxis').split(',') : null;\n //let increment = chartElement.hasAttribute('data-increment') ? chartElement.getAttribute('data-increment'): null;\n //let start:any = chartElement.hasAttribute('data-start') ? chartElement.getAttribute('data-start') : 0;\n //let end:any = chartElement.hasAttribute('data-end') ? chartElement.getAttribute('data-end') : getLargestValue(chartElement,table); // TODO - get largest value from the data-xaxis\n //let slope:any = chartElement.hasAttribute('data-slope') ? chartElement.getAttribute('data-slope') : null;\n //let yInt:any = chartElement.hasAttribute('data-yint') ? chartElement.getAttribute('data-yint') : null;\n return { min, max, yaxis, xaxis, guidelines };\n};\nfunction getLargestValue(chartElement, table) {\n const selector = chartElement.classList.contains('chart--stacked') ? 'tbody tr' : 'tbody td:not(:first-child)';\n let values = Array.from(table.querySelectorAll(selector)).map((element) => {\n let currentValue = element.getAttribute('data-numeric');\n return currentValue;\n });\n let largestValue = Math.max(...values);\n // TO DO round to the nearest 10, 100, 1000 and so on\n return Math.ceil(largestValue);\n}\nconst getValues = function (value, min, max, start) {\n let cleanValue = String(value);\n cleanValue = cleanValue.replace('£', '');\n cleanValue = cleanValue.replace('%', '');\n cleanValue = cleanValue.replace(',', '');\n cleanValue = Number.parseFloat(cleanValue);\n let percent = ((cleanValue - min) / (max - min)) * 100;\n let axis = percent;\n let bottom = 0;\n if (start && start != 0) {\n bottom = ((start - min) / (max - min)) * 100;\n }\n // If the value is negative the position below the 0 line\n if (min < 0) {\n bottom = Math.abs(((min) / (max - min)) * 100);\n if (cleanValue < 0) {\n percent = bottom - percent;\n bottom = bottom - percent;\n axis = bottom;\n }\n else {\n percent = percent - bottom;\n axis = percent + bottom;\n }\n }\n return { percent, axis, bottom };\n};\n// #endregion\n// #region SET functions - set data attributes and classes\nexport const setCellData = function (chartElement, table) {\n Array.from(table.querySelectorAll('tbody tr')).forEach((tr) => {\n let rowValue = 0;\n // Set the data numeric value if not set\n Array.from(tr.querySelectorAll('td:not(:first-child)')).forEach((td) => {\n let value = parseFloat(td.textContent.replace('£', '').replace('%', '').replace(',', ''));\n td.setAttribute('data-numeric', value);\n td.setAttribute('data-value', td.textContent);\n let display = getComputedStyle(td).display;\n if (display != 'none')\n rowValue += value;\n });\n tr.setAttribute('data-numeric', rowValue);\n });\n let { min, max } = getChartData(chartElement);\n Array.from(table.querySelectorAll('tbody tr')).forEach((tr, index) => {\n let group = tr.querySelector('td:first-child, th:first-child') ? tr.querySelector('td:first-child, th:first-child').textContent : '';\n tr.setAttribute('part', 'group');\n let percent = ((tr.getAttribute('data-numeric') - min) / (max - min)) * 100;\n tr.style.setProperty('--percent', `${percent}%`);\n // Set the data label value if not set\n Array.from(tr.querySelectorAll('td:not([data-label])')).forEach((td, index) => {\n if (index == 0)\n td.setAttribute('part', 'xaxis-label'); // PART\n else\n td.setAttribute('part', 'value');\n if (tr.querySelectorAll('td').length > 2)\n td.setAttribute('data-label', table.querySelectorAll('thead th')[index].textContent);\n });\n let rowMin = tr.hasAttribute('data-min') ? tr.getAttribute('data-min') : min;\n let rowMax = tr.hasAttribute('data-max') ? tr.getAttribute('data-max') : max;\n if (rowMin < 0) {\n let minBottom = Math.abs(((rowMin) / (rowMax - rowMin)) * 100);\n chartElement.setAttribute('style', `--min-bottom: ${minBottom}%;`);\n }\n // Add a useful index css var for the use of animatons.\n tr.style.setProperty('--row-index', index + 1);\n // Add css vars to cells\n Array.from(tr.querySelectorAll('td[data-numeric]:not([data-label=\"Min\"]):not([data-label=\"Max\"]):not(:first-child)')).forEach((td) => {\n let display = getComputedStyle(td).display;\n if (display == 'none')\n return;\n const content = td.innerHTML;\n const value = Number.parseFloat(td.getAttribute('data-numeric'));\n const start = Number.parseFloat(td.getAttribute('data-start'));\n if (!td.querySelector('span[data-group]'))\n td.innerHTML = `<span data-group=\"${group}\" ${td.hasAttribute('data-label') ? `data-label=\"${td.getAttribute('data-label')}\"` : ''} part=\"popover\">${content}</span>`;\n if (!td.hasAttribute('style')) {\n let { percent, bottom, axis } = getValues(value, rowMin, rowMax, start);\n td.setAttribute('data-percent', percent);\n td.setAttribute(\"style\", `--bottom:${bottom}%;--percent:${percent}%;--axis:${axis}%;`);\n }\n });\n });\n};\nexport const setLongestLabel = function (chartOuter) {\n let chartWrapper = chartOuter.querySelector('.chart__wrapper');\n let chartSpacer = chartOuter.querySelector('.chart__spacer span');\n let table = chartOuter.querySelector('.chart table');\n // set the longest label attr so that the bar chart knows what margin to set on the left\n let longestLabel = '';\n Array.from(table.querySelectorAll('tbody tr td:first-child')).forEach((td) => {\n if (typeof td.textContent != \"undefined\" && td.textContent.length > longestLabel.length) {\n longestLabel = td.textContent;\n }\n });\n chartWrapper.setAttribute('data-longest-label', longestLabel);\n chartSpacer.innerHTML = longestLabel;\n};\nexport const setLongestValue = function (chartOuter) {\n let chartWrapper = chartOuter.querySelector('.chart__wrapper');\n let table = chartOuter.querySelector('.chart table');\n let longestValue = '';\n Array.from(table.querySelectorAll('tbody tr td:not(:first-child) span')).forEach((td) => {\n if (typeof td.textContent != \"undefined\" && td.textContent.length > longestValue.length)\n longestValue = td.textContent;\n });\n chartWrapper.setAttribute('data-longest-value', longestValue);\n};\n// #endregion\n// #region CREATE function\nexport const createChartKey = function (chartOuter, tableElement, chartKey) {\n const chartID = `chart-${Date.now() + (Math.floor(Math.random() * 100) + 1)}`;\n //const chartOuter = chartElement.querySelector('.chart__outer');\n let previousInput;\n let headings = Array.from(tableElement.querySelectorAll('thead th'));\n headings.forEach((arrayElement, index) => {\n if (index != 0) {\n previousInput = createChartKeyItem(chartID, index, arrayElement.textContent, chartKey, chartOuter, previousInput);\n }\n if (index == 50) {\n headings.length = index + 1;\n }\n });\n return true;\n};\nfunction createChartKeyItem(chartID, index, text, chartKey, chartOuter, previousInput) {\n let input = document.createElement('input');\n input.setAttribute('name', `${chartID}-dataset-${index}`);\n input.setAttribute('id', `${chartID}-dataset-${index}`);\n input.setAttribute('data-dataset', `${index}`);\n input.setAttribute('data-label', `${text}`);\n input.checked = true;\n input.setAttribute('type', `checkbox`);\n if (index == 1)\n chartOuter.prepend(input);\n else\n chartOuter.insertBefore(input, previousInput.nextSibling);\n previousInput = input;\n let label = document.createElement('label');\n label.setAttribute('class', `key btn btn-action`);\n label.setAttribute('for', `${chartID}-dataset-${index}`);\n label.setAttribute('data-label', `${text}`);\n label.setAttribute('part', `key`);\n label.innerHTML = `${text}`;\n chartKey.append(label);\n return previousInput;\n}\nexport const createChartGuidelines = function (chartElement, chartGuidelines) {\n let { min, max, yaxis, guidelines } = getChartData(chartElement);\n if (!guidelines.length)\n guidelines = yaxis;\n chartGuidelines.innerHTML = '';\n for (var i = 0; i < guidelines.length; i++) {\n let value = parseFloat(guidelines[i].replace('£', '').replace('%', '').replace(',', ''));\n let { axis } = getValues(value, min, max);\n chartGuidelines.innerHTML += `<div class=\"guideline\" style=\"--percent:${axis}%;\">${yaxis.indexOf(guidelines[i]) != -1 ? `<span>${guidelines[i]}</span>` : ''}</div>`;\n }\n};\nexport const createChartYaxis = function (chartElement, chartYaxis) {\n let { min, max, yaxis } = getChartData(chartElement);\n chartYaxis.innerHTML = '';\n for (var i = 0; i < yaxis.length; i++) {\n let value = parseFloat(yaxis[i].replace('£', '').replace('%', ''));\n let { axis } = getValues(value, min, max);\n chartYaxis.innerHTML += `<div class=\"axis__point\" style=\"--percent:${axis}%;\"><span>${yaxis[i]}</span></div>`;\n }\n};\nexport const createXaxis = function (chartOuter) {\n const chart = chartOuter.querySelector('.chart');\n let chartXaxis = chartOuter.querySelector('.chart__xaxis');\n if (!chartXaxis) {\n chartXaxis = document.createElement('div');\n chartXaxis.setAttribute('class', 'chart__xaxis');\n }\n chart.prepend(chartXaxis);\n};\nexport const createTooltips = function (chartOuter) {\n const titles = chartOuter.querySelectorAll('thead th[title], tbody th[title]:first-child, tbody td[title]:first-child');\n Array.from(titles).forEach((title) => {\n let tooltipId = `tooltip-${Date.now()}-${Math.floor(Math.random() * 100)}`;\n title.innerHTML = `<button class=\"tooltip\" popovertarget=\"${tooltipId}\" part=\"tooltip\" style=\"anchor-name: --${tooltipId};\">${title.textContent}</button><span id=\"${tooltipId}\" style=\"position-anchor: --${tooltipId};\" popover part=\"tooltip__content\" class=\"tooltip__content\">${title.getAttribute('title')}</span>`;\n //title.removeAttribute('title'); // TODO add a supports query for anchor positioning\n });\n};\n// #endregion\nexport default setupChart;\n","// @ts-nocheck\nexport 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 let eventDetails = {\n \"event\": eventName,\n \"element\": componentName,\n \"target\": event.target\n };\n Object.keys(event.detail).forEach((eventKey) => {\n const eventDetail = event.detail[eventKey];\n eventDetails[eventKey] = eventDetail;\n });\n window.dataLayer.push(eventDetails);\n });\n });\n return true;\n};\n","// @ts-nocheck\nimport { addClasses, setupChart, setEventListener, setEventObservers, setLongestLabel, setLongestValue, createTooltips } from \"../../modules/chart.module.js\";\nimport { trackComponent, trackComponentRegistered } from \"../_global.js\";\ntrackComponentRegistered(\"iam-barchart\");\nclass iamBarChart extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location') ? document.body.getAttribute('data-assets-location') : '/assets';\n const loadCSS = `@import \"${assetLocation}/css/components/barchart.component.css\";`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n ${this.hasAttribute('css') ? `@import \"${this.getAttribute('css')}\";` : ``}\n \n ${loadCSS}\n </style>\n <div class=\"chart__outer\" part=\"outer\">\n <div class=\"chart__key\" part=\"chart-key\"></div>\n <div class=\"chart__wrapper\" part=\"wrapper\">\n <div class=\"chart__yaxis\" part=\"yaxis\"></div>\n <div class=\"chart\" part=\"chart\">\n <div class=\"chart__guidelines\" part=\"guidelines\"></div>\n </div>\n </div>\n <div class=\"chart__spacer\"><span part=\"spacer\"></span</div>\n </div>`;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n const chartComponent = this;\n const chartID = `chart-${Date.now() + (Math.floor(Math.random() * 100) + 1)}`;\n const orginalTable = this.querySelector('table');\n const clonedTable = orginalTable.cloneNode(true);\n const chart = this.shadowRoot.querySelector('.chart');\n const chartOuter = this.shadowRoot.querySelector('.chart__outer');\n const barCount = chart.querySelectorAll('td:not(:first-child)').length;\n chart.appendChild(clonedTable);\n addClasses(chartComponent, chartOuter);\n if (barCount <= 10) {\n chartComponent.classList.add('chart--fit-content');\n }\n if (barCount <= 5) {\n chartComponent.classList.add('chart--no-scale');\n }\n setupChart(chartComponent, chartOuter, clonedTable);\n setEventObservers(chartComponent, chartOuter);\n setEventListener(chartComponent, chartOuter);\n setLongestLabel(chartOuter);\n setLongestValue(chartOuter);\n createTooltips(chartOuter);\n trackComponent(chartComponent, \"iam-barchart\", ['view-change']);\n }\n attributeChangedCallback(attrName, oldVal, newVal) {\n }\n}\nexport default iamBarChart;\n"],"names":["addClasses","chartElement","chartOuter","i","colour","element","setupChart","tableElement","chartKey","chartGuidelines","chartYaxis","xaxis","getChartData","setCellData","createChartKey","createChartGuidelines","createChartYaxis","createXaxis","setEventListener","chart","event","rect","x","y","labels","label","table","shadowTable","eventTarget","customEvent","_a","setEventObservers","attributesUpdated","mutationList","observer","observer2","mutation","tableUpdated","min","max","getLargestValue","yaxis","guidelines","selector","values","largestValue","getValues","value","start","cleanValue","percent","axis","bottom","tr","rowValue","td","index","group","rowMin","rowMax","minBottom","content","setLongestLabel","chartWrapper","chartSpacer","longestLabel","setLongestValue","longestValue","chartID","previousInput","headings","arrayElement","createChartKeyItem","text","input","chartXaxis","createTooltips","titles","title","tooltipId","trackComponentRegistered","componentName","trackComponent","component","trackEvents","eventName","eventDetails","eventKey","eventDetail","iamBarChart","template","chartComponent","clonedTable","barCount","attrName","oldVal","newVal"],"mappings":"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"}
|