{"version":3,"file":"TableOfContentsPro.CUapOFF2.mjs","names":["useState","useRef","headings","startTransition"],"sources":["https:/framerusercontent.com/modules/dfVPrWTgJ9VMiHPR92qV/pa7Fo3iyfqL7pfLRLlg9/TableOfContentsPro.js"],"sourcesContent":["// TableOfContentsPro Component (Nested UL Version)\n// Automatically reads H1–H4 headings from the connected Formatted Text field\n// and renders them as nested unordered lists with clickable links.\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useState,useRef,startTransition}from\"react\";import{addPropertyControls,ControlType}from\"framer\";/**\n * @framerDisableUnlink\n * @framerIntrinsicWidth 200\n * @framerIntrinsicHeight 300\n */export default function TableOfContentsPro(props){const{container={padding:\"20px\",borderRadius:8,backgroundColor:\"#FFFFFF\",indentSize:20,scrollOffset:80},colors={defaultColor:\"#645dfc\",hoverColor:\"#0F172A\",activeColor:\"#0F172A\",activeBackgroundColor:\"#F1F5F9\",linkGap:8,activePadding:\"8px 12px\",activeBorderRadius:6,enablePadding:false},titleFont,h1Font,h2Font,h3Font,h4Font,smoothScroll=true,fieldName=\"Content\",showH1=true,showH2=true,showH3=true,showH4=true}=props;const{defaultColor,hoverColor,activeColor,activeBackgroundColor,linkGap,activePadding,activeBorderRadius,enablePadding}=colors;const{backgroundColor,scrollOffset}=container;const[headings,setHeadings]=useState([]);const[activeId,setActiveId]=useState(\"\");const[hoveredId,setHoveredId]=useState(\"\");const[showNoContentMessage,setShowNoContentMessage]=useState(false);const containerRef=useRef(null);useEffect(()=>{if(typeof window===\"undefined\")return;const contentContainer=document.querySelector(`[data-framer-name=\"${fieldName}\"]`);if(!contentContainer){console.warn(`Table of Contents: No element found with data-framer-name=\"${fieldName}\"`);startTransition(()=>setHeadings([]));return;}const headingElements=contentContainer.querySelectorAll(\"h1, h2, h3, h4\");const extractedHeadings=[];let visibleIndex=0;headingElements.forEach(heading=>{const level=parseInt(heading.tagName.substring(1));const text=heading.textContent||\"\";const shouldShow=level===1?showH1:level===2?showH2:level===3?showH3:level===4?showH4:false;if(shouldShow){const id=`heading-${visibleIndex}-${text.toLowerCase().replace(/\\s+/g,\"-\").replace(/[^\\w-]/g,\"\")}`;if(!heading.id){heading.id=id;}extractedHeadings.push({id:heading.id,text,level});visibleIndex++;}});startTransition(()=>setHeadings(extractedHeadings));},[fieldName,showH1,showH2,showH3,showH4]);useEffect(()=>{if(headings.length===0){const timer=setTimeout(()=>{startTransition(()=>setShowNoContentMessage(true));},500);return()=>clearTimeout(timer);}else{startTransition(()=>setShowNoContentMessage(false));}},[headings]);useEffect(()=>{if(typeof window===\"undefined\"||headings.length===0)return;const observer=new IntersectionObserver(entries=>{entries.forEach(entry=>{if(entry.isIntersecting){startTransition(()=>setActiveId(entry.target.id));}});},{rootMargin:`-${scrollOffset}px 0px -80% 0px`});headings.forEach(({id})=>{const element=document.getElementById(id);if(element)observer.observe(element);});return()=>observer.disconnect();},[headings,scrollOffset]);const handleClick=id=>{const element=document.getElementById(id);if(element){const top=element.getBoundingClientRect().top+window.pageYOffset-scrollOffset;if(smoothScroll){window.scrollTo({top,behavior:\"smooth\"});}else{window.scrollTo(0,top);}startTransition(()=>setActiveId(id));}};// --- 🧠 Nested List Renderer ---\nconst renderHeadings=(headings,parentLevel=1)=>{const grouped=[];let index=0;while(index<headings.length){const current=headings[index];const children=[];index++;while(index<headings.length&&headings[index].level>current.level){children.push(headings[index]);index++;}let headingFont=h1Font;if(current.level===2)headingFont=h2Font;if(current.level===3)headingFont=h3Font;if(current.level===4)headingFont=h4Font;const isActive=activeId===current.id;const isHovered=hoveredId===current.id;grouped.push(/*#__PURE__*/_jsxs(\"li\",{style:{marginBottom:linkGap},children:[/*#__PURE__*/_jsx(\"a\",{href:`#${current.id}`,onClick:e=>{e.preventDefault();handleClick(current.id);},onMouseEnter:()=>startTransition(()=>setHoveredId(current.id)),onMouseLeave:()=>startTransition(()=>setHoveredId(\"\")),style:{color:isActive?activeColor:isHovered?hoverColor:defaultColor,backgroundColor:enablePadding&&(isActive||isHovered)?activeBackgroundColor:\"transparent\",textDecoration:\"none\",cursor:\"pointer\",transition:\"color 0.2s ease, background-color 0.2s ease\",display:\"block\",padding:enablePadding?activePadding:\"0\",borderRadius:enablePadding?`${activeBorderRadius}px`:\"0\",listStyleType:\"none\",marginLeft:\"0\",whiteSpace:\"normal\",wordBreak:\"break-word\",overflowWrap:\"anywhere\",lineHeight:\"1.4em\",...headingFont},children:current.text.replace(/^\\d+(\\.\\d+)*[.)]?\\s*/,\"\")}),children.length>0&&/*#__PURE__*/_jsx(\"ul\",{style:{listStyleType:\"none\",margin:\"4px 0 0 0\",padding:0},children:renderHeadings(children,current.level+1)})]},current.id));}return grouped;};const isFixedWidth=props?.style&&props.style.width===\"100%\";return /*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:{...props.style,backgroundColor,color:defaultColor,padding:container.padding,borderRadius:container.borderRadius,overflow:\"visible\",...isFixedWidth?{}:{minWidth:\"max-content\"}},children:/*#__PURE__*/_jsx(\"nav\",{children:/*#__PURE__*/_jsx(\"ul\",{style:{listStyleType:\"none\",margin:0,padding:0},children:headings.length===0&&showNoContentMessage?/*#__PURE__*/_jsx(\"li\",{style:{color:defaultColor,opacity:.6,...h1Font},children:\"No connected CMS field found in this Page. Add a Formatted Text element and link it to your CMS to enable the Table of Contents.\"}):renderHeadings(headings)})})});}// --- Framer Property Controls (unchanged) ---\naddPropertyControls(TableOfContentsPro,{fieldName:{type:ControlType.Enum,title:\"CMS Field\",defaultValue:\"Content\",options:[\"Content\"],optionTitles:[\"Content\"]},container:{type:ControlType.Object,title:\"Container\",controls:{padding:{type:ControlType.Padding,title:\"Padding\",defaultValue:\"20px\"},borderRadius:{type:ControlType.Number,title:\"Border Radius\",defaultValue:8,unit:\"px\"},backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#FFFFFF\"},indentSize:{type:ControlType.Number,title:\"Indent Size\",defaultValue:20,unit:\"px\"},scrollOffset:{type:ControlType.Number,title:\"Scroll Offset\",defaultValue:80,unit:\"px\"}}},colors:{type:ControlType.Object,title:\"Links\",controls:{defaultColor:{type:ControlType.Color,title:\"Default\",defaultValue:\"#645dfc\"},hoverColor:{type:ControlType.Color,title:\"Hover\",defaultValue:\"#0F172A\"},activeColor:{type:ControlType.Color,title:\"Active\",defaultValue:\"#0F172A\"},linkGap:{type:ControlType.Number,title:\"Link Gap\",defaultValue:8,unit:\"px\"},enablePadding:{type:ControlType.Boolean,title:\"Padding\",defaultValue:false},activePadding:{type:ControlType.Padding,title:\"Padding Size\",defaultValue:\"8px 12px\"},activeBorderRadius:{type:ControlType.Number,title:\"Border Radius\",defaultValue:6,unit:\"px\"},activeBackgroundColor:{type:ControlType.Color,title:\"Active Background\",defaultValue:\"#F1F5F9\"}}},h1Font:{type:ControlType.Font,title:\"H1 Font\",controls:\"extended\"},h2Font:{type:ControlType.Font,title:\"H2 Font\",controls:\"extended\"},h3Font:{type:ControlType.Font,title:\"H3 Font\",controls:\"extended\"},h4Font:{type:ControlType.Font,title:\"H4 Font\",controls:\"extended\"},smoothScroll:{type:ControlType.Boolean,title:\"Smooth Scroll\",defaultValue:true},showH1:{type:ControlType.Boolean,title:\"Show H1\",defaultValue:true},showH2:{type:ControlType.Boolean,title:\"Show H2\",defaultValue:true},showH3:{type:ControlType.Boolean,title:\"Show H3\",defaultValue:true},showH4:{type:ControlType.Boolean,title:\"Show H4\",defaultValue:true}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"TableOfContentsPro\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerIntrinsicHeight\":\"300\",\"framerDisableUnlink\":\"* @framerIntrinsicWidth 200\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./TableOfContentsPro.map"],"mappings":"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"}