# 🎯 Prompt : Widget Formulaire Passage Modal Cross-Platform ## Contexte Développement d'un widget modal de formulaire de passage pour GEOSECTOR, compatible Svelte (web) et Flutter (mobile). ## Prompt à utiliser avec Cline/Claude ``` Je développe un widget modal de formulaire de passage pour GEOSECTOR qui doit fonctionner de manière identique sur : - Web avec Svelte/SvelteKit - Mobile avec Flutter ### Spécifications du widget #### Interface utilisateur - Modal centré avec overlay semi-transparent - Formulaire avec 4 champs principaux : 1. **Date** : sélecteur de date natif 2. **Heure** : sélecteur d'heure (format 24h) 3. **Commentaire** : textarea avec compteur (max 500 caractères) 4. **Statut** : dropdown avec options ["En attente", "Validé", "Rejeté", "En cours"] #### Fonctionnalités avancées - Validation en temps réel avec messages d'erreur contextuels - Sauvegarde automatique toutes les 30 secondes (draft local) - Animations d'ouverture/fermeture fluides - Gestion des états : loading, success, error - Boutons d'action : Annuler, Sauvegarder (draft), Valider (final) #### Contraintes techniques - Design system cohérent entre Svelte et Flutter - Accessibilité : labels, focus management, navigation clavier - Responsive : adaptation automatique mobile/desktop - Performance : lazy loading du composant - Validation côté client + préparation validation serveur Peux-tu m'accompagner dans le développement de ce widget en respectant ces spécifications et en optimisant pour la réutilisabilité ? ``` ## Bonnes pratiques à appliquer - Utiliser des validateurs côté client robustes - Implémenter un système de debouncing pour l'auto-save - Gérer proprement les animations et transitions - Prévoir la gestion d'erreur réseau - Tester l'accessibilité sur les deux plateformes ## Tests suggérés - Tests unitaires de validation - Tests d'intégration du formulaire - Tests d'accessibilité - Tests de performance (auto-save)