{{--
    v1.14.0 — un champ du formulaire en ligne : son état (erreur, remarque,
    confirmé par la pièce), son message relié au champ, son aide.
    Variables : $champ, $libelle, $saisie (type HTML), $aide, $exemple, $attrs, $classe,
    $avertissements, $confirmes ; v1.16.0 — $source (« lu sur la CIN »), dans le champ, en mode cabinet.
--}}
@php
    // « $saisie », pas « $type » : la vue appelante a déjà un $type (la situation de la société).
    $saisie ??= 'text';
    $erreur = $errors->first($champ);
    $remarque = ($avertissements ?? [])[$champ] ?? null;
    $confirme = ($confirmes ?? [])[$champ] ?? null;
    $etat = $erreur ? 'err' : ($remarque ? 'warn' : ($confirme ? 'ok' : ''));
    $decrit = collect([$erreur || $remarque || $confirme ? $champ.'-msg' : null, ($aide ?? null) ? $champ.'-aide' : null])->filter()->implode(' ');
@endphp
<div class="pt-field {{ $classe ?? '' }}" id="champ-{{ $champ }}">
    <label for="{{ $champ }}">{{ $libelle }}</label>
    @if ($source ?? null)<div class="pt-avec-source">@endif
    <input id="{{ $champ }}" type="{{ $saisie }}" class="pt-input {{ $etat }}" wire:model.blur.live="{{ $champ }}"
        @if ($exemple ?? null) placeholder="{{ $exemple }}" @endif
        @if ($erreur) aria-invalid="true" @endif
        @if ($decrit) aria-describedby="{{ $decrit }}" @endif
        {!! $attrs ?? '' !!}>
    @if ($source ?? null)<span class="pt-source">{{ $source }}</span></div>@endif
    @if ($erreur)
        <p class="pt-msg err" id="{{ $champ }}-msg"><x-portail.icone nom="alert"/><span>{{ $erreur }}</span></p>
    @elseif ($remarque && $champ === 'rep_email')
        <div class="pt-msg warn" id="{{ $champ }}-msg" style="align-items:center">
            <x-portail.icone nom="warn"/><span class="grow">Vouliez-vous dire <b>{{ $remarque }}</b> ?</span>
            <button type="button" class="pt-btn o sm" wire:click="corrigerEmail">Corriger</button>
        </div>
    @elseif ($remarque && $remarque !== 'doublon')
        <p class="pt-msg warn" id="{{ $champ }}-msg"><x-portail.icone nom="warn"/><span>{{ $remarque }}</span></p>
    @elseif ($confirme)
        <p class="pt-msg ok" id="{{ $champ }}-msg"><x-portail.icone nom="check"/><span>{{ $confirme }}</span></p>
    @endif
    @if ($aide ?? null)
        <p class="pt-hint" id="{{ $champ }}-aide">{{ $aide }}</p>
    @endif
</div>