Champ INN (10 ou 12 chiffres). Afficher l'erreur après blur. Le bouton Envoyer est désactivé jusqu'à ce que le formulaire soit valide.

Pour le champ INN avec validation de 10 ou 12 chiffres, affichant une erreur après blur et bloquant le bouton "Envoyer" jusqu'à ce que le formulaire soit invalide, vous pouvez faire ainsi (en React) :

import React, { useState } from 'react';

function InnForm() {
  const [inn, setInn] = useState('');
  const [touched, setTouched] = useState(false);

  const isValidInn = (value) => {
    return /^\d{10}$/.test(value) || /^\d{12}$/.test(value);
  };

  const handleBlur = () => {
    setTouched(true);
  };

  const isValid = isValidInn(inn);

  return (
    <form>
      <label>
        INN:
        <input
          type="text"
          value={inn}
          onChange={e => setInn(e.target.value)}
          onBlur={handleBlur}
          maxLength={12}
        />
      </label>
      {touched && !isValid && (
        <div style={{ color: 'red' }}>L'INN doit contenir 10 ou 12 chiffres</div>
      )}
      <button type="submit" disabled={!isValid}>Envoyer</button>
    </form>
  );
}

export default InnForm;
```\n\nIci :\n- La validation vérifie que l'INN contient exactement 10 ou 12 chiffres.\n- L'erreur s'affiche uniquement après que le champ a perdu le focus (`blur`).\n- Le bouton "Envoyer" est désactivé tant que l'INN n'est pas valide.