# Requirements Document - Interface Propriétés d'Étapes Complète

## Introduction

Ce document spécifie les exigences pour implémenter une interface utilisateur complète et robuste pour l'affichage et la configuration des propriétés d'étapes dans le Visual Workflow Builder. Le système doit gérer à la fois les étapes standard et les actions VWB avec une expérience utilisateur cohérente.

## Glossary

- **Étape Standard**: Étape avec des paramètres définis dans stepParametersConfig (click, type, wait, etc.)
- **Action VWB**: Action du catalogue Vision-Only RPA avec paramètres dynamiques
- **Propriétés d'Étape**: Paramètres configurables d'une étape (champs de saisie, sélecteurs, etc.)
- **StepTypeResolver**: Service de résolution unifié des types d'étapes
- **PropertiesPanel**: Composant React affichant les propriétés d'une étape sélectionnée
- **StandardParametersEditor**: Composant pour éditer les paramètres d'étapes standard
- **VWBActionProperties**: Composant pour éditer les paramètres d'actions VWB
- **EmptyStateMessage**: Message affiché quand aucun paramètre n'est disponible

## Requirements

### Requirement 1: Affichage des Propriétés d'Étapes Standard

**User Story:** En tant qu'utilisateur, je veux voir et configurer les propriétés des étapes standard (click, type, wait, etc.), afin de personnaliser le comportement de mes workflows.

#### Acceptance Criteria

1. WHEN une étape standard est sélectionnée, THE PropertiesPanel SHALL afficher les champs de configuration appropriés
2. WHEN l'étape est de type 'type', THE System SHALL afficher les champs: target (visual), text (text), clearFirst (boolean)
3. WHEN l'étape est de type 'click', THE System SHALL afficher les champs: target (visual), clickType (select)
4. WHEN l'étape est de type 'wait', THE System SHALL afficher le champ: duration (number)
5. WHEN l'étape est de type 'extract', THE System SHALL afficher les champs: target (visual), attribute (select)
6. THE StandardParametersEditor SHALL valider les valeurs saisies en temps réel
7. WHEN un paramètre requis est manquant, THE System SHALL afficher un message d'erreur
8. WHEN les paramètres sont modifiés, THE System SHALL sauvegarder automatiquement les changements

### Requirement 2: Gestion des Actions VWB

**User Story:** En tant qu'utilisateur, je veux configurer les actions VWB du catalogue, afin d'utiliser des fonctionnalités avancées de vision par ordinateur.

#### Acceptance Criteria

1. WHEN une action VWB est sélectionnée, THE PropertiesPanel SHALL détecter qu'il s'agit d'une action VWB
2. WHEN l'action VWB est chargée depuis le catalogue, THE VWBActionProperties SHALL afficher les paramètres spécialisés
3. WHEN l'action VWB n'est pas disponible dans le catalogue, THE System SHALL afficher un message informatif
4. WHEN une action VWB est en cours de chargement, THE System SHALL afficher un indicateur de chargement
5. THE VWBActionProperties SHALL supporter la validation des paramètres VWB
6. WHEN les paramètres VWB sont invalides, THE System SHALL afficher des erreurs spécifiques

### Requirement 3: États de Chargement et d'Erreur

**User Story:** En tant qu'utilisateur, je veux être informé de l'état du système lors du chargement des propriétés, afin de comprendre ce qui se passe.

#### Acceptance Criteria

1. WHEN le StepTypeResolver résout une étape, THE System SHALL afficher un indicateur de chargement
2. WHEN la résolution échoue, THE System SHALL afficher un message d'erreur informatif
3. WHEN aucune propriété n'est disponible, THE EmptyStateMessage SHALL expliquer pourquoi
4. THE System SHALL distinguer entre "pas de paramètres" et "erreur de chargement"
5. WHEN une action VWB n'est pas trouvée, THE System SHALL suggérer des actions alternatives

### Requirement 4: Interface Utilisateur Cohérente

**User Story:** En tant qu'utilisateur, je veux une interface cohérente pour toutes les propriétés d'étapes, afin d'avoir une expérience utilisateur fluide.

#### Acceptance Criteria

1. THE PropertiesPanel SHALL utiliser un design cohérent pour tous les types de champs
2. THE System SHALL respecter les couleurs et espacements du design system
3. WHEN un champ est en erreur, THE System SHALL utiliser les couleurs d'erreur standard
4. THE System SHALL supporter les raccourcis clavier pour la navigation
5. THE PropertiesPanel SHALL être responsive et s'adapter à différentes tailles d'écran
6. THE System SHALL maintenir l'accessibilité avec les attributs ARIA appropriés

### Requirement 5: Performance et Optimisation

**User Story:** En tant qu'utilisateur, je veux que l'interface des propriétés soit réactive, afin de travailler efficacement sur mes workflows.

#### Acceptance Criteria

1. THE PropertiesPanel SHALL éviter les re-rendus inutiles avec React.memo
2. THE StepTypeResolver SHALL utiliser le cache pour éviter les résolutions répétées
3. WHEN les paramètres changent, THE System SHALL debouncer les sauvegardes automatiques
4. THE System SHALL charger les actions VWB de manière asynchrone sans bloquer l'interface
5. THE PropertiesPanel SHALL supporter la virtualisation pour les listes longues de paramètres

### Requirement 6: Validation et Feedback

**User Story:** En tant qu'utilisateur, je veux être guidé lors de la configuration des paramètres, afin d'éviter les erreurs de configuration.

#### Acceptance Criteria

1. THE System SHALL valider les paramètres en temps réel pendant la saisie
2. WHEN un paramètre est invalide, THE System SHALL afficher l'erreur immédiatement
3. THE System SHALL supporter l'autocomplétion pour les variables
4. WHEN un champ supporte les variables, THE System SHALL afficher les variables disponibles
5. THE System SHALL prévisualiser les valeurs des variables dans les champs
6. WHEN tous les paramètres sont valides, THE System SHALL afficher un indicateur de succès

### Requirement 7: Intégration avec le Système Existant

**User Story:** En tant que développeur, je veux que le nouveau système s'intègre parfaitement avec l'architecture existante, afin de maintenir la cohérence du code.

#### Acceptance Criteria

1. THE PropertiesPanel SHALL utiliser le StepTypeResolver existant pour la résolution des types
2. THE System SHALL maintenir la compatibilité avec les hooks existants (useStepTypeResolver)
3. THE System SHALL respecter les interfaces TypeScript existantes
4. THE System SHALL utiliser les services existants (catalogService, apiClient)
5. THE System SHALL maintenir les logs de débogage pour le développement
6. THE System SHALL être testable avec les frameworks de test existants

### Requirement 8: Extensibilité Future

**User Story:** En tant que développeur, je veux un système extensible pour ajouter de nouveaux types de paramètres, afin de supporter l'évolution du produit.

#### Acceptance Criteria

1. THE ParameterFieldRenderer SHALL supporter l'ajout de nouveaux types de champs
2. THE System SHALL permettre l'enregistrement de renderers personnalisés
3. THE StandardParametersEditor SHALL être extensible pour de nouveaux types d'étapes
4. THE VWBActionProperties SHALL supporter l'évolution du format des actions VWB
5. THE System SHALL maintenir une API stable pour les extensions futures