{"version":3,"file":"elements-scrollable-expanding-content-js-CkYZWVtM.js","sources":["../src/entries/elements/scrollable-expanding-content.js"],"sourcesContent":["import debounce from \"lodash/debounce\";\nimport { gsap } from \"gsap\";\nimport { ScrollTrigger } from \"gsap/ScrollTrigger\";\n\ngsap.registerPlugin(ScrollTrigger);\n\nconst setupHeights = (el) => {\n const contentColumn = el.querySelector(\".content-column\");\n const listColumn = el.querySelector(\".list-column\");\n const lastElement = listColumn.querySelector(\".scroll-sections-placeholder .scroll-section-placeholder:last-child\");\n\n const isTwoColumn = window.matchMedia(\"(min-width: 768px)\").matches;\n const contentHeight = contentColumn.offsetHeight;\n const listHeight = listColumn.offsetHeight;\n\n if (isTwoColumn && listHeight > contentHeight) {\n const offset = contentColumn.offsetHeight - lastElement.offsetHeight;\n listColumn.style.paddingBottom = `${offset / 2}px`;\n } else {\n listColumn.style.paddingBottom = null;\n }\n};\n\ndocument.querySelectorAll(\".element-scrollableexpandingcontent\").forEach((el) => {\n setupHeights(el);\n\n const sectionsPlaceholder = el.querySelector(\".scroll-sections-placeholder\");\n const contents = el.querySelectorAll(\".scroll-content\");\n\n contents.forEach((content) => {\n const height = content.offsetHeight;\n const styles = window.getComputedStyle(content);\n const margin = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);\n const padding = parseFloat(styles.paddingTop) + parseFloat(styles.paddingBottom);\n\n content.setAttribute(\"data-height\", height + margin + padding);\n });\n\n gsap.set(contents, { height: 0 });\n\n const timeline = gsap.timeline({\n paused: true,\n scrollTrigger: {\n trigger: el.querySelector(\".scroll-sections\"),\n start: \"top 35%\",\n end: () => {\n return `${sectionsPlaceholder.offsetHeight * 1.2}px center`;\n },\n scrub: true,\n markers: false,\n },\n });\n\n contents.forEach((content, index) => {\n const section = content.closest(\".scroll-section\");\n const sectionImage = el.querySelector(`.section-image[data-pos=\"${section.dataset.index}\"]`);\n const prevSection = index > 0 ? contents[index - 1].closest(\".scroll-section\") : null;\n\n timeline.to(content, { height: content.dataset.height });\n\n if (prevSection) {\n const prevSectionImage = el.querySelector(`.section-image[data-pos=\"${prevSection.dataset.index}\"]`);\n timeline.to(prevSection, { className: \"scroll-section relative\" }, \"<\");\n timeline.to(prevSectionImage, { opacity: 0, duration: 0.1 }, \"<\");\n }\n\n timeline.to(section, { className: \"scroll-section relative is-active\" }, \"<\");\n timeline.to(sectionImage, { opacity: 1, duration: 0.1 }, \"<\");\n });\n\n ScrollTrigger.refresh();\n});\n\nwindow.addEventListener(\n \"resize\",\n debounce(() => {\n document.querySelectorAll(\".element-scrollableexpandingcontent\").forEach((el) => {\n setupHeights(el);\n });\n }, 250),\n);\n"],"names":["gsap","ScrollTrigger","setupHeights","el","contentColumn","listColumn","lastElement","isTwoColumn","contentHeight","listHeight","offset","sectionsPlaceholder","contents","content","height","styles","margin","padding","timeline","index","section","sectionImage","prevSection","prevSectionImage","debounce"],"mappings":"mIAIAA,EAAK,eAAeC,CAAa,EAEjC,MAAMC,EAAgBC,GAAO,CAC3B,MAAMC,EAAgBD,EAAG,cAAc,iBAAiB,EAClDE,EAAaF,EAAG,cAAc,cAAc,EAC5CG,EAAcD,EAAW,cAAc,qEAAqE,EAE5GE,EAAc,OAAO,WAAW,oBAAoB,EAAE,QACtDC,EAAgBJ,EAAc,aAC9BK,EAAaJ,EAAW,aAE9B,GAAIE,GAAeE,EAAaD,EAAe,CAC7C,MAAME,EAASN,EAAc,aAAeE,EAAY,aACxDD,EAAW,MAAM,cAAgB,GAAGK,EAAS,CAAC,IAClD,MACIL,EAAW,MAAM,cAAgB,IAErC,EAEA,SAAS,iBAAiB,qCAAqC,EAAE,QAASF,GAAO,CAC/ED,EAAaC,CAAE,EAEf,MAAMQ,EAAsBR,EAAG,cAAc,8BAA8B,EACrES,EAAWT,EAAG,iBAAiB,iBAAiB,EAEtDS,EAAS,QAASC,GAAY,CAC5B,MAAMC,EAASD,EAAQ,aACjBE,EAAS,OAAO,iBAAiBF,CAAO,EACxCG,EAAS,WAAWD,EAAO,SAAS,EAAI,WAAWA,EAAO,YAAY,EACtEE,EAAU,WAAWF,EAAO,UAAU,EAAI,WAAWA,EAAO,aAAa,EAE/EF,EAAQ,aAAa,cAAeC,EAASE,EAASC,CAAO,CACjE,CAAG,EAEDjB,EAAK,IAAIY,EAAU,CAAE,OAAQ,CAAG,CAAA,EAEhC,MAAMM,EAAWlB,EAAK,SAAS,CAC7B,OAAQ,GACR,cAAe,CACb,QAASG,EAAG,cAAc,kBAAkB,EAC5C,MAAO,UACP,IAAK,IACI,GAAGQ,EAAoB,aAAe,GAAG,YAElD,MAAO,GACP,QAAS,EACV,CACL,CAAG,EAEDC,EAAS,QAAQ,CAACC,EAASM,IAAU,CACnC,MAAMC,EAAUP,EAAQ,QAAQ,iBAAiB,EAC3CQ,EAAelB,EAAG,cAAc,4BAA4BiB,EAAQ,QAAQ,KAAK,IAAI,EACrFE,EAAcH,EAAQ,EAAIP,EAASO,EAAQ,CAAC,EAAE,QAAQ,iBAAiB,EAAI,KAIjF,GAFAD,EAAS,GAAGL,EAAS,CAAE,OAAQA,EAAQ,QAAQ,MAAM,CAAE,EAEnDS,EAAa,CACf,MAAMC,EAAmBpB,EAAG,cAAc,4BAA4BmB,EAAY,QAAQ,KAAK,IAAI,EACnGJ,EAAS,GAAGI,EAAa,CAAE,UAAW,yBAAyB,EAAI,GAAG,EACtEJ,EAAS,GAAGK,EAAkB,CAAE,QAAS,EAAG,SAAU,IAAO,GAAG,CACjE,CAEDL,EAAS,GAAGE,EAAS,CAAE,UAAW,mCAAmC,EAAI,GAAG,EAC5EF,EAAS,GAAGG,EAAc,CAAE,QAAS,EAAG,SAAU,IAAO,GAAG,CAChE,CAAG,EAEDpB,EAAc,QAAO,CACvB,CAAC,EAED,OAAO,iBACL,SACAuB,EAAS,IAAM,CACb,SAAS,iBAAiB,qCAAqC,EAAE,QAASrB,GAAO,CAC/ED,EAAaC,CAAE,CACrB,CAAK,CACF,EAAE,GAAG,CACR"}