{"version":3,"file":"static/js/3508.0ec18296.chunk.js","mappings":"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","sources":["helpers/accessibilityHelper.js","shared/practical-faq-container/practical-faq-element.jsx","shared/practical-faq-container/practical-faq-container.jsx"],"sourcesContent":["export function accessibilityEnterCheck(e, cb) {\n if (e.key === \" \" || e.key === \"32\" || e.key === \"Enter\" || e.key === \"13\" || e.type === \"click\" || e.type === \"change\") {\n cb()\n }\n}\n","import React, { useRef, useState } from \"react\"\nimport ReactHtmlParser from \"react-html-parser\"\nimport { accessibilityEnterCheck } from \"../../helpers/accessibilityHelper\"\n\nfunction PracticalFaqElement(props) {\n const accordionRef = useRef(null)\n\n const [isAccordionOpen, setIsAccordionOpen] = useState(false)\n\n const handleAccordion = (event, classname) => {\n let elem = event.currentTarget\n\n let node = event\n if (elem) {\n showHideContent(elem, classname)\n return\n }\n\n if (node) {\n showHideContent(node, classname)\n return\n }\n }\n\n const handleEnterKeyPress = (event, className) => {\n accessibilityEnterCheck(event, () => {\n const targetElement = event.target.childNodes[0]\n handleAccordion(targetElement, className)\n })\n }\n\n const showHideContent = (elem, classname) => {\n elem.__toggle = !elem.__toggle\n let target = elem.parentElement.querySelector(classname)\n if (elem.__toggle) {\n target.style.height = target.scrollHeight + \"px\"\n elem.classList.add(\"is-active\")\n setIsAccordionOpen(true)\n } else {\n target.style.height = 0 + \"px\"\n elem.classList.remove(\"is-active\")\n setIsAccordionOpen(false)\n }\n }\n\n const question = props.question\n const answer = props.answer\n\n const transform = (node) => {\n if (node.type === \"tag\" && node.name === \"a\") {\n // Set tabindex to -1 if the accordion is closed, otherwise keep it as is\n const tabindexValue = isAccordionOpen ? 0 : -1\n node.attribs.tabindex = tabindexValue\n }\n }\n\n const formattedAnswer = ReactHtmlParser(answer, { transform })\n\n return (\n <div\n tabIndex={0}\n role=\"button\"\n onKeyDown={(e) => handleEnterKeyPress(e, \".contentWrapper\")}\n aria-expanded={isAccordionOpen}\n ref={accordionRef}\n className=\"accordionitem\"\n id={question}\n >\n <h4 data-epi-property=\"Question\" aria-controls={question} className=\"accordion-trigger\" onClick={(e) => handleAccordion(e, \".contentWrapper\")}>\n {question}\n </h4>\n <div className=\"sand-break\">\n <div></div>\n </div>\n <div className=\"contentWrapper show-hide\" role=\"region\" aria-labelledby={question + \"-label\"}>\n <div data-epi-property=\"Answer\" className=\"faq-content\">\n {formattedAnswer}\n </div>\n </div>\n </div>\n )\n}\n\nexport default PracticalFaqElement\n","import React, { useRef, useState } from \"react\"\nimport FaqElement from \"./practical-faq-element\"\nimport \"./practical-faq-container.scss\"\nimport * as SelectionFactoryHelper from \"../helpers/SelectionFactoryHelper\"\n\nfunction PracticalFaqContainer({\n header,\n subHeader,\n faqElements,\n readMoreLabel,\n readLessLabel,\n iconUpload,\n hideIcon,\n backgroundColor,\n bottomPadding,\n topPadding,\n}) {\n const topRef = useRef()\n\n const [showMore, setShowMore] = useState(false)\n const bgColor = SelectionFactoryHelper.getFromSelectionFactory(backgroundColor, false) || undefined\n const tPadding = SelectionFactoryHelper.getFromSelectionFactory(bottomPadding, false) || undefined\n const bPadding = SelectionFactoryHelper.getFromSelectionFactory(topPadding, false) || undefined\n\n const scrollIntoView = () => {\n let element = topRef.current\n\n const siteHeader = document.getElementsByClassName(\"site-header\")[0]\n const headerOffset = siteHeader.clientHeight + 20\n const elementPosition = element.getBoundingClientRect().top\n const offsetPosition = elementPosition + window.pageYOffset - headerOffset\n\n window.scrollTo({ top: offsetPosition, behavior: \"smooth\" })\n }\n\n const toggleFaq = () => {\n scrollIntoView()\n setShowMore(!showMore)\n }\n\n return (\n <div className={`faq-container ${bgColor ? bgColor : \"c--sand\"} ${tPadding} ${bPadding}`}>\n <div ref={topRef} className={`handling-accordion`}>\n <div className=\"w--normal\">\n {hideIcon ? undefined : iconUpload ? (\n <img className=\"faq-icon\" data-epi-property=\"IconUpload\" src={iconUpload} />\n ) : (\n <div className=\"faq-icon\">\n <svg className=\"icon faq_3\">\n <use xmlnsXlink=\"http://www.w3.org/1999/xlink\" xlinkHref=\"/dist/svg/symbols.svg#svg-faq_3\">\n \n </use>\n </svg>\n </div>\n )}\n <div className=\"faq-header-container\">\n <p data-epi-property=\"Header\" className=\"faq-header\">\n <strong>{header}</strong> {subHeader}\n </p>\n </div>\n <div className={faqElements.length > 6 ? `faq-elements more-questions ${showMore ? \"show-all\" : \"\"}` : \"faq-elements\"}>\n {faqElements.map((element, index) => {\n return <FaqElement key={index} question={element.question} answer={element.answer} />\n })}\n <div className=\"show-more-questions\">\n <button data-epi-property=\"ReadMoreLabel\" onClick={toggleFaq} className=\"button button--expander more\">\n {readMoreLabel}\n </button>\n <button data-epi-property=\"ReadLessLabel\" onClick={toggleFaq} className=\"button button--expander less\">\n {readLessLabel}\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n )\n}\n\nexport default PracticalFaqContainer\n"],"names":["accessibilityEnterCheck","e","cb","key","type","props","accordionRef","useRef","_useState","useState","_useState2","_slicedToArray","isAccordionOpen","setIsAccordionOpen","handleAccordion","event","classname","elem","currentTarget","node","showHideContent","__toggle","target","parentElement","querySelector","style","height","scrollHeight","classList","add","remove","question","answer","formattedAnswer","ReactHtmlParser","transform","name","tabindexValue","attribs","tabindex","_jsxs","tabIndex","role","onKeyDown","className","targetElement","childNodes","ref","id","children","_jsx","onClick","_ref","header","subHeader","faqElements","readMoreLabel","readLessLabel","iconUpload","hideIcon","backgroundColor","bottomPadding","topPadding","topRef","showMore","setShowMore","bgColor","SelectionFactoryHelper","undefined","tPadding","bPadding","toggleFaq","element","current","headerOffset","document","getElementsByClassName","clientHeight","offsetPosition","getBoundingClientRect","top","window","pageYOffset","scrollTo","behavior","scrollIntoView","concat","src","xmlnsXlink","xlinkHref","length","map","index","FaqElement"],"sourceRoot":""}