{"version":3,"file":"ProjectNavigation.CJasTWCj.mjs","names":["React.useRef","React.useState"],"sources":["https:/framerusercontent.com/modules/JLBlhDVmf9vW1B1GCPQK/ehSxg6gWmmyCRhBV0Gkh/ProjectNavigation.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import*as React from\"react\";import{RenderTarget}from\"framer\";export function withProjectNavigation(Component){return function ProjectNavigation(props){const content=React.useRef(null);const[entries,setEntries]=React.useState([]);const[active,setActive]=React.useState(\"\");const staticCanvas=RenderTarget.current()===RenderTarget.canvas;React.useEffect(()=>{const root=content.current;if(!root||typeof window===\"undefined\")return;let frame=0;let disposed=false;let current=[];const updateActive=()=>{frame=0;if(disposed||!current.length)return;let selected=current[0].id;for(const entry of current){if(entry.element&&entry.element.getBoundingClientRect().top<=160)selected=entry.id;}setActive(previous=>previous===selected?previous:selected);};const schedule=()=>{if(!frame)frame=window.requestAnimationFrame(updateActive);};const collect=()=>{const headings=Array.from(root.querySelectorAll(\"h1, h2\")).filter(element=>!element.closest(\".portfolio-text-section\")&&element.getClientRects().length>0&&element.textContent?.trim()&&![\"Иллюстрация\",\"Видео\",\"Видеообзор проекта\"].includes(element.textContent.trim()));current=headings.map((element,index)=>{const label=element.tagName===\"H1\"?\"Overview\":element.textContent.trim();return{id:`case-section-${index+1}`,label,element};});setEntries(previous=>previous.length===current.length&&previous.every((e,i)=>e.label===current[i].label&&e.element===current[i].element)?previous:current);schedule();};collect();// Observe content only; all navigation state renders outside this subtree.\nconst observer=new MutationObserver(collect);observer.observe(root,{childList:true,subtree:true,characterData:true});const resize=new ResizeObserver(collect);resize.observe(root);window.addEventListener(\"scroll\",schedule,{passive:true});window.addEventListener(\"resize\",collect);return()=>{disposed=true;observer.disconnect();resize.disconnect();window.removeEventListener(\"scroll\",schedule);window.removeEventListener(\"resize\",collect);if(frame)window.cancelAnimationFrame(frame);};},[]);function navigate(event,entry){if(!entry.element)return;event.preventDefault();const reducedMotion=window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches;window.scrollTo({top:entry.element.getBoundingClientRect().top+window.scrollY-112,behavior:reducedMotion?\"auto\":\"smooth\"});setActive(entry.id);}const shown=entries.length?entries:staticCanvas?[{id:\"preview-overview\",label:\"Overview\"},{id:\"preview-context\",label:\"Context\"},{id:\"preview-problem\",label:\"Problem\"},{id:\"preview-research\",label:\"Research\"},{id:\"preview-solution\",label:\"Solution\"},{id:\"preview-results\",label:\"Results\"}]:[];// Framer stores authored width constraints in className on published pages.\n// Keep that class on the outer layout wrapper so maxWidth also caps navigation.\nreturn /*#__PURE__*/_jsxs(\"div\",{className:[props.className,\"case-with-navigation\"].filter(Boolean).join(\" \"),style:{...props.style,minWidth:0,display:\"block\",position:\"relative\",overflow:\"visible\",height:\"auto\"},children:[/*#__PURE__*/_jsx(\"style\",{children:`\n                .case-with-navigation { container-type: inline-size; container-name: case-navigation; }\r\n                .case-with-navigation > .case-navigation-layout { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 40px; align-items: start; }\n                @media (min-width: 810px) and (max-width: 1199px) { .case-with-navigation h1.framer-text { font-size: 40px !important; } .case-with-navigation h2.framer-text { font-size: 28px !important; } }\n                @media (max-width: 809px) { .case-with-navigation h1.framer-text { font-size: 32px !important; } .case-with-navigation h2.framer-text { font-size: 24px !important; } }\n                .case-section-sidebar { align-self: stretch; min-width: 0; }\n                .case-section-navigation { position: sticky; top: 120px; max-height: calc(100vh - 160px); overflow-y: auto; padding: 0 4px; font-family: Inter, sans-serif; }\n                .case-section-link { border: 0; width: 100%; background: transparent; text-align: left; cursor: pointer; font-family: inherit; display: flex; align-items: center; gap: 10px; padding: 11px 12px; margin-bottom: 3px; border-radius: 8px; font-size: 13px; line-height: 1.45; text-decoration: none; color: #6B7169; transition: background .18s, color .18s; }\n                .case-section-link::before { content: ''; width: 3px; height: 18px; flex-shrink: 0; border-radius: 3px; background: transparent; }\n                .case-section-link:hover { color: #20241F; background: #F0F4F7; }\n                .case-section-link[aria-current=\"location\"] { color: #20241F; background: #E1E9F0; font-weight: 600; }\n                .case-section-link[aria-current=\"location\"]::before { background: rgb(9, 122, 214); }\n                .case-section-link:focus-visible { outline: 2px solid #5A7540; outline-offset: 2px; }\n                @container case-navigation (max-width: 959px) { .case-navigation-layout { grid-template-columns: minmax(0, 1fr) !important; gap: 0 !important; } .case-section-sidebar { display: none; } }\r\n                @media (max-width: 1199px) { .case-with-navigation > .case-navigation-layout { grid-template-columns: minmax(0, 1fr); gap: 0; } .case-section-sidebar { display: none; } }\n            `}),/*#__PURE__*/_jsxs(\"div\",{className:\"case-navigation-layout\",children:[/*#__PURE__*/_jsx(\"aside\",{className:\"case-section-sidebar\",children:/*#__PURE__*/_jsx(\"nav\",{className:\"case-section-navigation\",\"aria-label\":\"Project sections\",children:shown.map((entry,index)=>/*#__PURE__*/_jsx(\"button\",{type:\"button\",className:\"case-section-link\",\"aria-current\":(active||shown[0]?.id)===entry.id?\"location\":undefined,onClick:event=>navigate(event,entry),children:entry.label},entry.id))})}),/*#__PURE__*/_jsx(\"div\",{ref:content,style:{minWidth:0},children:/*#__PURE__*/_jsx(Component,{...props,style:{...props.style,width:\"100%\",maxWidth:\"100%\",position:\"relative\",height:\"auto\"}})})]})]});};}\nexport const __FramerMetadata__ = {\"exports\":{\"withProjectNavigation\":{\"type\":\"reactHoc\",\"name\":\"withProjectNavigation\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ProjectNavigation.map"],"mappings":"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"}