@iamproperty/components 7.7.1--beta3 → 7.7.1--beta5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/css/components/actionbar.component.css +1 -1
- package/assets/css/components/actionbar.component.css.map +1 -1
- package/assets/css/components/address-lookup.component.css +1 -1
- package/assets/css/components/address-lookup.component.css.map +1 -1
- package/assets/css/components/applied-filters.css +1 -1
- package/assets/css/components/applied-filters.css.map +1 -1
- package/assets/css/components/barchart.component.css +1 -1
- package/assets/css/components/barchart.component.css.map +1 -1
- package/assets/css/components/calendar.component.css +1 -1
- package/assets/css/components/calendar.component.css.map +1 -1
- package/assets/css/components/card.component.css +1 -1
- package/assets/css/components/card.component.css.map +1 -1
- package/assets/css/components/carousel.component.css +1 -1
- package/assets/css/components/carousel.component.css.map +1 -1
- package/assets/css/components/collapsible-side.css +1 -1
- package/assets/css/components/collapsible-side.css.map +1 -1
- package/assets/css/components/config.component.css +1 -1
- package/assets/css/components/config.component.css.map +1 -1
- package/assets/css/components/content.component.css +1 -1
- package/assets/css/components/content.component.css.map +1 -1
- package/assets/css/components/doughnutchart.component.css +1 -1
- package/assets/css/components/doughnutchart.component.css.map +1 -1
- package/assets/css/components/fileupload.css +1 -1
- package/assets/css/components/fileupload.css.map +1 -1
- package/assets/css/components/inline-edit.css +1 -1
- package/assets/css/components/inline-edit.css.map +1 -1
- package/assets/css/components/modal.component.css +1 -1
- package/assets/css/components/modal.component.css.map +1 -1
- package/assets/css/components/multi-step-modal.component.css +1 -1
- package/assets/css/components/multi-step-modal.component.css.map +1 -1
- package/assets/css/components/multiselect.css +1 -1
- package/assets/css/components/multiselect.css.map +1 -1
- package/assets/css/components/nav.component.css +1 -1
- package/assets/css/components/nav.component.css.map +1 -1
- package/assets/css/components/pagination.css +1 -1
- package/assets/css/components/pagination.css.map +1 -1
- package/assets/css/components/split-button.component.css +1 -1
- package/assets/css/components/split-button.component.css.map +1 -1
- package/assets/css/components/tabs.component.css +1 -1
- package/assets/css/components/tabs.component.css.map +1 -1
- package/assets/css/components/tabs.config.css +1 -1
- package/assets/css/components/tabs.config.css.map +1 -1
- package/assets/css/components/video-card.component.css +1 -1
- package/assets/css/components/video-card.component.css.map +1 -1
- package/assets/css/components/video-modal.component.css +1 -1
- package/assets/css/components/video-modal.component.css.map +1 -1
- package/assets/css/components/video.component.css +1 -0
- package/assets/css/components/video.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/elements/badge-tag.css +1 -1
- package/assets/css/elements/badge-tag.css.map +1 -1
- package/assets/css/elements/buttons--action.css +1 -1
- package/assets/css/elements/buttons--action.css.map +1 -1
- package/assets/css/elements/buttons--global.css +1 -1
- package/assets/css/elements/buttons--global.css.map +1 -1
- package/assets/css/elements/buttons.css +1 -1
- package/assets/css/elements/buttons.css.map +1 -1
- package/assets/css/elements/links.css +1 -1
- package/assets/css/elements/links.css.map +1 -1
- package/assets/css/style.min.css +1 -1
- package/assets/css/style.min.css.map +1 -1
- package/assets/js/components/accordion/accordion.component.min.js +1 -1
- package/assets/js/components/actionbar/actionbar.component.min.js +2 -2
- package/assets/js/components/address-lookup/address-lookup.component.min.js +4 -4
- package/assets/js/components/address-lookup/address-lookup.component.min.js.map +1 -1
- package/assets/js/components/advanced-select/advanced-select.component.js +21 -7
- package/assets/js/components/advanced-select/advanced-select.component.min.js +4 -4
- package/assets/js/components/advanced-select/advanced-select.component.min.js.map +1 -1
- package/assets/js/components/applied-filters/applied-filters.component.min.js +2 -2
- package/assets/js/components/barchart/barchart.component.min.js +6 -6
- package/assets/js/components/barchart/barchart.component.min.js.map +1 -1
- package/assets/js/components/bento-grid/bento-grid.component.min.js +1 -1
- package/assets/js/components/calendar/calendar.component.min.js +2 -2
- package/assets/js/components/card/card.component.min.js +2 -2
- package/assets/js/components/carousel/carousel.component.min.js +3 -3
- package/assets/js/components/collapsible-side/collapsible-side.component.min.js +2 -2
- package/assets/js/components/config/config.component.min.js +2 -2
- package/assets/js/components/content/content.component.min.js +2 -2
- package/assets/js/components/darkmode/darkmode.component.min.js +1 -1
- package/assets/js/components/doughnutchart/doughnutchart.component.min.js +4 -4
- package/assets/js/components/fileupload/fileupload.component.min.js +2 -2
- package/assets/js/components/filter-card/filter-card.component.min.js +1 -1
- package/assets/js/components/filterlist/filterlist.component.min.js +1 -1
- package/assets/js/components/form/form.component.min.js +1 -1
- package/assets/js/components/header/header.component.min.js +1 -1
- package/assets/js/components/inline-edit/inline-edit.component.min.js +4 -4
- package/assets/js/components/input/input.component.min.js +1 -1
- package/assets/js/components/input-range/input-range.component.min.js +1 -1
- package/assets/js/components/marketing/marketing.component.min.js +1 -1
- package/assets/js/components/menu/menu.component.min.js +1 -1
- package/assets/js/components/milestone/milestone.component.min.js +1 -1
- package/assets/js/components/milestone-group/milestone-group.component.min.js +1 -1
- package/assets/js/components/modal/modal.component.js +2 -2
- package/assets/js/components/modal/modal.component.min.js +4 -4
- package/assets/js/components/modal/modal.component.min.js.map +1 -1
- package/assets/js/components/multi-step/multi-step.component.min.js +1 -1
- package/assets/js/components/multi-step-modal/multi-step-modal.component.min.js +2 -2
- package/assets/js/components/multiselect/multiselect.component.min.js +2 -2
- package/assets/js/components/nav/nav.component.min.js +2 -2
- package/assets/js/components/notification/notification.component.min.js +1 -1
- package/assets/js/components/pagination/pagination.component.min.js +2 -2
- package/assets/js/components/password/password.component.min.js +1 -1
- package/assets/js/components/popover/popover.component.min.js +1 -1
- package/assets/js/components/rank/rank.component.min.js +1 -1
- package/assets/js/components/rankings/rankings.component.min.js +1 -1
- package/assets/js/components/rating/rating.component.min.js +1 -1
- package/assets/js/components/record-card/record-card.component.min.js +1 -1
- package/assets/js/components/search/search.component.min.js +5 -5
- package/assets/js/components/search/search.component.min.js.map +1 -1
- package/assets/js/components/slider/slider.component.min.js +1 -1
- package/assets/js/components/split-button/split-button.component.min.js +2 -2
- package/assets/js/components/std-address-lookup/std-address-lookup.component.min.js +8 -8
- package/assets/js/components/std-address-lookup/std-address-lookup.component.min.js.map +1 -1
- package/assets/js/components/table/table.component.min.js +1 -1
- package/assets/js/components/table-ajax/table-ajax.component.min.js +1 -1
- package/assets/js/components/table-basic/table-basic.component.min.js +1 -1
- package/assets/js/components/table-no-submit/table-no-submit.component.min.js +1 -1
- package/assets/js/components/table-submit/table-submit.component.min.js +1 -1
- package/assets/js/components/tabs/tabs.component.js +13 -0
- package/assets/js/components/tabs/tabs.component.min.js +4 -4
- package/assets/js/components/tabs/tabs.component.min.js.map +1 -1
- package/assets/js/components/tag/tag.component.min.js +1 -1
- package/assets/js/components/tooltip/tooltip.component.min.js +1 -1
- package/assets/js/components/video/video.component.js +67 -0
- package/assets/js/components/video/video.component.min.js +21 -0
- package/assets/js/components/video/video.component.min.js.map +1 -0
- package/assets/js/components/video-card/video-card.component.js +42 -59
- package/assets/js/components/video-card/video-card.component.min.js +15 -7
- package/assets/js/components/video-card/video-card.component.min.js.map +1 -1
- package/assets/js/components/video-modal/video-modal.component.js +10 -44
- package/assets/js/components/video-modal/video-modal.component.min.js +12 -6
- package/assets/js/components/video-modal/video-modal.component.min.js.map +1 -1
- package/assets/js/components/word-count/word-count.component.min.js +1 -1
- package/assets/js/modules/advanced-select.js +31 -8
- package/assets/js/modules/modal.js +4 -2
- package/assets/js/modules/videos.js +42 -0
- package/assets/js/scripts.bundle.js +1 -1
- package/assets/js/scripts.bundle.min.js +1 -1
- package/assets/sass/_components.scss +1 -1
- package/assets/sass/components/tabs.component.scss +25 -0
- package/assets/sass/components/tabs.config.scss +5 -1
- package/assets/sass/components/video-card.component.scss +36 -62
- package/assets/sass/components/video-modal.component.scss +6 -4
- package/assets/sass/components/video.component.scss +75 -0
- package/assets/sass/elements/badge-tag.css +1 -1
- package/assets/sass/elements/buttons--action.css +17 -0
- package/assets/sass/elements/buttons--global.scss +5 -1
- package/assets/sass/elements/links.scss +53 -31
- package/assets/sass/foundations/animations.scss +1 -1
- package/assets/ts/components/advanced-select/advanced-select.component.ts +25 -7
- package/assets/ts/components/modal/modal.component.ts +2 -2
- package/assets/ts/components/tabs/tabs.component.ts +19 -0
- package/assets/ts/components/video/video.component.ts +74 -0
- package/assets/ts/components/video-card/video-card.component.ts +54 -75
- package/assets/ts/components/video-modal/video-modal.component.ts +10 -59
- package/assets/ts/modules/advanced-select.ts +38 -17
- package/assets/ts/modules/modal.ts +4 -2
- package/assets/ts/modules/videos.ts +57 -0
- package/dist/components.es.js +25 -25
- package/dist/components.umd.js +163 -133
- package/package.json +1 -1
- package/src/components/Video/Video.vue +22 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"advanced-select.component.min.js","sources":["../../modules/advanced-select.js","../../modules/helpers.js","advanced-select.component.js"],"sourcesContent":["function advancedSelect(advancedSelect, displayInputField, datalist, isSearch = false) {\n let currentFocus = -1;\n const datalistWrapper = datalist.closest('.datalist__wrapper') ? datalist.closest('.datalist__wrapper') : datalist;\n // Hide the default datalist\n displayInputField.setAttribute('data-list', displayInputField.getAttribute('list'));\n displayInputField.setAttribute('list', '');\n if (displayInputField.hasAttribute('placeholder'))\n displayInputField.setAttribute('data-placeholder', displayInputField.getAttribute('placeholder'));\n if (displayInputField.hasAttribute('placeholder'))\n displayInputField.setAttribute('data-original-placeholder', displayInputField.getAttribute('placeholder'));\n displayInputField.addEventListener('focus', function () {\n if (displayInputField.value != \"\") {\n displayInputField.setAttribute('placeholder', displayInputField.value);\n displayInputField.setAttribute('data-value', displayInputField.value);\n }\n displayInputField.value = '';\n });\n displayInputField.addEventListener('keyup', function () {\n if (displayInputField.value != \"\") {\n displayInputField.setAttribute('data-value', displayInputField.value);\n }\n });\n displayInputField.addEventListener('blur', function () {\n if (displayInputField.hasAttribute('data-value')) {\n displayInputField.value = displayInputField.getAttribute('data-value');\n }\n if (displayInputField.hasAttribute('data-placeholder'))\n displayInputField.setAttribute('placeholder', displayInputField.getAttribute('data-placeholder'));\n });\n for (const option of datalist.options) {\n if (option.innerHTML == '')\n option.innerHTML = option.value;\n }\n datalist.addEventListener('click', function (event) {\n if (event && event.target instanceof HTMLElement && event.target.closest('option')) {\n const option = event.target.closest('option');\n displayInputField.value = option.value;\n if (typeof window.triggerDynamicEvent == 'function')\n window.triggerDynamicEvent(displayInputField);\n for (const optionInner of datalist.options) {\n optionInner.classList.remove('active');\n }\n option.classList.add('active');\n setTimeout(() => {\n advancedSelect.dispatchEvent(new CustomEvent('update-value', {\n detail: { value: option.value },\n }));\n }, 0);\n }\n });\n displayInputField.addEventListener('input', function () {\n displayInputField.removeAttribute('data-value');\n currentFocus = -1;\n if (advancedSelect.tagName != \"IAM-ADDRESS-LOOKUP\") {\n const text = displayInputField.value.toUpperCase();\n for (const option of datalist.options) {\n if (option.value.toUpperCase().indexOf(text) > -1) {\n option.style.display = 'block';\n option.classList.remove('hide');\n }\n else {\n option.style.display = 'none';\n option.classList.add('hide');\n }\n }\n }\n });\n advancedSelect.addEventListener('keydown', function (e) {\n if (e.keyCode == 40) {\n currentFocus++;\n addActive(datalist.options);\n }\n else if (e.keyCode == 38) {\n currentFocus--;\n addActive(datalist.options);\n }\n else if (e.keyCode == 13) {\n e.preventDefault();\n if (currentFocus > -1) {\n /*and simulate a click on the \"active\" item:*/\n if (datalist.options)\n datalist.options[currentFocus].click();\n }\n }\n });\n function addActive(x) {\n if (!x)\n return false;\n removeActive(x);\n if (currentFocus >= x.length)\n currentFocus = 0;\n if (currentFocus < 0)\n currentFocus = x.length - 1;\n x[currentFocus].classList.add('active');\n }\n function removeActive(x) {\n if (!x)\n return false;\n for (let i = 0; i < x.length; i++) {\n x[i].classList.remove('active');\n }\n }\n // Add the empty button\n displayInputField\n .closest('label')\n .insertAdjacentHTML('beforeend', '<button class=\"empty btn btn-action\" type=\"button\"><i class=\"fa-light fa-times me-0\"></i></button>');\n const emptyField = () => {\n displayInputField.removeAttribute('placeholder');\n if (displayInputField.hasAttribute('data-original-placeholder'))\n displayInputField.setAttribute('placeholder', displayInputField.getAttribute('data-original-placeholder'));\n displayInputField.removeAttribute('data-value');\n displayInputField.value = '';\n for (const optionInner of datalist.options) {\n optionInner.classList.remove('active');\n optionInner.removeAttribute('style');\n }\n const updateEvent = new CustomEvent('close-button-pressed');\n advancedSelect.dispatchEvent(updateEvent);\n };\n const closeBtn = advancedSelect.querySelector('.empty') ? advancedSelect.querySelector('.empty') : advancedSelect.shadowRoot.querySelector('.empty');\n closeBtn.addEventListener('click', function (e) {\n emptyField();\n });\n advancedSelect.addEventListener('empty', function (e) {\n emptyField();\n });\n}\nexport default advancedSelect;\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};\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 () {\n checkElements(location.hash);\n }, false);\n addEventListener('popstate', (event) => {\n if (event && event.state && event.state.type && event.state.type == 'pagination') {\n const form = document.querySelector(`#${event.state.form}`);\n const 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 Array.from(document.querySelectorAll('form')).forEach((form) => {\n if (!(form === null || form === void 0 ? void 0 : form.closest('iam-form'))) {\n form.addEventListener('submit', (event) => {\n var _a;\n if (form.querySelector(':invalid')) {\n form.classList.add('was-validated');\n (_a = form === null || form === void 0 ? void 0 : form.querySelector('input:invalid')) === null || _a === void 0 ? void 0 : _a.scrollIntoView();\n event.preventDefault();\n }\n });\n }\n });\n document.addEventListener('click', (event) => {\n var _a;\n if (event && event.target instanceof HTMLElement && event.target.matches('form button:not([type=button])')) {\n const form = event.target.closest('form');\n if (!(form === null || form === void 0 ? void 0 : form.closest('iam-form'))) {\n // Reset password types\n Array.from(form.querySelectorAll('[data-password-type]')).forEach((input) => {\n input.setAttribute('type', 'password');\n });\n if (form.querySelector(':invalid') ||\n form.querySelector('.pwd-checker[data-strength=\"1\"]') ||\n form.querySelector('.pwd-checker[data-strength=\"2\"]')) {\n form.classList.add('was-validated');\n (_a = form === null || form === void 0 ? void 0 : form.querySelector('input:invalid')) === null || _a === void 0 ? void 0 : _a.scrollIntoView();\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 });\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) => {\n const label = progress.closest('label');\n label.setAttribute('data-percent', progress.getAttribute('value'));\n });\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\n .split(' ')\n .map((s) => ucfirst(s))\n .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 const convertStart = startDateString.split('/');\n const convertEnd = endDateString.split('/');\n const dateStart = new Date(convertStart[1] + '/' + convertStart[0] + '/' + convertStart[2]);\n const 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 const diffTime = dateEnd.getTime() - dateStart.getTime();\n const 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\n // eslint-disable-next-line no-useless-escape\n .split(/[\\.\\[\\]\\'\\\"]/)\n .filter((p) => p)\n .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 const pageWidth = window.innerWidth || document.body.clientWidth;\n const treshold = Math.max(1, Math.floor(0.01 * pageWidth));\n const x = touchendX - touchstartX;\n const y = touchendY - touchstartY;\n const xy = Math.abs(x / y);\n const 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};\nexport const uniqueID = (index = 1) => {\n const ID = Math.floor(Math.random() * Date.now() * (index + 1));\n return ID;\n};\nexport const isValidPostcode = (searchValue) => {\n const regexp = /^([A-Z][A-HJ-Y]?[0-9][A-Z0-9]? ?[0-9][A-Z]{2}|GIR ?0A{2})$/gmi;\n return regexp.test(searchValue.trim());\n};\n","import advancedSelect from '../../modules/advanced-select.js';\nimport { safeID } from '../../modules/helpers.js';\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n event: 'customElementRegistered',\n element: 'Advanced select',\n});\nclass iamAdvancedSelect extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css')\n ? document.body.getAttribute('data-core-css')\n : `${assetLocation}/css/core.min.css`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n input {\n background: red;\n }\n input:not(.is-invalid):not(:invalid) {\n background: none!important;\n }\n .optional-text {\n display: none;\n } \n .js-hide {\n display: none !important;\n }\n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\" />\n <slot></slot>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n var _a;\n // Clone original input field, re-name and use for display purposes\n const inputField = this.querySelector('input');\n if (!inputField)\n return;\n const displayInputField = inputField.cloneNode();\n displayInputField.setAttribute('name', `${inputField.getAttribute('name')}Alt`);\n inputField.removeAttribute('data-change-events');\n displayInputField.removeAttribute('id');\n let datalist = this.querySelector('datalist');\n inputField.after(displayInputField);\n // Hide original input field\n inputField.setAttribute('type', 'hidden');\n // if data list does not exist then create one and append\n if (!datalist) {\n datalist = document.createElement('datalist');\n const listID = safeID('list');\n datalist.setAttribute('id', listID);\n searchWrapper.appendChild(datalist);\n displayInputField.setAttribute('list', listID);\n }\n if (datalist.querySelector(`[value=\"${inputField.value}\"]`))\n (_a = datalist.querySelector(`[value=\"${inputField.value}\"]`)) === null || _a === void 0 ? void 0 : _a.classList.add('active');\n advancedSelect(this, displayInputField, datalist);\n // Apply initial value passed to the component host\n const initialValue = this.getAttribute('value') || '';\n if (!initialValue)\n return;\n inputField.value = initialValue;\n inputField.setAttribute('value', initialValue);\n displayInputField.value = '';\n displayInputField.setAttribute('placeholder', initialValue);\n displayInputField.setAttribute('data-value', initialValue);\n if (datalist) {\n Array.from(datalist.querySelectorAll('option')).forEach((option) => {\n const isMatch = option.getAttribute('value') === initialValue;\n option.classList.toggle('active', isMatch);\n });\n }\n }\n}\nexport default iamAdvancedSelect;\n"],"names":["advancedSelect","displayInputField","datalist","isSearch","currentFocus","option","event","optionInner","text","addActive","x","removeActive","i","emptyField","updateEvent","snake","str","safeID","iamAdvancedSelect","assetLocation","coreCSS","template","_a","inputField","listID","initialValue","isMatch"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"advanced-select.component.min.js","sources":["../../modules/advanced-select.js","../../modules/helpers.js","advanced-select.component.js"],"sourcesContent":["function advancedSelect(advancedSelect, displayInputField, datalist, isSearch = false) {\n let currentFocus = -1;\n const datalistWrapper = datalist.closest('.datalist__wrapper') ? datalist.closest('.datalist__wrapper') : datalist;\n // Hide the default datalist\n displayInputField.setAttribute('data-list', displayInputField.getAttribute('list'));\n displayInputField.setAttribute('list', '');\n if (displayInputField.hasAttribute('placeholder'))\n displayInputField.setAttribute('data-placeholder', displayInputField.getAttribute('placeholder'));\n if (displayInputField.hasAttribute('placeholder'))\n displayInputField.setAttribute('data-original-placeholder', displayInputField.getAttribute('placeholder'));\n displayInputField.addEventListener('focus', function () {\n if (displayInputField.value != \"\") {\n displayInputField.setAttribute('placeholder', displayInputField.value);\n displayInputField.setAttribute('data-value', displayInputField.value);\n }\n displayInputField.value = '';\n });\n displayInputField.addEventListener('blur', function () {\n if (displayInputField.hasAttribute('data-value')) {\n displayInputField.value = displayInputField.getAttribute('data-value');\n }\n if (displayInputField.hasAttribute('data-placeholder'))\n displayInputField.setAttribute('placeholder', displayInputField.getAttribute('data-placeholder'));\n });\n for (const option of datalist.options) {\n if (option.innerHTML == '')\n option.innerHTML = option.value;\n }\n datalist.addEventListener('click', function (event) {\n var _a;\n if (event && event.target instanceof HTMLElement && event.target.closest('option')) {\n const option = event.target.closest('option');\n const optionText = ((_a = option.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || option.value;\n // Store actual value on the original input\n const originalInput = advancedSelect.querySelector('input[type=\"hidden\"]');\n if (originalInput) {\n originalInput.value = option.value;\n originalInput.setAttribute('value', option.value);\n }\n // Show label text in the visible field\n displayInputField.value = optionText;\n displayInputField.setAttribute('data-value', optionText);\n displayInputField.setAttribute('placeholder', optionText);\n if (typeof window.triggerDynamicEvent == 'function')\n window.triggerDynamicEvent(displayInputField);\n for (const optionInner of datalist.options) {\n optionInner.classList.remove('active');\n }\n option.classList.add('active');\n setTimeout(() => {\n advancedSelect.dispatchEvent(new CustomEvent('update-value', {\n detail: {\n value: option.value,\n text: optionText,\n },\n }));\n }, 0);\n }\n });\n displayInputField.addEventListener('input', function () {\n displayInputField.removeAttribute('data-value');\n currentFocus = -1;\n if (advancedSelect.tagName != \"IAM-ADDRESS-LOOKUP\") {\n const text = displayInputField.value.toUpperCase();\n for (const option of datalist.options) {\n const optionText = (option.textContent || option.value).toUpperCase();\n if (optionText.indexOf(text) > -1) {\n option.style.display = 'block';\n option.classList.remove('hide');\n }\n else {\n option.style.display = 'none';\n option.classList.add('hide');\n }\n }\n }\n });\n advancedSelect.addEventListener('keydown', function (e) {\n if (e.keyCode == 40) {\n currentFocus++;\n addActive(datalist.options);\n }\n else if (e.keyCode == 38) {\n currentFocus--;\n addActive(datalist.options);\n }\n else if (e.keyCode == 13) {\n e.preventDefault();\n if (currentFocus > -1) {\n /*and simulate a click on the \"active\" item:*/\n if (datalist.options)\n datalist.options[currentFocus].click();\n }\n }\n });\n function addActive(x) {\n if (!x)\n return false;\n removeActive(x);\n if (currentFocus >= x.length)\n currentFocus = 0;\n if (currentFocus < 0)\n currentFocus = x.length - 1;\n x[currentFocus].classList.add('active');\n }\n function removeActive(x) {\n if (!x)\n return false;\n for (let i = 0; i < x.length; i++) {\n x[i].classList.remove('active');\n }\n }\n // Add the empty button\n displayInputField\n .closest('label')\n .insertAdjacentHTML('beforeend', '<button class=\"empty btn btn-action\" type=\"button\"><i class=\"fa-light fa-times me-0\"></i></button>');\n const emptyField = () => {\n const originalInput = advancedSelect.querySelector('input[type=\"hidden\"]');\n if (originalInput) {\n originalInput.value = '';\n originalInput.setAttribute('value', '');\n }\n displayInputField.removeAttribute('placeholder');\n if (displayInputField.hasAttribute('data-original-placeholder'))\n displayInputField.setAttribute('placeholder', displayInputField.getAttribute('data-original-placeholder'));\n displayInputField.removeAttribute('data-value');\n displayInputField.value = '';\n for (const optionInner of datalist.options) {\n optionInner.classList.remove('active');\n optionInner.classList.remove('hide');\n optionInner.removeAttribute('style');\n }\n const updateEvent = new CustomEvent('close-button-pressed');\n advancedSelect.dispatchEvent(updateEvent);\n // Notify consumers the value was cleared\n advancedSelect.dispatchEvent(new CustomEvent('update-value', {\n detail: {\n value: '',\n text: '',\n },\n }));\n };\n const closeBtn = advancedSelect.querySelector('.empty') ? advancedSelect.querySelector('.empty') : advancedSelect.shadowRoot.querySelector('.empty');\n closeBtn.addEventListener('click', function (e) {\n emptyField();\n });\n advancedSelect.addEventListener('empty', function (e) {\n emptyField();\n });\n}\nexport default advancedSelect;\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};\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 () {\n checkElements(location.hash);\n }, false);\n addEventListener('popstate', (event) => {\n if (event && event.state && event.state.type && event.state.type == 'pagination') {\n const form = document.querySelector(`#${event.state.form}`);\n const 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 Array.from(document.querySelectorAll('form')).forEach((form) => {\n if (!(form === null || form === void 0 ? void 0 : form.closest('iam-form'))) {\n form.addEventListener('submit', (event) => {\n var _a;\n if (form.querySelector(':invalid')) {\n form.classList.add('was-validated');\n (_a = form === null || form === void 0 ? void 0 : form.querySelector('input:invalid')) === null || _a === void 0 ? void 0 : _a.scrollIntoView();\n event.preventDefault();\n }\n });\n }\n });\n document.addEventListener('click', (event) => {\n var _a;\n if (event && event.target instanceof HTMLElement && event.target.matches('form button:not([type=button])')) {\n const form = event.target.closest('form');\n if (!(form === null || form === void 0 ? void 0 : form.closest('iam-form'))) {\n // Reset password types\n Array.from(form.querySelectorAll('[data-password-type]')).forEach((input) => {\n input.setAttribute('type', 'password');\n });\n if (form.querySelector(':invalid') ||\n form.querySelector('.pwd-checker[data-strength=\"1\"]') ||\n form.querySelector('.pwd-checker[data-strength=\"2\"]')) {\n form.classList.add('was-validated');\n (_a = form === null || form === void 0 ? void 0 : form.querySelector('input:invalid')) === null || _a === void 0 ? void 0 : _a.scrollIntoView();\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 });\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) => {\n const label = progress.closest('label');\n label.setAttribute('data-percent', progress.getAttribute('value'));\n });\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\n .split(' ')\n .map((s) => ucfirst(s))\n .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 const convertStart = startDateString.split('/');\n const convertEnd = endDateString.split('/');\n const dateStart = new Date(convertStart[1] + '/' + convertStart[0] + '/' + convertStart[2]);\n const 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 const diffTime = dateEnd.getTime() - dateStart.getTime();\n const 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\n // eslint-disable-next-line no-useless-escape\n .split(/[\\.\\[\\]\\'\\\"]/)\n .filter((p) => p)\n .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 const pageWidth = window.innerWidth || document.body.clientWidth;\n const treshold = Math.max(1, Math.floor(0.01 * pageWidth));\n const x = touchendX - touchstartX;\n const y = touchendY - touchstartY;\n const xy = Math.abs(x / y);\n const 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};\nexport const uniqueID = (index = 1) => {\n const ID = Math.floor(Math.random() * Date.now() * (index + 1));\n return ID;\n};\nexport const isValidPostcode = (searchValue) => {\n const regexp = /^([A-Z][A-HJ-Y]?[0-9][A-Z0-9]? ?[0-9][A-Z]{2}|GIR ?0A{2})$/gmi;\n return regexp.test(searchValue.trim());\n};\n","import advancedSelect from '../../modules/advanced-select.js';\nimport { safeID } from '../../modules/helpers.js';\n// Data layer Web component created\nwindow.dataLayer = window.dataLayer || [];\nwindow.dataLayer.push({\n event: 'customElementRegistered',\n element: 'Advanced select',\n});\nclass iamAdvancedSelect extends HTMLElement {\n constructor() {\n super();\n this.attachShadow({ mode: 'open' });\n const assetLocation = document.body.hasAttribute('data-assets-location')\n ? document.body.getAttribute('data-assets-location')\n : '/assets';\n const coreCSS = document.body.hasAttribute('data-core-css')\n ? document.body.getAttribute('data-core-css')\n : `${assetLocation}/css/core.min.css`;\n const template = document.createElement('template');\n template.innerHTML = `\n <style>\n @import \"${coreCSS}\";\n input {\n background: red;\n }\n input:not(.is-invalid):not(:invalid) {\n background: none!important;\n }\n .optional-text {\n display: none;\n } \n .js-hide {\n display: none !important;\n }\n </style>\n <link rel=\"stylesheet\" href=\"https://kit.fontawesome.com/8bd0fca975.css\" crossorigin=\"anonymous\" />\n <slot></slot>\n `;\n this.shadowRoot.appendChild(template.content.cloneNode(true));\n }\n connectedCallback() {\n var _a, _b;\n // Clone original input field, re-name and use for display purposes\n const inputField = this.querySelector('input');\n if (!inputField)\n return;\n const displayInputField = inputField.cloneNode();\n displayInputField.value = '';\n displayInputField.removeAttribute('value');\n displayInputField.setAttribute('name', `${inputField.getAttribute('name')}Alt`);\n inputField.removeAttribute('data-change-events');\n displayInputField.removeAttribute('id');\n let datalist = this.querySelector('datalist');\n inputField.after(displayInputField);\n // Hide original input field\n inputField.setAttribute('type', 'hidden');\n // if data list does not exist then create one and append\n if (!datalist) {\n datalist = document.createElement('datalist');\n const listID = safeID('list');\n datalist.setAttribute('id', listID);\n searchWrapper.appendChild(datalist);\n displayInputField.setAttribute('list', listID);\n }\n else {\n displayInputField.setAttribute('list', datalist.id);\n }\n if (datalist && datalist.querySelector(`[value=\"${inputField.value}\"]`)) {\n (_a = datalist.querySelector(`[value=\"${inputField.value}\"]`)) === null || _a === void 0 ? void 0 : _a.classList.add('active');\n }\n advancedSelect(this, displayInputField, datalist);\n // Apply initial value passed to the component host or original input\n const initialValue = this.getAttribute('value') || inputField.value || '';\n if (!initialValue)\n return;\n inputField.value = initialValue;\n inputField.setAttribute('value', initialValue);\n let displayValue = initialValue;\n if (datalist) {\n const selectedOption = Array.from(datalist.querySelectorAll('option')).find((option) => {\n return option.getAttribute('value') === initialValue;\n });\n if (selectedOption) {\n displayValue = ((_b = selectedOption.textContent) === null || _b === void 0 ? void 0 : _b.trim()) || selectedOption.value;\n }\n Array.from(datalist.querySelectorAll('option')).forEach((option) => {\n const isMatch = option.getAttribute('value') === initialValue;\n option.classList.toggle('active', isMatch);\n });\n }\n displayInputField.value = displayValue;\n displayInputField.setAttribute('placeholder', displayValue);\n displayInputField.setAttribute('data-value', displayValue);\n displayInputField.removeAttribute('value');\n }\n}\nexport default iamAdvancedSelect;\n"],"names":["advancedSelect","displayInputField","datalist","isSearch","currentFocus","option","event","_a","optionText","originalInput","optionInner","text","addActive","x","removeActive","i","emptyField","updateEvent","snake","str","safeID","iamAdvancedSelect","assetLocation","coreCSS","template","_b","inputField","listID","initialValue","displayValue","selectedOption","isMatch"],"mappings":"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"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.7.1--
|
|
2
|
+
* iamKey v7.7.1--beta5
|
|
3
3
|
* Copyright 2022-2026 iamproperty
|
|
4
4
|
*/function E(t,m){const g=t.closest("dialog"),b=(e,o,r=!1)=>{let s=!1,a=o.getAttribute("name");if(!a)return!1;a.includes("[]")&&(a=a.replace("[]",`[${o.value}]`));let l=e.querySelector(`[data-name="${a}"]`);l&&o.getAttribute("type")=="checkbox"&&(s=!o.checked);const c=o.getAttribute("data-filter-text");if(l||(l=document.createElement("button"),e.appendChild(l)),l.setAttribute("type","button"),l.classList.add("filter"),l.classList.add("tag"),r||l.classList.add("tag--not-set"),l.setAttribute("data-name",a),l.innerHTML=c.replace("$value",o.value),(!o.value||s)&&l.remove(),o.parentNode.closest("[data-filter-text]")){const i=o.parentNode.closest("[data-filter-text]");let v=!0;if(a="",i.querySelectorAll("input").forEach((u,n)=>{const p=u.getAttribute("name");if(a+=`${n!=0?",":""}${p}`,e.querySelector(`[data-name="${p}"]`)&&e.querySelector(`[data-name="${p}"]`).remove(),u.value){const d=document.createElement("button");d.setAttribute("type","button"),d.classList.add("filter"),d.classList.add("tag"),r||l.classList.add("tag--not-set"),d.setAttribute("data-name",p),d.innerHTML=c.replace("$value",u.value),e.appendChild(d)}else v=!1}),e.querySelector(`[data-name="${a}"]`)&&e.querySelector(`[data-name="${a}"]`).remove(),v){let u=i.getAttribute("data-filter-text");i.querySelectorAll("input").forEach((p,d)=>{const y=p.getAttribute("name");e.querySelector(`[data-name="${y}"]`)&&e.querySelector(`[data-name="${y}"]`).remove(),u=u.replace(`$${d+1}`,p.value)});const n=document.createElement("button");n.setAttribute("type","button"),n.classList.add("filter"),n.classList.add("tag"),r||l.classList.add("tag--not-set"),n.setAttribute("data-name",a),n.innerHTML=u,e.appendChild(n)}}},f=(e=!1)=>{m.innerHTML="",Array.from(t.querySelectorAll('input:is([type="checkbox"],[type="radio"]):checked, input:not([type="checkbox"], [type="radio"])')).forEach(o=>{b(m,o,e)})};f(!0),Array.from(t.querySelectorAll("input[data-filter-text]")).forEach(e=>{e.addEventListener("change",function(o){var r;const s=!t.closest("dialog");if(!t.hasAttribute("data-keep-same")&&!t.querySelector("dialog")&&b(m,e,s),s){const a=new CustomEvent("update");(r=t.parentElement.closest("iam-applied-filters"))===null||r===void 0||r.dispatchEvent(a)}})});const h=e=>{if(!e?.hasAttribute("data-name"))return!1;const o=e.getAttribute("data-name").split(",");for(let r=0;r<o.length;r++){const s=o[r];let a=`[name="${s}"]`;s.match(/\[(.*)\]/)&&(a=`[value="${s.replace(/.*\[(.*)\]/,"$1")}"]`);const l=t.querySelectorAll(a);for(let c=0;c<l.length;c++){const i=l[c];i.getAttribute("type")!="radio"&&i.getAttribute("type")!="checkbox"?i.value="":i.checked=!1;const v=new CustomEvent("change");i?.dispatchEvent(v)}}e.remove(),f()};if(m.addEventListener("click",function(e){if(e&&e.target instanceof HTMLElement&&e.target.closest(".filter")){const o=e.target.closest(".filter"),r=o.getAttribute("data-name");h(o);const s=new CustomEvent("filter-clicked",{detail:r});if(t.dispatchEvent(s),t.querySelector("dialog iam-applied-filters")){const a=new CustomEvent("filter",{detail:r});t.querySelector("dialog iam-applied-filters").dispatchEvent(a)}}},!1),t.addEventListener("filter",e=>{const o=t.shadowRoot.querySelector(`[data-name="${e.detail}"]`);h(o)}),t.addEventListener("set-filters",e=>{f(!0)}),g){const e=t.querySelector(".btn-primary")?t.querySelector(".btn-primary"):t.shadowRoot.querySelector(".btn-primary");e?.addEventListener("click",o=>{const r=new CustomEvent("update"),s=new CustomEvent("submit");if(t.dispatchEvent(s),t.parentElement.closest("iam-applied-filters")&&t.parentElement.closest("iam-applied-filters").dispatchEvent(r),t.parentElement&&t.parentElement.closest("iam-applied-filters")&&!t.parentElement.closest("iam-applied-filters").closest("dialog")){const a=new CustomEvent("set-filters");t.parentElement.closest("iam-applied-filters").dispatchEvent(a)}if(f(!0),!t.querySelector(".btn-primary").hasAttribute("command")){g.close();const a=new Event("close");g.dispatchEvent(a)}})}}window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:"Applied Filters"});class k extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const m=this.classList.toString(),g=document.createElement("template");g.innerHTML=`
|
|
5
5
|
<style>
|
|
6
|
-
@layer elements{:is(.badge,.tag){font-size:1rem;line-height:1.625rem;border:none !important;margin:0;display:inline-block;text-align:center;white-space:nowrap;max-width:fit-content;color:#262626;position:relative;background:var(--wider-colour, var(--wider-colour-1));margin-bottom
|
|
6
|
+
@layer elements{:is(.badge,.tag){font-size:1rem;line-height:1.625rem;border:none !important;margin:0;display:inline-block;text-align:center;white-space:nowrap;max-width:fit-content;color:#262626;position:relative;background:var(--wider-colour, var(--wider-colour-1));margin-bottom:.5rem;&:has(+:is(.badge,.tag)){margin-right:.375rem}&:empty{display:none}&:is(.bg-primary,.bg-dark,.bg-danger){color:#fcfcfc !important}}.badge{border-radius:.375rem;padding:0 .5rem}.badge--rounded{border-radius:1rem;min-width:1.625rem;padding:0}.tag{border-radius:1rem;padding:0 1rem;i{margin-left:.5rem}&:is(:hover,:focus,.hover,:focus-within,:focus-visible){background:color-mix(in oklab, var(--colour), #000000 5%)}&:is(:active,.active){background:color-mix(in oklab, var(--colour), #000000 10%)}&:has(input:disabled),&:disabled{background:var(--wider-colour-1) !important;color:#99adb1 !important}&:has([readonly]){pointer-events:none}&:has([readonly]):after{display:none !important}}iam-multiselect:not(:defined) .tag,.tag.tag--toggle{background:var(--colour-canvas);outline:1px solid var(--colour-border)}.tag.tag--toggle{&:after{display:none}&:is(:hover,:focus){background:#eee}&:is(:active){background:#e0e0e0}&:has(input:checked),&.selected{background:#e9f9fd;outline:1px solid #1ebee6}}.btn :is(.badge,.tag){position:relative;top:-1px}}.applied-filters:not(:empty){padding:1px 1px 1rem 1px}:host(.applied-filters--show-set) .tag--not-set{display:none}.tag:not(.tag--not-set){background:var(--wider-colour-3)}.tag.tag--not-set{background:var(--colour-canvas);outline:1px solid var(--colour-border)}/*# sourceMappingURL=assets/css/components/applied-filters.css.map */
|
|
7
7
|
|
|
8
8
|
</style>
|
|
9
9
|
<div class="applied-filters ${m}"></div>
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* iamKey v7.7.1--
|
|
2
|
+
* iamKey v7.7.1--beta5
|
|
3
3
|
* Copyright 2022-2026 iamproperty
|
|
4
|
-
*/const M=t=>t.charAt(0).toUpperCase()+t.slice(1),q=t=>t.replace(/_/g," "),N=(t,r)=>{for(let a=1;a<=10;a++){if(t.hasAttribute(`data-colour-${a}`)){const o=t.getAttribute(`data-colour-${a}`);t.style.setProperty(`--chart-colour-${a}`,`var(--chart-colour-${o})`),t.style.setProperty(`--chart-colour-${a}-hover`,`var(--chart-colour-${o}-hover)`)}Array.from(r.querySelectorAll(`[data-colour-${a}]`)).forEach(o=>{const e=o.getAttribute(`data-colour-${a}`);o.style.setProperty(`--chart-colour-${a}`,`var(--chart-colour-${e})`),o.style.setProperty(`--chart-colour-${a}-hover`,`var(--chart-colour-${e}-hover)`)})}return!0},k=(t,r,a)=>{if(t.tagName=="IAM-DOUGHNUTCHART")return R(t,r,a),!0;const o=r.querySelector(".chart__key");o.innerHTML="";const e=r.querySelector(".chart__guidelines");e.innerHTML="";const i=r.querySelector(".chart__yaxis");i.innerHTML="",Array.from(r.querySelectorAll(':scope > input[type="checkbox"],:scope > input[type="radio"]')).map(c=>{c.remove()});const{xaxis:n}=g(t);return A(t,a),T(r,a,o),X(t,e),E(t,i),n&&Y(r),!0},R=(t,r,a)=>{const o=r.querySelector(".chart__key");return o.innerHTML="",Array.from(r.querySelectorAll(':scope > input[type="checkbox"],:scope > input[type="radio"]')).map(e=>{e.remove()}),A(t,a),T(r,a,o),H(r),!0},V=function(t,r){const a=r.querySelector(".chart");a.addEventListener("mousemove",n=>{if(n&&n.target instanceof HTMLElement&&n.target.closest("td:not(:first-child")){const s=n.target.closest("td:not(:first-child").getBoundingClientRect(),d=n.clientX-s.left,l=n.clientY-s.top;a.setAttribute("style",`--cursor-x: ${d}px; --cursor-y: ${l}px;`)}});const o=r.querySelectorAll("label");Array.from(o).forEach(n=>{r.querySelector(`input#${n.getAttribute("for")}`).checked?n.setAttribute("part","key-checked"):n.setAttribute("part","key-unchecked")});const e=t.querySelector("table"),i=r.querySelector("table");r.addEventListener("change",function(n){const c=n.target,s=new CustomEvent("view-change",{detail:{"data-dataset":c.getAttribute("data-dataset"),label:c.getAttribute("data-label"),checked:c.checked}});t.dispatchEvent(s),Array.from(o).forEach(d=>{var l;!((l=r.querySelector(`input#${d.getAttribute("for")}`))===null||l===void 0)&&l.checked?d.setAttribute("part","key-checked"):d.setAttribute("part","key-unchecked")}),i.innerHTML=e.innerHTML,A(t,i),t.tagName=="IAM-DOUGHNUTCHART"&&H(r)})},U=function(t,r){const a=t.querySelector("table"),o=r.querySelector("table"),e=(s,d)=>{d.disconnect(),c.disconnect();for(const l of s)(l.attributeName=="class"||l.type==="attributes"||l.type==="attributes")&&(o.innerHTML=a.innerHTML,k(t,r,o));d.observe(a,{characterData:!0,subtree:!0}),c.observe(t,{attributes:!0})},i=(s,d)=>{d.disconnect(),c.disconnect();for(const l of s)(l.type=="characterData"||l.type=="childList"&&l.addedNodes.length)&&(o.innerHTML=a.innerHTML,k(t,r,o));d.observe(a,{characterData:!0,subtree:!0}),c.observe(t,{attributes:!0})},n=new MutationObserver(i),c=new MutationObserver(e);return n.observe(a,{characterData:!0,subtree:!0}),c.observe(t,{attributes:!0}),!0};function C(t,r){r>1&&(t=t-.25);const a=Math.cos(2*Math.PI*t),o=Math.sin(2*Math.PI*t);return[a*100,o*100]}const g=function(t){const r=t.shadowRoot.querySelector(".chart__wrapper table"),a=t.hasAttribute("data-min")?t.getAttribute("data-min"):0,o=t.hasAttribute("data-max")?t.getAttribute("data-max"):j(t,r),e=t.hasAttribute("data-yaxis")?t.getAttribute("data-yaxis").split(","):[],i=t.hasAttribute("data-guidelines")?t.getAttribute("data-guidelines").split(","):[],n=t.hasAttribute("data-xaxis")?t.getAttribute("data-xaxis").split(","):null;return{min:a,max:o,yaxis:e,xaxis:n,guidelines:i}};function j(t,r){const a=t.classList.contains("chart--stacked")?"tbody tr":"tbody td:not(:first-child)",o=Array.from(r.querySelectorAll(a)).map(i=>i.getAttribute("data-numeric")),e=Math.max(...o);return Math.ceil(e)}const x=function(t,r,a,o){let e=String(t);e=e.replace("\xA3",""),e=e.replace("%",""),e=e.replace(",",""),e=Number.parseFloat(e);let i=(e-r)/(a-r)*100,n=i,c=0;return o&&o!=0&&(c=(o-r)/(a-r)*100),r<0&&(c=Math.abs(r/(a-r)*100),e<0?(i=c-i,c=c-i,n=c):(i=i-c,n=i+c)),{percent:i,axis:n,bottom:c}},A=function(t,r){Array.from(r.querySelectorAll("tbody tr")).forEach(e=>{let i=0;Array.from(e.querySelectorAll("td:not(:first-child)")).forEach(n=>{const c=n.cloneNode(!0);Array.from(c.querySelectorAll("*")).forEach(l=>{l.remove()});const s=parseFloat(c.textContent.replace("\xA3","").replace("%","").replace(",",""));n.setAttribute("data-numeric",s),n.setAttribute("data-value",c.textContent),getComputedStyle(n).display!="none"&&(i+=s),Array.from(n.querySelectorAll("a, button")).forEach((l,m)=>{m==0&&l.insertAdjacentHTML("beforeBegin","<hr/>"),l.classList.add("btn"),l.classList.add("btn-tertiary")})}),e.setAttribute("data-numeric",i)});const{min:a,max:o}=g(t);Array.from(r.querySelectorAll("tbody tr")).forEach((e,i)=>{const n=e.querySelector("td:first-child, th:first-child")?e.querySelector("td:first-child, th:first-child").textContent:"";e.setAttribute("part","group");const c=(e.getAttribute("data-numeric")-a)/(o-a)*100;e.style.setProperty("--percent",`${c}%`),Array.from(e.querySelectorAll("td:not([data-label])")).forEach((l,m)=>{m==0?l.setAttribute("part","xaxis-label"):l.setAttribute("part","value"),e.querySelectorAll("td").length>2&&l.setAttribute("data-label",r.querySelectorAll("thead th")[m].textContent)});const s=e.hasAttribute("data-min")?e.getAttribute("data-min"):a,d=e.hasAttribute("data-max")?e.getAttribute("data-max"):o;if(s<0){const l=Math.abs(s/(d-s)*100);t.setAttribute("style",`--min-bottom: ${l}%;`)}e.style.setProperty("--row-index",i+1),Array.from(e.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")),h=Number.parseFloat(l.getAttribute("data-start"));if(l.querySelector("span[data-group]")||(l.innerHTML=`<span data-group="${n}" ${l.hasAttribute("data-label")?`data-label="${l.getAttribute("data-label")}"`:""} part="popover">${f}</span>`),!l.hasAttribute("style")){const{percent:u,bottom:y,axis:p}=x(v,s,d,h);l.setAttribute("data-percent",u),l.setAttribute("style",`--bottom:${y}%;--percent:${u}%;--axis:${p}%;`)}})})},I=function(t){const r=t.querySelector(".chart__wrapper"),a=t.querySelector(".chart__spacer span"),o=t.querySelector(".chart table");let e="";Array.from(o.querySelectorAll("tbody tr td:first-child")).forEach(i=>{typeof i.textContent<"u"&&i.textContent.length>e.length&&(e=i.textContent)}),r.setAttribute("data-longest-label",e),a.innerHTML=e},B=function(t){const r=t.querySelector(".chart__wrapper"),a=t.querySelector(".chart table");let o="";Array.from(a.querySelectorAll("tbody tr td:not(:first-child)")).forEach(e=>{typeof e.getAttribute("data-value")<"u"&&e.getAttribute("data-value").length>o.length&&(o=e.getAttribute("data-value"))}),r.setAttribute("data-longest-value",o)},T=function(t,r,a){const o=`chart-${Date.now()+(Math.floor(Math.random()*100)+1)}`;let e;const i=Array.from(r.querySelectorAll("thead th"));return i.forEach((n,c)=>{c!=0&&(e=K(o,c,n.textContent,a,t,e)),c==50&&(i.length=c+1)}),!0};function K(t,r,a,o,e,i){var n;const c=document.createElement("input");c.setAttribute("name",`${t}-dataset-${r}`),c.setAttribute("id",`${t}-dataset-${r}`),c.setAttribute("data-dataset",`${r}`),c.setAttribute("data-label",`${a}`),c.checked=!0,c.setAttribute("type","checkbox"),r==1?e.prepend(c):e.insertBefore(c,i.nextSibling),i=c;const s=document.createElement("label");s.setAttribute("class","key btn btn-action"),s.setAttribute("for",`${t}-dataset-${r}`),s.setAttribute("data-label",`${a}`),s.setAttribute("part","key");const d=(n=e.querySelector(`tbody tr td:nth-child(${r+1})`))===null||n===void 0?void 0:n.getAttribute("data-numeric");return s.setAttribute("data-numeric",d),s.innerHTML=`${a}`,o.append(s),i}const X=function(t,r){const{min:a,max:o,yaxis:e}=g(t);let{guidelines:i}=g(t);i.length||(i=e),r.innerHTML="";for(let n=0;n<i.length;n++){const c=parseFloat(i[n].replace("\xA3","").replace("%","").replace(",","")),{axis:s}=x(c,a,o);r.innerHTML+=`<div class="guideline" style="--percent:${s}%;">${e.indexOf(i[n])!=-1?`<span>${i[n]}</span>`:""}</div>`}},E=function(t,r){const{min:a,max:o,yaxis:e}=g(t);r.innerHTML="";for(let i=0;i<e.length;i++){const n=parseFloat(e[i].replace("\xA3","").replace("%","")),{axis:c}=x(n,a,o);r.innerHTML+=`<div class="axis__point" style="--percent:${c}%;"><span>${e[i]}</span></div>`}},Y=function(t){const r=t.querySelector(".chart");let a=t.querySelector(".chart__xaxis");a||(a=document.createElement("div"),a.setAttribute("class","chart__xaxis")),r.prepend(a)},G=function(t){const r=t.querySelectorAll("thead th[title], tbody th[title]:first-child, tbody td[title]:first-child");Array.from(r).forEach(a=>{const o=`tooltip-${Date.now()}-${Math.floor(Math.random()*100)}`;a.innerHTML=`<button class="tooltip" popovertarget="${o}" part="tooltip" style="anchor-name: --${o};">${a.textContent}</button><span id="${o}" style="position-anchor: --${o};" popover part="tooltip__content" class="tooltip__content">${a.getAttribute("title")}</span>`})},H=function(t){let r="";const a=t.querySelector(".chart");let o=t.querySelector(".doughnuts");o||(o=document.createElement("div"),o.setAttribute("class","doughnuts"),a.append(o)),Array.from(a.querySelectorAll("tbody tr")).forEach((e,i)=>{let n="",c="",s=0,d=0;const m=e.querySelectorAll("td")[0].innerHTML;let f=0;const v=e.getAttribute("data-numeric");Array.from(e.querySelectorAll("td")).forEach((h,u)=>{const y=getComputedStyle(h).display;if(u!=0&&y!="none"){let p=h.getAttribute("data-numeric");p=p.replace("\xA3",""),p=p.replace("%",""),p=p.replace(",",""),p=Number.parseInt(p),d+=p,f++}}),Array.from(e.querySelectorAll("td")).forEach((h,u)=>{var y,p;const _=getComputedStyle(h).display;if(u!=0&&f==1&&_!="none")n+=`<path d="M 0 0 L 100 0 A 100 100 0 1 1 100 -0.01 L 0 0" style="${h.getAttribute("style")} --path-index: ${u};"></path>`,c+=`<span class="h5 mb-0" part="popover">${M(q(h.getAttribute("data-label"))).trim()}<br/>${h.hasAttribute("data-second")?`${h.getAttribute("data-second-label")}: ${h.getAttribute("data-second")}<br/>`:""}${(y=h.querySelector('[part="popover"]'))===null||y===void 0?void 0:y.innerHTML}</span>`;else if(u!=0){let b=h.getAttribute("data-numeric");const F=_=="none"?"display: none;":"";b=b.replace("\xA3",""),b=b.replace("%",""),b=b.replace(",",""),b=Number.parseInt(b);const w=b/d,[z,$]=C(s,f),[S,L]=C(s+w,f),D=w>.5?1:0,P=["M 0 0",`L ${z?z.toFixed(0):0} ${$?$.toFixed(0):0}`,`A 100 100 0 ${D} 1 ${S?S.toFixed(0):0} ${L?L.toFixed(0):0}`,"L 0 0"].join(" ");n+=`<path d="${P}" style="${h.getAttribute("style")} --path-index: ${u};${F}"></path>`,c+=`<span class="h5 mb-0" part="popover">${M(q(h.getAttribute("data-label"))).trim()}<br/>${h.hasAttribute("data-second")?`${h.getAttribute("data-second-label")}: ${h.getAttribute("data-second")}<br/>`:""}${(p=h.querySelector('[part="popover"]'))===null||p===void 0?void 0:p.innerHTML}</span>`,_!="none"&&(s+=w)}}),r+=`<div class="doughnut">
|
|
5
|
-
<svg viewBox="-105 -105 210 210" preserveAspectRatio="none" style="--row-index: ${
|
|
4
|
+
*/const M=t=>t.charAt(0).toUpperCase()+t.slice(1),q=t=>t.replace(/_/g," "),N=(t,r)=>{for(let a=1;a<=10;a++){if(t.hasAttribute(`data-colour-${a}`)){const o=t.getAttribute(`data-colour-${a}`);t.style.setProperty(`--chart-colour-${a}`,`var(--chart-colour-${o})`),t.style.setProperty(`--chart-colour-${a}-hover`,`var(--chart-colour-${o}-hover)`)}Array.from(r.querySelectorAll(`[data-colour-${a}]`)).forEach(o=>{const e=o.getAttribute(`data-colour-${a}`);o.style.setProperty(`--chart-colour-${a}`,`var(--chart-colour-${e})`),o.style.setProperty(`--chart-colour-${a}-hover`,`var(--chart-colour-${e}-hover)`)})}return!0},k=(t,r,a)=>{if(t.tagName=="IAM-DOUGHNUTCHART")return R(t,r,a),!0;const o=r.querySelector(".chart__key");o.innerHTML="";const e=r.querySelector(".chart__guidelines");e.innerHTML="";const n=r.querySelector(".chart__yaxis");n.innerHTML="",Array.from(r.querySelectorAll(':scope > input[type="checkbox"],:scope > input[type="radio"]')).map(c=>{c.remove()});const{xaxis:i}=g(t);return A(t,a),T(r,a,o),X(t,e),E(t,n),i&&Y(r),!0},R=(t,r,a)=>{const o=r.querySelector(".chart__key");return o.innerHTML="",Array.from(r.querySelectorAll(':scope > input[type="checkbox"],:scope > input[type="radio"]')).map(e=>{e.remove()}),A(t,a),T(r,a,o),H(r),!0},V=function(t,r){const a=r.querySelector(".chart");a.addEventListener("mousemove",i=>{if(i&&i.target instanceof HTMLElement&&i.target.closest("td:not(:first-child")){const d=i.target.closest("td:not(:first-child").getBoundingClientRect(),s=i.clientX-d.left,l=i.clientY-d.top;a.setAttribute("style",`--cursor-x: ${s}px; --cursor-y: ${l}px;`)}});const o=r.querySelectorAll("label");Array.from(o).forEach(i=>{r.querySelector(`input#${i.getAttribute("for")}`).checked?i.setAttribute("part","key-checked"):i.setAttribute("part","key-unchecked")});const e=t.querySelector("table"),n=r.querySelector("table");r.addEventListener("change",function(i){const c=i.target,d=new CustomEvent("view-change",{detail:{"data-dataset":c.getAttribute("data-dataset"),label:c.getAttribute("data-label"),checked:c.checked}});t.dispatchEvent(d),Array.from(o).forEach(s=>{var l;!((l=r.querySelector(`input#${s.getAttribute("for")}`))===null||l===void 0)&&l.checked?s.setAttribute("part","key-checked"):s.setAttribute("part","key-unchecked")}),n.innerHTML=e.innerHTML,A(t,n),t.tagName=="IAM-DOUGHNUTCHART"&&H(r)})},U=function(t,r){const a=t.querySelector("table"),o=r.querySelector("table"),e=(d,s)=>{s.disconnect(),c.disconnect();for(const l of d)(l.attributeName=="class"||l.type==="attributes"||l.type==="attributes")&&(o.innerHTML=a.innerHTML,k(t,r,o));s.observe(a,{characterData:!0,subtree:!0}),c.observe(t,{attributes:!0})},n=(d,s)=>{s.disconnect(),c.disconnect();for(const l of d)(l.type=="characterData"||l.type=="childList"&&l.addedNodes.length)&&(o.innerHTML=a.innerHTML,k(t,r,o));s.observe(a,{characterData:!0,subtree:!0}),c.observe(t,{attributes:!0})},i=new MutationObserver(n),c=new MutationObserver(e);return i.observe(a,{characterData:!0,subtree:!0}),c.observe(t,{attributes:!0}),!0};function C(t,r){r>1&&(t=t-.25);const a=Math.cos(2*Math.PI*t),o=Math.sin(2*Math.PI*t);return[a*100,o*100]}const g=function(t){const r=t.shadowRoot.querySelector(".chart__wrapper table"),a=t.hasAttribute("data-min")?t.getAttribute("data-min"):0,o=t.hasAttribute("data-max")?t.getAttribute("data-max"):j(t,r),e=t.hasAttribute("data-yaxis")?t.getAttribute("data-yaxis").split(","):[],n=t.hasAttribute("data-guidelines")?t.getAttribute("data-guidelines").split(","):[],i=t.hasAttribute("data-xaxis")?t.getAttribute("data-xaxis").split(","):null;return{min:a,max:o,yaxis:e,xaxis:i,guidelines:n}};function j(t,r){const a=t.classList.contains("chart--stacked")?"tbody tr":"tbody td:not(:first-child)",o=Array.from(r.querySelectorAll(a)).map(n=>n.getAttribute("data-numeric")),e=Math.max(...o);return Math.ceil(e)}const x=function(t,r,a,o){let e=String(t);e=e.replace("\xA3",""),e=e.replace("%",""),e=e.replace(",",""),e=Number.parseFloat(e);let n=(e-r)/(a-r)*100,i=n,c=0;return o&&o!=0&&(c=(o-r)/(a-r)*100),r<0&&(c=Math.abs(r/(a-r)*100),e<0?(n=c-n,c=c-n,i=c):(n=n-c,i=n+c)),{percent:n,axis:i,bottom:c}},A=function(t,r){Array.from(r.querySelectorAll("tbody tr")).forEach(e=>{let n=0;Array.from(e.querySelectorAll("td:not(:first-child)")).forEach(i=>{const c=i.cloneNode(!0);Array.from(c.querySelectorAll("*")).forEach(l=>{l.remove()});const d=parseFloat(c.textContent.replace("\xA3","").replace("%","").replace(",",""));i.setAttribute("data-numeric",d),i.setAttribute("data-value",c.textContent),getComputedStyle(i).display!="none"&&(n+=d),Array.from(i.querySelectorAll("a, button")).forEach((l,m)=>{m==0&&l.insertAdjacentHTML("beforeBegin","<hr/>"),l.classList.add("btn"),l.classList.add("btn-tertiary")})}),e.setAttribute("data-numeric",n)});const{min:a,max:o}=g(t);Array.from(r.querySelectorAll("tbody tr")).forEach((e,n)=>{const i=e.querySelector("td:first-child, th:first-child")?e.querySelector("td:first-child, th:first-child").textContent:"";e.setAttribute("part","group");const c=(e.getAttribute("data-numeric")-a)/(o-a)*100;e.style.setProperty("--percent",`${c}%`),Array.from(e.querySelectorAll("td:not([data-label])")).forEach((l,m)=>{m==0?l.setAttribute("part","xaxis-label"):l.setAttribute("part","value"),e.querySelectorAll("td").length>2&&l.setAttribute("data-label",r.querySelectorAll("thead th")[m].textContent)});const d=e.hasAttribute("data-min")?e.getAttribute("data-min"):a,s=e.hasAttribute("data-max")?e.getAttribute("data-max"):o;if(d<0){const l=Math.abs(d/(s-d)*100);t.setAttribute("style",`--min-bottom: ${l}%;`)}e.style.setProperty("--row-index",n+1),Array.from(e.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")),h=Number.parseFloat(l.getAttribute("data-start"));if(l.querySelector("span[data-group]")||(l.innerHTML=`<span data-group="${i}" ${l.hasAttribute("data-label")?`data-label="${l.getAttribute("data-label")}"`:""} part="popover">${f}</span>`),!l.hasAttribute("style")){const{percent:u,bottom:y,axis:p}=x(v,d,s,h);l.setAttribute("data-percent",u),l.setAttribute("style",`--bottom:${y}%;--percent:${u}%;--axis:${p}%;`)}})})},I=function(t){const r=t.querySelector(".chart__wrapper"),a=t.querySelector(".chart__spacer span"),o=t.querySelector(".chart table");let e="";Array.from(o.querySelectorAll("tbody tr td:first-child")).forEach(n=>{typeof n.textContent<"u"&&n.textContent.length>e.length&&(e=n.textContent)}),r.setAttribute("data-longest-label",e),a.innerHTML=e},B=function(t){const r=t.querySelector(".chart__wrapper"),a=t.querySelector(".chart table");let o="";Array.from(a.querySelectorAll("tbody tr td:not(:first-child)")).forEach(e=>{typeof e.getAttribute("data-value")<"u"&&e.getAttribute("data-value").length>o.length&&(o=e.getAttribute("data-value"))}),r.setAttribute("data-longest-value",o)},T=function(t,r,a){const o=`chart-${Date.now()+(Math.floor(Math.random()*100)+1)}`;let e;const n=Array.from(r.querySelectorAll("thead th"));return n.forEach((i,c)=>{c!=0&&(e=K(o,c,i.textContent,a,t,e)),c==50&&(n.length=c+1)}),!0};function K(t,r,a,o,e,n){var i;const c=document.createElement("input");c.setAttribute("name",`${t}-dataset-${r}`),c.setAttribute("id",`${t}-dataset-${r}`),c.setAttribute("data-dataset",`${r}`),c.setAttribute("data-label",`${a}`),c.checked=!0,c.setAttribute("type","checkbox"),r==1?e.prepend(c):e.insertBefore(c,n.nextSibling),n=c;const d=document.createElement("label");d.setAttribute("class","key btn btn-action"),d.setAttribute("for",`${t}-dataset-${r}`),d.setAttribute("data-label",`${a}`),d.setAttribute("part","key");const s=(i=e.querySelector(`tbody tr td:nth-child(${r+1})`))===null||i===void 0?void 0:i.getAttribute("data-numeric");return d.setAttribute("data-numeric",s),d.innerHTML=`${a}`,o.append(d),n}const X=function(t,r){const{min:a,max:o,yaxis:e}=g(t);let{guidelines:n}=g(t);n.length||(n=e),r.innerHTML="";for(let i=0;i<n.length;i++){const c=parseFloat(n[i].replace("\xA3","").replace("%","").replace(",","")),{axis:d}=x(c,a,o);r.innerHTML+=`<div class="guideline" style="--percent:${d}%;">${e.indexOf(n[i])!=-1?`<span>${n[i]}</span>`:""}</div>`}},E=function(t,r){const{min:a,max:o,yaxis:e}=g(t);r.innerHTML="";for(let n=0;n<e.length;n++){const i=parseFloat(e[n].replace("\xA3","").replace("%","")),{axis:c}=x(i,a,o);r.innerHTML+=`<div class="axis__point" style="--percent:${c}%;"><span>${e[n]}</span></div>`}},Y=function(t){const r=t.querySelector(".chart");let a=t.querySelector(".chart__xaxis");a||(a=document.createElement("div"),a.setAttribute("class","chart__xaxis")),r.prepend(a)},G=function(t){const r=t.querySelectorAll("thead th[title], tbody th[title]:first-child, tbody td[title]:first-child");Array.from(r).forEach(a=>{const o=`tooltip-${Date.now()}-${Math.floor(Math.random()*100)}`;a.innerHTML=`<button class="tooltip" popovertarget="${o}" part="tooltip" style="anchor-name: --${o};">${a.textContent}</button><span id="${o}" style="position-anchor: --${o};" popover part="tooltip__content" class="tooltip__content">${a.getAttribute("title")}</span>`})},H=function(t){let r="";const a=t.querySelector(".chart");let o=t.querySelector(".doughnuts");o||(o=document.createElement("div"),o.setAttribute("class","doughnuts"),a.append(o)),Array.from(a.querySelectorAll("tbody tr")).forEach((e,n)=>{let i="",c="",d=0,s=0;const m=e.querySelectorAll("td")[0].innerHTML;let f=0;const v=e.getAttribute("data-numeric");Array.from(e.querySelectorAll("td")).forEach((h,u)=>{const y=getComputedStyle(h).display;if(u!=0&&y!="none"){let p=h.getAttribute("data-numeric");p=p.replace("\xA3",""),p=p.replace("%",""),p=p.replace(",",""),p=Number.parseInt(p),s+=p,f++}}),Array.from(e.querySelectorAll("td")).forEach((h,u)=>{var y,p;const _=getComputedStyle(h).display;if(u!=0&&f==1&&_!="none")i+=`<path d="M 0 0 L 100 0 A 100 100 0 1 1 100 -0.01 L 0 0" style="${h.getAttribute("style")} --path-index: ${u};"></path>`,c+=`<span class="h5 mb-0" part="popover">${M(q(h.getAttribute("data-label"))).trim()}<br/>${h.hasAttribute("data-second")?`${h.getAttribute("data-second-label")}: ${h.getAttribute("data-second")}<br/>`:""}${(y=h.querySelector('[part="popover"]'))===null||y===void 0?void 0:y.innerHTML}</span>`;else if(u!=0){let b=h.getAttribute("data-numeric");const F=_=="none"?"display: none;":"";b=b.replace("\xA3",""),b=b.replace("%",""),b=b.replace(",",""),b=Number.parseInt(b);const w=b/s,[z,$]=C(d,f),[S,L]=C(d+w,f),D=w>.5?1:0,P=["M 0 0",`L ${z?z.toFixed(0):0} ${$?$.toFixed(0):0}`,`A 100 100 0 ${D} 1 ${S?S.toFixed(0):0} ${L?L.toFixed(0):0}`,"L 0 0"].join(" ");i+=`<path d="${P}" style="${h.getAttribute("style")} --path-index: ${u};${F}"></path>`,c+=`<span class="h5 mb-0" part="popover">${M(q(h.getAttribute("data-label"))).trim()}<br/>${h.hasAttribute("data-second")?`${h.getAttribute("data-second-label")}: ${h.getAttribute("data-second")}<br/>`:""}${(p=h.querySelector('[part="popover"]'))===null||p===void 0?void 0:p.innerHTML}</span>`,_!="none"&&(d+=w)}}),r+=`<div class="doughnut">
|
|
5
|
+
<svg viewBox="-105 -105 210 210" preserveAspectRatio="none" style="--row-index: ${n+1};">${i}</svg>
|
|
6
6
|
<div class="doughnut__title" data-numeric="${v}"><span class="h5 mb-0">${m}</span></div>
|
|
7
7
|
<div class="tooltips">${c}</div>
|
|
8
|
-
</div>`}),o.innerHTML=r},W=t=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:t})},J=(t,r,a)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:r}),a.forEach(o=>{t.addEventListener(o,function(e){const
|
|
8
|
+
</div>`}),o.innerHTML=r},W=t=>{window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementRegistered",element:t})},J=(t,r,a)=>(window.dataLayer=window.dataLayer||[],window.dataLayer.push({event:"customElementAdded",element:r}),a.forEach(o=>{t.addEventListener(o,function(e){const n={event:o,element:r,target:e.target};Object.keys(e.detail).forEach(i=>{const c=e.detail[i];n[i]=c}),window.dataLayer.push(n)})}),!0);W("iam-barchart");class Q extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),document.body.hasAttribute("data-assets-location")&&document.body.getAttribute("data-assets-location");const r=document.createElement("template");r.innerHTML=`
|
|
9
9
|
<style>
|
|
10
10
|
${this.hasAttribute("css")?`@import "${this.getAttribute("css")}";`:""}
|
|
11
11
|
|
|
12
|
-
.chart__key .key:nth-child(11n-10),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-9){--chart-colour: var(--chart-colour-1)}.chart__outer table tbody tr:nth-child(1):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-1)}.chart__key .key:nth-child(11n-9),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-8){--chart-colour: var(--chart-colour-2)}.chart__outer table tbody tr:nth-child(2):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-2)}.chart__key .key:nth-child(11n-8),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-7){--chart-colour: var(--chart-colour-3)}.chart__outer table tbody tr:nth-child(3):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-3)}.chart__key .key:nth-child(11n-7),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-6){--chart-colour: var(--chart-colour-4)}.chart__outer table tbody tr:nth-child(4):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-4)}.chart__key .key:nth-child(11n-6),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-5){--chart-colour: var(--chart-colour-5)}.chart__outer table tbody tr:nth-child(5):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-5)}.chart__key .key:nth-child(11n-5),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-4){--chart-colour: var(--chart-colour-6)}.chart__outer table tbody tr:nth-child(6):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-6)}.chart__key .key:nth-child(11n-4),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-3){--chart-colour: var(--chart-colour-7)}.chart__outer table tbody tr:nth-child(7):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-7)}.chart__key .key:nth-child(11n-3),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-2){--chart-colour: var(--chart-colour-8)}.chart__outer table tbody tr:nth-child(8):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-8)}.chart__key .key:nth-child(11n-2),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-1){--chart-colour: var(--chart-colour-9)}.chart__outer table tbody tr:nth-child(9):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-9)}.chart__key .key:nth-child(11n-1),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-0){--chart-colour: var(--chart-colour-10)}.chart__outer table tbody tr:nth-child(10):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-10)}::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);--chart-height: 7.5rem;--chart-height-lg: 12.5rem;--chart-height-resp: var(--chart-height);--index-below: -1;--index-base: 0;--index-focus: 2;--index-above: 10;--index-floating: 100;--index-menu: 200;--index-overlay: 1000;--key-label-width: 100%;--label-size: 0.75rem;--line-thickness: 1px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%);--bar-gap: min(10%, 0.75rem)}.chart__outer>*{display:block;order:2}.chart__outer tbody{--chart-direction: 360deg;--chart-day-bg-pos: 100% calc(var(--single-day) * 7)}@container (min-width: 36em){.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);--line-thickness: 0.8px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%)}}@container (min-width: 62em){.chart__outer :has(tr:nth-child(10)){--bar-gap: 0}.chart__outer .chart__wrapper{--label-size: 0.875rem;--line-thickness: 0.5px}}.chart__outer .chart__spacer span{opacity:0}.chart__outer>input[type=checkbox]{opacity:0;position:absolute;pointer-events:none;bottom:50%;left:50%}.chart__key{padding:0 0 0 0;margin-bottom:1.5rem;display:flex;overflow:auto;scroll-snap-type:x mandatory;scroll-padding:.75rem;column-gap:.5rem}.chart__key:has(label:first-child:last-child){display:var(--single-key-display, none)}.chart__key .key{margin:0 !important}.chart__key .key:before{content:"";height:.8em;width:.8em;margin-right:.3em !important;background-color:var(--chart-colour);display:inline-block;border-radius:var(--key-border-radius, 4px)}.chart__key .key[data-label=Min],.chart__key .key[data-label=Max]{display:none}.chart__key .key .chart__total{display:none}.chart__outer input[type=checkbox]:focus:nth-child(1)~.chart__key .key:nth-child(1){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(2)~.chart__key .key:nth-child(2){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(3)~.chart__key .key:nth-child(3){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(4)~.chart__key .key:nth-child(4){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(5)~.chart__key .key:nth-child(5){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(6)~.chart__key .key:nth-child(6){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(7)~.chart__key .key:nth-child(7){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(8)~.chart__key .key:nth-child(8){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(9)~.chart__key .key:nth-child(9){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__key .key:nth-of-type(1){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__key .key:nth-of-type(2){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__key .key:nth-of-type(3){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__key .key:nth-of-type(4){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__key .key:nth-of-type(5){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__key .key:nth-of-type(6){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__key .key:nth-of-type(7){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__key .key:nth-of-type(8){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__key .key:nth-of-type(9){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__key .key:nth-of-type(10){opacity:.25}:host([data-yaxis]){--yaxis-display: flex}.chart__yaxis{display:var(--yaxis-display, none);flex-direction:column-reverse;width:var(--yaxis-width)}.chart__yaxis .axis__point{bottom:var(--percent);position:relative;height:0;white-space:nowrap}.chart__yaxis .axis__point:not(:last-child){display:var(--yaxis-point-display)}.chart__yaxis .axis__point span{display:block;transform:translate(0, -50%);padding-right:.25rem;text-align:right;font-weight:var(--chart-yaxis-fw, normal);font-size:var(--chart-yaxis-fs, 0.75rem);color:var(--colour-body)}.chart__yaxis .axis__point:last-child span{transform:var(--yaxis-last-point-transform)}.chart__xaxis{margin-bottom:1rem;display:flex;flex-direction:column-reverse;width:100%;position:absolute;left:0;bottom:-1rem}.chart__xaxis .axis__point{left:var(--percent);width:1px;position:absolute;height:0;white-space:nowrap}.chart__xaxis .axis__point span{display:block;transform:translate(-50%, 0%);text-align:center;font-size:var(--label-size);position:absolute;left:50%}.chart__guidelines{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column-reverse;pointer-events:none}.chart__guidelines .guideline{bottom:var(--percent);position:absolute;right:0;width:100%;height:0px;margin-bottom:-1px;border-bottom:1px dashed #eee;pointer-events:none;z-index:var(--index-below)}.chart__guidelines .guideline:not(.guideline--target) span{display:none}.chart__guidelines .guideline--target{border-bottom:1px dashed #000;z-index:var(--index-above);text-shadow:1px solid #fff;overflow:visible}.chart__guidelines .guideline--target span{position:absolute;bottom:0;font-size:var(--label-size);text-shadow:1px 1px 2px #fff;background:hsla(0,0%,100%,.6)}.chart__guidelines [data-value="0"]{border-bottom:1px solid var(--colour-primary)}.chart__guidelines [data-value="0"]:not(:first-child){border-bottom:1px dashed var(--colour-primary)}[part=popover]{position:absolute;top:var(--cursor-y, 50%);left:var(--cursor-x, 50%);font-size:var(--label-size);line-height:1.2;background:var(--chart-details-bg, var(--colour-canvas-2, Canvas));opacity:0;pointer-events:none;padding:.5rem;border-radius:.5rem;margin-bottom:.25rem;display:block;white-space:pre;text-align:left;box-shadow:var(--chart-details-shadow, 0 0.125rem 0.75rem rgba(0, 0, 0, 0.25));transform:translate(-50%, -100%)}[part=popover]::before{content:attr(data-group) "\\a"}[part=popover][data-label]::before{content:attr(data-group) "\\a" attr(data-label) "\\a"}[part=popover]:has(:is(a,button)){top:0;left:50%;transform:translate(-50%, -100%);font-size:.9rem}[part=popover] hr{margin:0;opacity:0}[part=popover] :is(a,button){display:inline-block !important;clear:both !important;float:left !important;margin-top:1rem !important;margin-right:1rem !important;margin-bottom:.25em !important;font-size:1em !important}[part=popover] :is(a,button)+:is(a,button){margin-top:0 !important}.chart__wrapper{display:block;display:flex;flex-direction:row;position:relative}.chart__wrapper .chart{position:relative;flex-grow:1}.chart__wrapper table{display:block;width:100% !important;padding-top:var(--chart-height-resp);position:relative;margin-bottom:0;overflow:visible}.chart__wrapper table thead{display:none}.chart__wrapper table tbody{display:flex;position:absolute;width:100%;height:100%;top:0;left:0;flex-direction:row;border:none}.chart__wrapper table tbody tr{display:flex;flex-direction:row;justify-content:var(--chart-bar-alignment, left);align-items:flex-end;border:none;width:100%;height:100%;position:relative;padding:0 2px;gap:var(--bar-gap)}.chart__wrapper table tbody tr td{font-weight:inherit}.chart__wrapper table tbody tr td:first-child{position:absolute;top:100%;left:0%;width:fit-content;padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--label-size);text-align:center}@container (min-width: 62em){.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:color-mix(in oklab, var(--chart-colour), #000000 5%)}.chart__wrapper table tbody tr td:not(:first-child):has(span:empty),.chart__wrapper table tbody tr td:not(:first-child):empty{display:none}.chart__wrapper table tbody tr td:not(:first-child)[data-label]:before{display:none}.chart__wrapper table tbody tr td:not(:first-child):hover [part=popover]{opacity:1;z-index:var(--index-above);pointer-events:all}.chart__wrapper table tbody tr td:first-child[data-label]:before{display:none}@container (min-width: 62em){.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: 36em){.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--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--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}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(2){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(3){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(4){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(5){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(6){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(7){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(8){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(9){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(10){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(11){display:none;opacity:0}@layer elements{*,*::before,*::after{box-sizing:border-box}button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}[role=button]{cursor:pointer}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit]){-webkit-appearance:button}:is(button,[type=button],[type=reset],[type=submit]):not(:disabled){cursor:pointer}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}.btn:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}.btn:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}.btn:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}.btn:not(:last-child){margin-right:var(--btn-margin)}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.colour-success{--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.colour-success:before,.btn.colour-success:is(:hover,:focus,.hover):not([disabled],:active,.active):before{content:"\uF00C";font-family:"Font Awesome 7 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 7 Pro"}.btn.btn[class*=fa-after]{padding-right:4rem}.btn.btn[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}.btn:not(.btn-compact):before{margin-right:1rem}.btn i[class*=fa-]{--fa-width: 1em;font-family:"Font Awesome 7 Pro";margin-right:1rem;line-height:1em;font-style:inherit}.btn i[class*=fa-]:not(:first-child){margin-left:1rem;margin-right:0}.btn.btn--prompt:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt:after,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active):after{margin-left:1.5rem;margin-right:-0.5rem}.btn-filter:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 7 Pro"}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary)}.btn-secondary:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:rgba(0,0,0,0);border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative}.btn.btn-tertiary:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}.btn.btn-tertiary.text-decoration-none:after{width:0%}.btn.btn-tertiary [class*=fa-]{margin-left:0;margin-right:.5rem}.btn.btn-tertiary [class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}.btn.btn-tertiary:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active):after{width:60% !important}.btn.btn-tertiary:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}@layer elements{.btn-action{--btn-border-width: 1px;--btn-padding-block: 0.3125rem /* 5px */;--btn-padding-inline: 0.3125rem /* 5px */;--btn-margin: 0.5rem;border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem;&:not(.btn-primary){color:var(--colour-heading)}&:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}&.btn[class*=fa-]:before{content:var(--fa);margin-right:.375rem}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) &,&:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem);@container style(--theme: dark){color:white}}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2}.btn[popovertarget]>.fa-chevron-down{display:none}.btn[popovertarget]:not(:has(i)):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}.btn[popovertarget][aria-pressed]:after{transform:rotate(270deg)}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content}.btn:has(select) select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important}.btn:has(select) select option{font-size:1rem;text-align:left;color:var(--colour-primary);padding-inline:var(--menu-item-padding, 0.5rem);padding-block:var(--menu-item-padding, 0.5rem) !important;border-radius:.25rem !important}.btn:has(select) select option:not(:last-child){margin:var(--menu-item-margin, 0 0 0.25rem 0) !important}.btn:has(select) select option:hover{background:var(--colour-light) !important}.btn:has(select) select option:after{content:attr(data-email)}.btn:has(select) select::picker-icon{display:none}.btn:has(select) select::picker(select){appearance:base-select;background:var(--menu-bg, canvas);margin-block:var(--menu-margin, 0.25rem);padding:var(--menu-padding, 0.5rem) !important;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.1);font-size:1rem}.btn:has(select) hr{height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}.btn:has(select) select option::checkmark{display:none}.btn:has(select) select selectedcontent span{display:none}.btn:has(select):after{position:absolute;top:.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em}.btn-action:has(select) select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}.btn-action:has(select):after{top:.2rem;right:.5rem}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-block:0 !important;margin-inline:auto !important;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0 !important;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}:host(.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;min-height:1.5rem}: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 table tbody:has(td:first-child strong) td:first-child{font-weight:normal !important}: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)}: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, 7.5rem)}@container (min-width: 36em){.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 */
|
|
12
|
+
.chart__key .key:nth-child(11n-10),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-9){--chart-colour: var(--chart-colour-1)}.chart__outer table tbody tr:nth-child(1):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-1)}.chart__key .key:nth-child(11n-9),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-8){--chart-colour: var(--chart-colour-2)}.chart__outer table tbody tr:nth-child(2):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-2)}.chart__key .key:nth-child(11n-8),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-7){--chart-colour: var(--chart-colour-3)}.chart__outer table tbody tr:nth-child(3):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-3)}.chart__key .key:nth-child(11n-7),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-6){--chart-colour: var(--chart-colour-4)}.chart__outer table tbody tr:nth-child(4):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-4)}.chart__key .key:nth-child(11n-6),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-5){--chart-colour: var(--chart-colour-5)}.chart__outer table tbody tr:nth-child(5):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-5)}.chart__key .key:nth-child(11n-5),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-4){--chart-colour: var(--chart-colour-6)}.chart__outer table tbody tr:nth-child(6):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-6)}.chart__key .key:nth-child(11n-4),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-3){--chart-colour: var(--chart-colour-7)}.chart__outer table tbody tr:nth-child(7):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-7)}.chart__key .key:nth-child(11n-3),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-2){--chart-colour: var(--chart-colour-8)}.chart__outer table tbody tr:nth-child(8):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-8)}.chart__key .key:nth-child(11n-2),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-1){--chart-colour: var(--chart-colour-9)}.chart__outer table tbody tr:nth-child(9):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-9)}.chart__key .key:nth-child(11n-1),.chart__outer table tbody tr td:not(:first-child):nth-child(11n-0){--chart-colour: var(--chart-colour-10)}.chart__outer table tbody tr:nth-child(10):has(td:nth-child(2):last-child):not([data-colour]):not([data-colour-1]) td:nth-child(2){--chart-colour: var(--chart-colour-10)}::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);--chart-height: 7.5rem;--chart-height-lg: 12.5rem;--chart-height-resp: var(--chart-height);--index-below: -1;--index-base: 0;--index-focus: 2;--index-above: 10;--index-floating: 100;--index-menu: 200;--index-overlay: 1000;--key-label-width: 100%;--label-size: 0.75rem;--line-thickness: 1px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%);--bar-gap: min(10%, 0.75rem)}.chart__outer>*{display:block;order:2}.chart__outer tbody{--chart-direction: 360deg;--chart-day-bg-pos: 100% calc(var(--single-day) * 7)}@container (min-width: 36em){.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);--line-thickness: 0.8px;--yaxis-width: auto;--yaxis-point-display: block;--yaxis-last-point-transform: translate(0, -50%)}}@container (min-width: 62em){.chart__outer :has(tr:nth-child(10)){--bar-gap: 0}.chart__outer .chart__wrapper{--label-size: 0.875rem;--line-thickness: 0.5px}}.chart__outer .chart__spacer span{opacity:0}.chart__outer>input[type=checkbox]{opacity:0;position:absolute;pointer-events:none;bottom:50%;left:50%}.chart__key{padding:0 0 0 0;margin-bottom:1.5rem;display:flex;overflow:auto;scroll-snap-type:x mandatory;scroll-padding:.75rem;column-gap:.5rem}.chart__key:has(label:first-child:last-child){display:var(--single-key-display, none)}.chart__key .key{margin:0 !important}.chart__key .key:before{content:"";height:.8em;width:.8em;margin-right:.3em !important;background-color:var(--chart-colour);display:inline-block;border-radius:var(--key-border-radius, 4px)}.chart__key .key[data-label=Min],.chart__key .key[data-label=Max]{display:none}.chart__key .key .chart__total{display:none}.chart__outer input[type=checkbox]:focus:nth-child(1)~.chart__key .key:nth-child(1){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(2)~.chart__key .key:nth-child(2){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(3)~.chart__key .key:nth-child(3){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(4)~.chart__key .key:nth-child(4){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(5)~.chart__key .key:nth-child(5){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(6)~.chart__key .key:nth-child(6){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(7)~.chart__key .key:nth-child(7){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(8)~.chart__key .key:nth-child(8){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer input[type=checkbox]:focus:nth-child(9)~.chart__key .key:nth-child(9){background:var(--colour-btn-action-hover-bg) !important;border:var(--btn-border-width) solid var(--colour-muted) !important}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__key .key:nth-of-type(1){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__key .key:nth-of-type(2){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__key .key:nth-of-type(3){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__key .key:nth-of-type(4){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__key .key:nth-of-type(5){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__key .key:nth-of-type(6){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__key .key:nth-of-type(7){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__key .key:nth-of-type(8){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__key .key:nth-of-type(9){opacity:.25}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__key .key:nth-of-type(10){opacity:.25}:host([data-yaxis]){--yaxis-display: flex}.chart__yaxis{display:var(--yaxis-display, none);flex-direction:column-reverse;width:var(--yaxis-width)}.chart__yaxis .axis__point{bottom:var(--percent);position:relative;height:0;white-space:nowrap}.chart__yaxis .axis__point:not(:last-child){display:var(--yaxis-point-display)}.chart__yaxis .axis__point span{display:block;transform:translate(0, -50%);padding-right:.25rem;text-align:right;font-weight:var(--chart-yaxis-fw, normal);font-size:var(--chart-yaxis-fs, 0.75rem);color:var(--colour-body)}.chart__yaxis .axis__point:last-child span{transform:var(--yaxis-last-point-transform)}.chart__xaxis{margin-bottom:1rem;display:flex;flex-direction:column-reverse;width:100%;position:absolute;left:0;bottom:-1rem}.chart__xaxis .axis__point{left:var(--percent);width:1px;position:absolute;height:0;white-space:nowrap}.chart__xaxis .axis__point span{display:block;transform:translate(-50%, 0%);text-align:center;font-size:var(--label-size);position:absolute;left:50%}.chart__guidelines{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column-reverse;pointer-events:none}.chart__guidelines .guideline{bottom:var(--percent);position:absolute;right:0;width:100%;height:0px;margin-bottom:-1px;border-bottom:1px dashed #eee;pointer-events:none;z-index:var(--index-below)}.chart__guidelines .guideline:not(.guideline--target) span{display:none}.chart__guidelines .guideline--target{border-bottom:1px dashed #000;z-index:var(--index-above);text-shadow:1px solid #fff;overflow:visible}.chart__guidelines .guideline--target span{position:absolute;bottom:0;font-size:var(--label-size);text-shadow:1px 1px 2px #fff;background:hsla(0,0%,100%,.6)}.chart__guidelines [data-value="0"]{border-bottom:1px solid var(--colour-primary)}.chart__guidelines [data-value="0"]:not(:first-child){border-bottom:1px dashed var(--colour-primary)}[part=popover]{position:absolute;top:var(--cursor-y, 50%);left:var(--cursor-x, 50%);font-size:var(--label-size);line-height:1.2;background:var(--chart-details-bg, var(--colour-canvas-2, Canvas));opacity:0;pointer-events:none;padding:.5rem;border-radius:.5rem;margin-bottom:.25rem;display:block;white-space:pre;text-align:left;box-shadow:var(--chart-details-shadow, 0 0.125rem 0.75rem rgba(0, 0, 0, 0.25));transform:translate(-50%, -100%)}[part=popover]::before{content:attr(data-group) "\\a"}[part=popover][data-label]::before{content:attr(data-group) "\\a" attr(data-label) "\\a"}[part=popover]:has(:is(a,button)){top:0;left:50%;transform:translate(-50%, -100%);font-size:.9rem}[part=popover] hr{margin:0;opacity:0}[part=popover] :is(a,button){display:inline-block !important;clear:both !important;float:left !important;margin-top:1rem !important;margin-right:1rem !important;margin-bottom:.25em !important;font-size:1em !important}[part=popover] :is(a,button)+:is(a,button){margin-top:0 !important}.chart__wrapper{display:block;display:flex;flex-direction:row;position:relative}.chart__wrapper .chart{position:relative;flex-grow:1}.chart__wrapper table{display:block;width:100% !important;padding-top:var(--chart-height-resp);position:relative;margin-bottom:0;overflow:visible}.chart__wrapper table thead{display:none}.chart__wrapper table tbody{display:flex;position:absolute;width:100%;height:100%;top:0;left:0;flex-direction:row;border:none}.chart__wrapper table tbody tr{display:flex;flex-direction:row;justify-content:var(--chart-bar-alignment, left);align-items:flex-end;border:none;width:100%;height:100%;position:relative;padding:0 2px;gap:var(--bar-gap)}.chart__wrapper table tbody tr td{font-weight:inherit}.chart__wrapper table tbody tr td:first-child{position:absolute;top:100%;left:0%;width:fit-content;padding:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--label-size);text-align:center}@container (min-width: 62em){.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:color-mix(in oklab, var(--chart-colour), #000000 5%)}.chart__wrapper table tbody tr td:not(:first-child):has(span:empty),.chart__wrapper table tbody tr td:not(:first-child):empty{display:none}.chart__wrapper table tbody tr td:not(:first-child)[data-label]:before{display:none}.chart__wrapper table tbody tr td:not(:first-child):hover [part=popover]{opacity:1;z-index:var(--index-above);pointer-events:all}.chart__wrapper table tbody tr td:first-child[data-label]:before{display:none}@container (min-width: 62em){.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: 36em){.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--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--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}.chart__outer>input[type=checkbox]:nth-of-type(1):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(2){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(2):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(3){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(3):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(4){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(4):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(5){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(5):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(6){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(6):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(7){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(7):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(8){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(8):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(9){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(9):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(10){display:none;opacity:0}.chart__outer>input[type=checkbox]:nth-of-type(10):not(:checked)~.chart__wrapper table tbody tr td:not(:first-child):nth-child(11){display:none;opacity:0}@layer elements{*,*::before,*::after{box-sizing:border-box}button{border-radius:0;text-transform:none;margin:0;font-family:inherit;font-size:inherit;line-height:inherit}[role=button]{cursor:pointer}button:focus:not(:focus-visible){outline:0}:is(button,[type=button],[type=reset],[type=submit]){-webkit-appearance:button}:is(button,[type=button],[type=reset],[type=submit]):not(:disabled){cursor:pointer}.btn{--btn-margin: 1rem;--btn-padding-block: 0.75rem;--btn-padding-inline: 2.5rem;--btn-border-width: 2px;--btn-font-size: 1.125rem;--btn-line-height: 1.25rem;display:inline-block;font-weight:bold;text-align:left;text-decoration:none;vertical-align:middle;cursor:pointer;user-select:none;color:var(--colour-btn);font-size:var(--btn-font-size);line-height:var(--btn-line-height);padding:var(--btn-padding-block) var(--btn-padding-inline);border-radius:1.5rem;margin-bottom:var(--btn-margin);background:none;transition:border .5s,background .5s,color .5s;height:auto;max-width:fit-content;appearance:none;white-space:nowrap}@media screen and (min-width: 36em){.btn{--btn-margin: 1.5rem}}.btn:not(.btn-secondary)[class*=colour-]{--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour)}.btn:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){--colour-btn: #fcfcfc}.btn:not(.border-0){background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border)}.btn:not(:last-child){margin-right:var(--btn-margin)}a:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) .btn,.btn:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){outline:0;text-decoration:none;background:var(--colour-btn-bg-hover);color:var(--colour-btn-hover);border-radius:1.5rem}a:is(:active,.active):not([disabled]) .btn,.btn:is(:active,.active):not([disabled]){filter:brightness(85%);transition:background .1s,color .1s;color:var(--colour-btn);border-radius:1.5rem}a:disabled .btn,.btn:disabled,[disabled] .btn,.btn[disabled]{opacity:.4;cursor:not-allowed}.btn.btn-complete{--colour: var(--colour-success);--colour-btn-bg-hover: var(--colour);--colour-btn-border-hover: var(--colour);--colour-btn-hover: var(--colour-primary-theme);--colour-btn-bg: var(--colour);--colour-btn-border: var(--colour);position:relative;padding-left:3.5rem;padding-right:3.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn-complete,.btn.btn-complete:is(:hover,:focus,.hover):not([disabled],:active,.active){padding-left:2.5rem;padding-right:2.5rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn-complete:before,.btn.btn-complete:is(:hover,:focus,.hover):not([disabled],:active,.active):before{content:"\uF00C";font-family:"Font Awesome 7 Pro";margin-right:1rem;font-style:inherit;width:1rem;display:inline-block;height:var(--btn-line-height);vertical-align:bottom}.btn.btn-sm{--btn-padding-block: 0.5rem;--btn-padding-inline: 2rem;--btn-margin: 0.5rem;--btn-font-size: 1rem}.btn[class*=fa-]:before{content:var(--fa);font-family:"Font Awesome 7 Pro"}.btn.btn[class*=fa-after]{padding-right:4rem}.btn.btn[class*=fa-after]:before{margin-right:0;margin-right:.375rem;position:absolute;right:1.5rem;top:50%;transform:translate(0, -50%)}.btn:not(.btn-compact):before{margin-right:1rem}.btn i[class*=fa-]{--fa-width: 1em;font-family:"Font Awesome 7 Pro";margin-right:1rem;line-height:1em;font-style:inherit}.btn i[class*=fa-]:not(:first-child){margin-left:1rem;margin-right:0}.btn.btn--prompt:after{content:"";height:var(--btn-line-height);width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem}a:is(:hover,:focus,.hover):not([disabled],:active,.active) .btn.btn--prompt:after,.btn.btn--prompt:is(:hover,:focus,.hover):not([disabled],:active,.active):after{margin-left:1.5rem;margin-right:-0.5rem}.btn-filter:after{content:"\uF1DE";display:inline-block;margin-left:1em;margin-bottom:-0.15em;height:1em;width:1em;z-index:var(--index-focus);color:currentColor;font-weight:300;font-family:"Font Awesome 7 Pro"}}@layer elements{.btn-secondary{color:var(--colour-btn-secondary)}.btn-secondary:not(.border-0){background:var(--colour-btn-secondary-bg);border:2px solid var(--colour-btn-secondary-border)}a:is(:hover,:focus,.hover,:active,.active):not([disabled]) .btn-secondary,.btn-secondary:is(:hover,:focus,.hover,:focus-within,:active,.active):not([disabled]){background:var(--colour-btn-secondary-bg-hover);color:var(--colour-btn-secondary-hover)}}@layer elements{.btn.btn-tertiary{background-color:rgba(0,0,0,0);border:none;color:var(--colour-link);margin:0 var(--btn-margin) var(--btn-margin) 0;padding:0;font-size:1.125rem;font-weight:normal;line-height:1.5rem;min-height:1.5rem;position:relative}.btn.btn-tertiary:after{position:absolute;content:"";top:100%;left:50%;height:2px;width:100%;transform:translate(-50%, 0);background:var(--colour-underline);transition:width .5s}.btn.btn-tertiary.text-decoration-none:after{width:0%}.btn.btn-tertiary [class*=fa-]{margin-left:0;margin-right:.5rem}.btn.btn-tertiary [class*=fa-]:not(:first-child){margin-left:.5rem;margin-right:0}.btn.btn-tertiary:is(:hover,:focus,.hover,:focus-within):not([disabled],:disabled,:active,.active):after{width:60% !important}.btn.btn-tertiary:is(:active,.active):not([disabled],:disabled){color:var(--colour-active)}}@layer elements{.btn-action{--btn-border-width: 1px;--btn-padding-block: 0.3125rem /* 5px */;--btn-padding-inline: 0.3125rem /* 5px */;--btn-margin: 0.5rem;border-radius:.25rem !important;font-weight:400 !important;font-size:1rem;line-height:1.25rem;&:not(.btn-primary){color:var(--colour-heading)}&:not(.btn-primary):not(.border-0){background-color:var(--colour-canvas-2);border:var(--btn-border-width) solid var(--colour-muted)}&.btn[class*=fa-]:before{content:var(--fa);margin-right:.375rem}&.icon-only{position:relative;text-indent:-300vw;overflow:hidden;min-width:1.75rem;&:before{position:absolute;left:0;top:0;min-width:1.75rem;text-align:center;text-indent:0;padding-inline:.25rem;line-height:1.85rem}}a:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&:not(.btn-primary):is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){background:var(--colour-btn-action-hover-bg)}.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active) &,&.btn-primary:is(:hover,:focus,.hover,:focus-within):not([disabled],:active,.active){filter:brightness(90%);background:var(--colour-btn-bg);border:var(--btn-border-width) solid var(--colour-btn-border);color:var(--colour-btn)}a:is(:active,.active):not([disabled]):not(.btn-primary) &,&:is(:active,.active):not([disabled]):not(.btn-primary){filter:brightness(85%);transition:all .1s;color:var(--colour-heading)}}.btn-action:not(.btn-compact).fa-compact-only:before{display:none !important}}@layer elements{.btn-compact{--compact-size: 3rem;padding:0 !important;margin-bottom:.5rem;text-align:center;width:var(--compact-size);min-width:var(--compact-size);max-width:var(--compact-size);height:var(--compact-size) !important;min-height:var(--compact-size) !important;max-height:var(--compact-size) !important;align-content:center;line-height:1 !important;text-indent:-500px;overflow:hidden;position:relative;font-size:1rem;&:not(:last-child){margin-right:.5rem}&:before{content:var(--fa);position:absolute;display:block;top:0;left:0;width:100%;height:100%;text-indent:0;line-height:calc(var(--compact-size) - .25rem);font-weight:900}[class*=fa-]:before{line-height:calc(var(--compact-size) - .25rem);@container style(--theme: dark){color:white}}&.btn-sm{--compact-size: 2.5rem;font-size:1rem;padding:0 !important}&.btn-action{--compact-size: 2rem;font-size:1rem;&:before{font-size:1em;font-weight:400}}&.btn-secondary{--colour-btn-bg: transparent;--colour-btn-border: transparent;border-color:transparent;&:not([class*=colour-]){--colour: var(--colour-light)}}&.btn-secondary:is(:hover,:focus,.hover,:active,.active,[aria-expanded],:focus-within):not([disabled]):not(.btn-collapse){background-color:var(--colour);color:var(--colour-primary-theme);border-color:var(--colour);&:is(.colour-primary,.colour-dark,.colour-danger,.colour-black){color:var(--colour-inverted)}}&[data-number]{position:relative}&[data-number]:after{content:attr(data-number);position:absolute;top:.5em;z-index:99;background:var(--colour-danger);height:1.5em;width:1.5em;border-radius:50%;text-indent:0;left:50%;font-size:.5em;line-height:1.5em;text-align:center;color:white;letter-spacing:-0.1em;font-family:arial,sans-serif}}.btn-compact{&:is(.fa-left,.fa-chevron-left,.fa-right,.fa-chevron-right,.fa-up,.fa-chevron-up,.fa-down,.fa-chevron-down,.fa-plus,.fa-bars,.fa-edit,.fa-envelope,.fa-calendar){--iso-display: block;--iso-font-size: 1.5rem;--iso-border-radius: 50%;--iso-text-indent: -500px}}@container style(--font-body){.btn-compact{font-size:var(--iso-font-size, 0.6rem) !important;text-indent:var(--iso-text-indent, 0px);white-space:initial;&:not(.btn-action){border-radius:var(--iso-border-radius, 0.25rem) !important}&:before{display:var(--iso-display, none);font-family:monospace !important;content:var(--iso) !important}}}@container style(--fa-font-regular){.btn-compact{text-indent:-500px;font-size:1rem !important;&:not(.btn-action){border-radius:50% !important}&:before{font-family:"Font Awesome 7 Pro" !important;content:var(--fa) !important;display:block}}}}@layer elements{.btn[popovertarget]{position:relative;anchor-name:--button2}.btn[popovertarget]>.fa-chevron-down{display:none}.btn[popovertarget]:not(:has(i)):after{content:"";display:inline-block;margin-right:.25em;margin-left:1em;height:.8em;width:.8em;z-index:var(--index-focus);background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;transform:rotate(90deg)}.btn[popovertarget][aria-pressed]:after{transform:rotate(270deg)}.btn:has(select){position:relative;padding:0;max-width:fit-content;min-width:fit-content;width:fit-content}.btn:has(select) select{all:unset !important;padding:var(--btn-padding-block) var(--btn-padding-inline) !important;padding-right:calc(var(--btn-padding-inline) + 2rem) !important;border-radius:1.5rem !important;appearance:none !important;background:none !important;border:none !important;color:currentColor !important;display:block;outline:none;font-weight:inherit !important;font-size:var(--btn-font-size) !important;line-height:var(--btn-line-height) !important;field-sizing:content !important;appearance:base-select !important}.btn:has(select) select option{font-size:1rem;text-align:left;color:var(--colour-primary);padding-inline:var(--menu-item-padding, 0.5rem);padding-block:var(--menu-item-padding, 0.5rem) !important;border-radius:.25rem !important}.btn:has(select) select option:not(:last-child){margin:var(--menu-item-margin, 0 0 0.25rem 0) !important}.btn:has(select) select option:hover{background:var(--colour-light) !important}.btn:has(select) select option:after{content:attr(data-email)}.btn:has(select) select::picker-icon{display:none}.btn:has(select) select::picker(select){appearance:base-select;background:var(--menu-bg, canvas);margin-block:var(--menu-margin, 0.25rem);padding:var(--menu-padding, 0.5rem) !important;border:none !important;border-radius:.5rem;box-shadow:0px 2px 9px rgba(0,0,0,.1);font-size:1rem}.btn:has(select) hr{height:1px !important;background-color:var(--menu-hr-border-color, var(--border-color, grey)) !important;width:100%;margin:var(--menu-item-margin, 0 0 0.25rem 0) !important;padding:0 !important}.btn:has(select) select option::checkmark{display:none}.btn:has(select) select selectedcontent span{display:none}.btn:has(select):after{position:absolute;top:.625rem;right:1.5rem;content:"";height:1.5rem;width:1rem;display:inline-block;background:currentColor;mask-image:var(--icon-arrow);mask-size:100%;mask-repeat:no-repeat;mask-position:50% 50%;-webkit-mask-image:var(--icon-arrow);-webkit-mask-size:100%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 50%;vertical-align:bottom;margin-left:1rem;transform:rotate(90deg);pointer-events:none}.btn-action:has(select){padding-block:0;padding-right:2rem;font-size:1em}.btn-action:has(select) select{margin:0rem 0rem !important;padding-right:2rem !important;margin-right:-2rem !important;font-size:1rem !important}.btn-action:has(select):after{top:.2rem;right:.5rem}}@layer elements{.btn__group{display:flex;flex-direction:column;row-gap:var(--gap);reading-flow:source-order;margin-bottom:1.5rem;.btn-compact{max-width:fit-content;margin-inline:auto}}:where(.btn__group,iam-modal){reading-flow:source-order;.btn{margin-inline-end:0;width:100%;max-width:100%;text-align:center;white-space:normal;margin:0;&:not(:last-child){margin-right:0}}.btn-tertiary{max-width:fit-content;margin-block:0 !important;margin-inline:auto !important;order:3;reading-order:3}.btn-secondary{order:2;reading-order:2}.btn-primary{order:1;reading-order:1;margin:0;&:not(:last-child){margin:0}}}:is(iam-form,form) .btn__group{padding-top:1rem}@container (min-width: 36em){.btn__group{flex-direction:row;row-gap:0;gap:var(--gap);flex-wrap:wrap;.btn-tertiary{max-width:fit-content;margin-inline:0 !important;margin-block:auto;order:1}.btn-secondary{order:2}.btn-primary{order:3}.btn-compact{margin-inline:0;margin-block:auto}}:where(iam-modal,.btn__group){.btn{max-width:fit-content;white-space:nowrap;margin-block:auto}}.btn__group{.btn-tertiary{reading-order:1}.btn-secondary{reading-order:2}.btn-primary{reading-order:3}}iam-modal{.btn-tertiary{reading-order:3;order:1}.btn-secondary{order:2;reading-order:2}.btn-primary{order:3;reading-order:1}}.btn__group.text-end{justify-content:flex-end}:is(iam-form,form) .btn__group{justify-content:flex-end;padding-top:3rem}iam-modal .btn__group:last-child .btn,dialog .btn__group:last-child .btn{margin-bottom:0}}}:host(.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;min-height:1.5rem}: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 table tbody:has(td:first-child strong) td:first-child{font-weight:normal !important}: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)}: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, 7.5rem)}@container (min-width: 36em){.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 */
|
|
13
13
|
|
|
14
14
|
</style>
|
|
15
15
|
<div class="chart__outer" part="outer">
|
|
@@ -21,5 +21,5 @@
|
|
|
21
21
|
</div>
|
|
22
22
|
</div>
|
|
23
23
|
<div class="chart__spacer"><span part="spacer"></span</div>
|
|
24
|
-
</div>`,this.shadowRoot.appendChild(r.content.cloneNode(!0))}connectedCallback(){const r=this,o=this.querySelector("table").cloneNode(!0),e=this.shadowRoot.querySelector(".chart"),
|
|
24
|
+
</div>`,this.shadowRoot.appendChild(r.content.cloneNode(!0))}connectedCallback(){const r=this,o=this.querySelector("table").cloneNode(!0),e=this.shadowRoot.querySelector(".chart"),n=this.shadowRoot.querySelector(".chart__outer"),i=e.querySelectorAll("td:not(:first-child)").length;e.appendChild(o),N(r,n),i<=10&&r.classList.add("chart--fit-content"),i<=5&&r.classList.add("chart--no-scale"),k(r,n,o),U(r,n),V(r,n),I(n),B(n),G(n),J(r,"iam-barchart",["view-change"])}}export{Q as default};
|
|
25
25
|
//# sourceMappingURL=barchart.component.min.js.map
|