{"version":3,"file":"ListLoadMore.CyLIfSbD.mjs","names":["useState","useRef"],"sources":["https:/framerusercontent.com/modules/ePqoK4BrawNXLLzfQuph/bXHhoIfy15Ev8Piw9MND/ListLoadMore.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useRef,useState}from\"react\";import{addPropertyControls,ControlType,RenderTarget}from\"framer\";import{typography,space,surfaceInk,focusCss}from\"https://framerusercontent.com/modules/HDAkrahb3ethcU2GAef2/nCb5ot8a39Uw7ZcMqia0/tokens.js\";import{toneControl}from\"https://framerusercontent.com/modules/QAOPTtLoApnb5MkIYZk8/OtTOdEBa3m1YNpcPzZSP/Section.js\";import{dur,easeCss,stagger,prefersReducedMotion,useCardInteraction,revealIn,useReveal}from\"https://framerusercontent.com/modules/YFy4SNb784n2qKl2hppy/GBtnVzB0BJq3YcX7fdeG/motion.js\";/**\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight auto\n */export default function ListLoadMore({listName=\"Press list\",initial=4,step=4,label=\"Meer laden\",tone=\"surface\",countVisible=false}){const name=listName.replace(/\"/g,\"\");const sel=`[data-framer-name=\"${name}\"]`;const ink=surfaceInk(tone);const isCanvas=RenderTarget.current()===RenderTarget.canvas;const[shown,setShown]=useState(initial);const[prev,setPrev]=useState(initial);const[total,setTotal]=useState(null);const[reduced,setReduced]=useState(false);const ref=useRef(null);// Hover colour for mouse/pen only (a tap left it stuck on phones) and for keyboard focus\nconst buttonRef=useRef(null);const{active:hover,handlers}=useCardInteraction(buttonRef);// Entrance: one-time reveal in page order (MOTION_SYSTEM §4.4), after the list above it; the button's\n// hover colour transition rides along. Items shown after a click keep their own rise (revealIn / wofLmIn).\nconst buttonReveal=useReveal(buttonRef,`color ${dur.micro}s ${easeCss.spring}`);const revealNext=useRef([])// countVisible: items hidden before the click\n;useEffect(()=>{setReduced(prefersReducedMotion());const list=document.querySelector(sel);if(!list)return;const count=()=>setTotal(list.children.length);count();const mo=new MutationObserver(count)// CMS lists can re-render their children\n;mo.observe(list,{childList:true});return()=>mo.disconnect();},[sel]);// countVisible: mark items past `shown` among the visible ones; re-run when an item hides/shows itself\nuseEffect(()=>{if(!countVisible||isCanvas)return;const list=document.querySelector(sel);if(!list)return;let busy=false;const apply=()=>{if(busy)return;busy=true;const kids=Array.from(list.children);kids.forEach(k=>k.removeAttribute(\"data-wof-lm-off\"));// In display order: items can be reordered with CSS `order` (eventWindow.tsx usePastLast)\nconst visible=kids.filter(k=>k.style.display!==\"none\"&&getComputedStyle(k).display!==\"none\").map((k,i)=>({k,i,o:Number(getComputedStyle(k).order)||0})).sort((a,b)=>a.o-b.o||a.i-b.i).map(({k})=>k);visible.forEach((k,i)=>{if(i>=shown)k.setAttribute(\"data-wof-lm-off\",\"\");});setTotal(visible.length);// After a click: the items that just became visible rise in, one stagger step each\nconst next=revealNext.current.filter(k=>!k.hasAttribute(\"data-wof-lm-off\"));revealNext.current=[];if(!reduced)next.forEach((k,i)=>revealIn(k,i));busy=false;};apply();const mo=new MutationObserver(()=>requestAnimationFrame(apply));mo.observe(list,{childList:true,subtree:true,attributes:true,attributeFilter:[\"style\"]});return()=>{mo.disconnect();Array.from(list.children).forEach(k=>k.removeAttribute(\"data-wof-lm-off\"));};},[countVisible,sel,shown,isCanvas,reduced]);const clicked=useRef(false);const more=()=>{const list=document.querySelector(sel);if(countVisible){revealNext.current=list?Array.from(list.querySelectorAll(\":scope > [data-wof-lm-off]\")):[];}// The last click removes the button, which dropped keyboard focus to <body> (2026-10-08): hand it to the\n// first newly shown item instead (its link, so the card shows its focus state). No scroll — it's right above.\nconst firstNew=countVisible?revealNext.current[0]:(list?.children[shown]);const lastClick=total!==null&&shown+step>=total;if(lastClick&&firstNew&&document.activeElement===buttonRef.current){requestAnimationFrame(()=>{const target=firstNew.querySelector(\"a[href], button, [tabindex]:not([tabindex='-1'])\")||firstNew;if(target===firstNew&&!firstNew.hasAttribute(\"tabindex\"))firstNew.tabIndex=-1;target.focus({preventScroll:true});});}clicked.current=true;setPrev(shown);setShown(shown+step);};// Newly revealed items: nth-child(prev+1 … shown), one rule each for the stagger delay.\nconst animate=!reduced&&!isCanvas&&shown>prev;const reveal=animate?Array.from({length:shown-prev},(_,i)=>`${sel} > *:nth-child(${prev+1+i}){animation:wofLmIn ${dur.medium}s ${easeCss.primary} ${(i*stagger.item).toFixed(2)}s both}`).join(\"\"):\"\";const css=(countVisible?`${sel} > [data-wof-lm-off]{display:none !important}`:`${sel} > *:nth-child(n+${shown+1}){display:none !important}`)+(countVisible?\"\":reveal)+`@keyframes wofLmIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}`+focusCss(\".wof-lm\",\"link\",tone);const done=total!==null&&shown>=total;// Done after a click: the button fades out (dur.short, ease.inOut) before it unmounts, instead of vanishing\n// (2026-10-08). A list that is short from the start never shows it at all.\nconst[gone,setGone]=useState(false);useEffect(()=>{if(!done){setGone(false);return;}if(!clicked.current||reduced||isCanvas){setGone(true);return;}const t=setTimeout(()=>setGone(true),dur.short*1e3);return()=>clearTimeout(t);},[done,reduced,isCanvas]);const leaving=done?{opacity:0,pointerEvents:\"none\",transition:`opacity ${dur.short}s ${easeCss.inOut}`}:{};return(// Space above (2026-09-25): the Press timeline line runs through each row's bottom padding and touched the label\n/*#__PURE__*/_jsxs(\"div\",{ref:ref,style:{width:\"100%\",paddingTop:space.gapLarge,boxSizing:\"border-box\"},children:[/*#__PURE__*/_jsx(\"style\",{children:css}),!gone&&/*#__PURE__*/_jsx(\"button\",{type:\"button\",ref:buttonRef,className:\"wof-lm\",onClick:more,...handlers,style:{...typography.label,// Hidden (space kept) until the item count is known, so it never flashes on a short list\nvisibility:total===null?\"hidden\":\"visible\",background:\"none\",border:\"none\",padding:0,cursor:\"pointer\",color:hover?ink.linkHover:ink.text,textDecoration:\"underline\",textUnderlineOffset:\"0.25em\",...buttonReveal,...leaving},children:label})]}));}addPropertyControls(ListLoadMore,{listName:{type:ControlType.String,title:\"List layer name\",defaultValue:\"Press list\",description:\"Exact layer name of the Collection List frame (must be unique on the page)\"},initial:{type:ControlType.Number,title:\"Show first\",defaultValue:4,min:1,step:1,displayStepper:true},step:{type:ControlType.Number,title:\"Load per click\",defaultValue:4,min:1,step:1,displayStepper:true},label:{type:ControlType.String,title:\"Label\",defaultValue:\"Meer laden\"},tone:toneControl(\"surface\"),countVisible:{type:ControlType.Boolean,title:\"Count visible only\",defaultValue:false,description:\"For lists whose items hide themselves (events: Show = Past/Upcoming)\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ListLoadMore\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"any\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"auto\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}"],"mappings":"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"}