{{-- v1.16.0 §A2.5 — les suggestions de la recherche des clients, pendant la frappe (dès 3 lettres). Entrée filtre la liste. --}}
<script>
(function () {
    var form = document.querySelector('form[data-suggestions]');
    if (!form) { return; }
    var champ = form.querySelector('input[name="q"]');
    var boite = form.querySelector('.pt-suggestions');
    var minuteur = null;
    var derniere = '';

    function fermer() { boite.hidden = true; champ.setAttribute('aria-expanded', 'false'); }

    function texte(t) { var d = document.createElement('div'); d.textContent = t; return d.innerHTML; }

    function afficher(r) {
        if (!r.clients.length && !r.resume) { fermer(); return; }
        var html = '<div class="tete">' + texte(r.resume) + (r.correction ? ' · <i>' + texte(r.correction) + '</i>' : '') + '</div>';
        r.clients.forEach(function (c) {
            html += '<a role="option" href="' + c.lien + '"><b>' + texte(c.raison_sociale) + '</b>'
                + '<span class="pt-pourquoi' + (c.approche ? ' approche' : '') + '">' + c.pourquoi + '</span>'
                + '<span class="pt-small pt-muted">' + texte(c.code) + '</span></a>';
        });
        boite.innerHTML = html;
        boite.hidden = false;
        champ.setAttribute('aria-expanded', 'true');
    }

    champ.addEventListener('input', function () {
        var q = champ.value.trim();
        clearTimeout(minuteur);
        if (q.length < 3) { fermer(); return; }
        minuteur = setTimeout(function () {
            derniere = q;
            fetch(form.dataset.suggestions + '?q=' + encodeURIComponent(q), { headers: { 'Accept': 'application/json' }, credentials: 'same-origin' })
                .then(function (rep) { return rep.ok ? rep.json() : null; })
                .then(function (r) { if (r && derniere === q) { afficher(r); } })
                .catch(fermer);
        }, 200);
    });

    champ.addEventListener('keydown', function (e) { if (e.key === 'Escape') { fermer(); } });
    document.addEventListener('click', function (e) { if (!form.contains(e.target)) { fermer(); } });
})();
</script>