function Catalogue({go,addToCart,openProduct}){ const {SectionHeader,Tag,SearchBar,Select,ProductCard,Breadcrumbs} = window.IDHDesignSystem_6f4674; const {cartridges} = window.IDH_DATA; function Icon({name,size=18}){const pascal=name.replace(/(^\w|-\w)/g,c=>c.replace('-','').toUpperCase());const nodes=window.lucide&&window.lucide.icons[pascal];const inner=nodes?nodes.map(([tag,attrs])=>'<'+tag+' '+Object.entries(attrs).map(([k,v])=>k+'="'+v+'"').join(' ')+'/>').join(''):'';const svg=''+inner+'';return React.createElement('span',{style:{display:'inline-flex',width:size,height:size},dangerouslySetInnerHTML:{__html:svg}});} const [brand,setBrand]=React.useState('Tous'); const [q,setQ]=React.useState(''); const [sort,setSort]=React.useState('pertinence'); const brands=['Tous','HP','Canon','Epson']; let items = cartridges.filter(p=> (brand==='Tous'||p.brand===brand) && (p.name.toLowerCase().includes(q.toLowerCase())||p.ref.toLowerCase().includes(q.toLowerCase()))); if(sort==='prix-asc') items=[...items].sort((a,b)=>a.price-b.price); if(sort==='prix-desc') items=[...items].sort((a,b)=>b.price-a.price); return React.createElement('div',{style:{maxWidth:1240,margin:'0 auto',padding:'32px 32px 80px'}}, React.createElement(Breadcrumbs,{items:[{href:'accueil',label:'Accueil'},{href:'catalogue',label:'Fourniture & Consommables'}],onNavigate:go}), React.createElement('div',{style:{marginTop:20,display:'grid',gridTemplateColumns:'1.2fr 0.8fr',gap:32,alignItems:'center'}}, React.createElement(SectionHeader,{eyebrow:'Fourniture & Consommables',title:'Catalogue Cartouches & Toners',subtitle:'158 références en stock — recherchez par marque, modèle ou référence.'}), React.createElement('div',{style:{height:180}},React.createElement(window.IllustrationConsommables,null))), React.createElement('div',{style:{marginTop:28}},React.createElement(SearchBar,{value:q,onChange:e=>setQ(e.target.value),placeholder:'Rechercher une cartouche, une marque, une référence...',icon:React.createElement(Icon,{name:'search'})})), React.createElement('div',{style:{display:'flex',justifyContent:'space-between',alignItems:'center',marginTop:20,flexWrap:'wrap',gap:14}}, React.createElement('div',{style:{display:'flex',gap:10}},brands.map(b=>React.createElement(Tag,{key:b,active:brand===b,onClick:()=>setBrand(b)},b))), React.createElement('div',{style:{width:220}},React.createElement(Select,{value:sort,onChange:e=>setSort(e.target.value),options:[{value:'pertinence',label:'Pertinence'},{value:'prix-asc',label:'Prix croissant'},{value:'prix-desc',label:'Prix décroissant'}]}))), React.createElement('div',{style:{fontFamily:'var(--font-body)',fontSize:13.5,color:'var(--text-muted)',marginTop:18}},items.length+' résultat(s) sur 158 références'), React.createElement('div',{style:{display:'grid',gridTemplateColumns:'repeat(4,1fr)',gap:18,marginTop:16}}, items.map(p=>React.createElement(ProductCard,{key:p.ref,image:React.createElement(window.ProductImage,{icon:p.icon,photo:p.photo&&('assets/products/'+p.photo)}),brand:p.brand,name:p.name,sku:p.ref,price:p.price,stock:p.stock,onAdd:()=>addToCart(p),onOpen:()=>openProduct(p)}))), items.length===0&&React.createElement('div',{style:{textAlign:'center',padding:'60px 0',color:'var(--text-muted)',fontFamily:'var(--font-body)'}},'Aucune référence ne correspond à votre recherche.')); } window.Catalogue = Catalogue;