<div class="village-input-group">
    <label class="village-label" for="text-input-text">
        Libellé champ de saisie
    </label>
    <input class="village-input" id="text-input-text" type="text">
</div>

<div class="village-input-group">
    <label class="village-label" for="text-input-number">
        Libellé champ de saisie
    </label>
    <input class="village-input" pattern="[0-9]*" inputmode="numeric" id="text-input-number" type="number">
</div>

<div class="village-input-group">
    <label class="village-label" for="text-input-search">
        Libellé champ de saisie
    </label>
    <input class="village-input" id="text-input-search" type="search">
</div>

<div class="village-input-group">
    <label class="village-label" for="text-input-date">
        Libellé champ de saisie
    </label>
    <input class="village-input" id="text-input-date" type="date">
</div>

<div class="village-input-group">
    <label class="village-label" for="textarea">
        Libellé champ de saisie
    </label>
    <textarea class="village-input" id="textarea"></textarea>
</div>

<div class="village-input-group">
    <label class="village-label" for="text-input-password">
        Libellé champ de saisie
    </label>
    <input class="village-input" id="text-input-password" type="password">
</div>

<div class="village-input-group">
    <label class="village-label" for="text-input-button">
        Label champ de saisie
    </label>
    <div class="village-input-wrap village-input-wrap--addon">
        <input class="village-input" id="text-input-button" type="text">
        <button class="village-btn" id="button-8082" type="submit">
            Envoyer
        </button>
    </div>
</div>

<div class="village-input-group">
    <label class="village-label" for="text-input-placeholder">
        Libellé champ de saisie
    </label>
    <input class="village-input" placeholder="placeholder" id="text-input-placeholder" type="text">
</div>

<div class="village-input-group">
    <label class="village-label" for="text-input-value">
        Libellé champ de saisie
    </label>
    <input class="village-input" value="value" id="text-input-value" type="text">
</div>

<div class="village-input-group">
    <label class="village-label" for="text-input-icon">
        Libellé champ de saisie
        <span class="village-hint-text">Texte de description additionnel</span>
    </label>
    <div class="village-input-wrap village-icon-alert-line">
        <input class="village-input" id="text-input-icon" type="text">
    </div>
</div>

<div class="village-input-group village-input-group--disabled">
    <label class="village-label" for="text-input-disabled">
        Libellé champ de saisie
    </label>
    <input class="village-input" disabled id="text-input-disabled" type="text">
</div>

<div class="village-input-group">
    <label class="village-label" for="text-input-hint">
        Libellé champ de saisie
        <span class="village-hint-text">Texte de description additionnel</span>
    </label>
    <input class="village-input" id="text-input-hint" type="text">
</div>

<div class="village-input-group village-input-group--valid">
    <label class="village-label" for="text-input-valid">
        Libellé champ de saisie
    </label>
    <input class="village-input village-input--valid" aria-describedby="text-input-valid-desc-valid" id="text-input-valid" type="text">
    <p id="text-input-valid-desc-valid" class="village-valid-text">
        Texte de validation
    </p>
</div>

<div class="village-input-group village-input-group--error">
    <label class="village-label" for="text-input-error">
        Libellé champ de saisie
    </label>
    <input class="village-input village-input--error" aria-describedby="text-input-error-desc-error" id="text-input-error" type="text">
    <p id="text-input-error-desc-error" class="village-error-text">
        Texte d’erreur obligatoire
    </p>
</div>