function Commande({go,cart,orderInfo,setOrderInfo}){ const {SectionHeader,Breadcrumbs,Card,Input,Select,Button,Alert} = window.IDHDesignSystem_6f4674; const {communesAbidjan} = window.IDH_DATA; const total = cart.reduce((s,it)=>s+it.price*it.qty,0); const [form,setForm] = React.useState({ name: orderInfo.name||'', phone: orderInfo.phone||'', email: orderInfo.email||'', commune: orderInfo.commune||communesAbidjan[0], address: orderInfo.address||'', notes: orderInfo.notes||'' }); const [errors,setErrors] = React.useState({}); function set(field){return e=>setForm(f=>({...f,[field]:e.target.value}));} function validate(){ const e={}; if(!form.name.trim()) e.name='Le nom complet est requis.'; if(!/^[0-9+ ]{8,}$/.test(form.phone.trim())) e.phone='Entrez un numéro de téléphone valide.'; if(form.email.trim()&&!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(form.email.trim())) e.email='Adresse e-mail invalide.'; if(!form.address.trim()) e.address='Précisez une adresse (quartier, rue, repère).'; setErrors(e); return Object.keys(e).length===0; } function submit(ev){ ev.preventDefault(); if(!validate()) return; setOrderInfo(form); go('paiement'); } if(cart.length===0){ return React.createElement('div',{style:{maxWidth:1240,margin:'0 auto',padding:'32px 32px 80px'}}, React.createElement(Breadcrumbs,{items:[{href:'accueil',label:'Accueil'},{href:'boutique',label:'Mon Panier'},{href:'commande',label:'Commande'}],onNavigate:go}), React.createElement(Card,{padding:'48px'},React.createElement('div',{style:{textAlign:'center',color:'var(--text-muted)',fontFamily:'var(--font-body)'}},'Votre panier est vide.',React.createElement('div',{style:{marginTop:16}},React.createElement(Button,{variant:'primary',onClick:()=>go('catalogue')},'Parcourir le catalogue'))))); } return React.createElement('div',{style:{maxWidth:1240,margin:'0 auto',padding:'32px 32px 80px'}}, React.createElement(Breadcrumbs,{items:[{href:'accueil',label:'Accueil'},{href:'boutique',label:'Mon Panier'},{href:'commande',label:'Commande'}],onNavigate:go}), React.createElement('div',{style:{marginTop:20}},React.createElement(SectionHeader,{eyebrow:'Étape 1 sur 2',title:'Vos informations de livraison',subtitle:'Ces informations servent à préparer et livrer votre commande.'})), React.createElement('div',{style:{display:'grid',gridTemplateColumns:'1.6fr 1fr',gap:32,marginTop:32,alignItems:'start'}}, React.createElement(Card,{padding:'28px'}, React.createElement('form',{onSubmit:submit,style:{display:'flex',flexDirection:'column',gap:18}}, React.createElement(Input,{label:'Nom complet',placeholder:'Votre nom',value:form.name,onChange:set('name'),error:errors.name}), React.createElement(Input,{label:'Téléphone',type:'tel',placeholder:'+225 07 00 00 00 00',value:form.phone,onChange:set('phone'),error:errors.phone}), React.createElement(Input,{label:'E-mail (optionnel — pour recevoir la confirmation par e-mail)',type:'email',placeholder:'vous@entreprise.com',value:form.email,onChange:set('email'),error:errors.email}), React.createElement(Select,{label:'Commune (Abidjan)',value:form.commune,onChange:set('commune'),options:communesAbidjan.map(c=>({value:c,label:c}))}), React.createElement(Input,{label:'Adresse précise',placeholder:'Quartier, rue, repère (ex: Cocody Angré, non loin de la pharmacie)',value:form.address,onChange:set('address'),error:errors.address}), React.createElement('label',{style:{display:'flex',flexDirection:'column',gap:6,fontFamily:'var(--font-body)'}}, React.createElement('span',{style:{fontSize:13,fontWeight:600,color:'var(--text-secondary)'}},'Note de livraison (optionnel)'), React.createElement('textarea',{rows:3,placeholder:'Étage, horaires préférés, indications complémentaires...',value:form.notes,onChange:set('notes'),style:{fontFamily:'var(--font-body)',fontSize:15,padding:'10px 12px',borderRadius:'var(--radius-sm)',border:'1.5px solid var(--border-default)',resize:'vertical'}})), React.createElement(Alert,{tone:'info'},'Livraison à Abidjan sous 24h ; pour l’intérieur du pays, contactez-nous pour un délai précis.'), React.createElement('div',{style:{display:'flex',gap:12,marginTop:6}}, React.createElement(Button,{variant:'secondary',type:'button',onClick:()=>go('boutique')},'Retour au panier'), React.createElement(Button,{variant:'primary',type:'submit',fullWidth:true,size:'lg'},'Continuer vers le paiement')))), React.createElement(Card,{padding:'24px',elevated:true}, React.createElement('div',{style:{fontFamily:'var(--font-display)',fontWeight:700,fontSize:18,marginBottom:18}},'Récapitulatif'), cart.map(it=>React.createElement('div',{key:it.ref,style:{display:'flex',justifyContent:'space-between',fontFamily:'var(--font-body)',fontSize:13.5,color:'var(--text-secondary)',marginBottom:8}},React.createElement('span',null,it.qty,'× ',it.name),React.createElement('span',null,(it.price*it.qty).toLocaleString('fr-FR'),' FCFA'))), React.createElement('div',{style:{display:'flex',justifyContent:'space-between',fontFamily:'var(--font-display)',fontWeight:700,fontSize:20,color:'var(--brand-primary)',borderTop:'1px solid var(--border-default)',paddingTop:16,marginTop:10}},React.createElement('span',null,'Total'),React.createElement('span',null,total.toLocaleString('fr-FR'),' FCFA'))))); } window.Commande = Commande;