{"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"}