mp-design-system 1.2.15 → 1.2.17

Sign up to get free protection for your applications and to get access to all the features.
Files changed (14) hide show
  1. package/dist/build/js/app.js.map +1 -1
  2. package/dist/build/js/product-finder.js +2 -0
  3. package/dist/build/js/product-finder.js.map +1 -0
  4. package/dist/build/scss/library.css +1 -1
  5. package/dist/build/scss/library.css.map +1 -1
  6. package/dist/build/scss/main.css +1 -1
  7. package/dist/build/scss/main.css.map +1 -1
  8. package/package.json +1 -1
  9. package/src/_includes/components/embed/embed.scss +0 -1
  10. package/src/assets/js/product-finder.js +575 -0
  11. package/src/assets/scss/components/product-finder.scss +4 -0
  12. package/src/assets/scss/objects/grid.scss +5 -0
  13. package/src/assets/scss/utilities/display.scss +7 -0
  14. package/src/prototype/product-finder.njk +61 -0
package/dist/build/js/app.js.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"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","sources":["src/assets/js/imports/accordion.js","src/assets/js/imports/carousel.js","src/assets/js/imports/clear-form.js","src/assets/js/imports/comparison.js","src/assets/js/imports/gallery.js","src/assets/js/imports/utilities.js","src/assets/js/imports/hero-pattern.js","src/assets/js/imports/hero-video.js","src/assets/js/imports/internal-nav.js","src/assets/js/imports/off-canvas.js","src/assets/js/imports/responsive-table.js","src/assets/js/imports/scrollbar-width.js","src/assets/js/imports/scroll-spy.js","src/assets/js/imports/tabs.js","src/assets/js/app.js"],"sourcesContent":["function Accordion() {\r\n const accordions = Array.from(document.querySelectorAll('.c-accordion__title'));\r\n accordions.forEach(setupAccordions);\r\n}\r\n\r\nfunction setupAccordions(title) {\r\n title.addEventListener('click', titleClick())\r\n}\r\n\r\nfunction titleClick() {\r\n return (event) => {\r\n var item = event.currentTarget.parentElement;\r\n item.classList.toggle('c-accordion__item--open');\r\n }\r\n}\r\n\r\nexport default Accordion;\r\n","function Carousel() {\r\n let current = 0;\r\n const bgSlides = document.querySelectorAll('.c-hero__image-bg');\r\n const fgSlides = document.querySelectorAll('.c-hero__image-fg');\r\n\r\n if(fgSlides.length > 0) {\r\n setInterval(() => {\r\n for (var bgSlide of bgSlides) {\r\n bgSlide.style.opacity = 0;\r\n }\r\n current = (current != bgSlides.length - 1) ? current + 1 : 0;\r\n bgSlides[current].style.opacity = 1;\r\n \r\n for (var fgSlide of fgSlides) {\r\n fgSlide.style.opacity = 0;\r\n }\r\n fgSlides[current].style.opacity = 1;\r\n }, 5000);\r\n }\r\n}\r\n\r\nexport default Carousel;","function ClearForm() {\r\n const formClear = document.getElementById('clearForm');\r\n if (formClear) {\r\n formClear.addEventListener('click', function () {\r\n const fields = this.closest('form').elements;\r\n fields.forEach(field => {\r\n if (field.value != '') {\r\n if (\r\n field.type.toLowerCase() == 'text' || \r\n field.type.toLowerCase() == 'email' || \r\n field.type.toLowerCase() == 'tel' || \r\n field.type.toLowerCase() == 'select-one' || \r\n field.type.toLowerCase() == 'textarea'\r\n ) {\r\n field.value = '';\r\n return;\r\n } else if (field.type.toLowerCase() == 'checkbox') {\r\n field.checked = false;\r\n return;\r\n }\r\n }\r\n });\r\n });\r\n };\r\n}\r\n\r\nexport default ClearForm;","function Comparison() {\r\n document.querySelectorAll('.c-comparison-table').forEach(extractMobileComparison)\r\n}\r\n\r\nfunction extractMobileComparison(container) {\r\n const parent = container.parentNode.parentNode;\r\n const body = parent.querySelector('.c-comparison-table tbody');\r\n const head = parent.querySelector('.c-comparison-table thead');\r\n const mobile = parent.parentElement.querySelector('.c-comparison-table__mobile');\r\n\r\n if (!body || !head || !mobile) return;\r\n\r\n // Remove empty corner piece \r\n const productsInfo = Array.from(head.children[0].children).filter((x, i) => i).map(x => ({ info: x.innerHTML }));\r\n const productsButtons = Array.from(head.children[1].children).filter((x, i) => i).map(x => ({ buttons: x.innerHTML }));\r\n const products = productsInfo.map((info, index) => ({ ...info, ...productsButtons[index], table: [] }));\r\n\r\n Array.from(body.children).forEach(row => {\r\n // For table row headers, push to all products\r\n if (row.classList.contains('c-comparison-table__title')) {\r\n products.forEach(x => {\r\n x.table.push({ type: 'title', title: row.children[0].textContent })\r\n })\r\n } else {\r\n // For all others, loop the cells and push to their appropriate parent\r\n const cells = Array.from(row.children);\r\n const firstCell = cells.shift();\r\n\r\n cells.forEach((el, index) => {\r\n products[index].table.push({\r\n type: 'row',\r\n key: firstCell.textContent,\r\n value: el.innerHTML\r\n })\r\n })\r\n }\r\n })\r\n\r\n products.forEach(product => {\r\n const el = createMobileProduct(product);\r\n mobile.appendChild(el)\r\n })\r\n}\r\n\r\nfunction createMobileProduct(product) {\r\n const parent = document.createElement('article');\r\n parent.innerHTML = `${product.info}${product.buttons}\r\n <table class=\"c-comparison-table\">\r\n ${product.table.map(x => {\r\n if (x.type === 'title') {\r\n return `<tr class=\"c-comparison-table__title\"><th><span>${x.title}</span></th><th></th></tr>`;\r\n } else {\r\n return `<tr>\r\n <td>${x.key}</td>\r\n <td>${x.value}</td>\r\n </tr>`;\r\n }\r\n }).join('')}\r\n </table>`;\r\n\r\n return parent;\r\n}\r\n\r\nexport default Comparison;\r\n","function Gallery() {\r\n const mainSlides = document.querySelectorAll('.c-gallery__main .c-gallery__slide');\r\n const thumbnailSlides = document.querySelectorAll('.c-gallery__thumbnails .c-gallery__slide');\r\n\r\n thumbnailSlides.forEach(thumbnailSlide => thumbnailSlide.addEventListener('click', function(e) {\r\n thumbnailSlides.forEach(function(thumbnail) {\r\n if(thumbnail != e.target.parentNode) {\r\n thumbnail.classList.remove('active');\r\n }\r\n });\r\n e.target.parentNode.classList.add('active');\r\n\r\n mainSlides.forEach(function(mainSlide) {\r\n if(mainSlide.dataset.slide == thumbnailSlide.dataset.slide) {\r\n mainSlide.classList.add('active');\r\n } else {\r\n mainSlide.classList.remove('active');\r\n }\r\n });\r\n }));\r\n\r\n mainSlides.forEach(function(mainSlide) {\r\n if(!mainSlide.classList.contains('c-gallery__video')) {\r\n mainSlide.addEventListener('click', lightboxTrigger);\r\n }\r\n });\r\n\r\n function lightboxTrigger() {\r\n const lightbox = document.querySelector('.c-gallery__main').cloneNode(true);\r\n lightbox.classList.remove('c-gallery__main');\r\n lightbox.classList.add('c-lightbox');\r\n lightbox.querySelectorAll('.c-gallery__slide').forEach(function(slide) {\r\n if(slide.classList.contains('c-gallery__video')) {\r\n slide.remove();\r\n }\r\n if(!slide.classList.contains('c-gallery__video')) {\r\n var slideImg = slide.querySelector('img');\r\n if(slideImg.srcset != '') {\r\n slideImg.removeAttribute('srcset');\r\n }\r\n var slideImgSrc = slideImg.getAttribute('src');\r\n if (slideImgSrc) {\r\n if (slideImgSrc.indexOf('?') !== -1) {\r\n slideImg.setAttribute('src', slideImgSrc.split(\"?\")[0] + '?quality=90&width=2176');\r\n } else {\r\n slideImg.setAttribute('src', slideImgSrc + '?quality=90&width=2176');\r\n }\r\n } else {\r\n console.log(slideImg);\r\n console.log('has no src defined...');\r\n }\r\n }\r\n slide.classList.add('c-lightbox__slide');\r\n slide.classList.remove('c-gallery__slide');\r\n });\r\n document.body.appendChild(lightbox);\r\n lightbox.insertAdjacentHTML('beforeend', '<a class=\"c-lightbox__prev\"></a><a class=\"c-lightbox__next\"></a>');\r\n\r\n lightbox.querySelector('.c-lightbox__prev').addEventListener('click', function() {\r\n const lightboxActive = lightbox.querySelector('.active');\r\n const prevImage = lightbox.querySelector('[data-slide=\"' + (parseInt(lightboxActive.dataset.slide) - 1) + '\"]');\r\n if(prevImage != null) {\r\n lightboxActive.classList.remove('active');\r\n prevImage.classList.add('active');\r\n }\r\n });\r\n\r\n lightbox.querySelector('.c-lightbox__next').addEventListener('click', function() {\r\n const lightboxActive = lightbox.querySelector('.active');\r\n const nextImage = lightbox.querySelector('[data-slide=\"' + (parseInt(lightboxActive.dataset.slide) + 1) + '\"]');\r\n if(nextImage != null) {\r\n lightboxActive.classList.remove('active');\r\n nextImage.classList.add('active');\r\n }\r\n });\r\n\r\n lightbox.addEventListener('click', function(e) {\r\n if (e.target !== e.currentTarget) {\r\n return;\r\n } else {\r\n lightbox.remove();\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default Gallery;\r\n","export function shuffle(array) {\r\n const arr = [...array];\r\n for (let i = arr.length - 1; i > 0; i--) {\r\n let j = Math.floor(Math.random() * (i + 1));\r\n [arr[i], arr[j]] = [arr[j], arr[i]];\r\n }\r\n\r\n return arr;\r\n}\r\n\r\nexport function userPrefersReducedMotion() {\r\n const QUERY = '(prefers-reduced-motion: no-preference)';\r\n const mediaQueryList = window.matchMedia(QUERY);\r\n const prefersReducedMotion = !mediaQueryList.matches;\r\n return prefersReducedMotion;\r\n}\r\n\r\nexport const debounce = (func, limit) => {\r\n let wait = false; \r\n return () => {\r\n if (wait) return;\r\n func();\r\n wait = true;\r\n setTimeout(() => wait = false, limit);\r\n }\r\n}\r\n\r\nexport const lerp = (x, y, a) => x * (1 - a) + y * a;\r\nexport const clamp = (a, min = 0, max = 1) => Math.min(max, Math.max(min, a));\r\nexport const invlerp = (x, y, a) => clamp((a - x) / (y - x));\r\nexport const range = (x1, y1, x2, y2, a) => lerp(x2, y2, invlerp(x1, y1, a));\r\n","import { range, shuffle, userPrefersReducedMotion } from './utilities';\r\n\r\nfunction HeroPattern() {\r\n let time = 0;\r\n\r\n const c = document.querySelector('.c-hero__canvas');\r\n if (!c) return;\r\n const ctx = c.getContext(\"2d\");\r\n \r\n const sineColour = \"rgb(19,170,19)\";\r\n const reduceMotion = userPrefersReducedMotion();\r\n\r\n const crossGap = 147;\r\n const minimumOpacity = 0;\r\n const maximumOpacity = 0.5;\r\n const crossSpeed = 0.25;\r\n\r\n let width;\r\n let height;\r\n let across;\r\n let down;\r\n let crosses = [];\r\n let totalPoints;\r\n\r\n function draw() {\r\n // Sine wave\r\n time = time + 0.005;\r\n \r\n ctx.clearRect(0, 0, c.width, c.height);\r\n ctx.beginPath();\r\n \r\n for(let cnt = c.width; cnt > 0; cnt--) {\r\n ctx.lineTo(cnt, c.height * 0.5 - (Math.cos(time + cnt / 5 * 0.03) * (height * 0.3) ));\r\n }\r\n \r\n ctx.lineWidth = 0.5;\r\n ctx.strokeStyle = sineColour;\r\n ctx.stroke();\r\n \r\n // Crosses\r\n crosses.forEach(cross => {\r\n drawCross(cross.x, cross.y, range(0, crosses.length, minimumOpacity, maximumOpacity, cross.counter));\r\n \r\n cross.counter += cross.direction;\r\n if (cross.counter >= crosses.length) cross.direction = -1 * crossSpeed;\r\n if (cross.counter < 0) cross.direction = crossSpeed;\r\n })\r\n \r\n if (!reduceMotion) {\r\n window.requestAnimationFrame(draw);\r\n }\r\n }\r\n \r\n function onResize() {\r\n width = c.scrollWidth;\r\n height = c.scrollHeight;\r\n \r\n ctx.canvas.width = width;\r\n ctx.canvas.height = height;\r\n \r\n across = Math.ceil(width / crossGap);\r\n down = Math.ceil(height / crossGap);\r\n \r\n totalPoints = (across + 1) * (down + 1);\r\n const ids = shuffle(Array.from({ length: totalPoints }, (_, i) => (i)))\r\n crosses = [];\r\n for(let x = 0; x <= across; x++) {\r\n for(let y = 0; y <= down; y++) {\r\n crosses.push({\r\n counter: ids.shift(),\r\n direction: Math.random() > 0.5 ? crossSpeed : -1 * crossSpeed,\r\n x: crossGap * (x + 1) - crossGap / 1,\r\n y: crossGap * (y + 1) - crossGap / 2\r\n });\r\n }\r\n }\r\n }\r\n \r\n function drawCross(x, y, opacity) {\r\n ctx.beginPath();\r\n ctx.moveTo(x - 14, y);\r\n ctx.lineTo(x + 14, y);\r\n ctx.strokeStyle = `rgba(255, 255, 255, ${opacity}`;\r\n ctx.moveTo(x, y - 14);\r\n ctx.lineTo(x, y + 14);\r\n ctx.stroke();\r\n }\r\n\r\n window.addEventListener('resize', onResize);\r\n onResize();\r\n draw();\r\n}\r\n\r\nexport default HeroPattern;\r\n","function HeroVideo() {\r\n document.addEventListener(\"DOMContentLoaded\", () => {\r\n const videoBackground = document.getElementById('videoBackground');\r\n if(typeof(videoBackground) != 'undefined' && videoBackground != null) {\r\n const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');\r\n if(!reducedMotion || reducedMotion.matches) {\r\n videoBackground.classList.add('u-hidden');\r\n }\r\n \r\n const lightboxTrigger = document.getElementById('playVideo');\r\n const lightboxContainer = document.getElementById('lightboxVideo');\r\n const lightboxVideo = lightboxContainer.querySelector('.c-lightbox__video');\r\n\r\n lightboxTrigger.addEventListener('click', e => {\r\n videoBackground.pause();\r\n lightboxContainer.classList.remove('u-hidden');\r\n checkVideos();\r\n });\r\n \r\n lightboxContainer.addEventListener('click', (e) => {\r\n if (!e.target.classList.contains('c-lightbox__video')) {\r\n videoBackground.setAttribute('autoplay','');\r\n lightboxContainer.classList.add('u-hidden');\r\n checkVideos();\r\n }\r\n });\r\n window.addEventListener('keydown', function(e) {\r\n if (e.key == \"Escape\") {\r\n videoBackground.setAttribute('autoplay','');\r\n lightboxContainer.classList.add('u-hidden');\r\n checkVideos();\r\n }\r\n });\r\n\r\n function checkVideos() {\r\n if(lightboxContainer.classList.contains('u-hidden')) {\r\n if (videoBackground.paused) {\r\n videoBackground.play();\r\n }\r\n if (!lightboxVideo.paused) {\r\n lightboxVideo.pause();\r\n }\r\n } else {\r\n if (!videoBackground.paused) {\r\n videoBackground.pause();\r\n }\r\n }\r\n }\r\n }\r\n });\r\n}\r\n\r\nexport default HeroVideo;","function InternalNav() {\r\n const internalNav = document.querySelector('.c-internal-nav.u-sticky');\r\n\r\n if (!internalNav) {\r\n return;\r\n }\r\n\r\n const observerOptions = {\r\n root: null,\r\n rootMargin: '0px',\r\n threshold: 1.0\r\n };\r\n\r\n const intersectionCallback = (entries, observer) => {\r\n const isIntersecting = entries[0].isIntersecting;\r\n internalNav.classList.toggle('c-internal-nav--stuck', !isIntersecting);\r\n };\r\n\r\n const observer = new IntersectionObserver(intersectionCallback, observerOptions);\r\n observer.observe(internalNav);\r\n}\r\n\r\nexport default InternalNav;\r\n","// Function to initialize off-canvas behavior\r\nfunction OffCanvas() {\r\n // Select all elements that trigger off-canvas behavior\r\n const toggles = document.querySelectorAll(\".c-off-canvas__toggle\");\r\n\r\n // Iterate through each toggle element\r\n if (toggles.length) {\r\n toggles.forEach(toggle => {\r\n // Determine initial visibility state and handle click event\r\n handleOffCanvas(toggle, isVisible(toggle));\r\n toggle.addEventListener('click', () => toggleOffCanvas(toggle));\r\n });\r\n\r\n // Add event listener for scroll events to check visibility\r\n // window.addEventListener('scroll', () => {\r\n // toggles.forEach(toggle => {\r\n // handleOffCanvas(toggle, isVisible(toggle));\r\n // });\r\n // });\r\n\r\n // Add event listener for resize events to check visibility\r\n window.addEventListener('resize', () => {\r\n toggles.forEach(toggle => {\r\n handleOffCanvas(toggle, isVisible(toggle));\r\n });\r\n });\r\n }\r\n}\r\n\r\n// Function to check if an element is currently visible on the page\r\nfunction isVisible(element) {\r\n // Check element's position and styles for visibility\r\n const rect = element.getBoundingClientRect();\r\n const style = window.getComputedStyle(element);\r\n return (\r\n rect.top >= 0 &&\r\n rect.left >= 0 &&\r\n rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&\r\n rect.right <= (window.innerWidth || document.documentElement.clientWidth) &&\r\n style.display !== 'none' &&\r\n style.visibility !== 'hidden'\r\n );\r\n}\r\n\r\n// Function to handle off-canvas behavior based on visibility\r\nfunction handleOffCanvas(toggle, isVisible) {\r\n const target = document.getElementById(toggle.getAttribute('data-target'));\r\n if (isVisible === true) {\r\n createOffCanvas(target);\r\n } else {\r\n removeOffCanvas(target);\r\n }\r\n}\r\n\r\n// Function to create off canvas\r\nfunction createOffCanvas(target) {\r\n // Add necessary classes and attributes for off-canvas display\r\n target.classList.add('c-off-canvas');\r\n target.setAttribute('tabindex', '-1');\r\n target.setAttribute('aria-hidden', 'true');\r\n \r\n // Extract specific sections of the off-canvas content\r\n const targetHeader = target.querySelector('[data-off-canvas=\"header\"]');\r\n const targetMain = target.querySelector('[data-off-canvas=\"main\"]');\r\n const targetFooter = target.querySelector('[data-off-canvas=\"footer\"]');\r\n\r\n // Extract content from the sections\r\n const targetHeaderContent = targetHeader !== null ? targetHeader.outerHTML : '';\r\n const targetMainContent = targetMain !== null ? targetMain.outerHTML : '';\r\n const targetFooterContent = targetFooter !== null ? targetFooter.outerHTML : '';\r\n\r\n // Replace the target's content with off-canvas structure\r\n target.innerHTML = `\r\n <div class=\"c-off-canvas__backdrop\" role=\"presentation\"></div>\r\n <div class=\"c-off-canvas__content\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"offCanvasHeader\">\r\n <header id=\"offCanvasHeader\" class=\"c-off-canvas__header\">${targetHeaderContent}</header>\r\n <main class=\"c-off-canvas__main\">${targetMainContent}</main>\r\n <footer class=\"c-off-canvas__footer\">\r\n ${targetFooterContent}\r\n <button class=\"mp c-twi c-twi--left c-off-canvas__close\" data-off-canvas-close=\"true\" onclick=\"return false\">\r\n <span>Cancel</span>\r\n <svg role=\"img\" aria-hidden=\"true\" focusable=\"false\" class=\"mp c-icon c-icon--cross\">\r\n <use xlink:href=\"/static/svg/sprite.svg#cross\"></use>\r\n </svg>\r\n </button>\r\n </footer>\r\n </div>\r\n `;\r\n}\r\n\r\n// Function to remove off-canvas layout\r\nfunction removeOffCanvas(target) {\r\n // Remove classes and attributes for off-canvas display\r\n target.classList.remove('c-off-canvas', 'c-off-canvas--active');\r\n target.removeAttribute('tabindex');\r\n target.removeAttribute('aria-hidden');\r\n\r\n // Remove backdrop element if present\r\n const targetBackdrop = target.querySelector('.c-off-canvas__backdrop');\r\n if (targetBackdrop) {\r\n targetBackdrop.remove();\r\n }\r\n\r\n // Restore original content by removing off-canvas structure\r\n const targetContent = target.querySelector('.c-off-canvas__content');\r\n if (targetContent) {\r\n while (targetContent.firstChild) {\r\n target.insertBefore(targetContent.firstChild, targetContent);\r\n }\r\n target.removeChild(targetContent);\r\n }\r\n\r\n const targetHeader = target.querySelector('.c-off-canvas__header');\r\n if (targetHeader) {\r\n while (targetHeader.firstChild) {\r\n target.insertBefore(targetHeader.firstChild, targetHeader);\r\n }\r\n target.removeChild(targetHeader);\r\n }\r\n\r\n const targetMain = target.querySelector('.c-off-canvas__main');\r\n if (targetMain) {\r\n while (targetMain.firstChild) {\r\n target.insertBefore(targetMain.firstChild, targetMain);\r\n }\r\n target.removeChild(targetMain);\r\n }\r\n\r\n const targetFooter = target.querySelector('.c-off-canvas__footer');\r\n if (targetFooter) {\r\n while (targetFooter.firstChild) {\r\n target.insertBefore(targetFooter.firstChild, targetFooter);\r\n }\r\n target.removeChild(targetFooter);\r\n }\r\n \r\n // Remove close button element if present\r\n const targetClose = target.querySelector('.c-off-canvas__close');\r\n if (targetClose) {\r\n targetClose.remove();\r\n }\r\n}\r\n\r\n// Function to toggle off-canvas visibility\r\nfunction toggleOffCanvas(toggle) {\r\n const target = document.getElementById(toggle.getAttribute('data-target'));\r\n\r\n // Check if the target is already open or closed\r\n if (!target.classList.contains('c-off-canvas--active')) {\r\n openOffCanvas(toggle, target);\r\n } else if (target.classList.contains('c-off-canvas--active')) {\r\n closeOffCanvas(target);\r\n }\r\n}\r\n\r\nfunction openOffCanvas(toggle, target) {\r\n // Add classes and attributes for open off-canvas\r\n toggle.setAttribute('aria-expanded', 'true');\r\n target.classList.add('c-off-canvas--active');\r\n target.setAttribute('aria-hidden', 'false');\r\n\r\n // Add event listener for backdrop clicks\r\n const offCanvasBackdrop = target.querySelector('.c-off-canvas__backdrop');\r\n if(offCanvasBackdrop) {\r\n offCanvasBackdrop.addEventListener('click', handleBackdropClick);\r\n }\r\n\r\n // Add event listener forclose button clicks\r\n const offCanvasCloseElements = target.querySelectorAll('[data-off-canvas-close=\"true\"]');\r\n if (offCanvasCloseElements.length > 0) {\r\n offCanvasCloseElements.forEach((offCanvasClose) => {\r\n offCanvasClose.addEventListener('click', handleCloseClick);\r\n });\r\n }\r\n\r\n // Add event listener for Escape key press\r\n document.addEventListener('keydown', handleKeyDown, { once: true });\r\n\r\n // Adjust body overflow to prevent scrolling\r\n document.body.style.overflowY = 'hidden';\r\n\r\n // Close other open off-canvas elements\r\n const allOffCanvasElementsExceptCurrent = Array.from(document.querySelectorAll('.c-off-canvas')).filter(offCanvas => offCanvas !== target);\r\n if (allOffCanvasElementsExceptCurrent.length > 0) {\r\n allOffCanvasElementsExceptCurrent.forEach((offCanvas) => {\r\n closeOffCanvas(offCanvas);\r\n });\r\n }\r\n}\r\n\r\n// Function to close an off-canvas\r\nfunction closeOffCanvas(target) {\r\n // Remove classes and attributes for open off-canvas\r\n document.querySelector('[data-target=\"' + target.id + '\"').setAttribute('aria-expanded', 'false');\r\n target.classList.remove('c-off-canvas--active');\r\n target.setAttribute('aria-hidden', 'true');\r\n\r\n // Restore body overflow\r\n document.body.style.overflowY = '';\r\n}\r\n\r\n// Function to handle backdrop click\r\nfunction handleBackdropClick() {\r\n const offCanvas = this.closest('.c-off-canvas');\r\n closeOffCanvas(offCanvas);\r\n}\r\n\r\n// Function to handle Escape key press\r\nfunction handleKeyDown(event) {\r\n if (event.key === 'Escape') {\r\n const activeOffCanvas = document.querySelector('.c-off-canvas--active');\r\n if (activeOffCanvas) {\r\n closeOffCanvas(activeOffCanvas);\r\n }\r\n }\r\n}\r\n\r\n// Function to handle close button click\r\nfunction handleCloseClick() {\r\n const offCanvas = this.closest('.c-off-canvas');\r\n closeOffCanvas(offCanvas);\r\n}\r\n\r\nexport default OffCanvas;","const ResponsiveTable = () => {\r\n const tables = Array.from(document.querySelectorAll('.c-table--responsive'));\r\n tables.forEach(createResponsiveTable);\r\n\r\n /**\r\n * Create responsive table headers for large tables\r\n * @param {HTMLTableElement} table\r\n */\r\n function createResponsiveTable(table) {\r\n const headers = table.querySelectorAll('thead > :first-child th');\r\n const breakPoint = Number(table.getAttribute('data-columns')) || 2\r\n \r\n if (headers.length < breakPoint) {\r\n table.classList.remove('c-table--responsive');\r\n return;\r\n };\r\n\r\n Array.from(table.querySelectorAll('tbody tr')).forEach((row) => {\r\n Array.from(headers)\r\n .map((x) => x.textContent)\r\n .forEach((header, index) => {\r\n if (row.children[index]) {\r\n row.children[index].setAttribute('data-responsive-title', header);\r\n }\r\n });\r\n });\r\n }\r\n};\r\n\r\nexport default ResponsiveTable;\r\n","import { debounce } from './utilities';\r\n\r\nfunction ScrollbarWidth() {\r\n setScrollbarWidth();\r\n window.addEventListener('resize', debounce(setScrollbarWidth, 250));\r\n}\r\n\r\nfunction setScrollbarWidth() {\r\n document.documentElement.style.setProperty(\r\n '--scrollbarWidth', \r\n window.innerWidth - document.body.clientWidth + 'px'\r\n );\r\n}\r\n\r\nexport default ScrollbarWidth;","function ScrollSpy() {\r\n const spies = Array.from(document.querySelectorAll('.c-scroll-spy'));\r\n spies.forEach(setup);\r\n}\r\n\r\nfunction setup(element) {\r\n const anchors = Array.from(element.querySelectorAll('a'));\r\n const observer = new IntersectionObserver(observation(anchors));\r\n \r\n anchors.forEach(anchor => {\r\n const id = anchor.getAttribute('href').replace('#', '');\r\n const target = document.getElementById(id);\r\n if (!target) return;\r\n\r\n observer.observe(target);\r\n });\r\n}\r\n\r\n/**\r\n * @param {Array<HTMLAnchorElement>} results \r\n * @return {Array<IntersectionObserverEntry>}\r\n */\r\nfunction observation(anchors) {\r\n return (results) => {\r\n const firstObservation = results.find(x => x.isIntersecting);\r\n\r\n if (firstObservation) {\r\n anchors.forEach(x => {\r\n x.classList.toggle(\r\n 'c-scroll-spy-active',\r\n x.getAttribute('href') === '#' + firstObservation.target.id\r\n )\r\n })\r\n }\r\n }\r\n}\r\n\r\nexport default ScrollSpy;\r\n","function Tabs() {\r\n const tabs = Array.from(document.querySelectorAll('.c-tabs--anchor'));\r\n tabs.forEach(setupTabs);\r\n}\r\n\r\nfunction setupTabs(parent) {\r\n const controls = Array.from(parent.querySelectorAll('.c-tabs__control'));\r\n const content = Array.from(parent.querySelectorAll('.c-tab'));\r\n const persist = parent.classList.contains('c-tabs--persist');\r\n \r\n if (!controls.length || !content.length) return;\r\n\r\n controls.forEach(control => {\r\n control.addEventListener('click', controlClick(controls, content, persist))\r\n })\r\n\r\n if (persist && window.location.hash) {\r\n const control = parent.querySelector('[href=\"' + window.location.hash + '\"]');\r\n if (control) control.dispatchEvent(new Event('click'));\r\n }\r\n}\r\n\r\nfunction controlClick(controls, contents, persist) {\r\n return (event) => {\r\n const control = event.currentTarget;\r\n const content = contents.find(x => x.id === control.getAttribute('href').replace('#', ''));\r\n \r\n if (!content) {\r\n return true;\r\n };\r\n\r\n event.preventDefault();\r\n \r\n if (persist) {\r\n history.pushState(null, null, control.getAttribute('href'));\r\n }\r\n\r\n controls.forEach(c => c.classList.toggle('c-tabs__control--active', c === control));\r\n contents.forEach(c => {\r\n const isCurrent = c === content;\r\n c.classList.toggle('c-tab--active', isCurrent);\r\n \r\n if (persist) return;\r\n\r\n if (isCurrent) {\r\n c.setAttribute('tabIndex', -1);\r\n \r\n const y = window.scrollY;\r\n c.focus();\r\n window.scrollTo({ behavior: \"auto\", top: y })\r\n } else {\r\n c.removeAttribute('tabIndex');\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default Tabs;\r\n","import Accordion from './imports/accordion';\r\nimport Carousel from './imports/carousel';\r\nimport ClearForm from './imports/clear-form';\r\nimport Comparison from './imports/comparison';\r\nimport Gallery from './imports/gallery';\r\nimport HeroPattern from './imports/hero-pattern';\r\nimport HeroVideo from './imports/hero-video';\r\nimport InternalNav from './imports/internal-nav';\r\nimport OffCanvas from './imports/off-canvas';\r\nimport ResponsiveTable from './imports/responsive-table';\r\nimport ScrollbarWidth from './imports/scrollbar-width';\r\nimport ScrollSpy from './imports/scroll-spy';\r\nimport Tabs from './imports/tabs';\r\n\r\n(() => {\r\n if(window.NodeList && !NodeList.prototype.forEach) {\r\n NodeList.prototype.forEach = Array.prototype.forEach;\r\n }\r\n if(window.HTMLCollection && !HTMLCollection.prototype.forEach) {\r\n HTMLCollection.prototype.forEach = Array.prototype.forEach;\r\n }\r\n \r\n Accordion();\r\n Carousel();\r\n ClearForm();\r\n Comparison();\r\n Gallery();\r\n HeroPattern();\r\n HeroVideo();\r\n InternalNav();\r\n OffCanvas();\r\n ResponsiveTable();\r\n ScrollbarWidth();\r\n ScrollSpy();\r\n Tabs();\r\n})();"],"names":["$c274619fa9ae66ac$var$setupAccordions","title","addEventListener","event","currentTarget","parentElement","classList","toggle","$c274619fa9ae66ac$export$2e2bcd8739ae039","Array","from","document","querySelectorAll","forEach","$5bdce36a18199573$export$2e2bcd8739ae039","current","bgSlides","fgSlides","length","setInterval","bgSlide","style","opacity","fgSlide","$2b04c6f63ef290fb$export$2e2bcd8739ae039","formClear","getElementById","this","closest","elements","field","value","type","toLowerCase","checked","$7fbc59e2fab6d5d2$var$extractMobileComparison","container","parent","parentNode","body","querySelector","head","mobile","productsInfo","children","filter","x","i","map","info","innerHTML","productsButtons","buttons","products","index","table","row","contains","push","textContent","cells","firstCell","shift","el","key","product","createElement","join","$7fbc59e2fab6d5d2$var$createMobileProduct","appendChild","$7fbc59e2fab6d5d2$export$2e2bcd8739ae039","$dfe0031b837edf6f$export$2e2bcd8739ae039","mainSlides","thumbnailSlides","lightboxTrigger","lightbox","cloneNode","remove","add","slide","slideImg","srcset","removeAttribute","slideImgSrc","getAttribute","indexOf","setAttribute","split","console","log","insertAdjacentHTML","lightboxActive","prevImage","parseInt","dataset","nextImage","e","target","thumbnailSlide","thumbnail","mainSlide","$41a3994d4318effb$export$b568019c0551f0a4","y","a","min","max","Math","$41a3994d4318effb$export$7d15b64cf5a3a4c4","$2e27ca8f14f20195$export$2e2bcd8739ae039","time","c","ctx","getContext","reduceMotion","window","matchMedia","matches","crossGap","crossSpeed","width","height","across","down","totalPoints","crosses","onResize","scrollWidth","scrollHeight","canvas","ceil","ids","array","arr","j","floor","random","$41a3994d4318effb$export$448332262467e042","_","counter","direction","draw","clearRect","beginPath","cnt","lineTo","cos","lineWidth","strokeStyle","stroke","cross","x1","y1","x2","y2","$41a3994d4318effb$export$3a89f8d6f6bf6c9f","moveTo","requestAnimationFrame","$63fd9338c6a56d33$export$2e2bcd8739ae039","videoBackground","reducedMotion","lightboxContainer","lightboxVideo","checkVideos","paused","play","pause","$a8ec42a1db03828c$export$2e2bcd8739ae039","internalNav","IntersectionObserver","entries","observer","isIntersecting","root","rootMargin","threshold","observe","$34e92b90f028a0e5$var$isVisible","element","rect","getBoundingClientRect","getComputedStyle","top","left","bottom","innerHeight","documentElement","clientHeight","right","innerWidth","clientWidth","display","visibility","$34e92b90f028a0e5$var$handleOffCanvas","isVisible","targetHeader","targetMain","targetFooter","targetHeaderContent","outerHTML","targetMainContent","targetFooterContent","$34e92b90f028a0e5$var$createOffCanvas","targetBackdrop","targetContent","firstChild","insertBefore","removeChild","targetClose","$34e92b90f028a0e5$var$removeOffCanvas","$34e92b90f028a0e5$var$closeOffCanvas","id","overflowY","$34e92b90f028a0e5$var$handleBackdropClick","$34e92b90f028a0e5$var$handleKeyDown","activeOffCanvas","$34e92b90f028a0e5$var$handleCloseClick","$34e92b90f028a0e5$export$2e2bcd8739ae039","toggles","offCanvasBackdrop","offCanvasCloseElements","offCanvasClose","once","allOffCanvasElementsExceptCurrent","offCanvas","$34e92b90f028a0e5$var$openOffCanvas","$34e92b90f028a0e5$var$toggleOffCanvas","headers","breakPoint","Number","header","$e3dc92a106d80d6c$var$setScrollbarWidth","setProperty","$e3dc92a106d80d6c$export$2e2bcd8739ae039","func","limit","wait","setTimeout","$41a3994d4318effb$export$61fc7d43ac8f84b0","$9d1dec2ad218c628$var$setup","anchors","results","firstObservation","find","$9d1dec2ad218c628$var$observation","anchor","replace","$1d2dabc452d8efd6$var$setupTabs","controls","content","persist","control","contents","preventDefault","history","pushState","isCurrent","scrollY","focus","scrollTo","behavior","$1d2dabc452d8efd6$var$controlClick","location","hash","dispatchEvent","Event","$1d2dabc452d8efd6$export$2e2bcd8739ae039","NodeList","prototype","HTMLCollection","$384feef4bde84172$export$2e2bcd8739ae039","$9d1dec2ad218c628$export$2e2bcd8739ae039"],"version":3,"file":"app.js.map"}
1
+ {"mappings":"MAKA,SAASA,EAAgBC,GACrBA,EAAMC,iBAAiB,SAIfC,IACOA,EAAMC,cAAcC,cAC1BC,UAAUC,OAAO,kCAI9BC,EAhBA,WACuBC,MAAMC,KAAKC,SAASC,iBAAiB,wBAC7CC,QAAQb,QCmBvBc,EArBA,WACE,IAAIC,EAAU,EACd,MAAMC,EAAWL,SAASC,iBAAiB,qBACrCK,EAAWN,SAASC,iBAAiB,qBAExCK,EAASC,OAAS,GACnBC,aAAY,KACV,IAAK,IAAIC,KAAWJ,EAClBI,EAAQC,MAAMC,QAAU,EAK1B,IAAK,IAAIC,KAHTR,EAAWA,GAAWC,EAASE,OAAS,EAAKH,EAAU,EAAI,EAC3DC,EAASD,GAASM,MAAMC,QAAU,EAEdL,GAClBM,EAAQF,MAAMC,QAAU,EAE1BL,EAASF,GAASM,MAAMC,QAAU,IACjC,UCSPE,EA1BA,WACE,MAAMC,EAAYd,SAASe,eAAe,aACtCD,GACFA,EAAUvB,iBAAiB,SAAS,WACnByB,KAAKC,QAAQ,QAAQC,SAC7BhB,SAAQiB,IACb,GAAmB,IAAfA,EAAMC,MAAa,CACrB,GAC8B,QAA5BD,EAAME,KAAKC,eACiB,SAA5BH,EAAME,KAAKC,eACiB,OAA5BH,EAAME,KAAKC,eACiB,cAA5BH,EAAME,KAAKC,eACiB,YAA5BH,EAAME,KAAKC,cAGX,YADAH,EAAMC,MAAQ,IAET,GAAgC,YAA5BD,EAAME,KAAKC,cAEpB,YADAH,EAAMI,SAAU,WCb5B,SAASC,EAAwBC,GAC/B,MAAMC,EAASD,EAAUE,WAAWA,WAC9BC,EAAOF,EAAOG,cAAc,6BAC5BC,EAAOJ,EAAOG,cAAc,6BAC5BE,EAASL,EAAOhC,cAAcmC,cAAc,+BAElD,IAAKD,IAASE,IAASC,EAAQ,OAG/B,MAAMC,EAAelC,MAAMC,KAAK+B,EAAKG,SAAS,GAAGA,UAAUC,QAAO,CAACC,EAAGC,IAAMA,IAAGC,KAAIF,IAAM,CAAEG,KAAMH,EAAEI,cAC7FC,EAAkB1C,MAAMC,KAAK+B,EAAKG,SAAS,GAAGA,UAAUC,QAAO,CAACC,EAAGC,IAAMA,IAAGC,KAAIF,IAAM,CAAEM,QAASN,EAAEI,cACnGG,EAAWV,EAAaK,KAAI,CAACC,EAAMK,KAAW,IAAKL,KAASE,EAAgBG,GAAQC,MAAO,OAEjG9C,MAAMC,KAAK6B,EAAKK,UAAU/B,SAAQ2C,IAEhC,GAAIA,EAAIlD,UAAUmD,SAAS,6BACzBJ,EAASxC,SAAQiC,IACfA,EAAES,MAAMG,KAAK,CAAE1B,KAAM,QAAS/B,MAAOuD,EAAIZ,SAAS,GAAGe,qBAElD,CAEL,MAAMC,EAAQnD,MAAMC,KAAK8C,EAAIZ,UACvBiB,EAAYD,EAAME,QAExBF,EAAM/C,SAAQ,CAACkD,EAAIT,KACjBD,EAASC,GAAOC,MAAMG,KAAK,CACzB1B,KAAM,MACNgC,IAAKH,EAAUF,YACf5B,MAAOgC,EAAGb,mBAMlBG,EAASxC,SAAQoD,IACf,MAAMF,EAKV,SAA6BE,GAC3B,MAAM5B,EAAS1B,SAASuD,cAAc,WAetC,OAdA7B,EAAOa,UAAY,GAAGe,EAAQhB,OAAOgB,EAAQb,sDAEzCa,EAAQV,MAAMP,KAAIF,GACH,UAAXA,EAAEd,KACG,mDAAmDc,EAAE7C,kCAErD,uBACC6C,EAAEkB,2BACFlB,EAAEf,8BAGXoC,KAAK,kBAGH9B,EArBM+B,CAAoBH,GAC/BvB,EAAO2B,YAAYN,UAuBvBO,EA/DA,WACE3D,SAASC,iBAAiB,uBAAuBC,QAAQsB,QCqF3DoC,EAtFA,WACE,MAAMC,EAAa7D,SAASC,iBAAiB,sCACvC6D,EAAkB9D,SAASC,iBAAiB,4CAyBlD,SAAS8D,IACP,MAAMC,EAAWhE,SAAS6B,cAAc,oBAAoBoC,WAAU,GACtED,EAASrE,UAAUuE,OAAO,mBAC1BF,EAASrE,UAAUwE,IAAI,cACvBH,EAAS/D,iBAAiB,qBAAqBC,SAAQ,SAASkE,GAI9D,GAHGA,EAAMzE,UAAUmD,SAAS,qBAC1BsB,EAAMF,UAEJE,EAAMzE,UAAUmD,SAAS,oBAAqB,CAChD,IAAIuB,EAAWD,EAAMvC,cAAc,OACb,IAAnBwC,EAASC,QACVD,EAASE,gBAAgB,UAE3B,IAAIC,EAAcH,EAASI,aAAa,OACpCD,GAC+B,IAA7BA,EAAYE,QAAQ,KACtBL,EAASM,aAAa,MAAOH,EAAYI,MAAM,KAAK,GAAK,0BAEzDP,EAASM,aAAa,MAAOH,EAAc,2BAG7CK,QAAQC,IAAIT,GACZQ,QAAQC,IAAI,0BAGhBV,EAAMzE,UAAUwE,IAAI,qBACpBC,EAAMzE,UAAUuE,OAAO,uBAEzBlE,SAAS4B,KAAK8B,YAAYM,GAC1BA,EAASe,mBAAmB,YAAa,oEAEzCf,EAASnC,cAAc,qBAAqBtC,iBAAiB,SAAS,WACpE,MAAMyF,EAAiBhB,EAASnC,cAAc,WACxCoD,EAAYjB,EAASnC,cAAc,iBAAmBqD,SAASF,EAAeG,QAAQf,OAAS,GAAK,MAC1F,MAAba,IACDD,EAAerF,UAAUuE,OAAO,UAChCe,EAAUtF,UAAUwE,IAAI,cAI5BH,EAASnC,cAAc,qBAAqBtC,iBAAiB,SAAS,WACpE,MAAMyF,EAAiBhB,EAASnC,cAAc,WACxCuD,EAAYpB,EAASnC,cAAc,iBAAmBqD,SAASF,EAAeG,QAAQf,OAAS,GAAK,MAC1F,MAAbgB,IACDJ,EAAerF,UAAUuE,OAAO,UAChCkB,EAAUzF,UAAUwE,IAAI,cAI5BH,EAASzE,iBAAiB,SAAS,SAAS8F,GACtCA,EAAEC,SAAWD,EAAE5F,eAGjBuE,EAASE,YA5EfJ,EAAgB5D,SAAQqF,GAAkBA,EAAehG,iBAAiB,SAAS,SAAS8F,GAC1FvB,EAAgB5D,SAAQ,SAASsF,GAC5BA,GAAaH,EAAEC,OAAO3D,YACvB6D,EAAU7F,UAAUuE,OAAO,aAG/BmB,EAAEC,OAAO3D,WAAWhC,UAAUwE,IAAI,UAElCN,EAAW3D,SAAQ,SAASuF,GACvBA,EAAUN,QAAQf,OAASmB,EAAeJ,QAAQf,MACnDqB,EAAU9F,UAAUwE,IAAI,UAExBsB,EAAU9F,UAAUuE,OAAO,kBAKjCL,EAAW3D,SAAQ,SAASuF,GACtBA,EAAU9F,UAAUmD,SAAS,qBAC/B2C,EAAUlG,iBAAiB,QAASwE,OCNnC,MAYM2B,EAAU,CAACvD,EAAGwD,EAAGC,IADT,EAACA,EAAGC,EAAM,EAAGC,EAAM,IAAMC,KAAKF,IAAIC,EAAKC,KAAKD,IAAID,EAAKD,IACtCI,EAAOJ,EAAIzD,IAAMwD,EAAIxD,QCgEzD8D,EA3FA,WACE,IAAIC,EAAO,EAEX,MAAMC,EAAInG,SAAS6B,cAAc,mBACjC,IAAKsE,EAAG,OACR,MAAMC,EAAMD,EAAEE,WAAW,MAGnBC,GDEiBC,OAAOC,WADhB,2CAE+BC,QCDvCC,EAAW,IAGXC,EAAa,IAEnB,IAAIC,EACAC,EACAC,EACAC,EAEAC,EADAC,EAAU,GAgCd,SAASC,IACPN,EAAQT,EAAEgB,YACVN,EAASV,EAAEiB,aAEXhB,EAAIiB,OAAOT,MAASA,EACpBR,EAAIiB,OAAOR,OAASA,EAEpBC,EAASf,KAAKuB,KAAKV,EAAQF,GAC3BK,EAAOhB,KAAKuB,KAAKT,EAASH,GAE1BM,GAAeF,EAAS,IAAMC,EAAO,GACrC,MAAMQ,EDhEH,SAAiBC,GACtB,MAAMC,EAAM,IAAID,GAChB,IAAK,IAAIpF,EAAIqF,EAAIlH,OAAS,EAAG6B,EAAI,EAAGA,IAAK,CACvC,IAAIsF,EAAI3B,KAAK4B,MAAM5B,KAAK6B,UAAYxF,EAAI,KACvCqF,EAAIrF,GAAIqF,EAAIC,IAAM,CAACD,EAAIC,GAAID,EAAIrF,IAGlC,OAAOqF,ECyDOI,CAAQ/H,MAAMC,KAAK,CAAEQ,OAAQyG,IAAe,CAACc,EAAG1F,IAAOA,KACnE6E,EAAU,GACV,IAAI,IAAI9E,EAAI,EAAGA,GAAK2E,EAAQ3E,IAC1B,IAAI,IAAIwD,EAAI,EAAGA,GAAKoB,EAAMpB,IACxBsB,EAAQlE,KAAK,CACXgF,QAASR,EAAIpE,QACb6E,UAAWjC,KAAK6B,SAAW,GAAMjB,GAAa,IAC9CxE,EAAGuE,GAAYvE,EAAI,GAAKuE,IACxBf,EAAGe,GAAYf,EAAI,GAAKe,OAgBhCH,OAAOhH,iBAAiB,SAAU2H,GAClCA,IAjEA,SAASe,IAEP/B,GAAc,KAEdE,EAAI8B,UAAU,EAAG,EAAG/B,EAAES,MAAOT,EAAEU,QAC/BT,EAAI+B,YAEJ,IAAI,IAAIC,EAAMjC,EAAES,MAAOwB,EAAM,EAAGA,IAC9BhC,EAAIiC,OAAOD,EAAgB,GAAXjC,EAAEU,OAAgBd,KAAKuC,IAAIpC,EAAOkC,EAAM,EAAI,MAAkB,GAATvB,IAGvET,EAAImC,UAAY,GAChBnC,EAAIoC,YA3Ba,iBA4BjBpC,EAAIqC,SAGJxB,EAAQ/G,SAAQwI,IAsClB,IAAmBvG,EAAGwD,EAAGhF,EDhDLgI,EAAIC,EAAIC,EAAIC,EAAIlD,ECgDjBzD,EArCLuG,EAAMvG,EAqCEwD,EArCC+C,EAAM/C,EDXTgD,ECWkB,EDXdC,ECWiB3B,EAAQ1G,ODXrBsI,ECjBL,EDiBSC,EChBT,GDgBalD,ECWqD8C,EAAMX,QAqCtEpH,EDnDP,EAACwB,EAAGwD,EAAGC,IAAMzD,GAAK,EAAIyD,GAAKD,EAAIC,EAGPmD,CAAKF,EAAIC,EAAIpD,EAAQiD,EAAIC,EAAIhD,ICiDrEQ,EAAI+B,YACJ/B,EAAI4C,OAAO7G,EAAI,GAAIwD,GACnBS,EAAIiC,OAAOlG,EAAI,GAAIwD,GACnBS,EAAIoC,YAAc,uBAAuB7H,IACzCyF,EAAI4C,OAAO7G,EAAGwD,EAAI,IAClBS,EAAIiC,OAAOlG,EAAGwD,EAAI,IAClBS,EAAIqC,SA1CFC,EAAMX,SAAWW,EAAMV,UACnBU,EAAMX,SAAWd,EAAQ1G,SAAQmI,EAAMV,WAAY,KACnDU,EAAMX,QAAU,IAAGW,EAAMV,UAAYrB,MAGtCL,GACHC,OAAO0C,sBAAsBhB,GAyCjCA,QCtCFiB,EApDA,WACElJ,SAAST,iBAAiB,oBAAoB,KAC5C,MAAM4J,EAAkBnJ,SAASe,eAAe,mBAChD,QAA8B,IAApBoI,GAAsD,MAAnBA,EAAyB,CACpE,MAAMC,EAAgB7C,OAAOC,WAAW,oCACpC4C,IAAiBA,EAAc3C,SACjC0C,EAAgBxJ,UAAUwE,IAAI,YAGhC,MAAMJ,EAAkB/D,SAASe,eAAe,aAC1CsI,EAAoBrJ,SAASe,eAAe,iBAC5CuI,EAAgBD,EAAkBxH,cAAc,sBAuBtD,SAAS0H,IACJF,EAAkB1J,UAAUmD,SAAS,aAClCqG,EAAgBK,QAClBL,EAAgBM,OAEbH,EAAcE,QACjBF,EAAcI,SAGXP,EAAgBK,QACnBL,EAAgBO,QA/BtB3F,EAAgBxE,iBAAiB,SAAS8F,IACxC8D,EAAgBO,QAChBL,EAAkB1J,UAAUuE,OAAO,YACnCqF,OAGFF,EAAkB9J,iBAAiB,SAAU8F,IACtCA,EAAEC,OAAO3F,UAAUmD,SAAS,uBAC/BqG,EAAgBxE,aAAa,WAAW,IACxC0E,EAAkB1J,UAAUwE,IAAI,YAChCoF,QAGJhD,OAAOhH,iBAAiB,WAAW,SAAS8F,GAC7B,UAATA,EAAEhC,MACJ8F,EAAgBxE,aAAa,WAAW,IACxC0E,EAAkB1J,UAAUwE,IAAI,YAChCoF,iBCRVI,EAtBA,WACI,MAAMC,EAAc5J,SAAS6B,cAAc,4BAE3C,IAAK+H,EACD,OAca,IAAIC,sBALQ,CAACC,EAASC,KACnC,MAAMC,EAAiBF,EAAQ,GAAGE,eAClCJ,EAAYjK,UAAUC,OAAO,yBAA0BoK,KARnC,CACpBC,KAAM,KACNC,WAAY,MACZC,UAAW,IASNC,QAAQR,ICWrB,SAASS,EAAUC,GAEjB,MAAMC,EAAOD,EAAQE,wBACf9J,EAAQ6F,OAAOkE,iBAAiBH,GACtC,OACEC,EAAKG,KAAO,GACZH,EAAKI,MAAQ,GACbJ,EAAKK,SAAWrE,OAAOsE,aAAe7K,SAAS8K,gBAAgBC,eAC/DR,EAAKS,QAAUzE,OAAO0E,YAAcjL,SAAS8K,gBAAgBI,cAC3C,SAAlBxK,EAAMyK,SACe,WAArBzK,EAAM0K,WAKV,SAASC,EAAgBzL,EAAQ0L,GAC/B,MAAMhG,EAAStF,SAASe,eAAenB,EAAO6E,aAAa,iBACzC,IAAd6G,EAQN,SAAyBhG,GAEvBA,EAAO3F,UAAUwE,IAAI,gBACrBmB,EAAOX,aAAa,WAAY,MAChCW,EAAOX,aAAa,cAAe,QAGnC,MAAM4G,EAAejG,EAAOzD,cAAc,8BACpC2J,EAAalG,EAAOzD,cAAc,4BAClC4J,EAAenG,EAAOzD,cAAc,8BAGpC6J,EAAuC,OAAjBH,EAAwBA,EAAaI,UAAY,GACvEC,EAAmC,OAAfJ,EAAsBA,EAAWG,UAAY,GACjEE,EAAuC,OAAjBJ,EAAwBA,EAAaE,UAAY,GAG7ErG,EAAO/C,UAAY,oPAG6CmJ,sDACzBE,kEAE/BC,oYA9BNC,CAAgBxG,GA2CpB,SAAyBA,GAEvBA,EAAO3F,UAAUuE,OAAO,eAAgB,wBACxCoB,EAAOf,gBAAgB,YACvBe,EAAOf,gBAAgB,eAGvB,MAAMwH,EAAiBzG,EAAOzD,cAAc,2BACxCkK,GACFA,EAAe7H,SAIjB,MAAM8H,EAAgB1G,EAAOzD,cAAc,0BAC3C,GAAImK,EAAe,CACjB,KAAOA,EAAcC,YACnB3G,EAAO4G,aAAaF,EAAcC,WAAYD,GAEhD1G,EAAO6G,YAAYH,GAGrB,MAAMT,EAAejG,EAAOzD,cAAc,yBAC1C,GAAI0J,EAAc,CAChB,KAAOA,EAAaU,YAClB3G,EAAO4G,aAAaX,EAAaU,WAAYV,GAE/CjG,EAAO6G,YAAYZ,GAGrB,MAAMC,EAAalG,EAAOzD,cAAc,uBACxC,GAAI2J,EAAY,CACd,KAAOA,EAAWS,YAChB3G,EAAO4G,aAAaV,EAAWS,WAAYT,GAE7ClG,EAAO6G,YAAYX,GAGrB,MAAMC,EAAenG,EAAOzD,cAAc,yBAC1C,GAAI4J,EAAc,CAChB,KAAOA,EAAaQ,YAClB3G,EAAO4G,aAAaT,EAAaQ,WAAYR,GAE/CnG,EAAO6G,YAAYV,GAIrB,MAAMW,EAAc9G,EAAOzD,cAAc,wBACrCuK,GACFA,EAAYlI,SAzFZmI,CAAgB/G,GA6IpB,SAASgH,EAAehH,GAEtBtF,SAAS6B,cAAc,iBAAmByD,EAAOiH,GAAK,KAAK5H,aAAa,gBAAiB,SACzFW,EAAO3F,UAAUuE,OAAO,wBACxBoB,EAAOX,aAAa,cAAe,QAGnC3E,SAAS4B,KAAKlB,MAAM8L,UAAY,GAIlC,SAASC,IAEPH,EADkBtL,KAAKC,QAAQ,kBAKjC,SAASyL,EAAclN,GACrB,GAAkB,WAAdA,EAAM6D,IAAkB,CAC1B,MAAMsJ,EAAkB3M,SAAS6B,cAAc,yBAC3C8K,GACFL,EAAeK,IAMrB,SAASC,IAEPN,EADkBtL,KAAKC,QAAQ,sBAIjC4L,EA9NA,WAEE,MAAMC,EAAU9M,SAASC,iBAAiB,yBAGtC6M,EAAQvM,SACVuM,EAAQ5M,SAAQN,IAEdyL,EAAgBzL,EAAQyK,EAAUzK,IAClCA,EAAOL,iBAAiB,SAAS,IAsIvC,SAAyBK,GACvB,MAAM0F,EAAStF,SAASe,eAAenB,EAAO6E,aAAa,gBAGtDa,EAAO3F,UAAUmD,SAAS,wBAEpBwC,EAAO3F,UAAUmD,SAAS,yBACnCwJ,EAAehH,GAInB,SAAuB1F,EAAQ0F,GAE7B1F,EAAO+E,aAAa,gBAAiB,QACrCW,EAAO3F,UAAUwE,IAAI,wBACrBmB,EAAOX,aAAa,cAAe,SAGnC,MAAMoI,EAAoBzH,EAAOzD,cAAc,2BAC5CkL,GACDA,EAAkBxN,iBAAiB,QAASkN,GAI9C,MAAMO,EAAyB1H,EAAOrF,iBAAiB,kCACnD+M,EAAuBzM,OAAS,GAClCyM,EAAuB9M,SAAS+M,IAC9BA,EAAe1N,iBAAiB,QAASqN,MAK7C5M,SAAST,iBAAiB,UAAWmN,EAAe,CAAEQ,MAAM,IAG5DlN,SAAS4B,KAAKlB,MAAM8L,UAAY,SAGhC,MAAMW,EAAoCrN,MAAMC,KAAKC,SAASC,iBAAiB,kBAAkBiC,QAAOkL,GAAaA,IAAc9H,IAC/H6H,EAAkC5M,OAAS,GAC7C4M,EAAkCjN,SAASkN,IACzCd,EAAec,MApCjBC,CAAczN,EAAQ0F,GA3ImBgI,CAAgB1N,QAWzD2G,OAAOhH,iBAAiB,UAAU,KAChCuN,EAAQ5M,SAAQN,IACdyL,EAAgBzL,EAAQyK,EAAUzK,kBCvBlB,KACPE,MAAMC,KAAKC,SAASC,iBAAiB,yBAC7CC,kBAUgB0C,SACnB2K,EAAM3K,EAAU3C,iBAAO,2BACvBuN,EAAOC,OAAA7K,EAAA6B,aAAA,kBAAA,KACR8I,EAAAhN,OAAAiN,EAGC,YADF5K,EAAUjD,UAAOuE,OAAA,kCAIXtB,EAAQ3C,iBACN,aAAaC,SAAO2C,UAErB9C,KAAAwN,GAAAlL,KAAAF,GAAAA,EAAAa,cACJ9C,SAAA,CAAAwN,EAAA/K,KACJE,EAAAZ,SAAAU,IAAAE,EAAAZ,SAAAU,GAAAgC,aAAA,wBAAA+I,aCnBH,SAASC,IACL3N,SAAS8K,gBAAgBpK,MAAMkN,YAC3B,mBACArH,OAAO0E,WAAajL,SAAS4B,KAAKsJ,YAAc,UAIxD2C,EAZA,WACIF,IACApH,OAAOhH,iBAAiB,SNaJ,EAACuO,EAAMC,KAC7B,IAAIC,GAAO,EACX,MAAO,KACCA,IACJF,IACAE,GAAO,EACPC,YAAW,IAAMD,GAAO,GAAOD,MMnBCG,CAASP,EAAmB,OCClE,SAASQ,EAAM7D,GACb,MAAM8D,EAAUtO,MAAMC,KAAKuK,EAAQrK,iBAAiB,MAC9C8J,EAAW,IAAIF,8BAiB0CuE,UAEzDC,UAEEC,EACAD,EAAAE,MAAApM,GAAAA,EAAqB6H,iBAK5BsE,GAAAF,EAAAlO,SAAAiC,IACFA,EAAAxC,UAAAC,OAAA,sBAAAuC,EAAAsC,aAAA,UAAA,IAAA6J,EAAAhJ,OAAAiH,QA5B2CiC,CAAYJ,IAEtDA,EAAQlO,SAAQuO,IACd,MAAMlC,EAAKkC,EAAOhK,aAAa,QAAQiK,QAAQ,IAAK,IAC9CpJ,EAAStF,SAASe,eAAewL,GAClCjH,GAELyE,EAASK,QAAQ9E,YAdrB,WACgBxF,MAAMC,KAAKC,SAASC,iBAAiB,kBAC7CC,QAAQiO,ICGhB,SAASQ,EAAUjN,GACjB,MAAMkN,EAAW9O,MAAMC,KAAK2B,EAAOzB,iBAAiB,qBAC9C4O,EAAU/O,MAAMC,KAAK2B,EAAOzB,iBAAiB,WAC7C6O,EAAUpN,EAAO/B,UAAUmD,SAAS,mBAE1C,GAAK8L,EAASrO,QAAWsO,EAAQtO,SAEjCqO,EAAS1O,SAAQ6O,IACfA,EAAQxP,iBAAiB,QAS7B,SAAsBqP,EAAUI,EAAUF,GACxC,OAAQtP,IACN,MAAMuP,EAAUvP,EAAMC,cAChBoP,EAAUG,EAAST,MAAKpM,GAAKA,EAAEoK,KAAOwC,EAAQtK,aAAa,QAAQiK,QAAQ,IAAK,MAEtF,IAAKG,EACH,OAAO,EAGTrP,EAAMyP,iBAEFH,GACFI,QAAQC,UAAU,KAAM,KAAMJ,EAAQtK,aAAa,SAGrDmK,EAAS1O,SAAQiG,GAAKA,EAAExG,UAAUC,OAAO,0BAA2BuG,IAAM4I,KAC1EC,EAAS9O,SAAQiG,IACf,MAAMiJ,EAAYjJ,IAAM0I,EAGxB,GAFA1I,EAAExG,UAAUC,OAAO,gBAAiBwP,IAEhCN,EAEJ,GAAIM,EAAW,CACbjJ,EAAExB,aAAa,YAAY,GAE3B,MAAMgB,EAAIY,OAAO8I,QACjBlJ,EAAEmJ,QACF/I,OAAOgJ,SAAS,CAAEC,SAAU,OAAQ9E,IAAK/E,SAEzCQ,EAAE5B,gBAAgB,gBAtCYkL,CAAab,EAAUC,EAASC,OAGhEA,GAAWvI,OAAOmJ,SAASC,MAAM,CACnC,MAAMZ,EAAUrN,EAAOG,cAAc,UAAY0E,OAAOmJ,SAASC,KAAO,MACpEZ,GAASA,EAAQa,cAAc,IAAIC,MAAM,eAuCjDC,EAzDA,WACehQ,MAAMC,KAAKC,SAASC,iBAAiB,oBAC7CC,QAAQyO,ICaVpI,OAAOwJ,WAAaA,SAASC,UAAU9P,UACxC6P,SAASC,UAAU9P,QAAUJ,MAAMkQ,UAAU9P,SAE5CqG,OAAO0J,iBAAmBA,eAAeD,UAAU9P,UACpD+P,eAAeD,UAAU9P,QAAUJ,MAAMkQ,UAAU9P,SAGrDL,IACAM,IACAU,IACA8C,IACAC,IACAqC,IACAiD,IACAS,IACAkD,IACAqD,IACArC,IACAsC,IACAL","sources":["src/assets/js/imports/accordion.js","src/assets/js/imports/carousel.js","src/assets/js/imports/clear-form.js","src/assets/js/imports/comparison.js","src/assets/js/imports/gallery.js","src/assets/js/imports/utilities.js","src/assets/js/imports/hero-pattern.js","src/assets/js/imports/hero-video.js","src/assets/js/imports/internal-nav.js","src/assets/js/imports/off-canvas.js","src/assets/js/imports/responsive-table.js","src/assets/js/imports/scrollbar-width.js","src/assets/js/imports/scroll-spy.js","src/assets/js/imports/tabs.js","src/assets/js/app.js"],"sourcesContent":["function Accordion() {\r\n const accordions = Array.from(document.querySelectorAll('.c-accordion__title'));\r\n accordions.forEach(setupAccordions);\r\n}\r\n\r\nfunction setupAccordions(title) {\r\n title.addEventListener('click', titleClick())\r\n}\r\n\r\nfunction titleClick() {\r\n return (event) => {\r\n var item = event.currentTarget.parentElement;\r\n item.classList.toggle('c-accordion__item--open');\r\n }\r\n}\r\n\r\nexport default Accordion;\r\n","function Carousel() {\r\n let current = 0;\r\n const bgSlides = document.querySelectorAll('.c-hero__image-bg');\r\n const fgSlides = document.querySelectorAll('.c-hero__image-fg');\r\n\r\n if(fgSlides.length > 0) {\r\n setInterval(() => {\r\n for (var bgSlide of bgSlides) {\r\n bgSlide.style.opacity = 0;\r\n }\r\n current = (current != bgSlides.length - 1) ? current + 1 : 0;\r\n bgSlides[current].style.opacity = 1;\r\n \r\n for (var fgSlide of fgSlides) {\r\n fgSlide.style.opacity = 0;\r\n }\r\n fgSlides[current].style.opacity = 1;\r\n }, 5000);\r\n }\r\n}\r\n\r\nexport default Carousel;","function ClearForm() {\r\n const formClear = document.getElementById('clearForm');\r\n if (formClear) {\r\n formClear.addEventListener('click', function () {\r\n const fields = this.closest('form').elements;\r\n fields.forEach(field => {\r\n if (field.value != '') {\r\n if (\r\n field.type.toLowerCase() == 'text' || \r\n field.type.toLowerCase() == 'email' || \r\n field.type.toLowerCase() == 'tel' || \r\n field.type.toLowerCase() == 'select-one' || \r\n field.type.toLowerCase() == 'textarea'\r\n ) {\r\n field.value = '';\r\n return;\r\n } else if (field.type.toLowerCase() == 'checkbox') {\r\n field.checked = false;\r\n return;\r\n }\r\n }\r\n });\r\n });\r\n };\r\n}\r\n\r\nexport default ClearForm;","function Comparison() {\r\n document.querySelectorAll('.c-comparison-table').forEach(extractMobileComparison)\r\n}\r\n\r\nfunction extractMobileComparison(container) {\r\n const parent = container.parentNode.parentNode;\r\n const body = parent.querySelector('.c-comparison-table tbody');\r\n const head = parent.querySelector('.c-comparison-table thead');\r\n const mobile = parent.parentElement.querySelector('.c-comparison-table__mobile');\r\n\r\n if (!body || !head || !mobile) return;\r\n\r\n // Remove empty corner piece \r\n const productsInfo = Array.from(head.children[0].children).filter((x, i) => i).map(x => ({ info: x.innerHTML }));\r\n const productsButtons = Array.from(head.children[1].children).filter((x, i) => i).map(x => ({ buttons: x.innerHTML }));\r\n const products = productsInfo.map((info, index) => ({ ...info, ...productsButtons[index], table: [] }));\r\n\r\n Array.from(body.children).forEach(row => {\r\n // For table row headers, push to all products\r\n if (row.classList.contains('c-comparison-table__title')) {\r\n products.forEach(x => {\r\n x.table.push({ type: 'title', title: row.children[0].textContent })\r\n })\r\n } else {\r\n // For all others, loop the cells and push to their appropriate parent\r\n const cells = Array.from(row.children);\r\n const firstCell = cells.shift();\r\n\r\n cells.forEach((el, index) => {\r\n products[index].table.push({\r\n type: 'row',\r\n key: firstCell.textContent,\r\n value: el.innerHTML\r\n })\r\n })\r\n }\r\n })\r\n\r\n products.forEach(product => {\r\n const el = createMobileProduct(product);\r\n mobile.appendChild(el)\r\n })\r\n}\r\n\r\nfunction createMobileProduct(product) {\r\n const parent = document.createElement('article');\r\n parent.innerHTML = `${product.info}${product.buttons}\r\n <table class=\"c-comparison-table\">\r\n ${product.table.map(x => {\r\n if (x.type === 'title') {\r\n return `<tr class=\"c-comparison-table__title\"><th><span>${x.title}</span></th><th></th></tr>`;\r\n } else {\r\n return `<tr>\r\n <td>${x.key}</td>\r\n <td>${x.value}</td>\r\n </tr>`;\r\n }\r\n }).join('')}\r\n </table>`;\r\n\r\n return parent;\r\n}\r\n\r\nexport default Comparison;\r\n","function Gallery() {\r\n const mainSlides = document.querySelectorAll('.c-gallery__main .c-gallery__slide');\r\n const thumbnailSlides = document.querySelectorAll('.c-gallery__thumbnails .c-gallery__slide');\r\n\r\n thumbnailSlides.forEach(thumbnailSlide => thumbnailSlide.addEventListener('click', function(e) {\r\n thumbnailSlides.forEach(function(thumbnail) {\r\n if(thumbnail != e.target.parentNode) {\r\n thumbnail.classList.remove('active');\r\n }\r\n });\r\n e.target.parentNode.classList.add('active');\r\n\r\n mainSlides.forEach(function(mainSlide) {\r\n if(mainSlide.dataset.slide == thumbnailSlide.dataset.slide) {\r\n mainSlide.classList.add('active');\r\n } else {\r\n mainSlide.classList.remove('active');\r\n }\r\n });\r\n }));\r\n\r\n mainSlides.forEach(function(mainSlide) {\r\n if(!mainSlide.classList.contains('c-gallery__video')) {\r\n mainSlide.addEventListener('click', lightboxTrigger);\r\n }\r\n });\r\n\r\n function lightboxTrigger() {\r\n const lightbox = document.querySelector('.c-gallery__main').cloneNode(true);\r\n lightbox.classList.remove('c-gallery__main');\r\n lightbox.classList.add('c-lightbox');\r\n lightbox.querySelectorAll('.c-gallery__slide').forEach(function(slide) {\r\n if(slide.classList.contains('c-gallery__video')) {\r\n slide.remove();\r\n }\r\n if(!slide.classList.contains('c-gallery__video')) {\r\n var slideImg = slide.querySelector('img');\r\n if(slideImg.srcset != '') {\r\n slideImg.removeAttribute('srcset');\r\n }\r\n var slideImgSrc = slideImg.getAttribute('src');\r\n if (slideImgSrc) {\r\n if (slideImgSrc.indexOf('?') !== -1) {\r\n slideImg.setAttribute('src', slideImgSrc.split(\"?\")[0] + '?quality=90&width=2176');\r\n } else {\r\n slideImg.setAttribute('src', slideImgSrc + '?quality=90&width=2176');\r\n }\r\n } else {\r\n console.log(slideImg);\r\n console.log('has no src defined...');\r\n }\r\n }\r\n slide.classList.add('c-lightbox__slide');\r\n slide.classList.remove('c-gallery__slide');\r\n });\r\n document.body.appendChild(lightbox);\r\n lightbox.insertAdjacentHTML('beforeend', '<a class=\"c-lightbox__prev\"></a><a class=\"c-lightbox__next\"></a>');\r\n\r\n lightbox.querySelector('.c-lightbox__prev').addEventListener('click', function() {\r\n const lightboxActive = lightbox.querySelector('.active');\r\n const prevImage = lightbox.querySelector('[data-slide=\"' + (parseInt(lightboxActive.dataset.slide) - 1) + '\"]');\r\n if(prevImage != null) {\r\n lightboxActive.classList.remove('active');\r\n prevImage.classList.add('active');\r\n }\r\n });\r\n\r\n lightbox.querySelector('.c-lightbox__next').addEventListener('click', function() {\r\n const lightboxActive = lightbox.querySelector('.active');\r\n const nextImage = lightbox.querySelector('[data-slide=\"' + (parseInt(lightboxActive.dataset.slide) + 1) + '\"]');\r\n if(nextImage != null) {\r\n lightboxActive.classList.remove('active');\r\n nextImage.classList.add('active');\r\n }\r\n });\r\n\r\n lightbox.addEventListener('click', function(e) {\r\n if (e.target !== e.currentTarget) {\r\n return;\r\n } else {\r\n lightbox.remove();\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default Gallery;\r\n","export function shuffle(array) {\r\n const arr = [...array];\r\n for (let i = arr.length - 1; i > 0; i--) {\r\n let j = Math.floor(Math.random() * (i + 1));\r\n [arr[i], arr[j]] = [arr[j], arr[i]];\r\n }\r\n\r\n return arr;\r\n}\r\n\r\nexport function userPrefersReducedMotion() {\r\n const QUERY = '(prefers-reduced-motion: no-preference)';\r\n const mediaQueryList = window.matchMedia(QUERY);\r\n const prefersReducedMotion = !mediaQueryList.matches;\r\n return prefersReducedMotion;\r\n}\r\n\r\nexport const debounce = (func, limit) => {\r\n let wait = false; \r\n return () => {\r\n if (wait) return;\r\n func();\r\n wait = true;\r\n setTimeout(() => wait = false, limit);\r\n }\r\n}\r\n\r\nexport const lerp = (x, y, a) => x * (1 - a) + y * a;\r\nexport const clamp = (a, min = 0, max = 1) => Math.min(max, Math.max(min, a));\r\nexport const invlerp = (x, y, a) => clamp((a - x) / (y - x));\r\nexport const range = (x1, y1, x2, y2, a) => lerp(x2, y2, invlerp(x1, y1, a));\r\n","import { range, shuffle, userPrefersReducedMotion } from './utilities';\r\n\r\nfunction HeroPattern() {\r\n let time = 0;\r\n\r\n const c = document.querySelector('.c-hero__canvas');\r\n if (!c) return;\r\n const ctx = c.getContext(\"2d\");\r\n \r\n const sineColour = \"rgb(19,170,19)\";\r\n const reduceMotion = userPrefersReducedMotion();\r\n\r\n const crossGap = 147;\r\n const minimumOpacity = 0;\r\n const maximumOpacity = 0.5;\r\n const crossSpeed = 0.25;\r\n\r\n let width;\r\n let height;\r\n let across;\r\n let down;\r\n let crosses = [];\r\n let totalPoints;\r\n\r\n function draw() {\r\n // Sine wave\r\n time = time + 0.005;\r\n \r\n ctx.clearRect(0, 0, c.width, c.height);\r\n ctx.beginPath();\r\n \r\n for(let cnt = c.width; cnt > 0; cnt--) {\r\n ctx.lineTo(cnt, c.height * 0.5 - (Math.cos(time + cnt / 5 * 0.03) * (height * 0.3) ));\r\n }\r\n \r\n ctx.lineWidth = 0.5;\r\n ctx.strokeStyle = sineColour;\r\n ctx.stroke();\r\n \r\n // Crosses\r\n crosses.forEach(cross => {\r\n drawCross(cross.x, cross.y, range(0, crosses.length, minimumOpacity, maximumOpacity, cross.counter));\r\n \r\n cross.counter += cross.direction;\r\n if (cross.counter >= crosses.length) cross.direction = -1 * crossSpeed;\r\n if (cross.counter < 0) cross.direction = crossSpeed;\r\n })\r\n \r\n if (!reduceMotion) {\r\n window.requestAnimationFrame(draw);\r\n }\r\n }\r\n \r\n function onResize() {\r\n width = c.scrollWidth;\r\n height = c.scrollHeight;\r\n \r\n ctx.canvas.width = width;\r\n ctx.canvas.height = height;\r\n \r\n across = Math.ceil(width / crossGap);\r\n down = Math.ceil(height / crossGap);\r\n \r\n totalPoints = (across + 1) * (down + 1);\r\n const ids = shuffle(Array.from({ length: totalPoints }, (_, i) => (i)))\r\n crosses = [];\r\n for(let x = 0; x <= across; x++) {\r\n for(let y = 0; y <= down; y++) {\r\n crosses.push({\r\n counter: ids.shift(),\r\n direction: Math.random() > 0.5 ? crossSpeed : -1 * crossSpeed,\r\n x: crossGap * (x + 1) - crossGap / 1,\r\n y: crossGap * (y + 1) - crossGap / 2\r\n });\r\n }\r\n }\r\n }\r\n \r\n function drawCross(x, y, opacity) {\r\n ctx.beginPath();\r\n ctx.moveTo(x - 14, y);\r\n ctx.lineTo(x + 14, y);\r\n ctx.strokeStyle = `rgba(255, 255, 255, ${opacity}`;\r\n ctx.moveTo(x, y - 14);\r\n ctx.lineTo(x, y + 14);\r\n ctx.stroke();\r\n }\r\n\r\n window.addEventListener('resize', onResize);\r\n onResize();\r\n draw();\r\n}\r\n\r\nexport default HeroPattern;\r\n","function HeroVideo() {\r\n document.addEventListener(\"DOMContentLoaded\", () => {\r\n const videoBackground = document.getElementById('videoBackground');\r\n if(typeof(videoBackground) != 'undefined' && videoBackground != null) {\r\n const reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');\r\n if(!reducedMotion || reducedMotion.matches) {\r\n videoBackground.classList.add('u-hidden');\r\n }\r\n \r\n const lightboxTrigger = document.getElementById('playVideo');\r\n const lightboxContainer = document.getElementById('lightboxVideo');\r\n const lightboxVideo = lightboxContainer.querySelector('.c-lightbox__video');\r\n\r\n lightboxTrigger.addEventListener('click', e => {\r\n videoBackground.pause();\r\n lightboxContainer.classList.remove('u-hidden');\r\n checkVideos();\r\n });\r\n \r\n lightboxContainer.addEventListener('click', (e) => {\r\n if (!e.target.classList.contains('c-lightbox__video')) {\r\n videoBackground.setAttribute('autoplay','');\r\n lightboxContainer.classList.add('u-hidden');\r\n checkVideos();\r\n }\r\n });\r\n window.addEventListener('keydown', function(e) {\r\n if (e.key == \"Escape\") {\r\n videoBackground.setAttribute('autoplay','');\r\n lightboxContainer.classList.add('u-hidden');\r\n checkVideos();\r\n }\r\n });\r\n\r\n function checkVideos() {\r\n if(lightboxContainer.classList.contains('u-hidden')) {\r\n if (videoBackground.paused) {\r\n videoBackground.play();\r\n }\r\n if (!lightboxVideo.paused) {\r\n lightboxVideo.pause();\r\n }\r\n } else {\r\n if (!videoBackground.paused) {\r\n videoBackground.pause();\r\n }\r\n }\r\n }\r\n }\r\n });\r\n}\r\n\r\nexport default HeroVideo;","function InternalNav() {\r\n const internalNav = document.querySelector('.c-internal-nav.u-sticky');\r\n\r\n if (!internalNav) {\r\n return;\r\n }\r\n\r\n const observerOptions = {\r\n root: null,\r\n rootMargin: '0px',\r\n threshold: 1.0\r\n };\r\n\r\n const intersectionCallback = (entries, observer) => {\r\n const isIntersecting = entries[0].isIntersecting;\r\n internalNav.classList.toggle('c-internal-nav--stuck', !isIntersecting);\r\n };\r\n\r\n const observer = new IntersectionObserver(intersectionCallback, observerOptions);\r\n observer.observe(internalNav);\r\n}\r\n\r\nexport default InternalNav;\r\n","// Function to initialize off-canvas behavior\r\nfunction OffCanvas() {\r\n // Select all elements that trigger off-canvas behavior\r\n const toggles = document.querySelectorAll(\".c-off-canvas__toggle\");\r\n\r\n // Iterate through each toggle element\r\n if (toggles.length) {\r\n toggles.forEach(toggle => {\r\n // Determine initial visibility state and handle click event\r\n handleOffCanvas(toggle, isVisible(toggle));\r\n toggle.addEventListener('click', () => toggleOffCanvas(toggle));\r\n });\r\n\r\n // Add event listener for scroll events to check visibility\r\n // window.addEventListener('scroll', () => {\r\n // toggles.forEach(toggle => {\r\n // handleOffCanvas(toggle, isVisible(toggle));\r\n // });\r\n // });\r\n\r\n // Add event listener for resize events to check visibility\r\n window.addEventListener('resize', () => {\r\n toggles.forEach(toggle => {\r\n handleOffCanvas(toggle, isVisible(toggle));\r\n });\r\n });\r\n }\r\n}\r\n\r\n// Function to check if an element is currently visible on the page\r\nfunction isVisible(element) {\r\n // Check element's position and styles for visibility\r\n const rect = element.getBoundingClientRect();\r\n const style = window.getComputedStyle(element);\r\n return (\r\n rect.top >= 0 &&\r\n rect.left >= 0 &&\r\n rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&\r\n rect.right <= (window.innerWidth || document.documentElement.clientWidth) &&\r\n style.display !== 'none' &&\r\n style.visibility !== 'hidden'\r\n );\r\n}\r\n\r\n// Function to handle off-canvas behavior based on visibility\r\nfunction handleOffCanvas(toggle, isVisible) {\r\n const target = document.getElementById(toggle.getAttribute('data-target'));\r\n if (isVisible === true) {\r\n createOffCanvas(target);\r\n } else {\r\n removeOffCanvas(target);\r\n }\r\n}\r\n\r\n// Function to create off canvas\r\nfunction createOffCanvas(target) {\r\n // Add necessary classes and attributes for off-canvas display\r\n target.classList.add('c-off-canvas');\r\n target.setAttribute('tabindex', '-1');\r\n target.setAttribute('aria-hidden', 'true');\r\n \r\n // Extract specific sections of the off-canvas content\r\n const targetHeader = target.querySelector('[data-off-canvas=\"header\"]');\r\n const targetMain = target.querySelector('[data-off-canvas=\"main\"]');\r\n const targetFooter = target.querySelector('[data-off-canvas=\"footer\"]');\r\n\r\n // Extract content from the sections\r\n const targetHeaderContent = targetHeader !== null ? targetHeader.outerHTML : '';\r\n const targetMainContent = targetMain !== null ? targetMain.outerHTML : '';\r\n const targetFooterContent = targetFooter !== null ? targetFooter.outerHTML : '';\r\n\r\n // Replace the target's content with off-canvas structure\r\n target.innerHTML = `\r\n <div class=\"c-off-canvas__backdrop\" role=\"presentation\"></div>\r\n <div class=\"c-off-canvas__content\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"offCanvasHeader\">\r\n <header id=\"offCanvasHeader\" class=\"c-off-canvas__header\">${targetHeaderContent}</header>\r\n <main class=\"c-off-canvas__main\">${targetMainContent}</main>\r\n <footer class=\"c-off-canvas__footer\">\r\n ${targetFooterContent}\r\n <button class=\"mp c-twi c-twi--left c-off-canvas__close\" data-off-canvas-close=\"true\" onclick=\"return false\">\r\n <span>Cancel</span>\r\n <svg role=\"img\" aria-hidden=\"true\" focusable=\"false\" class=\"mp c-icon c-icon--cross\">\r\n <use xlink:href=\"/static/svg/sprite.svg#cross\"></use>\r\n </svg>\r\n </button>\r\n </footer>\r\n </div>\r\n `;\r\n}\r\n\r\n// Function to remove off-canvas layout\r\nfunction removeOffCanvas(target) {\r\n // Remove classes and attributes for off-canvas display\r\n target.classList.remove('c-off-canvas', 'c-off-canvas--active');\r\n target.removeAttribute('tabindex');\r\n target.removeAttribute('aria-hidden');\r\n\r\n // Remove backdrop element if present\r\n const targetBackdrop = target.querySelector('.c-off-canvas__backdrop');\r\n if (targetBackdrop) {\r\n targetBackdrop.remove();\r\n }\r\n\r\n // Restore original content by removing off-canvas structure\r\n const targetContent = target.querySelector('.c-off-canvas__content');\r\n if (targetContent) {\r\n while (targetContent.firstChild) {\r\n target.insertBefore(targetContent.firstChild, targetContent);\r\n }\r\n target.removeChild(targetContent);\r\n }\r\n\r\n const targetHeader = target.querySelector('.c-off-canvas__header');\r\n if (targetHeader) {\r\n while (targetHeader.firstChild) {\r\n target.insertBefore(targetHeader.firstChild, targetHeader);\r\n }\r\n target.removeChild(targetHeader);\r\n }\r\n\r\n const targetMain = target.querySelector('.c-off-canvas__main');\r\n if (targetMain) {\r\n while (targetMain.firstChild) {\r\n target.insertBefore(targetMain.firstChild, targetMain);\r\n }\r\n target.removeChild(targetMain);\r\n }\r\n\r\n const targetFooter = target.querySelector('.c-off-canvas__footer');\r\n if (targetFooter) {\r\n while (targetFooter.firstChild) {\r\n target.insertBefore(targetFooter.firstChild, targetFooter);\r\n }\r\n target.removeChild(targetFooter);\r\n }\r\n \r\n // Remove close button element if present\r\n const targetClose = target.querySelector('.c-off-canvas__close');\r\n if (targetClose) {\r\n targetClose.remove();\r\n }\r\n}\r\n\r\n// Function to toggle off-canvas visibility\r\nfunction toggleOffCanvas(toggle) {\r\n const target = document.getElementById(toggle.getAttribute('data-target'));\r\n\r\n // Check if the target is already open or closed\r\n if (!target.classList.contains('c-off-canvas--active')) {\r\n openOffCanvas(toggle, target);\r\n } else if (target.classList.contains('c-off-canvas--active')) {\r\n closeOffCanvas(target);\r\n }\r\n}\r\n\r\nfunction openOffCanvas(toggle, target) {\r\n // Add classes and attributes for open off-canvas\r\n toggle.setAttribute('aria-expanded', 'true');\r\n target.classList.add('c-off-canvas--active');\r\n target.setAttribute('aria-hidden', 'false');\r\n\r\n // Add event listener for backdrop clicks\r\n const offCanvasBackdrop = target.querySelector('.c-off-canvas__backdrop');\r\n if(offCanvasBackdrop) {\r\n offCanvasBackdrop.addEventListener('click', handleBackdropClick);\r\n }\r\n\r\n // Add event listener forclose button clicks\r\n const offCanvasCloseElements = target.querySelectorAll('[data-off-canvas-close=\"true\"]');\r\n if (offCanvasCloseElements.length > 0) {\r\n offCanvasCloseElements.forEach((offCanvasClose) => {\r\n offCanvasClose.addEventListener('click', handleCloseClick);\r\n });\r\n }\r\n\r\n // Add event listener for Escape key press\r\n document.addEventListener('keydown', handleKeyDown, { once: true });\r\n\r\n // Adjust body overflow to prevent scrolling\r\n document.body.style.overflowY = 'hidden';\r\n\r\n // Close other open off-canvas elements\r\n const allOffCanvasElementsExceptCurrent = Array.from(document.querySelectorAll('.c-off-canvas')).filter(offCanvas => offCanvas !== target);\r\n if (allOffCanvasElementsExceptCurrent.length > 0) {\r\n allOffCanvasElementsExceptCurrent.forEach((offCanvas) => {\r\n closeOffCanvas(offCanvas);\r\n });\r\n }\r\n}\r\n\r\n// Function to close an off-canvas\r\nfunction closeOffCanvas(target) {\r\n // Remove classes and attributes for open off-canvas\r\n document.querySelector('[data-target=\"' + target.id + '\"').setAttribute('aria-expanded', 'false');\r\n target.classList.remove('c-off-canvas--active');\r\n target.setAttribute('aria-hidden', 'true');\r\n\r\n // Restore body overflow\r\n document.body.style.overflowY = '';\r\n}\r\n\r\n// Function to handle backdrop click\r\nfunction handleBackdropClick() {\r\n const offCanvas = this.closest('.c-off-canvas');\r\n closeOffCanvas(offCanvas);\r\n}\r\n\r\n// Function to handle Escape key press\r\nfunction handleKeyDown(event) {\r\n if (event.key === 'Escape') {\r\n const activeOffCanvas = document.querySelector('.c-off-canvas--active');\r\n if (activeOffCanvas) {\r\n closeOffCanvas(activeOffCanvas);\r\n }\r\n }\r\n}\r\n\r\n// Function to handle close button click\r\nfunction handleCloseClick() {\r\n const offCanvas = this.closest('.c-off-canvas');\r\n closeOffCanvas(offCanvas);\r\n}\r\n\r\nexport default OffCanvas;","const ResponsiveTable = () => {\r\n const tables = Array.from(document.querySelectorAll('.c-table--responsive'));\r\n tables.forEach(createResponsiveTable);\r\n\r\n /**\r\n * Create responsive table headers for large tables\r\n * @param {HTMLTableElement} table\r\n */\r\n function createResponsiveTable(table) {\r\n const headers = table.querySelectorAll('thead > :first-child th');\r\n const breakPoint = Number(table.getAttribute('data-columns')) || 2\r\n \r\n if (headers.length < breakPoint) {\r\n table.classList.remove('c-table--responsive');\r\n return;\r\n };\r\n\r\n Array.from(table.querySelectorAll('tbody tr')).forEach((row) => {\r\n Array.from(headers)\r\n .map((x) => x.textContent)\r\n .forEach((header, index) => {\r\n if (row.children[index]) {\r\n row.children[index].setAttribute('data-responsive-title', header);\r\n }\r\n });\r\n });\r\n }\r\n};\r\n\r\nexport default ResponsiveTable;\r\n","import { debounce } from './utilities';\r\n\r\nfunction ScrollbarWidth() {\r\n setScrollbarWidth();\r\n window.addEventListener('resize', debounce(setScrollbarWidth, 250));\r\n}\r\n\r\nfunction setScrollbarWidth() {\r\n document.documentElement.style.setProperty(\r\n '--scrollbarWidth', \r\n window.innerWidth - document.body.clientWidth + 'px'\r\n );\r\n}\r\n\r\nexport default ScrollbarWidth;","function ScrollSpy() {\r\n const spies = Array.from(document.querySelectorAll('.c-scroll-spy'));\r\n spies.forEach(setup);\r\n}\r\n\r\nfunction setup(element) {\r\n const anchors = Array.from(element.querySelectorAll('a'));\r\n const observer = new IntersectionObserver(observation(anchors));\r\n \r\n anchors.forEach(anchor => {\r\n const id = anchor.getAttribute('href').replace('#', '');\r\n const target = document.getElementById(id);\r\n if (!target) return;\r\n\r\n observer.observe(target);\r\n });\r\n}\r\n\r\n/**\r\n * @param {Array<HTMLAnchorElement>} results \r\n * @return {Array<IntersectionObserverEntry>}\r\n */\r\nfunction observation(anchors) {\r\n return (results) => {\r\n const firstObservation = results.find(x => x.isIntersecting);\r\n\r\n if (firstObservation) {\r\n anchors.forEach(x => {\r\n x.classList.toggle(\r\n 'c-scroll-spy-active',\r\n x.getAttribute('href') === '#' + firstObservation.target.id\r\n )\r\n })\r\n }\r\n }\r\n}\r\n\r\nexport default ScrollSpy;\r\n","function Tabs() {\r\n const tabs = Array.from(document.querySelectorAll('.c-tabs--anchor'));\r\n tabs.forEach(setupTabs);\r\n}\r\n\r\nfunction setupTabs(parent) {\r\n const controls = Array.from(parent.querySelectorAll('.c-tabs__control'));\r\n const content = Array.from(parent.querySelectorAll('.c-tab'));\r\n const persist = parent.classList.contains('c-tabs--persist');\r\n \r\n if (!controls.length || !content.length) return;\r\n\r\n controls.forEach(control => {\r\n control.addEventListener('click', controlClick(controls, content, persist))\r\n })\r\n\r\n if (persist && window.location.hash) {\r\n const control = parent.querySelector('[href=\"' + window.location.hash + '\"]');\r\n if (control) control.dispatchEvent(new Event('click'));\r\n }\r\n}\r\n\r\nfunction controlClick(controls, contents, persist) {\r\n return (event) => {\r\n const control = event.currentTarget;\r\n const content = contents.find(x => x.id === control.getAttribute('href').replace('#', ''));\r\n \r\n if (!content) {\r\n return true;\r\n };\r\n\r\n event.preventDefault();\r\n \r\n if (persist) {\r\n history.pushState(null, null, control.getAttribute('href'));\r\n }\r\n\r\n controls.forEach(c => c.classList.toggle('c-tabs__control--active', c === control));\r\n contents.forEach(c => {\r\n const isCurrent = c === content;\r\n c.classList.toggle('c-tab--active', isCurrent);\r\n \r\n if (persist) return;\r\n\r\n if (isCurrent) {\r\n c.setAttribute('tabIndex', -1);\r\n \r\n const y = window.scrollY;\r\n c.focus();\r\n window.scrollTo({ behavior: \"auto\", top: y })\r\n } else {\r\n c.removeAttribute('tabIndex');\r\n }\r\n });\r\n }\r\n}\r\n\r\nexport default Tabs;\r\n","import Accordion from './imports/accordion';\r\nimport Carousel from './imports/carousel';\r\nimport ClearForm from './imports/clear-form';\r\nimport Comparison from './imports/comparison';\r\nimport Gallery from './imports/gallery';\r\nimport HeroPattern from './imports/hero-pattern';\r\nimport HeroVideo from './imports/hero-video';\r\nimport InternalNav from './imports/internal-nav';\r\nimport OffCanvas from './imports/off-canvas';\r\nimport ResponsiveTable from './imports/responsive-table';\r\nimport ScrollbarWidth from './imports/scrollbar-width';\r\nimport ScrollSpy from './imports/scroll-spy';\r\nimport Tabs from './imports/tabs';\r\n\r\n(() => {\r\n if(window.NodeList && !NodeList.prototype.forEach) {\r\n NodeList.prototype.forEach = Array.prototype.forEach;\r\n }\r\n if(window.HTMLCollection && !HTMLCollection.prototype.forEach) {\r\n HTMLCollection.prototype.forEach = Array.prototype.forEach;\r\n }\r\n \r\n Accordion();\r\n Carousel();\r\n ClearForm();\r\n Comparison();\r\n Gallery();\r\n HeroPattern();\r\n HeroVideo();\r\n InternalNav();\r\n OffCanvas();\r\n ResponsiveTable();\r\n ScrollbarWidth();\r\n ScrollSpy();\r\n Tabs();\r\n})();"],"names":["$c274619fa9ae66ac$var$setupAccordions","title","addEventListener","event","currentTarget","parentElement","classList","toggle","$c274619fa9ae66ac$export$2e2bcd8739ae039","Array","from","document","querySelectorAll","forEach","$5bdce36a18199573$export$2e2bcd8739ae039","current","bgSlides","fgSlides","length","setInterval","bgSlide","style","opacity","fgSlide","$2b04c6f63ef290fb$export$2e2bcd8739ae039","formClear","getElementById","this","closest","elements","field","value","type","toLowerCase","checked","$7fbc59e2fab6d5d2$var$extractMobileComparison","container","parent","parentNode","body","querySelector","head","mobile","productsInfo","children","filter","x","i","map","info","innerHTML","productsButtons","buttons","products","index","table","row","contains","push","textContent","cells","firstCell","shift","el","key","product","createElement","join","$7fbc59e2fab6d5d2$var$createMobileProduct","appendChild","$7fbc59e2fab6d5d2$export$2e2bcd8739ae039","$dfe0031b837edf6f$export$2e2bcd8739ae039","mainSlides","thumbnailSlides","lightboxTrigger","lightbox","cloneNode","remove","add","slide","slideImg","srcset","removeAttribute","slideImgSrc","getAttribute","indexOf","setAttribute","split","console","log","insertAdjacentHTML","lightboxActive","prevImage","parseInt","dataset","nextImage","e","target","thumbnailSlide","thumbnail","mainSlide","$41a3994d4318effb$export$b568019c0551f0a4","y","a","min","max","Math","$41a3994d4318effb$export$7d15b64cf5a3a4c4","$2e27ca8f14f20195$export$2e2bcd8739ae039","time","c","ctx","getContext","reduceMotion","window","matchMedia","matches","crossGap","crossSpeed","width","height","across","down","totalPoints","crosses","onResize","scrollWidth","scrollHeight","canvas","ceil","ids","array","arr","j","floor","random","$41a3994d4318effb$export$448332262467e042","_","counter","direction","draw","clearRect","beginPath","cnt","lineTo","cos","lineWidth","strokeStyle","stroke","cross","x1","y1","x2","y2","$41a3994d4318effb$export$3a89f8d6f6bf6c9f","moveTo","requestAnimationFrame","$63fd9338c6a56d33$export$2e2bcd8739ae039","videoBackground","reducedMotion","lightboxContainer","lightboxVideo","checkVideos","paused","play","pause","$a8ec42a1db03828c$export$2e2bcd8739ae039","internalNav","IntersectionObserver","entries","observer","isIntersecting","root","rootMargin","threshold","observe","$34e92b90f028a0e5$var$isVisible","element","rect","getBoundingClientRect","getComputedStyle","top","left","bottom","innerHeight","documentElement","clientHeight","right","innerWidth","clientWidth","display","visibility","$34e92b90f028a0e5$var$handleOffCanvas","isVisible","targetHeader","targetMain","targetFooter","targetHeaderContent","outerHTML","targetMainContent","targetFooterContent","$34e92b90f028a0e5$var$createOffCanvas","targetBackdrop","targetContent","firstChild","insertBefore","removeChild","targetClose","$34e92b90f028a0e5$var$removeOffCanvas","$34e92b90f028a0e5$var$closeOffCanvas","id","overflowY","$34e92b90f028a0e5$var$handleBackdropClick","$34e92b90f028a0e5$var$handleKeyDown","activeOffCanvas","$34e92b90f028a0e5$var$handleCloseClick","$34e92b90f028a0e5$export$2e2bcd8739ae039","toggles","offCanvasBackdrop","offCanvasCloseElements","offCanvasClose","once","allOffCanvasElementsExceptCurrent","offCanvas","$34e92b90f028a0e5$var$openOffCanvas","$34e92b90f028a0e5$var$toggleOffCanvas","headers","breakPoint","Number","header","$e3dc92a106d80d6c$var$setScrollbarWidth","setProperty","$e3dc92a106d80d6c$export$2e2bcd8739ae039","func","limit","wait","setTimeout","$41a3994d4318effb$export$61fc7d43ac8f84b0","$9d1dec2ad218c628$var$setup","anchors","results","firstObservation","find","$9d1dec2ad218c628$var$observation","anchor","replace","$1d2dabc452d8efd6$var$setupTabs","controls","content","persist","control","contents","preventDefault","history","pushState","isCurrent","scrollY","focus","scrollTo","behavior","$1d2dabc452d8efd6$var$controlClick","location","hash","dispatchEvent","Event","$1d2dabc452d8efd6$export$2e2bcd8739ae039","NodeList","prototype","HTMLCollection","$384feef4bde84172$export$2e2bcd8739ae039","$9d1dec2ad218c628$export$2e2bcd8739ae039"],"version":3,"file":"app.js.map"}
package/dist/build/js/product-finder.js ADDED
@@ -0,0 +1,2 @@
1
+ Vue.createApp({setup(){const{ref:e,computed:t}=Vue;let o={generic:{questionText:"Question",backText:"Back",nextText:"Next",restartText:"Restart",seeResultsText:"See results",viewText:"View",getAQuoteText:"Get a quote",requestADemoText:"Request a demo"},questionOne:{labelText:"Where will your Zetasizer be used?",options:[{optionText:"Academic Research"},{optionText:"Industrial Research"},{optionText:"Pharmaceutical Research"},{optionText:"Industrial QA/QC"},{optionText:"Pharmaceutical QA/QC"}]},questionTwo:{labelText:'If you are replacing or supplementing an existing system please choose the model from below or select "not applicable"',options:[{optionText:"Zetasizer Nano S90/ZS90"},{optionText:"Zetasizer Nano ZS/ZSE"},{optionText:"Zetasizer Nano ZSP"},{optionText:"Zetasizer uV"},{optionText:"Zetasizer Ultra"},{optionText:"Zetasizer Pro"},{optionText:"Other manufacturer's system"},{optionText:"Not applicable"}]},questionThree:{labelText:"What do you want the Zetasizer to tell you about your sample? (Select as many as applicable)",options:[{optionText:"Size"},{optionText:"Zeta potential"},{optionText:"Concentration"}]},questionFour:{labelText:"If you are using your existing system in a QA/QC department is it important that the new system provides consistency of results compared to a previously used system?",options:[{optionText:"Very important"},{optionText:"Somewhat important"},{optionText:"Not important"}]},questionFive:{labelText:"Which of the following best describes your sample material?",options:[{optionText:"Slurries/Dispersions >5% solids"},{optionText:"Emulsions/Lipid Suspension"},{optionText:"Natural Polymers/Proteins >10 mg/mL"},{optionText:"Proteins/Biomolecules <10 mg/mL"},{optionText:"Environmental Samples (Aqueous)"},{optionText:"Dilute nanoparticle/colloidal systems"}]},questionSix:{labelText:"What is the expected size range of your sample?",options:[{optionText:"<100 nm"},{optionText:"<500 nm"},{optionText:">500 nm"},{optionText:"Various/Unknown"}]},questionSeven:{labelText:"Are you likely to measure samples that fluoresce in red light?",options:[{optionText:"Yes"},{optionText:"No"}]},results:{headingText:"All done.",multipleResultsLedeText:"Based on the features and specifications you selected we would recommend these products.",singleResultLedeText:"Based on the features and specifications you selected we would recommend the"}};0==window.location.pathname.lastIndexOf("/de",0)||0==window.location.pathname.lastIndexOf("/es",0)||0==window.location.pathname.lastIndexOf("/fr",0)||0==window.location.pathname.lastIndexOf("/br",0)||0==window.location.pathname.lastIndexOf("/ru",0)||0==window.location.pathname.lastIndexOf("/kr",0)||0==window.location.pathname.lastIndexOf("/jp",0)||0==window.location.pathname.lastIndexOf("/tw",0)||window.location.hostname.indexOf("malvernpanalytical.com.cn");let n=e(1);const i={questionOne:{label:o.questionOne.labelText,options:[{label:o.questionOne.options[0].optionText,value:"Academic Research",id:"One"},{label:o.questionOne.options[1].optionText,value:"Industrial Research",id:"Two"},{label:o.questionOne.options[2].optionText,value:"Pharmaceutical Research",id:"Three"},{label:o.questionOne.options[3].optionText,value:"Industrial QA/QC",id:"Four"},{label:o.questionOne.options[4].optionText,value:"Pharmaceutical QA/QC",id:"Five"}]},questionTwo:{label:o.questionTwo.labelText,options:[{label:o.questionTwo.options[0].optionText,value:"Zetasizer Nano S90/ZS90",id:"One"},{label:o.questionTwo.options[1].optionText,value:"Zetasizer Nano ZS/ZSE",id:"Two"},{label:o.questionTwo.options[2].optionText,value:"Zetasizer Nano ZSP",id:"Three"},{label:o.questionTwo.options[3].optionText,value:"Zetasizer uV",id:"Four"},{label:o.questionTwo.options[4].optionText,value:"Zetasizer Ultra",id:"Five"},{label:o.questionTwo.options[5].optionText,value:"Zetasizer Pro",id:"Six"},{label:o.questionTwo.options[6].optionText,value:"Other manufacturer's system",id:"Seven"},{label:o.questionTwo.options[7].optionText,value:"Not applicable",id:"Eight"}]},questionThree:{label:o.questionThree.labelText,options:[{label:o.questionThree.options[0].optionText,value:"Size",id:"One"},{label:o.questionThree.options[1].optionText,value:"Zeta potential",id:"Two"},{label:o.questionThree.options[2].optionText,value:"Concentration",id:"Three"}]},questionFour:{label:o.questionFour.labelText,options:[{label:o.questionFour.options[0].optionText,value:"Very important",id:"One"},{label:o.questionFour.options[1].optionText,value:"Somewhat important",id:"Two"},{label:o.questionFour.options[2].optionText,value:"Not important",id:"Three"}]},questionFive:{label:o.questionFive.labelText,options:[{label:o.questionFive.options[0].optionText,value:"Slurries/Dispersions >5% solids",id:"One"},{label:o.questionFive.options[1].optionText,value:"Emulsions/Lipid Suspension",id:"Two"},{label:o.questionFive.options[2].optionText,value:"Natural Polymers/Proteins >10 mg/mL",id:"Three"},{label:o.questionFive.options[3].optionText,value:"Proteins/Biomolecules <10 mg/mL",id:"Four"},{label:o.questionFive.options[4].optionText,value:"Environmental Samples (Aqueous)",id:"Five"},{label:o.questionFive.options[5].optionText,value:"Dilute nanoparticle/colloidal systems",id:"Six"}]},questionSix:{label:o.questionSix.labelText,options:[{label:o.questionSix.options[0].optionText,value:"<100 nm",id:"One"},{label:o.questionSix.options[1].optionText,value:"<500 nm",id:"Two"},{label:o.questionSix.options[2].optionText,value:">500 nm",id:"Three"},{label:o.questionSix.options[3].optionText,value:"Various/Unknown",id:"Four"}]},questionSeven:{label:o.questionSeven.labelText,options:[{label:o.questionSeven.options[0].optionText,value:"Yes",id:"One"},{label:o.questionSeven.options[1].optionText,value:"No",id:"Two"}]}};let s={questionOne:"",questionTwo:"",questionThree:"",questionFour:"",questionFive:"",questionSix:"",questionSeven:""},l=(e([]),e([]));const a=e(!1),u=t((()=>window.location.hostname.toString())),r=t((()=>window.location.pathname.toString()));return{translations:o,activeStep:n,questions:i,answers:s,loading:a,results:l,checkQuestionOne:function(e,t){s.questionOne&&(console.log(e),console.log(t))},checkQuestionTwo:function(e,t){s.questionTwo},checkQuestionThree:function(e,t){s.questionThree},checkQuestionFour:function(e,t){s.questionFour},checkQuestionFive:function(e,t){s.questionFive},checkQuestionSix:function(e,t){s.questionSix},checkQuestionSeven:function(e,t){s.questionSeven},previousStep:function(){1==n.value||2==n.value||3==n.value?n.value--:4==n.value?n.value-=2:5==n.value&&n.value--},restart:function(e){dataLayer.push({event:"product_finder",action:"Restart",label:e}),_paq.push(["trackEvent","Product finder","Restart",e]),n.value=0,l.value=[],s.questionOne="",s.questionTwo="",s.questionThree="",s.questionFour="",s.questionFive=""},resultTracking:function(e){dataLayer.push({event:"product_finder",action:"Result",label:e}),_paq.push(["trackEvent","Product finder","Result",e])},hostname:u,pathname:r}},template:'\n <div class="u-wrap u-margin-top-s u-margin-bottom-xl">\n \x3c!-- Question 1 --\x3e\n <div class="u-bg-petrol-step-3 u-flex u-flex-column u-align-center u-pad-xl u-flow--l" v-if="activeStep == 1">\n <p class="c-h c-h--upper c-h--step--1 u-grey-step-1 u-uppercase">{{ translations.generic.questionText }} 1</p>\n <h2 class="c-h c-h--step-3 u-petrol">{{ questions.questionOne.label }}</h2>\n <fieldset id="questionOne" class="o-grid o-grid--of-four u-wrap--content">\n <div v-for="option in questions.questionOne.options" :key="option">\n <input type="radio" class="c-radio c-radio--box" name="questionOne" :id="\'questionOne_\' + option.id" :value="option.value" v-model="answers.questionOne" />\n <label :for="\'questionOne_\' + option.id" v-html="option.label"></label>\n </div>\n </fieldset>\n <button type="button" class="mp c-button" :class="loading ? \'c-button--red loading-indicator\' : \'\'" :disabled="loading == true" @@click="checkQuestionOne(questions.questionOne.label.toString(), answers.questionOne.toString())">{{ translations.generic.nextText }}</button>\n </div>\n \x3c!-- Question 2 --\x3e\n <div class="u-bg-petrol-step-3 u-flex u-flex-column u-align-center u-pad-xl u-flow--l" v-if="activeStep == 2">\n <a class="mp c-twi u-link c-twi--left" style="align-self: flex-start" @@click="previousStep()">\n <span>{{ translations.generic.backText }}</span>\n <svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--arrow-right">\n <use xlink:href="/static/svg/sprite.svg#arrow-left"></use>\n </svg>\n </a>\n <p class="c-h c-h--upper c-h--step--1 u-grey-step-1 u-uppercase u-margin-top-0">{{ translations.generic.questionText }} 2</p>\n <h2 class="c-h c-h--step-3 u-petrol">{{ questions.questionTwo.label }}</h2>\n <fieldset id="questionTwo" class="o-grid o-grid--of-two u-wrap--content">\n <div v-for="option in questions.questionTwo.options" :key="option">\n <input type="radio" class="c-radio c-radio--box" name="questionTwo" :id="\'questionTwo_\' + option.id" :value="option.value" v-model="answers.questionTwo" />\n <label :for="\'questionTwo_\' + option.id" v-html="option.label"></label>\n </div>\n </fieldset>\n <button type="button" class="mp c-button" :class="loading ? \'c-button--red loading-indicator\' : \'\'" :disabled="loading == true" @@click="checkQuestionTwo(questions.questionTwo.label.toString(), answers.questionTwo.toString())">{{ translations.generic.nextText }}</button>\n </div>\n \x3c!-- Question 3 --\x3e\n <div class="u-bg-petrol-step-3 u-flex u-flex-column u-align-center u-pad-xl u-flow--l" v-if="activeStep == 3">\n <a class="mp c-twi u-link c-twi--left" style="align-self: flex-start" @@click="previousStep()">\n <span>{{ translations.generic.backText }}</span>\n <svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--arrow-right">\n <use xlink:href="/static/svg/sprite.svg#arrow-left"></use>\n </svg>\n </a>\n <p class="c-h c-h--upper c-h--step--1 u-grey-step-1 u-uppercase u-margin-top-0">{{ translations.generic.questionText }} 3</p>\n <h2 class="c-h c-h--step-3 u-petrol">{{ questions.questionThree.label }}</h2>\n <fieldset id="questionThree" class="o-grid o-grid--of-four u-wrap--content">\n <div v-for="option in questions.questionThree.options" :key="option">\n <input type="radio" class="c-radio c-radio--box" name="questionThree" :id="\'questionThree_\' + option.id" :value="option.value" v-model="answers.questionThree" :disabled="!results.some(result => result.Measurements.map(measurement => measurement.toLowerCase()).includes(option.value.toLowerCase()))" />\n <label :for="\'questionThree_\' + option.id" v-html="option.label"></label>\n </div>\n </fieldset>\n <button type="button" class="mp c-button" :class="loading ? \'c-button--red loading-indicator\' : \'\'" :disabled="loading == true" @@click="checkQuestionThree(questions.questionThree.label.toString(), answers.questionThree.toString())">{{ translations.generic.nextText }}</button>\n </div>\n \x3c!-- Question 4 --\x3e\n <div class="u-bg-petrol-step-3 u-flex u-flex-column u-align-center u-pad-xl u-flow--l" v-if="activeStep == 4">\n <a class="mp c-twi u-link c-twi--left" style="align-self: flex-start" @@click="previousStep()">\n <span>{{ translations.generic.backText }}</span>\n <svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--arrow-right">\n <use xlink:href="/static/svg/sprite.svg#arrow-left"></use>\n </svg>\n </a>\n <p class="c-h c-h--upper c-h--step--1 u-grey-step-1 u-uppercase u-margin-top-0">{{ translations.generic.questionText }} 4</p>\n <h2 class="c-h c-h--step-3 u-petrol">{{ questions.questionFour.label }}</h2>\n <fieldset id="questionFour" class="o-grid o-grid--of-three u-wrap--content">\n <div v-for="option in questions.questionFour.options" :key="option">\n <input type="radio" class="c-radio c-radio--box" name="questionFour" :id="\'questionFour_\' + option.id" :value="option.value" v-model="answers.questionFour" :disabled="!results.some(result => result.SizeRanges.map(sizeRange => sizeRange.toLowerCase()).includes(option.value.toLowerCase()))" />\n <label :for="\'questionFour_\' + option.id" v-html="option.label"></label>\n </div>\n </fieldset>\n <button type="button" class="mp c-button" :class="loading ? \'c-button--red loading-indicator\' : \'\'" :disabled="loading == true" @@click="checkQuestionFour(questions.questionFour.label.toString(), answers.questionFour.toString())">{{ translations.generic.nextText }}</button>\n </div>\n \x3c!-- Question 5 --\x3e\n <div class="u-bg-petrol-step-3 u-flex u-flex-column u-align-center u-pad-xl u-flow--l" v-if="activeStep == 5">\n <a class="mp c-twi u-link c-twi--left" style="align-self: flex-start" @@click="previousStep()">\n <span>{{ translations.generic.backText }}</span>\n <svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--arrow-right">\n <use xlink:href="/static/svg/sprite.svg#arrow-left"></use>\n </svg>\n </a>\n <p class="c-h c-h--upper c-h--step--1 u-grey-step-1 u-uppercase u-margin-top-0">{{ translations.generic.questionText }} 5</p>\n <h2 class="c-h c-h--step-3 u-petrol">{{ questions.questionFive.label }}</h2>\n <fieldset id="questionFive" class="o-grid o-grid--of-three u-wrap--content">\n <div v-for="option in questions.questionFive.options" :key="option">\n <input type="radio" class="c-radio c-radio--box" name="questionFive" :id="\'questionFive_\' + option.id" :value="option.value" v-model="answers.questionFive" :disabled="!results.some(result => result.Environments.map(environment => environment.toLowerCase()).includes(option.value.toLowerCase()))" />\n <label :for="\'questionFive_\' + option.id" v-html="option.label"></label>\n </div>\n </fieldset>\n <button type="button" class="mp c-button" :class="loading ? \'c-button--red loading-indicator\' : \'\'" :disabled="loading == true" @@click="checkQuestionFive(questions.questionFive.label.toString(), answers.questionFive.toString())">{{ translations.generic.seeResultsText }}</button>\n </div>\n \x3c!-- Question 6 --\x3e\n\n \x3c!-- Question 7 --\x3e\n\n\n \x3c!-- Finish --\x3e\n \x3c!-- <div class="u-bg-petrol-step-3 o-grid o-grid--layout o-grid--6/5 o-grid--push u-pad-xl u-flow--m" v-if="activeStep == 6 && results.length >= 1">\n <div class="u-flex u-flex-column u-flow--l" :class="results.length == 1 ? \'u-justify-center\' : \'\'">\n <h2 class="c-h c-h--step-3 u-petrol">{{ translations.results.headingText }}</h2>\n <div class="mp o-prose u-flow--prose">\n <p v-if="results.length > 1">{{ translations.results.multipleResultsLedeText }}</p>\n <p v-else>{{ translations.results.singleResultLedeText }} <strong>{{ results[0].Title }}</strong>.</p>\n </div>\n <div class="u-flex">\n <a class="mp c-button" :href="results.length == 1 ? \'@WebRequestContext.Localization.Path/products/request-a-quote?product=\' + results[0].ProductId : \'@WebRequestContext.Localization.Path/products/request-a-quote\'">{{ translations.generic.getAQuoteText }}</a>\n </div>\n <div>\n <a class="mp c-twi u-link c-twi--left" @@click="restart(\'Results\')">\n <span>{{ translations.generic.restartText }}</span>\n <svg width="22" height="21" viewBox="0 0 22 21" fill="none" xmlns="http://www.w3.org/2000/svg">\n <path d="M1 2V8H7" stroke="#006DAF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>\n <path d="M3.51 12.9999C4.15839 14.8403 5.38734 16.4201 7.01166 17.5013C8.63598 18.5825 10.5677 19.1065 12.5157 18.9944C14.4637 18.8823 16.3226 18.1401 17.8121 16.8797C19.3017 15.6193 20.3413 13.9089 20.7742 12.0063C21.2072 10.1037 21.0101 8.11191 20.2126 6.33105C19.4152 4.55019 18.0605 3.07674 16.3528 2.13271C14.6451 1.18868 12.6769 0.825212 10.7447 1.09707C8.81245 1.36892 7.02091 2.26137 5.64 3.63995L1 7.99995" stroke="#006DAF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>\n </svg>\n </a>\n </div>\n </div>\n <div class="u-margin-top-0 u-flow--s">\n <article class="mp c-card c-card--layout-multi c-card--size-large c-card--bordered c-card--has-image" v-for="result in results" :key="result">\n <div class="c-card__wrapper">\n <figure class="c-card__image u-flex u-flex-column u-justify-center" v-if="result.Img">\n <img :src="result.Img + \'?width=475\'" style="mix-blend-mode: multiply;">\n </figure>\n <div class="c-card__primary">\n <header class="c-card__header u-flow--2xs">\n <h2 class="c-h c-card__title" v-if="result.Title">{{ result.Title }}</h2>\n <h3 class="c-h c-h--tagline" v-if="result.Strapline">{{ result.Strapline }}</h3>\n </header>\n <div class="c-card__content u-flow">\n <div class="mp o-prose u-flow--prose u-step--1">\n <p v-if="result.Description">{{ result.Description }}</p>\n </div>\n <div class="c-card__specs" v-if="result.Range">\n <dl>\n <dt>{{ result.Range }}</dt>\n <dd>Particle size range</dd>\n </dl>\n </div>\n </div>\n <footer class="c-card__footer u-flow--2xs">\n <a class="mp c-twi u-link c-twi--left">\n <span>{{ translations.generic.viewText }} {{ result.Title }}</span>\n <svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--arrow-right">\n <use xlink:href="/static/svg/sprite.svg#arrow-right"></use>\n </svg>\n </a>\n </footer>\n </div>\n <a class="u-fill u-fill--link" :href="(hostname.includes(\'malvernpanalytical.com.cn\') ? \'/\' : \'/\' + pathname.split(\'/\')[1] + \'/\') + result.Url.split(\'/\').slice(2).join(\'/\')" @@click="resultTracking(result.Title.toString())">{{ result.Title }}</a>\n </div>\n </article>\n </div>\n </div> --\x3e\n </div>\n '}).mount("#product-finder");
2
+ //# sourceMappingURL=product-finder.js.map
package/dist/build/js/product-finder.js.map ADDED
@@ -0,0 +1 @@
1
+ {"mappings":"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","sources":["src/assets/js/product-finder.js"],"sourcesContent":["const ProductFinder = Vue.createApp({\r\n setup() {\r\n const { ref, computed } = Vue;\r\n\r\n let translations = {\r\n generic: {\r\n questionText: \"Question\",\r\n backText: \"Back\",\r\n nextText: \"Next\",\r\n restartText: \"Restart\",\r\n seeResultsText: \"See results\",\r\n viewText: \"View\",\r\n getAQuoteText: \"Get a quote\",\r\n requestADemoText: \"Request a demo\",\r\n },\r\n questionOne: {\r\n labelText: \"Where will your Zetasizer be used?\",\r\n options: [\r\n { optionText: \"Academic Research\" },\r\n { optionText: \"Industrial Research\" },\r\n { optionText: \"Pharmaceutical Research\" },\r\n { optionText: \"Industrial QA/QC\" },\r\n { optionText: \"Pharmaceutical QA/QC\" },\r\n ],\r\n },\r\n questionTwo: {\r\n labelText: \"If you are replacing or supplementing an existing system please choose the model from below or select \\\"not applicable\\\"\",\r\n options: [\r\n { optionText: \"Zetasizer Nano S90/ZS90\" },\r\n { optionText: \"Zetasizer Nano ZS/ZSE\" },\r\n { optionText: \"Zetasizer Nano ZSP\" },\r\n { optionText: \"Zetasizer uV\" },\r\n { optionText: \"Zetasizer Ultra\" },\r\n { optionText: \"Zetasizer Pro\" },\r\n { optionText: \"Other manufacturer's system\" },\r\n { optionText: \"Not applicable\" },\r\n ],\r\n },\r\n questionThree: {\r\n labelText: \"What do you want the Zetasizer to tell you about your sample? (Select as many as applicable)\",\r\n options: [\r\n { optionText: \"Size\" },\r\n { optionText: \"Zeta potential\" },\r\n { optionText: \"Concentration\" },\r\n ],\r\n },\r\n questionFour: {\r\n labelText: \"If you are using your existing system in a QA/QC department is it important that the new system provides consistency of results compared to a previously used system?\",\r\n options: [\r\n { optionText: \"Very important\" },\r\n { optionText: \"Somewhat important\" },\r\n { optionText: \"Not important\" },\r\n ],\r\n },\r\n questionFive: {\r\n labelText: \"Which of the following best describes your sample material?\",\r\n options: [\r\n { optionText: \"Slurries/Dispersions >5% solids\" },\r\n { optionText: \"Emulsions/Lipid Suspension\" },\r\n { optionText: \"Natural Polymers/Proteins >10 mg/mL\" },\r\n { optionText: \"Proteins/Biomolecules <10 mg/mL\" },\r\n { optionText: \"Environmental Samples (Aqueous)\" },\r\n { optionText: \"Dilute nanoparticle/colloidal systems\" },\r\n ],\r\n },\r\n questionSix: {\r\n labelText: \"What is the expected size range of your sample?\",\r\n options: [\r\n { optionText: \"<100 nm\" },\r\n { optionText: \"<500 nm\" },\r\n { optionText: \">500 nm\" },\r\n { optionText: \"Various/Unknown\" },\r\n ],\r\n },\r\n questionSeven: {\r\n labelText: \"Are you likely to measure samples that fluoresce in red light?\",\r\n options: [\r\n { optionText: \"Yes\" },\r\n { optionText: \"No\" },\r\n ],\r\n },\r\n results: {\r\n headingText: \"All done.\",\r\n multipleResultsLedeText:\r\n \"Based on the features and specifications you selected we would recommend these products.\",\r\n singleResultLedeText:\r\n \"Based on the features and specifications you selected we would recommend the\",\r\n },\r\n };\r\n if (window.location.pathname.lastIndexOf(\"/de\", 0) == 0) {\r\n // German translations\r\n } else if (window.location.pathname.lastIndexOf(\"/es\", 0) == 0) {\r\n // Spanish translations\r\n } else if (window.location.pathname.lastIndexOf(\"/fr\", 0) == 0) {\r\n // French translations\r\n } else if (window.location.pathname.lastIndexOf(\"/br\", 0) == 0) {\r\n // Portugese translations\r\n } else if (window.location.pathname.lastIndexOf(\"/ru\", 0) == 0) {\r\n // Russian translations\r\n } else if (window.location.pathname.lastIndexOf(\"/kr\", 0) == 0) {\r\n // Korean translations\r\n } else if (window.location.pathname.lastIndexOf(\"/jp\", 0) == 0) {\r\n // Japanese translations\r\n } else if (window.location.pathname.lastIndexOf(\"/tw\", 0) == 0) {\r\n // Taiwanese translations\r\n } else if (window.location.hostname.indexOf(\"malvernpanalytical.com.cn\") > 0) {\r\n // Chinese translations\r\n }\r\n\r\n let activeStep = ref(1);\r\n\r\n const questions = {\r\n questionOne: {\r\n label: translations.questionOne.labelText,\r\n options: [\r\n {\r\n label: translations.questionOne.options[0].optionText,\r\n value: \"Academic Research\",\r\n id: \"One\",\r\n },\r\n {\r\n label: translations.questionOne.options[1].optionText,\r\n value: \"Industrial Research\",\r\n id: \"Two\",\r\n },\r\n {\r\n label: translations.questionOne.options[2].optionText,\r\n value: \"Pharmaceutical Research\",\r\n id: \"Three\",\r\n },\r\n {\r\n label: translations.questionOne.options[3].optionText,\r\n value: \"Industrial QA/QC\",\r\n id: \"Four\",\r\n },\r\n {\r\n label: translations.questionOne.options[4].optionText,\r\n value: \"Pharmaceutical QA/QC\",\r\n id: \"Five\",\r\n },\r\n ],\r\n },\r\n questionTwo: {\r\n label: translations.questionTwo.labelText,\r\n options: [\r\n {\r\n label: translations.questionTwo.options[0].optionText,\r\n value: \"Zetasizer Nano S90/ZS90\",\r\n id: \"One\",\r\n },\r\n {\r\n label: translations.questionTwo.options[1].optionText,\r\n value: \"Zetasizer Nano ZS/ZSE\",\r\n id: \"Two\",\r\n },\r\n {\r\n label: translations.questionTwo.options[2].optionText,\r\n value: \"Zetasizer Nano ZSP\",\r\n id: \"Three\",\r\n },\r\n {\r\n label: translations.questionTwo.options[3].optionText,\r\n value: \"Zetasizer uV\",\r\n id: \"Four\",\r\n },\r\n {\r\n label: translations.questionTwo.options[4].optionText,\r\n value: \"Zetasizer Ultra\",\r\n id: \"Five\",\r\n },\r\n {\r\n label: translations.questionTwo.options[5].optionText,\r\n value: \"Zetasizer Pro\",\r\n id: \"Six\",\r\n },\r\n {\r\n label: translations.questionTwo.options[6].optionText,\r\n value: \"Other manufacturer's system\",\r\n id: \"Seven\",\r\n },\r\n {\r\n label: translations.questionTwo.options[7].optionText,\r\n value: \"Not applicable\",\r\n id: \"Eight\",\r\n },\r\n ],\r\n },\r\n questionThree: {\r\n label: translations.questionThree.labelText,\r\n options: [\r\n {\r\n label: translations.questionThree.options[0].optionText,\r\n value: \"Size\",\r\n id: \"One\",\r\n },\r\n {\r\n label: translations.questionThree.options[1].optionText,\r\n value: \"Zeta potential\",\r\n id: \"Two\",\r\n },\r\n {\r\n label: translations.questionThree.options[2].optionText,\r\n value: \"Concentration\",\r\n id: \"Three\",\r\n },\r\n ],\r\n },\r\n questionFour: {\r\n label: translations.questionFour.labelText,\r\n options: [\r\n {\r\n label: translations.questionFour.options[0].optionText,\r\n value: \"Very important\",\r\n id: \"One\",\r\n },\r\n {\r\n label: translations.questionFour.options[1].optionText,\r\n value: \"Somewhat important\",\r\n id: \"Two\",\r\n },\r\n {\r\n label: translations.questionFour.options[2].optionText,\r\n value: \"Not important\",\r\n id: \"Three\",\r\n },\r\n ],\r\n },\r\n questionFive: {\r\n label: translations.questionFive.labelText,\r\n options: [\r\n {\r\n label: translations.questionFive.options[0].optionText,\r\n value: \"Slurries/Dispersions >5% solids\",\r\n id: \"One\",\r\n },\r\n {\r\n label: translations.questionFive.options[1].optionText,\r\n value: \"Emulsions/Lipid Suspension\",\r\n id: \"Two\",\r\n },\r\n {\r\n label: translations.questionFive.options[2].optionText,\r\n value: \"Natural Polymers/Proteins >10 mg/mL\",\r\n id: \"Three\",\r\n },\r\n {\r\n label: translations.questionFive.options[3].optionText,\r\n value: \"Proteins/Biomolecules <10 mg/mL\",\r\n id: \"Four\",\r\n },\r\n {\r\n label: translations.questionFive.options[4].optionText,\r\n value: \"Environmental Samples (Aqueous)\",\r\n id: \"Five\",\r\n },\r\n {\r\n label: translations.questionFive.options[5].optionText,\r\n value: \"Dilute nanoparticle/colloidal systems\",\r\n id: \"Six\",\r\n },\r\n ],\r\n },\r\n questionSix: {\r\n label: translations.questionSix.labelText,\r\n options: [\r\n {\r\n label: translations.questionSix.options[0].optionText,\r\n value: \"<100 nm\",\r\n id: \"One\",\r\n },\r\n {\r\n label: translations.questionSix.options[1].optionText,\r\n value: \"<500 nm\",\r\n id: \"Two\",\r\n },\r\n {\r\n label: translations.questionSix.options[2].optionText,\r\n value: \">500 nm\",\r\n id: \"Three\",\r\n },\r\n {\r\n label: translations.questionSix.options[3].optionText,\r\n value: \"Various/Unknown\",\r\n id: \"Four\",\r\n },\r\n ],\r\n },\r\n questionSeven: {\r\n label: translations.questionSeven.labelText,\r\n options: [\r\n {\r\n label: translations.questionSeven.options[0].optionText,\r\n value: \"Yes\",\r\n id: \"One\",\r\n },\r\n {\r\n label: translations.questionSeven.options[1].optionText,\r\n value: \"No\",\r\n id: \"Two\",\r\n },\r\n ],\r\n },\r\n };\r\n\r\n let answers = {\r\n questionOne: \"\",\r\n questionTwo: \"\",\r\n questionThree: \"\",\r\n questionFour: \"\",\r\n questionFive: \"\",\r\n questionSix: \"\",\r\n questionSeven: \"\",\r\n };\r\n\r\n let products = ref([]);\r\n let results = ref([]);\r\n const loading = ref(false);\r\n\r\n function checkQuestionOne(question, answer) {\r\n if (answers.questionOne) {\r\n console.log(question);\r\n console.log(answer);\r\n }\r\n }\r\n\r\n function checkQuestionTwo(question, answer) {\r\n if (answers.questionTwo) {\r\n\r\n }\r\n }\r\n\r\n function checkQuestionThree(question, answer) {\r\n if (answers.questionThree) {\r\n\r\n }\r\n }\r\n\r\n function checkQuestionFour(question, answer) {\r\n if (answers.questionFour) {\r\n\r\n }\r\n }\r\n\r\n function checkQuestionFive(question, answer) {\r\n if (answers.questionFive) {\r\n\r\n }\r\n }\r\n\r\n function checkQuestionSix(question, answer) {\r\n if (answers.questionSix) {\r\n \r\n }\r\n }\r\n\r\n function checkQuestionSeven(question, answer) {\r\n if (answers.questionSeven) {\r\n \r\n }\r\n }\r\n\r\n function previousStep() {\r\n if (activeStep.value == 1) {\r\n activeStep.value--;\r\n } else if (activeStep.value == 2) {\r\n activeStep.value--;\r\n } else if (activeStep.value == 3) {\r\n activeStep.value--;\r\n } else if (activeStep.value == 4) {\r\n activeStep.value -= 2;\r\n } else if (activeStep.value == 5) {\r\n activeStep.value--;\r\n }\r\n }\r\n\r\n function restart(resultsView) {\r\n dataLayer.push({\r\n event: \"product_finder\",\r\n action: \"Restart\",\r\n label: resultsView,\r\n });\r\n _paq.push([\"trackEvent\", \"Product finder\", \"Restart\", resultsView]);\r\n activeStep.value = 0;\r\n results.value = [];\r\n answers.questionOne = \"\";\r\n answers.questionTwo = \"\";\r\n answers.questionThree = \"\";\r\n answers.questionFour = \"\";\r\n answers.questionFive = \"\";\r\n }\r\n\r\n function resultTracking(product) {\r\n dataLayer.push({\r\n event: \"product_finder\",\r\n action: \"Result\",\r\n label: product,\r\n });\r\n _paq.push([\"trackEvent\", \"Product finder\", \"Result\", product]);\r\n }\r\n\r\n const hostname = computed(() => window.location.hostname.toString());\r\n const pathname = computed(() => window.location.pathname.toString());\r\n\r\n return {\r\n translations,\r\n activeStep,\r\n questions,\r\n answers,\r\n loading,\r\n results,\r\n checkQuestionOne,\r\n checkQuestionTwo,\r\n checkQuestionThree,\r\n checkQuestionFour,\r\n checkQuestionFive,\r\n checkQuestionSix,\r\n checkQuestionSeven,\r\n previousStep,\r\n restart,\r\n resultTracking,\r\n hostname,\r\n pathname,\r\n };\r\n },\r\n template: `\r\n <div class=\"u-wrap u-margin-top-s u-margin-bottom-xl\">\r\n <!-- Question 1 -->\r\n <div class=\"u-bg-petrol-step-3 u-flex u-flex-column u-align-center u-pad-xl u-flow--l\" v-if=\"activeStep == 1\">\r\n <p class=\"c-h c-h--upper c-h--step--1 u-grey-step-1 u-uppercase\">{{ translations.generic.questionText }} 1</p>\r\n <h2 class=\"c-h c-h--step-3 u-petrol\">{{ questions.questionOne.label }}</h2>\r\n <fieldset id=\"questionOne\" class=\"o-grid o-grid--of-four u-wrap--content\">\r\n <div v-for=\"option in questions.questionOne.options\" :key=\"option\">\r\n <input type=\"radio\" class=\"c-radio c-radio--box\" name=\"questionOne\" :id=\"'questionOne_' + option.id\" :value=\"option.value\" v-model=\"answers.questionOne\" />\r\n <label :for=\"'questionOne_' + option.id\" v-html=\"option.label\"></label>\r\n </div>\r\n </fieldset>\r\n <button type=\"button\" class=\"mp c-button\" :class=\"loading ? 'c-button--red loading-indicator' : ''\" :disabled=\"loading == true\" @@click=\"checkQuestionOne(questions.questionOne.label.toString(), answers.questionOne.toString())\">{{ translations.generic.nextText }}</button>\r\n </div>\r\n <!-- Question 2 -->\r\n <div class=\"u-bg-petrol-step-3 u-flex u-flex-column u-align-center u-pad-xl u-flow--l\" v-if=\"activeStep == 2\">\r\n <a class=\"mp c-twi u-link c-twi--left\" style=\"align-self: flex-start\" @@click=\"previousStep()\">\r\n <span>{{ translations.generic.backText }}</span>\r\n <svg role=\"img\" aria-hidden=\"true\" focusable=\"false\" class=\"mp c-icon c-icon--arrow-right\">\r\n <use xlink:href=\"/static/svg/sprite.svg#arrow-left\"></use>\r\n </svg>\r\n </a>\r\n <p class=\"c-h c-h--upper c-h--step--1 u-grey-step-1 u-uppercase u-margin-top-0\">{{ translations.generic.questionText }} 2</p>\r\n <h2 class=\"c-h c-h--step-3 u-petrol\">{{ questions.questionTwo.label }}</h2>\r\n <fieldset id=\"questionTwo\" class=\"o-grid o-grid--of-two u-wrap--content\">\r\n <div v-for=\"option in questions.questionTwo.options\" :key=\"option\">\r\n <input type=\"radio\" class=\"c-radio c-radio--box\" name=\"questionTwo\" :id=\"'questionTwo_' + option.id\" :value=\"option.value\" v-model=\"answers.questionTwo\" />\r\n <label :for=\"'questionTwo_' + option.id\" v-html=\"option.label\"></label>\r\n </div>\r\n </fieldset>\r\n <button type=\"button\" class=\"mp c-button\" :class=\"loading ? 'c-button--red loading-indicator' : ''\" :disabled=\"loading == true\" @@click=\"checkQuestionTwo(questions.questionTwo.label.toString(), answers.questionTwo.toString())\">{{ translations.generic.nextText }}</button>\r\n </div>\r\n <!-- Question 3 -->\r\n <div class=\"u-bg-petrol-step-3 u-flex u-flex-column u-align-center u-pad-xl u-flow--l\" v-if=\"activeStep == 3\">\r\n <a class=\"mp c-twi u-link c-twi--left\" style=\"align-self: flex-start\" @@click=\"previousStep()\">\r\n <span>{{ translations.generic.backText }}</span>\r\n <svg role=\"img\" aria-hidden=\"true\" focusable=\"false\" class=\"mp c-icon c-icon--arrow-right\">\r\n <use xlink:href=\"/static/svg/sprite.svg#arrow-left\"></use>\r\n </svg>\r\n </a>\r\n <p class=\"c-h c-h--upper c-h--step--1 u-grey-step-1 u-uppercase u-margin-top-0\">{{ translations.generic.questionText }} 3</p>\r\n <h2 class=\"c-h c-h--step-3 u-petrol\">{{ questions.questionThree.label }}</h2>\r\n <fieldset id=\"questionThree\" class=\"o-grid o-grid--of-four u-wrap--content\">\r\n <div v-for=\"option in questions.questionThree.options\" :key=\"option\">\r\n <input type=\"radio\" class=\"c-radio c-radio--box\" name=\"questionThree\" :id=\"'questionThree_' + option.id\" :value=\"option.value\" v-model=\"answers.questionThree\" :disabled=\"!results.some(result => result.Measurements.map(measurement => measurement.toLowerCase()).includes(option.value.toLowerCase()))\" />\r\n <label :for=\"'questionThree_' + option.id\" v-html=\"option.label\"></label>\r\n </div>\r\n </fieldset>\r\n <button type=\"button\" class=\"mp c-button\" :class=\"loading ? 'c-button--red loading-indicator' : ''\" :disabled=\"loading == true\" @@click=\"checkQuestionThree(questions.questionThree.label.toString(), answers.questionThree.toString())\">{{ translations.generic.nextText }}</button>\r\n </div>\r\n <!-- Question 4 -->\r\n <div class=\"u-bg-petrol-step-3 u-flex u-flex-column u-align-center u-pad-xl u-flow--l\" v-if=\"activeStep == 4\">\r\n <a class=\"mp c-twi u-link c-twi--left\" style=\"align-self: flex-start\" @@click=\"previousStep()\">\r\n <span>{{ translations.generic.backText }}</span>\r\n <svg role=\"img\" aria-hidden=\"true\" focusable=\"false\" class=\"mp c-icon c-icon--arrow-right\">\r\n <use xlink:href=\"/static/svg/sprite.svg#arrow-left\"></use>\r\n </svg>\r\n </a>\r\n <p class=\"c-h c-h--upper c-h--step--1 u-grey-step-1 u-uppercase u-margin-top-0\">{{ translations.generic.questionText }} 4</p>\r\n <h2 class=\"c-h c-h--step-3 u-petrol\">{{ questions.questionFour.label }}</h2>\r\n <fieldset id=\"questionFour\" class=\"o-grid o-grid--of-three u-wrap--content\">\r\n <div v-for=\"option in questions.questionFour.options\" :key=\"option\">\r\n <input type=\"radio\" class=\"c-radio c-radio--box\" name=\"questionFour\" :id=\"'questionFour_' + option.id\" :value=\"option.value\" v-model=\"answers.questionFour\" :disabled=\"!results.some(result => result.SizeRanges.map(sizeRange => sizeRange.toLowerCase()).includes(option.value.toLowerCase()))\" />\r\n <label :for=\"'questionFour_' + option.id\" v-html=\"option.label\"></label>\r\n </div>\r\n </fieldset>\r\n <button type=\"button\" class=\"mp c-button\" :class=\"loading ? 'c-button--red loading-indicator' : ''\" :disabled=\"loading == true\" @@click=\"checkQuestionFour(questions.questionFour.label.toString(), answers.questionFour.toString())\">{{ translations.generic.nextText }}</button>\r\n </div>\r\n <!-- Question 5 -->\r\n <div class=\"u-bg-petrol-step-3 u-flex u-flex-column u-align-center u-pad-xl u-flow--l\" v-if=\"activeStep == 5\">\r\n <a class=\"mp c-twi u-link c-twi--left\" style=\"align-self: flex-start\" @@click=\"previousStep()\">\r\n <span>{{ translations.generic.backText }}</span>\r\n <svg role=\"img\" aria-hidden=\"true\" focusable=\"false\" class=\"mp c-icon c-icon--arrow-right\">\r\n <use xlink:href=\"/static/svg/sprite.svg#arrow-left\"></use>\r\n </svg>\r\n </a>\r\n <p class=\"c-h c-h--upper c-h--step--1 u-grey-step-1 u-uppercase u-margin-top-0\">{{ translations.generic.questionText }} 5</p>\r\n <h2 class=\"c-h c-h--step-3 u-petrol\">{{ questions.questionFive.label }}</h2>\r\n <fieldset id=\"questionFive\" class=\"o-grid o-grid--of-three u-wrap--content\">\r\n <div v-for=\"option in questions.questionFive.options\" :key=\"option\">\r\n <input type=\"radio\" class=\"c-radio c-radio--box\" name=\"questionFive\" :id=\"'questionFive_' + option.id\" :value=\"option.value\" v-model=\"answers.questionFive\" :disabled=\"!results.some(result => result.Environments.map(environment => environment.toLowerCase()).includes(option.value.toLowerCase()))\" />\r\n <label :for=\"'questionFive_' + option.id\" v-html=\"option.label\"></label>\r\n </div>\r\n </fieldset>\r\n <button type=\"button\" class=\"mp c-button\" :class=\"loading ? 'c-button--red loading-indicator' : ''\" :disabled=\"loading == true\" @@click=\"checkQuestionFive(questions.questionFive.label.toString(), answers.questionFive.toString())\">{{ translations.generic.seeResultsText }}</button>\r\n </div>\r\n <!-- Question 6 -->\r\n\r\n <!-- Question 7 -->\r\n\r\n\r\n <!-- Finish -->\r\n <!-- <div class=\"u-bg-petrol-step-3 o-grid o-grid--layout o-grid--6/5 o-grid--push u-pad-xl u-flow--m\" v-if=\"activeStep == 6 && results.length >= 1\">\r\n <div class=\"u-flex u-flex-column u-flow--l\" :class=\"results.length == 1 ? 'u-justify-center' : ''\">\r\n <h2 class=\"c-h c-h--step-3 u-petrol\">{{ translations.results.headingText }}</h2>\r\n <div class=\"mp o-prose u-flow--prose\">\r\n <p v-if=\"results.length > 1\">{{ translations.results.multipleResultsLedeText }}</p>\r\n <p v-else>{{ translations.results.singleResultLedeText }} <strong>{{ results[0].Title }}</strong>.</p>\r\n </div>\r\n <div class=\"u-flex\">\r\n <a class=\"mp c-button\" :href=\"results.length == 1 ? '@WebRequestContext.Localization.Path/products/request-a-quote?product=' + results[0].ProductId : '@WebRequestContext.Localization.Path/products/request-a-quote'\">{{ translations.generic.getAQuoteText }}</a>\r\n </div>\r\n <div>\r\n <a class=\"mp c-twi u-link c-twi--left\" @@click=\"restart('Results')\">\r\n <span>{{ translations.generic.restartText }}</span>\r\n <svg width=\"22\" height=\"21\" viewBox=\"0 0 22 21\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M1 2V8H7\" stroke=\"#006DAF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n <path d=\"M3.51 12.9999C4.15839 14.8403 5.38734 16.4201 7.01166 17.5013C8.63598 18.5825 10.5677 19.1065 12.5157 18.9944C14.4637 18.8823 16.3226 18.1401 17.8121 16.8797C19.3017 15.6193 20.3413 13.9089 20.7742 12.0063C21.2072 10.1037 21.0101 8.11191 20.2126 6.33105C19.4152 4.55019 18.0605 3.07674 16.3528 2.13271C14.6451 1.18868 12.6769 0.825212 10.7447 1.09707C8.81245 1.36892 7.02091 2.26137 5.64 3.63995L1 7.99995\" stroke=\"#006DAF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n </a>\r\n </div>\r\n </div>\r\n <div class=\"u-margin-top-0 u-flow--s\">\r\n <article class=\"mp c-card c-card--layout-multi c-card--size-large c-card--bordered c-card--has-image\" v-for=\"result in results\" :key=\"result\">\r\n <div class=\"c-card__wrapper\">\r\n <figure class=\"c-card__image u-flex u-flex-column u-justify-center\" v-if=\"result.Img\">\r\n <img :src=\"result.Img + '?width=475'\" style=\"mix-blend-mode: multiply;\">\r\n </figure>\r\n <div class=\"c-card__primary\">\r\n <header class=\"c-card__header u-flow--2xs\">\r\n <h2 class=\"c-h c-card__title\" v-if=\"result.Title\">{{ result.Title }}</h2>\r\n <h3 class=\"c-h c-h--tagline\" v-if=\"result.Strapline\">{{ result.Strapline }}</h3>\r\n </header>\r\n <div class=\"c-card__content u-flow\">\r\n <div class=\"mp o-prose u-flow--prose u-step--1\">\r\n <p v-if=\"result.Description\">{{ result.Description }}</p>\r\n </div>\r\n <div class=\"c-card__specs\" v-if=\"result.Range\">\r\n <dl>\r\n <dt>{{ result.Range }}</dt>\r\n <dd>Particle size range</dd>\r\n </dl>\r\n </div>\r\n </div>\r\n <footer class=\"c-card__footer u-flow--2xs\">\r\n <a class=\"mp c-twi u-link c-twi--left\">\r\n <span>{{ translations.generic.viewText }} {{ result.Title }}</span>\r\n <svg role=\"img\" aria-hidden=\"true\" focusable=\"false\" class=\"mp c-icon c-icon--arrow-right\">\r\n <use xlink:href=\"/static/svg/sprite.svg#arrow-right\"></use>\r\n </svg>\r\n </a>\r\n </footer>\r\n </div>\r\n <a class=\"u-fill u-fill--link\" :href=\"(hostname.includes('malvernpanalytical.com.cn') ? '/' : '/' + pathname.split('/')[1] + '/') + result.Url.split('/').slice(2).join('/')\" @@click=\"resultTracking(result.Title.toString())\">{{ result.Title }}</a>\r\n </div>\r\n </article>\r\n </div>\r\n </div> -->\r\n </div>\r\n `,\r\n}).mount(\"#product-finder\");\r\n"],"names":["Vue","createApp","setup","ref","computed","translations","generic","questionText","backText","nextText","restartText","seeResultsText","viewText","getAQuoteText","requestADemoText","questionOne","labelText","options","optionText","questionTwo","questionThree","questionFour","questionFive","questionSix","questionSeven","results","headingText","multipleResultsLedeText","singleResultLedeText","window","location","pathname","lastIndexOf","hostname","indexOf","activeStep","questions","label","value","id","answers","loading","toString","checkQuestionOne","question","answer","console","log","checkQuestionTwo","checkQuestionThree","checkQuestionFour","checkQuestionFive","checkQuestionSix","checkQuestionSeven","previousStep","restart","resultsView","dataLayer","push","event","action","_paq","resultTracking","product","template","mount"],"version":3,"file":"product-finder.js.map"}
package/dist/build/scss/library.css CHANGED
@@ -1,2 +1,2 @@
1
- @import "https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap";.u-breakout{left:50%;left:calc(50% + var(--scrollbarWidth)/2.0001);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:safe-space(0);padding-right:safe-space(0);position:relative;transform:translate(-50vw)}.u-cutoff{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--gutter)),calc(100% - var(--gutter))100%,0 100%)}.u-cutoff--top-right{clip-path:polygon(0 0,calc(100% - var(--gutter))0,100% var(--gutter),100% 100%,0 100%)}.u-cutoff--top-left{clip-path:polygon(0 var(--gutter),var(--gutter)0,100% 0,100% 100%,0 100%)}.u-cutoff--bottom-left{clip-path:polygon(0 0,100% 0,100% 100%,var(--gutter)100%,0 calc(100% - var(--gutter)))}.u-cutoff--xl{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--space-xl)),calc(100% - var(--space-xl))100%,0 100%)}:root{--fluid-min-width:320;--fluid-max-width:1332;--fluid-screen:100vw;--fluid-bp:calc( (var(--fluid-screen) - var(--fluid-min-width)/16*1rem)/(var(--fluid-max-width) - var(--fluid-min-width)))}@media screen and (min-width:1332px){:root{--fluid-screen:calc(var(--fluid-max-width)*1px)}}:root{--f--2-min:12.64;--f--2-max:12.5;--step--2:calc( ((var(--f--2-min)/16)*1rem) + (var(--f--2-max) - var(--f--2-min))*var(--fluid-bp));--f--1-min:14.22;--f--1-max:15;--step--1:calc( ((var(--f--1-min)/16)*1rem) + (var(--f--1-max) - var(--f--1-min))*var(--fluid-bp));--f-0-min:16;--f-0-max:18;--step-0:calc( ((var(--f-0-min)/16)*1rem) + (var(--f-0-max) - var(--f-0-min))*var(--fluid-bp));--f-1-min:18;--f-1-max:21.6;--step-1:calc( ((var(--f-1-min)/16)*1rem) + (var(--f-1-max) - var(--f-1-min))*var(--fluid-bp));--f-2-min:20.25;--f-2-max:25.92;--step-2:calc( ((var(--f-2-min)/16)*1rem) + (var(--f-2-max) - var(--f-2-min))*var(--fluid-bp));--f-3-min:22.78;--f-3-max:31.1;--step-3:calc( ((var(--f-3-min)/16)*1rem) + (var(--f-3-max) - var(--f-3-min))*var(--fluid-bp));--f-4-min:25.63;--f-4-max:37.32;--step-4:calc( ((var(--f-4-min)/16)*1rem) + (var(--f-4-max) - var(--f-4-min))*var(--fluid-bp));--f-5-min:28.83;--f-5-max:44.79;--step-5:calc( ((var(--f-5-min)/16)*1rem) + (var(--f-5-max) - var(--f-5-min))*var(--fluid-bp));--f-6-min:32.44;--f-6-max:53.75;--step-6:calc( ((var(--f-6-min)/16)*1rem) + (var(--f-6-max) - var(--f-6-min))*var(--fluid-bp));--f-7-min:36.49;--f-7-max:64.5;--step-7:calc( ((var(--f-7-min)/16)*1rem) + (var(--f-7-max) - var(--f-7-min))*var(--fluid-bp));--f-8-min:41.05;--f-8-max:77.4;--step-8:calc( ((var(--f-8-min)/16)*1rem) + (var(--f-8-max) - var(--f-8-min))*var(--fluid-bp));--f-9-min:46.18;--f-9-max:92.88;--step-9:calc( ((var(--f-9-min)/16)*1rem) + (var(--f-9-max) - var(--f-9-min))*var(--fluid-bp));--f-10-min:51.96;--f-10-max:111.45;--step-10:calc( ((var(--f-10-min)/16)*1rem) + (var(--f-10-max) - var(--f-10-min))*var(--fluid-bp))}@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(../Inter-Regular.ed77b881.woff2)format("woff2"),url(../Inter-Regular.ca6858d7.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(../Inter-SemiBold.dd034768.woff2)format("woff2"),url(../Inter-SemiBold.cc1168df.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url(../Inter-Bold.af5441a3.woff2)format("woff2"),url(../Inter-Bold.419e8c71.woff)format("woff")}:root{--max-screen:83.25;--fc-screen:100vw;--fc-bp:calc((var(--fc-screen) - 20em)/(var(--max-screen) - 20));--fc-base:18;--fc-3xs:4.5;--space-3xs:calc(var(--fc-3xs)/16*1rem);--fc-2xs:9;--space-2xs:calc(var(--fc-2xs)/16*1rem);--fc-xs:13.5;--space-xs:calc(var(--fc-xs)/16*1rem);--fc-s:18;--space-s:calc(var(--fc-s)/16*1rem);--fc-m:27;--space-m:calc(var(--fc-m)/16*1rem);--fc-l:36;--space-l:calc(var(--fc-l)/16*1rem);--fc-xl:54;--space-xl:calc(var(--fc-xl)/16*1rem);--fc-2xl:72;--space-2xl:calc(var(--fc-2xl)/16*1rem);--fc-3xl:108;--space-3xl:calc(var(--fc-3xl)/16*1rem);--fc-4xl:144;--space-4xl:calc(var(--fc-4xl)/16*1rem);--space--3xs:calc( ((var(--fc-)/16)*1rem) + (var(--fc-3xs) - var(--fc-))*var(--fluid-bp));--space-3xs-2xs:calc( ((var(--fc-3xs)/16)*1rem) + (var(--fc-2xs) - var(--fc-3xs))*var(--fluid-bp));--space-2xs-xs:calc( ((var(--fc-2xs)/16)*1rem) + (var(--fc-xs) - var(--fc-2xs))*var(--fluid-bp));--space-xs-s:calc( ((var(--fc-xs)/16)*1rem) + (var(--fc-s) - var(--fc-xs))*var(--fluid-bp));--space-s-m:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-m) - var(--fc-s))*var(--fluid-bp));--space-m-l:calc( ((var(--fc-m)/16)*1rem) + (var(--fc-l) - var(--fc-m))*var(--fluid-bp));--space-l-xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-xl) - var(--fc-l))*var(--fluid-bp));--space-xl-2xl:calc( ((var(--fc-xl)/16)*1rem) + (var(--fc-2xl) - var(--fc-xl))*var(--fluid-bp));--space-2xl-3xl:calc( ((var(--fc-2xl)/16)*1rem) + (var(--fc-3xl) - var(--fc-2xl))*var(--fluid-bp));--space-3xl-4xl:calc( ((var(--fc-3xl)/16)*1rem) + (var(--fc-4xl) - var(--fc-3xl))*var(--fluid-bp));--space-s-l:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-l) - var(--fc-s))*var(--fluid-bp));--space-s-m:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-m) - var(--fc-s))*var(--fluid-bp));--space-xs-l:calc( ((var(--fc-xs)/16)*1rem) + (var(--fc-l) - var(--fc-xs))*var(--fluid-bp));--space-m-xl:calc( ((var(--fc-m)/16)*1rem) + (var(--fc-xl) - var(--fc-m))*var(--fluid-bp));--space-l-2xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-2xl) - var(--fc-l))*var(--fluid-bp));--space-s-xl:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-xl) - var(--fc-s))*var(--fluid-bp));--space-l-3xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-3xl) - var(--fc-l))*var(--fluid-bp));--space-xl-3xl:calc( ((var(--fc-xl)/16)*1rem) + (var(--fc-3xl) - var(--fc-xl))*var(--fluid-bp));--space-l-4xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-4xl) - var(--fc-l))*var(--fluid-bp));--space-3xs-m:calc( ((var(--fc-3xs)/16)*1rem) + (var(--fc-m) - var(--fc-3xs))*var(--fluid-bp));--gutter:var(--space-s-l)}@media screen and (min-width:75em){:root{--fc-screen:calc(var(--max-screen)*1rem)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(360deg)}}*,:before,:after{box-sizing:border-box}body{min-height:100vh;flex-direction:column;justify-content:flex-start;align-items:stretch;margin:0;display:flex}html{scroll-behavior:smooth}blockquote,pre,ol,ul,figure{margin:0;padding:0}img{max-width:100%;height:auto;border:0;display:block}article,aside,figure,footer,header,aside,main,nav{display:block}iframe{border:0}body{letter-spacing:-.01em;font:400 18px/1.2 Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:var(--step-0);color:#333}h1,h2,h3,h4,h5,h6,p,ul,ol,dl{margin:0}ul,ol,p{line-height:1.2}a{text-decoration:none}a,a:hover{cursor:pointer;color:inherit}.mp ol,.mp ul{list-style:none}cite,address{font-style:normal}[type=submit],[type=button],button{box-shadow:none;appearance:none;cursor:pointer;color:inherit;font:inherit;background:0 0;border:0;border-radius:0;padding:0}label{cursor:pointer}fieldset{border:0;padding:.01em 0 0}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}code[class*=language-],pre[class*=language-]{text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;color:#3d7b87;tab-size:4;hyphens:none;background:#ebf1f2;font-family:Source Code Pro,monospace;font-size:1rem;line-height:1.5em}.c-alert code[class*=language-],.c-alert pre[class*=language-]{background:0 0}code[class*=language-]::selection,pre[class*=language-]::selection,code[class*=language-] ::selection,pre[class*=language-] ::selection{color:#263238;background:#cceae7}:not(pre)>code[class*=language-]{white-space:normal;border-radius:.2em;padding:.1em}pre[class*=language-]{padding:18px;padding:var(--space-s);position:relative;overflow:auto}.language-css>code,.language-sass>code,.language-scss>code{color:#f2a60d}[class*=language-] .namespace{opacity:.7}.token.atrule{color:#3d7b87}.token.attr-name{color:#00a2c2}.token.attr-value,.token.attribute{color:#13aa13}.token.boolean{color:#ce0058}.token.builtin,.token.cdata,.token.char,.token.class{color:#00a2c2}.token.class-name{color:#6182b8}.token.comment{color:#aabfc9}.token.constant{color:#3d7b87}.token.deleted{color:#ce0058}.token.doctype{color:#aabfc9}.token.entity{color:#ce0058}.token.function{color:#3d7b87}.token.hexcode{color:#f2a60d}.token.id,.token.important{color:#3d7b87;font-weight:700}.token.inserted{color:#00a2c2}.token.keyword{color:#3d7b87}.token.number{color:#f2a60d}.token.operator{color:#00a2c2}.token.prolog{color:#aabfc9}.token.property{color:#00a2c2}.token.pseudo-class,.token.pseudo-element{color:#13aa13}.token.punctuation,.token.regex{color:#00a2c2}.token.selector{color:#ce0058}.token.string{color:#13aa13}.token.symbol{color:#3d7b87}.token.tag{color:#005461}.token.unit{color:#f2a60d}.token.url,.token.variable{color:#ce0058}.u-hr,.c-library hr,.o-prose hr{padding-bottom:27px;padding-bottom:var(--space-m-xl);margin:0 0 27px;margin-bottom:var(--space-m-xl);border:0;border-bottom:1px solid #bfd3d6}.u-border-top{border-top:1px solid #bfd3d6}.u-border-bottom{border-bottom:1px solid #bfd3d6}.u-border{border:1px solid #bfd3d6}.o-grid{margin-bottom:-18px;margin-bottom:calc(-1*var(--gutter));width:100%;flex-wrap:wrap;justify-content:stretch;display:flex}.o-grid--float:after{content:" ";clear:both;display:table}.o-grid--between{justify-content:space-between}.o-grid--no-height-match{align-items:start}.o-grid>*{width:100%;margin-bottom:18px;margin-bottom:var(--gutter)}@media (min-width:40em){.o-grid--of-two>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two>:nth-child(2n+1){margin-left:0}}@media (min-width:40em){.o-grid--of-two-switch>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-switch>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-switch>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-two-late>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-late>:nth-child(2n+1){margin-left:0}}@media (min-width:22.4em){.o-grid--of-two-early>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-early>:nth-child(2n+1){margin-left:0}}@media (min-width:38em) and (max-width:54.9375em){.o-grid--of-three>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-three>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>:nth-child(3n+1){margin-left:0}}@media (min-width:38em) and (max-width:67.9375em){.o-grid--of-three-late>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>:nth-child(2n+1){margin-left:0}}@media (min-width:68em){.o-grid--of-three-late>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>:nth-child(3n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:54.9375em){.o-grid--of-three-early>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-three-early>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>:nth-child(3n+1){margin-left:0}}@media (min-width:38em) and (max-width:59.9375em){.o-grid--of-four>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>:nth-child(2n+1){margin-left:0}}@media (min-width:60em){.o-grid--of-four>*{width:calc(25% - 13.6px);width:calc(25% - 3*var(--gutter)/4 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>:nth-child(4n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:59.9375em){.o-grid--of-four-early>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>:nth-child(2n+1){margin-left:0}}@media (min-width:60em){.o-grid--of-four-early>*{width:calc(25% - 13.6px);width:calc(25% - 3*var(--gutter)/4 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>:nth-child(4n+1){margin-left:0}}@media (max-width:54.9375em){.o-grid--swipeable{left:50%;left:calc(50% + var(--scrollbarWidth)/2.0001);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:var(--gutter);padding-right:var(--gutter);scroll-snap-type:x mandatory;scroll-padding:var(--gutter);-webkit-overflow-scrolling:touch;flex-wrap:nowrap;position:relative;overflow-x:scroll;transform:translate(-50vw)}.o-grid--swipeable>*{max-width:23em;width:calc(85vw - var(--gutter)*2.333);scroll-snap-align:start;scroll-snap-stop:always;flex:none}.o-grid--swipeable>*+*{margin-left:var(--gutter)!important}}@media (min-width:55em){.o-grid--4\/7>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+2){width:57.1429%}.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--8\/4>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--8\/4-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){width:65.7143%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--4\/8>:nth-child(2n+1),.o-grid--4\/7>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2),.o-grid--4\/8-switch>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+1){width:31.4286%}.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){margin-left:2.85714%;margin-right:0}.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+1){max-width:828px}.o-grid[class*=switch]>:nth-child(2n+1){order:1}.o-grid--layout,.o-grid--layout>:nth-last-child(1),.o-grid--layout>:nth-last-child(2){margin-bottom:0}.o-grid--push{justify-content:space-between}.o-grid--pull{justify-content:flex-start}.o-grid--float{display:block}.o-grid--float:not([class*=switch])>:nth-child(2n+1),.o-grid--float[class*=switch]>:nth-child(2n+2){float:left}.o-grid--float:not([class*=switch])>:nth-child(2n+2),.o-grid--float[class*=switch]>:nth-child(2n+1){float:right}}@media (min-width:70em){.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1){width:74.2857%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2){width:22.8571%}}.c-library{min-height:100vh;grid-template-rows:auto 1fr auto;display:grid}.c-library--components{grid-template-rows:auto 1fr}.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:9px;padding:var(--space-2xs);color:#fff;background:#005461;flex-direction:column;align-items:flex-start;font-weight:700}@media only screen and (min-width:650px){.c-library__header{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);flex-direction:row;align-items:center}}@media only screen and (min-width:1000px){.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:18px;padding:var(--space-s)var(--space-s-l)}}.c-library__header img{filter:saturate(0)brightness(10)}.c-library__header .c-library-page-active{position:relative}.c-library__header .c-library-page-active:after{content:"";width:100%;border-bottom:1px solid ;position:absolute;bottom:-6px;left:0}.c-library__hero{color:#fff;background:linear-gradient(#005461,#0000),linear-gradient(45deg,#00a2c2,#005461)}.c-library__body{grid-template-rows:auto auto;display:grid}@media only screen and (min-width:600px){.c-library__body{grid-template-columns:10em 1fr}}@media only screen and (min-width:800px){.c-library__body{grid-template-columns:17em 1fr}}@media only screen and (min-width:600px){.c-library--components .c-library__body>*{height:calc(100vh - var(--headerHeight) - 1px);overflow-y:auto}}.c-library__sidebar{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);scroll-behavior:none;border-right:1px solid #ebf1f2;grid-row:-1}@media only screen and (min-width:600px){.c-library__sidebar{grid-row:auto}}@media only screen and (min-width:800px){.c-library__sidebar{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1)}}.c-library__sidebar>*{padding:18px;padding:var(--space-s-l)var(--space-s)var(--space-s-l)var(--space-s-l)}.c-library__sidebar li{position:relative}.c-library__sidebar li a{color:#006daf}.c-library__sidebar li a:hover{color:#006daf;text-decoration:underline}.c-library__sidebar li+li{margin-top:13.5px;margin-top:var(--space-xs)}.c-library__sidebar ul ul{padding:13.5px;padding:var(--space-xs);padding-bottom:0}.c-library__sidebar ul ul li+li{margin-top:9px;margin-top:var(--space-2xs)}.c-library__skip-link{padding:13.5px;padding:var(--space-xs)}@media only screen and (min-width:600px){.c-library__skip-link{display:none}}.c-library__logo{max-width:15%;min-width:100px;justify-content:center;align-items:center;display:flex}@media only screen and (min-width:650px){.c-library__logo{justify-content:flex-start}}.c-library__logo-name{padding-left:13.5px;padding-left:var(--space-xs-s);margin-left:13.5px;margin-left:var(--space-xs-s);white-space:nowrap;border-left:1px solid #3d7b87}.c-library__logo-name span{display:block}.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){text-transform:uppercase;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);letter-spacing:.08em;color:#bfd3d6}.c-library__logo-name span:nth-last-child(2){color:#fff;letter-spacing:-.03em;font-size:37.32px;font-size:var(--step-4)}.has-js .c-library__sidebar ul>li>ul{display:none}.has-js .c-library__sidebar ul>.c-library-accordion-open>ul{display:block}.c-library .c-library-accordion-open>.c-library-accordion__toggle{transform:rotate(180deg)}.c-library .c-library-accordion__toggle{color:#006daf;justify-content:center;align-items:center;padding:.25rem;font-size:1rem;line-height:1;display:flex;position:absolute;top:0;right:0}.c-library-menu-active{font-weight:700;position:relative}.c-library-menu-active:before{content:"▸ ";position:absolute;top:0;left:-17px}.c-library-stretch{flex-direction:column;flex:1;display:flex}.c-library__main{overflow-y:auto}@media only screen and (min-width:600px){.c-library__main{overflow-y:scroll}}.c-library__frame{width:100%;position:relative}.c-library__frame-links{right:0;top:calc(-1*(var(--space-m) + var(--space-s)));z-index:1;position:absolute}.c-library__frame-links a,.c-library__frame-links button{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595;background:#bfd3d6;border-radius:0 0 .25em .25em;padding:.25em .666em}.c-library__frame-background{border-radius:0 0 0 .25em;top:0}.c-library__frame iframe{--negative-padding:calc( var(--space-m)*-1 );height:100%;width:100%;width:calc(100% - var(--negative-padding)*2);left:var(--negative-padding);top:var(--negative-padding);resize:both;transition:padding .3s cubic-bezier(.22,.61,.36,1),background-color .3s cubic-bezier(.22,.61,.36,1)}@media only screen and (min-width:600px){.c-library__frame iframe{position:absolute}}.c-library__frame iframe body{border:2px solid red}.c-library-code{font-family:Source Code Pro}.c-library-pre{padding:18px;padding:var(--space-s);background:#ebf1f2;font-family:Source Code Pro;line-height:1.4;overflow-x:auto}.c-library-pre--bordered{border-bottom:1px solid #bfd3d6}.c-library-version{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595}.c-library-status{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595;background:#bfd3d6;border-radius:.25em;padding:.25em .666em}.c-library-status--ready{color:#fff;background:#13aa13}.c-library-status--in-production,.c-library-status--development,.c-library-status--placeholder{color:#fff;background:#f2a60d}.c-library-status--deprecated{color:#fff;background:#ce0058}.c-library__swatch-grid{margin-bottom:var(--space-m);grid-auto-rows:minmax(4em,auto);gap:0 1em;display:grid}@media only screen and (min-width:680px){.c-library__swatch-grid{grid-template-rows:5em auto;grid-template-columns:repeat(5,auto);gap:0}}.c-library__swatch-grid--has-labels{grid-auto-flow:row}@media only screen and (min-width:40em){.c-library__swatch-grid--has-labels{grid-template-rows:auto;grid-template-columns:minmax(15%,15em) auto}}@media only screen and (min-width:1000px){.c-library__swatch-grid--has-labels{grid-template-rows:5em auto;grid-template-columns:repeat(5,1fr);grid-auto-flow:column}}.c-library__swatches,.c-library__swatch-labels{grid-template-columns:repeat(auto-fit,165px);display:grid}.c-library__swatch{display:flex}.c-library__swatch>*{justify-content:center;margin:auto;font-weight:700}.c-library__swatches>*{height:0;padding-bottom:50%;position:relative}.c-library__swatches>*>*{text-align:center;height:100%;width:100%;justify-content:center;align-items:center;padding:.5rem;font-weight:700;display:flex;position:absolute;top:0;left:0}.c-library__swatch-grid table{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__swatch-grid table td,.c-library__swatch-grid table th{padding:9px 0 9px 4.5px;padding:var(--space-2xs)0 var(--space-2xs)var(--space-3xs)}.c-library__swatch-grid table th{width:3em}.c-library__swatch-grid table td{font-family:monospace}.c-library__image-row{max-width:100%;display:flex}.c-library__image-row img{object-fit:contain;width:6%;flex:auto;margin:0 2% 0 0}.c-library__image-row img:last-child{margin-right:0}.c-library__space{display:block}.c-library__space span{height:0;background:linear-gradient(45deg,#fff3 0%,#fff0 100%),#ce005880;padding-bottom:100%;display:block;position:relative}.c-library__space code{margin-left:18px;margin-left:var(--space-s);white-space:nowrap;line-height:1;position:absolute;top:50%;left:100%;transform:translateY(-50%)}.c-library-grid{color:#fff;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);background:#00758c;justify-content:center;align-items:center;padding:3rem 1rem;display:flex}.c-library-grid--alt{background:#3d7b87;padding:2rem 1rem}.c-library-grid--alt:before{content:" ";display:block}.c-library-grid--first{background:#005461;padding:2rem 1rem}.c-library-grid--first:before{content:"First on mobile"}.c-library-copy{position:relative}.c-library-copy__trigger{letter-spacing:-.01em;font-size:15px;font-weight:700;font-size:var(--step--1);padding:4.5px 9px;padding:var(--space-3xs)var(--space-2xs);letter-spacing:.02em;background:#bfd3d6;position:absolute;bottom:0;right:0}.c-library-copy__trigger:hover{color:#ce0058}.c-library__typo__sidebar{width:14.2857%}.c-library__typo__sidebar span{display:block}.c-library__typo__sidebar .x2{height:2em;border:1px solid #333;border-width:1px 0;margin-top:4.25em;line-height:2em}.c-library__typo__main{width:82.8572%}.c-library__semi{font-weight:600}.c-library__photo-grid{margin-top:54px;margin-top:var(--space-xl);grid-template-columns:1fr;gap:2px;display:grid}@media only screen and (min-width:880px){.c-library__photo-grid{grid-auto-flow:dense;grid-auto-rows:auto}.c-library__photo-grid img{height:100%;width:100%;object-fit:cover}.c-library__photo-grid div{grid-area:1/1/2/3;display:flex}.c-library__photo-grid div h2{margin:auto var(--space-s)}.c-library__photo-grid.grid-1{grid-template-columns:40% 20% 40%;grid-template-rows:var(--space-2xl)400px 400px}.c-library__photo-grid.grid-1 img:nth-child(2){grid-area:2/1/3/3}.c-library__photo-grid.grid-1 img:nth-child(3){grid-area:1/3/3/4}.c-library__photo-grid.grid-1 img:nth-child(5){grid-column:2/4}.c-library__photo-grid.grid-2{grid-template-columns:50% 50%;grid-template-rows:var(--space-2xl)300px 300px}.c-library__photo-grid.grid-2 div{grid-column:1/2}.c-library__photo-grid.grid-2 img:nth-child(2){grid-row:2/4}.c-library__photo-grid.grid-2 img:nth-child(3){grid-row:1/3}}.c-library__illustration-grid{gap:var(--gutter);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}.c-library__illustration-grid :nth-child(2n+1):nth-last-child(5){grid-column:1/-1}.c-library .c-alert ul li{margin-left:1em;padding-left:.5rem;list-style:outside url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"8\" height=\"20\" viewBox=\"0 0 10 20\"><circle cx=\"5\" cy=\"14\" r=\"3.5\" fill=\"%2313AA13\" fill-rule=\"evenodd\"/></svg>")}.c-library .c-alert ul li h3,.c-library .c-alert ul li h4{color:#13aa13;font-size:1em;line-height:1.6}@media only screen and (max-width:1050px){.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__logo-name span:nth-last-child(2){letter-spacing:-.02em;font-size:21.6px;font-size:var(--step-1)}.c-library__header nav li:last-child{display:none}}@media only screen and (min-width:650px) and (max-width:700px),screen and (max-width:450px){.c-library__header nav .u-row{gap:9px;gap:var(--space-2xs);letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}}@media only screen and (max-width:650px){.c-library__header nav a{padding:9px 0;padding:var(--space-2xs)0;display:block}.c-library__header .c-library-page-active:after{bottom:4.5px;bottom:var(--space-3xs)}}
1
+ @import "https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap";.u-breakout{left:50%;left:calc(50% + var(--scrollbarWidth)/2.0001);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:safe-space(0);padding-right:safe-space(0);position:relative;transform:translate(-50vw)}.u-cutoff{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--gutter)),calc(100% - var(--gutter))100%,0 100%)}.u-cutoff--top-right{clip-path:polygon(0 0,calc(100% - var(--gutter))0,100% var(--gutter),100% 100%,0 100%)}.u-cutoff--top-left{clip-path:polygon(0 var(--gutter),var(--gutter)0,100% 0,100% 100%,0 100%)}.u-cutoff--bottom-left{clip-path:polygon(0 0,100% 0,100% 100%,var(--gutter)100%,0 calc(100% - var(--gutter)))}.u-cutoff--xl{clip-path:polygon(0 0,100% 0,100% calc(100% - var(--space-xl)),calc(100% - var(--space-xl))100%,0 100%)}:root{--fluid-min-width:320;--fluid-max-width:1332;--fluid-screen:100vw;--fluid-bp:calc( (var(--fluid-screen) - var(--fluid-min-width)/16*1rem)/(var(--fluid-max-width) - var(--fluid-min-width)))}@media screen and (min-width:1332px){:root{--fluid-screen:calc(var(--fluid-max-width)*1px)}}:root{--f--2-min:12.64;--f--2-max:12.5;--step--2:calc( ((var(--f--2-min)/16)*1rem) + (var(--f--2-max) - var(--f--2-min))*var(--fluid-bp));--f--1-min:14.22;--f--1-max:15;--step--1:calc( ((var(--f--1-min)/16)*1rem) + (var(--f--1-max) - var(--f--1-min))*var(--fluid-bp));--f-0-min:16;--f-0-max:18;--step-0:calc( ((var(--f-0-min)/16)*1rem) + (var(--f-0-max) - var(--f-0-min))*var(--fluid-bp));--f-1-min:18;--f-1-max:21.6;--step-1:calc( ((var(--f-1-min)/16)*1rem) + (var(--f-1-max) - var(--f-1-min))*var(--fluid-bp));--f-2-min:20.25;--f-2-max:25.92;--step-2:calc( ((var(--f-2-min)/16)*1rem) + (var(--f-2-max) - var(--f-2-min))*var(--fluid-bp));--f-3-min:22.78;--f-3-max:31.1;--step-3:calc( ((var(--f-3-min)/16)*1rem) + (var(--f-3-max) - var(--f-3-min))*var(--fluid-bp));--f-4-min:25.63;--f-4-max:37.32;--step-4:calc( ((var(--f-4-min)/16)*1rem) + (var(--f-4-max) - var(--f-4-min))*var(--fluid-bp));--f-5-min:28.83;--f-5-max:44.79;--step-5:calc( ((var(--f-5-min)/16)*1rem) + (var(--f-5-max) - var(--f-5-min))*var(--fluid-bp));--f-6-min:32.44;--f-6-max:53.75;--step-6:calc( ((var(--f-6-min)/16)*1rem) + (var(--f-6-max) - var(--f-6-min))*var(--fluid-bp));--f-7-min:36.49;--f-7-max:64.5;--step-7:calc( ((var(--f-7-min)/16)*1rem) + (var(--f-7-max) - var(--f-7-min))*var(--fluid-bp));--f-8-min:41.05;--f-8-max:77.4;--step-8:calc( ((var(--f-8-min)/16)*1rem) + (var(--f-8-max) - var(--f-8-min))*var(--fluid-bp));--f-9-min:46.18;--f-9-max:92.88;--step-9:calc( ((var(--f-9-min)/16)*1rem) + (var(--f-9-max) - var(--f-9-min))*var(--fluid-bp));--f-10-min:51.96;--f-10-max:111.45;--step-10:calc( ((var(--f-10-min)/16)*1rem) + (var(--f-10-max) - var(--f-10-min))*var(--fluid-bp))}@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(../Inter-Regular.ed77b881.woff2)format("woff2"),url(../Inter-Regular.ca6858d7.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(../Inter-SemiBold.dd034768.woff2)format("woff2"),url(../Inter-SemiBold.cc1168df.woff)format("woff")}@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url(../Inter-Bold.af5441a3.woff2)format("woff2"),url(../Inter-Bold.419e8c71.woff)format("woff")}:root{--max-screen:83.25;--fc-screen:100vw;--fc-bp:calc((var(--fc-screen) - 20em)/(var(--max-screen) - 20));--fc-base:18;--fc-3xs:4.5;--space-3xs:calc(var(--fc-3xs)/16*1rem);--fc-2xs:9;--space-2xs:calc(var(--fc-2xs)/16*1rem);--fc-xs:13.5;--space-xs:calc(var(--fc-xs)/16*1rem);--fc-s:18;--space-s:calc(var(--fc-s)/16*1rem);--fc-m:27;--space-m:calc(var(--fc-m)/16*1rem);--fc-l:36;--space-l:calc(var(--fc-l)/16*1rem);--fc-xl:54;--space-xl:calc(var(--fc-xl)/16*1rem);--fc-2xl:72;--space-2xl:calc(var(--fc-2xl)/16*1rem);--fc-3xl:108;--space-3xl:calc(var(--fc-3xl)/16*1rem);--fc-4xl:144;--space-4xl:calc(var(--fc-4xl)/16*1rem);--space--3xs:calc( ((var(--fc-)/16)*1rem) + (var(--fc-3xs) - var(--fc-))*var(--fluid-bp));--space-3xs-2xs:calc( ((var(--fc-3xs)/16)*1rem) + (var(--fc-2xs) - var(--fc-3xs))*var(--fluid-bp));--space-2xs-xs:calc( ((var(--fc-2xs)/16)*1rem) + (var(--fc-xs) - var(--fc-2xs))*var(--fluid-bp));--space-xs-s:calc( ((var(--fc-xs)/16)*1rem) + (var(--fc-s) - var(--fc-xs))*var(--fluid-bp));--space-s-m:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-m) - var(--fc-s))*var(--fluid-bp));--space-m-l:calc( ((var(--fc-m)/16)*1rem) + (var(--fc-l) - var(--fc-m))*var(--fluid-bp));--space-l-xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-xl) - var(--fc-l))*var(--fluid-bp));--space-xl-2xl:calc( ((var(--fc-xl)/16)*1rem) + (var(--fc-2xl) - var(--fc-xl))*var(--fluid-bp));--space-2xl-3xl:calc( ((var(--fc-2xl)/16)*1rem) + (var(--fc-3xl) - var(--fc-2xl))*var(--fluid-bp));--space-3xl-4xl:calc( ((var(--fc-3xl)/16)*1rem) + (var(--fc-4xl) - var(--fc-3xl))*var(--fluid-bp));--space-s-l:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-l) - var(--fc-s))*var(--fluid-bp));--space-s-m:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-m) - var(--fc-s))*var(--fluid-bp));--space-xs-l:calc( ((var(--fc-xs)/16)*1rem) + (var(--fc-l) - var(--fc-xs))*var(--fluid-bp));--space-m-xl:calc( ((var(--fc-m)/16)*1rem) + (var(--fc-xl) - var(--fc-m))*var(--fluid-bp));--space-l-2xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-2xl) - var(--fc-l))*var(--fluid-bp));--space-s-xl:calc( ((var(--fc-s)/16)*1rem) + (var(--fc-xl) - var(--fc-s))*var(--fluid-bp));--space-l-3xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-3xl) - var(--fc-l))*var(--fluid-bp));--space-xl-3xl:calc( ((var(--fc-xl)/16)*1rem) + (var(--fc-3xl) - var(--fc-xl))*var(--fluid-bp));--space-l-4xl:calc( ((var(--fc-l)/16)*1rem) + (var(--fc-4xl) - var(--fc-l))*var(--fluid-bp));--space-3xs-m:calc( ((var(--fc-3xs)/16)*1rem) + (var(--fc-m) - var(--fc-3xs))*var(--fluid-bp));--gutter:var(--space-s-l)}@media screen and (min-width:75em){:root{--fc-screen:calc(var(--max-screen)*1rem)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(360deg)}}*,:before,:after{box-sizing:border-box}body{min-height:100vh;flex-direction:column;justify-content:flex-start;align-items:stretch;margin:0;display:flex}html{scroll-behavior:smooth}blockquote,pre,ol,ul,figure{margin:0;padding:0}img{max-width:100%;height:auto;border:0;display:block}article,aside,figure,footer,header,aside,main,nav{display:block}iframe{border:0}body{letter-spacing:-.01em;font:400 18px/1.2 Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:var(--step-0);color:#333}h1,h2,h3,h4,h5,h6,p,ul,ol,dl{margin:0}ul,ol,p{line-height:1.2}a{text-decoration:none}a,a:hover{cursor:pointer;color:inherit}.mp ol,.mp ul{list-style:none}cite,address{font-style:normal}[type=submit],[type=button],button{box-shadow:none;appearance:none;cursor:pointer;color:inherit;font:inherit;background:0 0;border:0;border-radius:0;padding:0}label{cursor:pointer}fieldset{border:0;padding:.01em 0 0}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}code[class*=language-],pre[class*=language-]{text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;color:#3d7b87;tab-size:4;-webkit-hyphens:none;hyphens:none;background:#ebf1f2;font-family:Source Code Pro,monospace;font-size:1rem;line-height:1.5em}.c-alert code[class*=language-],.c-alert pre[class*=language-]{background:0 0}code[class*=language-]::selection,pre[class*=language-]::selection,code[class*=language-] ::selection,pre[class*=language-] ::selection{color:#263238;background:#cceae7}:not(pre)>code[class*=language-]{white-space:normal;border-radius:.2em;padding:.1em}pre[class*=language-]{padding:18px;padding:var(--space-s);position:relative;overflow:auto}.language-css>code,.language-sass>code,.language-scss>code{color:#f2a60d}[class*=language-] .namespace{opacity:.7}.token.atrule{color:#3d7b87}.token.attr-name{color:#00a2c2}.token.attr-value,.token.attribute{color:#13aa13}.token.boolean{color:#ce0058}.token.builtin,.token.cdata,.token.char,.token.class{color:#00a2c2}.token.class-name{color:#6182b8}.token.comment{color:#aabfc9}.token.constant{color:#3d7b87}.token.deleted{color:#ce0058}.token.doctype{color:#aabfc9}.token.entity{color:#ce0058}.token.function{color:#3d7b87}.token.hexcode{color:#f2a60d}.token.id,.token.important{color:#3d7b87;font-weight:700}.token.inserted{color:#00a2c2}.token.keyword{color:#3d7b87}.token.number{color:#f2a60d}.token.operator{color:#00a2c2}.token.prolog{color:#aabfc9}.token.property{color:#00a2c2}.token.pseudo-class,.token.pseudo-element{color:#13aa13}.token.punctuation,.token.regex{color:#00a2c2}.token.selector{color:#ce0058}.token.string{color:#13aa13}.token.symbol{color:#3d7b87}.token.tag{color:#005461}.token.unit{color:#f2a60d}.token.url,.token.variable{color:#ce0058}.u-hr,.c-library hr,.o-prose hr{padding-bottom:27px;padding-bottom:var(--space-m-xl);margin:0 0 27px;margin-bottom:var(--space-m-xl);border:0;border-bottom:1px solid #bfd3d6}.u-border-top{border-top:1px solid #bfd3d6}.u-border-bottom{border-bottom:1px solid #bfd3d6}.u-border{border:1px solid #bfd3d6}.o-grid{margin-bottom:-18px;margin-bottom:calc(-1*var(--gutter));width:100%;flex-wrap:wrap;justify-content:stretch;display:flex}.o-grid--float:after{content:" ";clear:both;display:table}.o-grid--between{justify-content:space-between}.o-grid--no-height-match{align-items:start}.o-grid>*{width:100%;margin-bottom:18px;margin-bottom:var(--gutter)}@media (min-width:40em){.o-grid--of-two>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two>:nth-child(2n+1){margin-left:0}}.o-grid--of-two-switch>*{gap:var(--space-s);margin-bottom:0}@media (min-width:40em){.o-grid--of-two-switch>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-switch>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-switch>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-two-late>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-late>:nth-child(2n+1){margin-left:0}}@media (min-width:22.4em){.o-grid--of-two-early>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-two-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-two-early>:nth-child(2n+1){margin-left:0}}@media (min-width:38em) and (max-width:54.9375em){.o-grid--of-three>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-three>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three>:nth-child(3n+1){margin-left:0}}@media (min-width:38em) and (max-width:67.9375em){.o-grid--of-three-late>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>:nth-child(2n+1){margin-left:0}}@media (min-width:68em){.o-grid--of-three-late>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three-late>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-late>:nth-child(3n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:54.9375em){.o-grid--of-three-early>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>:nth-child(2n+1){margin-left:0}}@media (min-width:55em){.o-grid--of-three-early>*{width:calc(33.3333% - 12.1px);width:calc(33.3333% - 2*var(--gutter)/3 - .1px)}.o-grid--of-three-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-three-early>:nth-child(3n+1){margin-left:0}}@media (min-width:38em) and (max-width:59.9375em){.o-grid--of-four>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>:nth-child(2n+1){margin-left:0}}@media (min-width:60em){.o-grid--of-four>*{width:calc(25% - 13.6px);width:calc(25% - 3*var(--gutter)/4 - .1px)}.o-grid--of-four>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four>:nth-child(4n+1){margin-left:0}}@media (min-width:22.4em) and (max-width:59.9375em){.o-grid--of-four-early>*{width:calc(50% - 9.1px);width:calc(50% - 1*var(--gutter)/2 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>:nth-child(2n+1){margin-left:0}}@media (min-width:60em){.o-grid--of-four-early>*{width:calc(25% - 13.6px);width:calc(25% - 3*var(--gutter)/4 - .1px)}.o-grid--of-four-early>*+*{margin-left:18px;margin-left:var(--gutter)}.o-grid--of-four-early>:nth-child(4n+1){margin-left:0}}@media (max-width:54.9375em){.o-grid--swipeable{left:50%;left:calc(50% + var(--scrollbarWidth)/2.0001);width:100vw;width:calc(100vw - var(--scrollbarWidth));padding-left:var(--gutter);padding-right:var(--gutter);scroll-snap-type:x mandatory;scroll-padding:var(--gutter);-webkit-overflow-scrolling:touch;flex-wrap:nowrap;position:relative;overflow-x:scroll;transform:translate(-50vw)}.o-grid--swipeable>*{max-width:23em;width:calc(85vw - var(--gutter)*2.333);scroll-snap-align:start;scroll-snap-stop:always;flex:none}.o-grid--swipeable>*+*{margin-left:var(--gutter)!important}}@media (min-width:55em){.o-grid--4\/7>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+2){width:57.1429%}.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--8\/4>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--8\/4-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){width:65.7143%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--4\/8>:nth-child(2n+1),.o-grid--4\/7>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2),.o-grid--4\/8-switch>:nth-child(2n+2),.o-grid--4\/7-switch>:nth-child(2n+1){width:31.4286%}.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--4\/8>:nth-child(2n+2),.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--8\/4>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--8\/4-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1),.o-grid--4\/8-switch>:nth-child(2n+1){margin-left:2.85714%;margin-right:0}.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+1){max-width:828px}.o-grid[class*=switch]>:nth-child(2n+1){order:1}.o-grid--layout,.o-grid--layout>:nth-last-child(1),.o-grid--layout>:nth-last-child(2){margin-bottom:0}.o-grid--push{justify-content:space-between}.o-grid--pull{justify-content:flex-start}.o-grid--float{display:block}.o-grid--float:not([class*=switch])>:nth-child(2n+1),.o-grid--float[class*=switch]>:nth-child(2n+2){float:left}.o-grid--float:not([class*=switch])>:nth-child(2n+2),.o-grid--float[class*=switch]>:nth-child(2n+1){float:right}}@media (min-width:70em){.o-grid--9\/3>:nth-child(2n+1),.o-grid--8\/3>:nth-child(2n+1),.o-grid--3\/9>:nth-child(2n+2),.o-grid--3\/8>:nth-child(2n+2),.o-grid--9\/3-switch>:nth-child(2n+2),.o-grid--8\/3-switch>:nth-child(2n+2),.o-grid--3\/9-switch>:nth-child(2n+1),.o-grid--3\/8-switch>:nth-child(2n+1){width:74.2857%}.o-grid--9\/3>:nth-child(2n+2),.o-grid--8\/3>:nth-child(2n+2),.o-grid--3\/9>:nth-child(2n+1),.o-grid--3\/8>:nth-child(2n+1),.o-grid--9\/3-switch>:nth-child(2n+1),.o-grid--8\/3-switch>:nth-child(2n+1),.o-grid--3\/9-switch>:nth-child(2n+2),.o-grid--3\/8-switch>:nth-child(2n+2){width:22.8571%}}.c-library{min-height:100vh;grid-template-rows:auto 1fr auto;display:grid}.c-library--components{grid-template-rows:auto 1fr}.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:9px;padding:var(--space-2xs);color:#fff;background:#005461;flex-direction:column;align-items:flex-start;font-weight:700}@media only screen and (min-width:650px){.c-library__header{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);flex-direction:row;align-items:center}}@media only screen and (min-width:1000px){.c-library__header{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);padding:18px;padding:var(--space-s)var(--space-s-l)}}.c-library__header img{filter:saturate(0)brightness(10)}.c-library__header .c-library-page-active{position:relative}.c-library__header .c-library-page-active:after{content:"";width:100%;border-bottom:1px solid ;position:absolute;bottom:-6px;left:0}.c-library__hero{color:#fff;background:linear-gradient(#005461,#0000),linear-gradient(45deg,#00a2c2,#005461)}.c-library__body{grid-template-rows:auto auto;display:grid}@media only screen and (min-width:600px){.c-library__body{grid-template-columns:10em 1fr}}@media only screen and (min-width:800px){.c-library__body{grid-template-columns:17em 1fr}}@media only screen and (min-width:600px){.c-library--components .c-library__body>*{height:calc(100vh - var(--headerHeight) - 1px);overflow-y:auto}}.c-library__sidebar{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2);scroll-behavior:none;border-right:1px solid #ebf1f2;grid-row:-1}@media only screen and (min-width:600px){.c-library__sidebar{grid-row:auto}}@media only screen and (min-width:800px){.c-library__sidebar{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1)}}.c-library__sidebar>*{padding:18px;padding:var(--space-s-l)var(--space-s)var(--space-s-l)var(--space-s-l)}.c-library__sidebar li{position:relative}.c-library__sidebar li a{color:#006daf}.c-library__sidebar li a:hover{color:#006daf;text-decoration:underline}.c-library__sidebar li+li{margin-top:13.5px;margin-top:var(--space-xs)}.c-library__sidebar ul ul{padding:13.5px;padding:var(--space-xs);padding-bottom:0}.c-library__sidebar ul ul li+li{margin-top:9px;margin-top:var(--space-2xs)}.c-library__skip-link{padding:13.5px;padding:var(--space-xs)}@media only screen and (min-width:600px){.c-library__skip-link{display:none}}.c-library__logo{max-width:15%;min-width:100px;justify-content:center;align-items:center;display:flex}@media only screen and (min-width:650px){.c-library__logo{justify-content:flex-start}}.c-library__logo-name{padding-left:13.5px;padding-left:var(--space-xs-s);margin-left:13.5px;margin-left:var(--space-xs-s);white-space:nowrap;border-left:1px solid #3d7b87}.c-library__logo-name span{display:block}.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){text-transform:uppercase;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);letter-spacing:.08em;color:#bfd3d6}.c-library__logo-name span:nth-last-child(2){color:#fff;letter-spacing:-.03em;font-size:37.32px;font-size:var(--step-4)}.has-js .c-library__sidebar ul>li>ul{display:none}.has-js .c-library__sidebar ul>.c-library-accordion-open>ul{display:block}.c-library .c-library-accordion-open>.c-library-accordion__toggle{transform:rotate(180deg)}.c-library .c-library-accordion__toggle{color:#006daf;justify-content:center;align-items:center;padding:.25rem;font-size:1rem;line-height:1;display:flex;position:absolute;top:0;right:0}.c-library-menu-active{font-weight:700;position:relative}.c-library-menu-active:before{content:"▸ ";position:absolute;top:0;left:-17px}.c-library-stretch{flex-direction:column;flex:1;display:flex}.c-library__main{overflow-y:auto}@media only screen and (min-width:600px){.c-library__main{overflow-y:scroll}}.c-library__frame{width:100%;position:relative}.c-library__frame-links{right:0;top:calc(-1*(var(--space-m) + var(--space-s)));z-index:1;position:absolute}.c-library__frame-links a,.c-library__frame-links button{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595;background:#bfd3d6;border-radius:0 0 .25em .25em;padding:.25em .666em}.c-library__frame-background{border-radius:0 0 0 .25em;top:0}.c-library__frame iframe{--negative-padding:calc( var(--space-m)*-1 );height:100%;width:100%;width:calc(100% - var(--negative-padding)*2);left:var(--negative-padding);top:var(--negative-padding);resize:both;transition:padding .3s cubic-bezier(.22,.61,.36,1),background-color .3s cubic-bezier(.22,.61,.36,1)}@media only screen and (min-width:600px){.c-library__frame iframe{position:absolute}}.c-library__frame iframe body{border:2px solid red}.c-library-code{font-family:Source Code Pro}.c-library-pre{padding:18px;padding:var(--space-s);background:#ebf1f2;font-family:Source Code Pro;line-height:1.4;overflow-x:auto}.c-library-pre--bordered{border-bottom:1px solid #bfd3d6}.c-library-version{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595}.c-library-status{letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);color:#959595;background:#bfd3d6;border-radius:.25em;padding:.25em .666em}.c-library-status--ready{color:#fff;background:#13aa13}.c-library-status--in-production,.c-library-status--development,.c-library-status--placeholder{color:#fff;background:#f2a60d}.c-library-status--deprecated{color:#fff;background:#ce0058}.c-library__swatch-grid{margin-bottom:var(--space-m);grid-auto-rows:minmax(4em,auto);gap:0 1em;display:grid}@media only screen and (min-width:680px){.c-library__swatch-grid{grid-template-rows:5em auto;grid-template-columns:repeat(5,auto);gap:0}}.c-library__swatch-grid--has-labels{grid-auto-flow:row}@media only screen and (min-width:40em){.c-library__swatch-grid--has-labels{grid-template-rows:auto;grid-template-columns:minmax(15%,15em) auto}}@media only screen and (min-width:1000px){.c-library__swatch-grid--has-labels{grid-template-rows:5em auto;grid-template-columns:repeat(5,1fr);grid-auto-flow:column}}.c-library__swatches,.c-library__swatch-labels{grid-template-columns:repeat(auto-fit,165px);display:grid}.c-library__swatch{display:flex}.c-library__swatch>*{justify-content:center;margin:auto;font-weight:700}.c-library__swatches>*{height:0;padding-bottom:50%;position:relative}.c-library__swatches>*>*{text-align:center;height:100%;width:100%;justify-content:center;align-items:center;padding:.5rem;font-weight:700;display:flex;position:absolute;top:0;left:0}.c-library__swatch-grid table{letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__swatch-grid table td,.c-library__swatch-grid table th{padding:9px 0 9px 4.5px;padding:var(--space-2xs)0 var(--space-2xs)var(--space-3xs)}.c-library__swatch-grid table th{width:3em}.c-library__swatch-grid table td{font-family:monospace}.c-library__image-row{max-width:100%;display:flex}.c-library__image-row img{object-fit:contain;width:6%;flex:auto;margin:0 2% 0 0}.c-library__image-row img:last-child{margin-right:0}.c-library__space{display:block}.c-library__space span{height:0;background:linear-gradient(45deg,#fff3 0%,#fff0 100%),#ce005880;padding-bottom:100%;display:block;position:relative}.c-library__space code{margin-left:18px;margin-left:var(--space-s);white-space:nowrap;line-height:1;position:absolute;top:50%;left:100%;transform:translateY(-50%)}.c-library-grid{color:#fff;letter-spacing:-.01em;font-size:15px;font-size:var(--step--1);background:#00758c;justify-content:center;align-items:center;padding:3rem 1rem;display:flex}.c-library-grid--alt{background:#3d7b87;padding:2rem 1rem}.c-library-grid--alt:before{content:" ";display:block}.c-library-grid--first{background:#005461;padding:2rem 1rem}.c-library-grid--first:before{content:"First on mobile"}.c-library-copy{position:relative}.c-library-copy__trigger{letter-spacing:-.01em;font-size:15px;font-weight:700;font-size:var(--step--1);padding:4.5px 9px;padding:var(--space-3xs)var(--space-2xs);letter-spacing:.02em;background:#bfd3d6;position:absolute;bottom:0;right:0}.c-library-copy__trigger:hover{color:#ce0058}.c-library__typo__sidebar{width:14.2857%}.c-library__typo__sidebar span{display:block}.c-library__typo__sidebar .x2{height:2em;border:1px solid #333;border-width:1px 0;margin-top:4.25em;line-height:2em}.c-library__typo__main{width:82.8572%}.c-library__semi{font-weight:600}.c-library__photo-grid{margin-top:54px;margin-top:var(--space-xl);grid-template-columns:1fr;gap:2px;display:grid}@media only screen and (min-width:880px){.c-library__photo-grid{grid-auto-flow:dense;grid-auto-rows:auto}.c-library__photo-grid img{height:100%;width:100%;object-fit:cover}.c-library__photo-grid div{grid-area:1/1/2/3;display:flex}.c-library__photo-grid div h2{margin:auto var(--space-s)}.c-library__photo-grid.grid-1{grid-template-columns:40% 20% 40%;grid-template-rows:var(--space-2xl)400px 400px}.c-library__photo-grid.grid-1 img:nth-child(2){grid-area:2/1/3/3}.c-library__photo-grid.grid-1 img:nth-child(3){grid-area:1/3/3/4}.c-library__photo-grid.grid-1 img:nth-child(5){grid-column:2/4}.c-library__photo-grid.grid-2{grid-template-columns:50% 50%;grid-template-rows:var(--space-2xl)300px 300px}.c-library__photo-grid.grid-2 div{grid-column:1/2}.c-library__photo-grid.grid-2 img:nth-child(2){grid-row:2/4}.c-library__photo-grid.grid-2 img:nth-child(3){grid-row:1/3}}.c-library__illustration-grid{gap:var(--gutter);grid-template-columns:repeat(auto-fill,minmax(260px,1fr));display:grid}.c-library__illustration-grid :nth-child(2n+1):nth-last-child(5){grid-column:1/-1}.c-library .c-alert ul li{margin-left:1em;padding-left:.5rem;list-style:outside url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"8\" height=\"20\" viewBox=\"0 0 10 20\"><circle cx=\"5\" cy=\"14\" r=\"3.5\" fill=\"%2313AA13\" fill-rule=\"evenodd\"/></svg>")}.c-library .c-alert ul li h3,.c-library .c-alert ul li h4{color:#13aa13;font-size:1em;line-height:1.6}@media only screen and (max-width:1050px){.c-library__logo-name span:nth-last-child(3),.c-library__logo-name span:nth-last-child(1){letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}.c-library__logo-name span:nth-last-child(2){letter-spacing:-.02em;font-size:21.6px;font-size:var(--step-1)}.c-library__header nav li:last-child{display:none}}@media only screen and (min-width:650px) and (max-width:700px),screen and (max-width:450px){.c-library__header nav .u-row{gap:9px;gap:var(--space-2xs);letter-spacing:-.01em;font-size:12.5px;font-size:var(--step--2)}}@media only screen and (max-width:650px){.c-library__header nav a{padding:9px 0;padding:var(--space-2xs)0;display:block}.c-library__header .c-library-page-active:after{bottom:4.5px;bottom:var(--space-3xs)}}
2
2
  /*# sourceMappingURL=library.css.map */