tracker/static/mockup-groups.js

// Page-flow module folding has independent persistence from Use cases.
(() => {
 const KEY='tracker-pageflow-collapsed-modules';
 let collapsed;try{const saved=JSON.parse(localStorage.getItem(KEY)||'[]');collapsed=new Set(Array.isArray(saved)?saved.filter(v=>typeof v==='string'):[])}catch{collapsed=new Set()}
 let lastQuery='',searchCollapsed=new Set();
 const query=()=>document.getElementById('mock-flow-search')?.value.toLowerCase().trim()||'';
 function apply(){const q=query();if(q!==lastQuery){searchCollapsed=new Set();lastQuery=q;}
  document.querySelectorAll('[data-flow-module]').forEach(group=>{
   const rows=[...group.querySelectorAll('.mock-flow-row')],matches=rows.filter(row=>!q||row.dataset.flowSearch.toLowerCase().includes(q)),open=!(q?searchCollapsed:collapsed).has(group.dataset.flowModule),button=group.querySelector('[data-flow-toggle]');
   group.hidden=matches.length===0;button.setAttribute('aria-expanded',String(open));button.querySelector('[data-flow-chevron]').textContent=open?'▾':'▸';group.querySelector('[data-flow-count]').textContent=(q?matches.length+' / ':'')+rows.length+' Use cases';rows.forEach(row=>row.hidden=!open||!matches.includes(row));
  });
 }
 document.addEventListener('click',event=>{const toggle=event.target.closest('[data-flow-toggle]'),expand=event.target.closest('[data-flow-expand-all]'),collapse=event.target.closest('[data-flow-collapse-all]');if(!toggle&&!expand&&!collapse)return;
  const set=query()?searchCollapsed:collapsed;if(toggle){const key=toggle.dataset.flowToggle;set.has(key)?set.delete(key):set.add(key)}else document.querySelectorAll('[data-flow-module]').forEach(group=>collapse?set.add(group.dataset.flowModule):set.delete(group.dataset.flowModule));
  if(!query())try{localStorage.setItem(KEY,JSON.stringify([...collapsed]))}catch{}
  apply();
 });
 document.addEventListener('input',event=>{if(event.target.id==='mock-flow-search')apply()});
 apply();document.addEventListener('tracker:updated',apply);
})();