{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/GLSJdXSA2alvXeOwIY6M/FFpVJWFTGVzHNgx4efsq/TextHighlightonScroll.js"],
  "sourcesContent": ["import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from\"react/jsx-runtime\";import{useLayoutEffect,useEffect}from\"react\";export function withAnimatedCMSHighlight(Component){return props=>{useLayoutEffect(()=>{const elements=document.querySelectorAll(`.${props.className} *`);elements.forEach(element=>{const computedStyle=window.getComputedStyle(element);if(computedStyle.fontStyle===\"italic\"){// Remove italic styling\nelement.style.fontStyle=\"normal\";// Wrap the content inside a <mark> tag\nconst markElement=document.createElement(\"mark\");while(element.firstChild){markElement.appendChild(element.firstChild);}element.appendChild(markElement);}});},[props.className]);useEffect(()=>{const markedElements=document.querySelectorAll(`.${props.className} mark`);const observer=new IntersectionObserver(entries=>{entries.forEach(entry=>{if(entry.isIntersecting){entry.target.classList.add(\"highlight-animate\");}});},{threshold:.3})// Trigger animation when 30% is visible\n;markedElements.forEach(el=>observer.observe(el));return()=>observer.disconnect();},[props.className]);return /*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(\"style\",{children:`\n.${props.className} mark {\n  background: linear-gradient(120deg, rgba(255, 230, 0, 0.5) 50%, transparent 50%);\n  background-size: 200% 100%;\n  background-position: 100% 0;\n  padding: 0 4px;\n  border-radius: 4px;\n  font-weight: inherit;\n  font-style: inherit;\n  transition: background-position 1s ease-in-out;\n}\n\n.${props.className} mark.highlight-animate {\n  background-position: 0 0;\n}\n`}),/*#__PURE__*/_jsx(Component,{...props})]});};}\nexport const __FramerMetadata__ = {\"exports\":{\"withAnimatedCMSHighlight\":{\"type\":\"reactHoc\",\"name\":\"withAnimatedCMSHighlight\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./TextHighlightonScroll.map"],
  "mappings": "8GAAmI,SAASA,EAAyBC,EAAU,CAAC,OAAOC,IAAQC,EAAgB,IAAI,CAAgB,SAAS,iBAAiB,IAAID,EAAM,SAAS,IAAI,EAAW,QAAQE,GAAS,CAAsD,GAAjCC,EAAO,iBAAiBD,CAAO,EAAmB,YAAY,SAAS,CAC5YA,EAAQ,MAAM,UAAU,SACxB,IAAME,EAAY,SAAS,cAAc,MAAM,EAAE,KAAMF,EAAQ,YAAYE,EAAY,YAAYF,EAAQ,UAAU,EAAGA,EAAQ,YAAYE,CAAW,CAAE,CAAC,CAAC,CAAE,EAAE,CAACJ,EAAM,SAAS,CAAC,EAAEK,EAAU,IAAI,CAAC,IAAMC,EAAe,SAAS,iBAAiB,IAAIN,EAAM,SAAS,OAAO,EAAQO,EAAS,IAAI,qBAAqBC,GAAS,CAACA,EAAQ,QAAQC,GAAO,CAAIA,EAAM,gBAAgBA,EAAM,OAAO,UAAU,IAAI,mBAAmB,CAAG,CAAC,CAAE,EAAE,CAAC,UAAU,EAAE,CAAC,EAClb,OAAAH,EAAe,QAAQI,GAAIH,EAAS,QAAQG,CAAE,CAAC,EAAQ,IAAIH,EAAS,WAAW,CAAE,EAAE,CAACP,EAAM,SAAS,CAAC,EAAsBW,EAAM,EAAU,CAAC,SAAS,CAAcC,EAAK,QAAQ,CAAC,SAAS;AAAA,GACvLZ,EAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWfA,EAAM,SAAS;AAAA;AAAA;AAAA,CAGjB,CAAC,EAAeY,EAAKb,EAAU,CAAC,GAAGC,CAAK,CAAC,CAAC,CAAC,CAAC,EAAI",
  "names": ["withAnimatedCMSHighlight", "Component", "props", "fe", "element", "window", "markElement", "ue", "markedElements", "observer", "entries", "entry", "el", "u", "p"]
}