@rsuci/shared-form-components 1.0.83 → 1.0.85

package/dist/components/inputs/DatePicker.d.ts

@@ -1,6 +1,9 @@
 /**
  * Composant DatePicker - Sélecteur de date et date-heure
  * RSU v2 - Moteur de Rendu des Formulaires d'Enquête
+ *
+ * Supporte la saisie manuelle (dd/MM/yyyy ou dd/MM/yyyy HH:mm)
+ * ET la sélection via le calendrier natif du navigateur.
  */
 import React from 'react';
 import { VariableFormulaire, VariableValue } from '../../types/enquete';

package/dist/components/inputs/DatePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/DatePicker.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAKxE,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,kBAAkB,GAAG;QAAE,QAAQ,EAAE,MAAM,GAAG,WAAW,CAAA;KAAE,CAAC;IAClE,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACzC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAkEzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/DatePicker.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,KAAmD,MAAM,OAAO,CAAC;AAExE,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAKxE,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,kBAAkB,GAAG;QAAE,QAAQ,EAAE,MAAM,GAAG,WAAW,CAAA;KAAE,CAAC;IAClE,KAAK,EAAE,aAAa,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;IACzC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAuDD,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA+JzC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/dist/components/inputs/DatePicker.js

@@ -1,57 +1,178 @@
 /**
  * Composant DatePicker - Sélecteur de date et date-heure
  * RSU v2 - Moteur de Rendu des Formulaires d'Enquête
+ *
+ * Supporte la saisie manuelle (dd/MM/yyyy ou dd/MM/yyyy HH:mm)
+ * ET la sélection via le calendrier natif du navigateur.
  */
 'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef, useEffect, useCallback } from 'react';
+import { Calendar } from 'lucide-react';
 import { VariableValueConverter } from '../../lib/utils/variableValueConverter';
 import { applyComponentStyle } from '../../utils/styleUtils';
 import { isComponentReadonly, readonlyClasses } from '../../utils/componentStateUtils';
+/**
+ * Applique le masque de saisie date sur une chaîne de chiffres bruts.
+ * DATE:      dd/MM/yyyy       (max 8 chiffres → 10 chars avec séparateurs)
+ * DATEHEURE: dd/MM/yyyy HH:mm (max 12 chiffres → 16 chars avec séparateurs)
+ */
+function applyDateMask(raw, isDateTime) {
+    // Ne garder que les chiffres
+    const digits = raw.replace(/\D/g, '');
+    const maxDigits = isDateTime ? 12 : 8;
+    const limited = digits.slice(0, maxDigits);
+    let result = '';
+    for (let i = 0; i < limited.length; i++) {
+        // Séparateurs pour la partie date: après position 2 et 4 (dd/MM/yyyy)
+        if (i === 2 || i === 4)
+            result += '/';
+        // Séparateurs pour la partie heure: espace après position 8, : après position 10
+        if (i === 8)
+            result += ' ';
+        if (i === 10)
+            result += ':';
+        result += limited[i];
+    }
+    return result;
+}
+/**
+ * Convertit une Date JS en chaîne d'affichage dd/MM/yyyy ou dd/MM/yyyy HH:mm
+ */
+function dateToDisplay(date, isDateTime) {
+    const d = date.getDate().toString().padStart(2, '0');
+    const m = (date.getMonth() + 1).toString().padStart(2, '0');
+    const y = date.getFullYear();
+    if (isDateTime) {
+        const hh = date.getHours().toString().padStart(2, '0');
+        const mm = date.getMinutes().toString().padStart(2, '0');
+        return `${d}/${m}/${y} ${hh}:${mm}`;
+    }
+    return `${d}/${m}/${y}`;
+}
+/**
+ * Convertit une Date JS en format ISO pour l'input natif caché
+ */
+function dateToIso(date, isDateTime) {
+    const y = date.getFullYear();
+    const m = (date.getMonth() + 1).toString().padStart(2, '0');
+    const d = date.getDate().toString().padStart(2, '0');
+    if (isDateTime) {
+        const hh = date.getHours().toString().padStart(2, '0');
+        const mm = date.getMinutes().toString().padStart(2, '0');
+        return `${y}-${m}-${d}T${hh}:${mm}`;
+    }
+    return `${y}-${m}-${d}`;
+}
 const DatePicker = ({ variable, value, onChange, onBlur, error, disabled, isConsultationMode = false }) => {
     const props = variable.proprietes;
     const { textStyle, containerStyle } = applyComponentStyle(variable.componentStyle);
-    // Déterminer si le composant est en lecture seule
+    const isDateTime = variable.typeCode === 'DATEHEURE';
     const isReadonly = isComponentReadonly(variable, isConsultationMode);
-    // Générer les classes CSS
+    const hiddenInputRef = useRef(null);
+    const isTypingRef = useRef(false);
+    // État local pour le texte affiché dans l'input
+    const [displayValue, setDisplayValue] = useState('');
+    const [hasFormatError, setHasFormatError] = useState(false);
+    // Synchroniser la prop value → displayValue (quand la valeur change depuis l'extérieur)
+    useEffect(() => {
+        if (isTypingRef.current)
+            return; // Ne pas écraser pendant la saisie
+        if (!value || value === '') {
+            setDisplayValue('');
+            setHasFormatError(false);
+            return;
+        }
+        const parsed = VariableValueConverter.parse(value, variable.typeCode);
+        if (parsed && !isNaN(parsed.getTime())) {
+            setDisplayValue(dateToDisplay(parsed, isDateTime));
+            setHasFormatError(false);
+        }
+    }, [value, variable.typeCode, isDateTime]);
+    // Valeur ISO pour l'input natif caché
+    const isoValue = (() => {
+        const parsed = VariableValueConverter.parse(value, variable.typeCode);
+        if (parsed && !isNaN(parsed.getTime())) {
+            return dateToIso(parsed, isDateTime);
+        }
+        return '';
+    })();
+    const inputType = isDateTime ? 'datetime-local' : 'date';
+    const placeholder = isDateTime ? 'jj/MM/aaaa HH:mm' : 'jj/MM/aaaa';
+    const maxLength = isDateTime ? 16 : 10;
+    // Classes CSS
     const getInputClasses = () => {
-        const baseClasses = 'w-full px-3 py-2 border rounded-lg focus:ring-2 focus:ring-green-500 focus:border-transparent text-gray-900';
-        const errorClasses = error ? 'border-red-500' : 'border-gray-300';
+        const baseClasses = 'w-full px-3 py-2 pr-10 border rounded-lg focus:ring-2 focus:ring-green-500 focus:border-transparent text-gray-900';
+        const borderClass = (error || hasFormatError) ? 'border-red-500' : 'border-gray-300';
         if (disabled)
-            return `${baseClasses} ${errorClasses} bg-gray-100 cursor-not-allowed text-gray-500`;
+            return `${baseClasses} ${borderClass} bg-gray-100 cursor-not-allowed text-gray-500`;
         if (isReadonly)
-            return `${baseClasses} ${errorClasses} ${readonlyClasses.readonly}`;
-        return `${baseClasses} ${errorClasses} bg-white`;
+            return `${baseClasses} ${borderClass} ${readonlyClasses.readonly}`;
+        return `${baseClasses} ${borderClass} bg-white`;
     };
-    // Conversion de la valeur string vers Date pour l'affichage
-    const parsedDate = VariableValueConverter.parse(value, variable.typeCode);
-    // Formatage pour l'input HTML (qui exige YYYY-MM-DD / YYYY-MM-DDTHH:mm)
-    let inputValue = '';
-    if (parsedDate && !isNaN(parsedDate.getTime())) {
-        const y = parsedDate.getFullYear();
-        const m = (parsedDate.getMonth() + 1).toString().padStart(2, '0');
-        const d = parsedDate.getDate().toString().padStart(2, '0');
-        if (variable.typeCode === 'DATEHEURE') {
-            const hh = parsedDate.getHours().toString().padStart(2, '0');
-            const mm = parsedDate.getMinutes().toString().padStart(2, '0');
-            inputValue = `${y}-${m}-${d}T${hh}:${mm}`;
+    // Saisie manuelle avec masque
+    const handleTextChange = useCallback((e) => {
+        isTypingRef.current = true;
+        const masked = applyDateMask(e.target.value, isDateTime);
+        setDisplayValue(masked);
+        setHasFormatError(false);
+    }, [isDateTime]);
+    // Validation au blur
+    const handleBlur = useCallback(() => {
+        isTypingRef.current = false;
+        if (!displayValue || displayValue.trim() === '') {
+            setHasFormatError(false);
+            onChange('');
+            onBlur?.();
+            return;
+        }
+        // Vérifier que la longueur est complète
+        const expectedLength = isDateTime ? 16 : 10;
+        if (displayValue.length < expectedLength) {
+            setHasFormatError(true);
+            onBlur?.();
+            return;
+        }
+        // Tenter de parser
+        const parsed = VariableValueConverter.parse(displayValue, variable.typeCode);
+        if (parsed && !isNaN(parsed.getTime())) {
+            const serialized = VariableValueConverter.serialize(parsed, variable.typeCode);
+            setHasFormatError(false);
+            onChange(serialized);
         }
         else {
-            inputValue = `${y}-${m}-${d}`;
+            setHasFormatError(true);
         }
-    }
-    const inputType = variable.typeCode === 'DATEHEURE' ? 'datetime-local' : 'date';
-    const handleChange = (e) => {
+        onBlur?.();
+    }, [displayValue, isDateTime, variable.typeCode, onChange, onBlur]);
+    // Sélection via le calendrier natif
+    const handlePickerChange = useCallback((e) => {
         if (!e.target.value) {
-            onChange(''); // Sérialiser comme string vide
+            setDisplayValue('');
+            onChange('');
             return;
         }
         const newDate = new Date(e.target.value);
         if (!isNaN(newDate.getTime())) {
-            // Sérialiser la date vers string pour le stockage
-            const serializedValue = VariableValueConverter.serialize(newDate, variable.typeCode);
-            onChange(serializedValue);
+            setDisplayValue(dateToDisplay(newDate, isDateTime));
+            setHasFormatError(false);
+            const serialized = VariableValueConverter.serialize(newDate, variable.typeCode);
+            onChange(serialized);
         }
-    };
-    return (_jsx("div", { style: containerStyle, children: _jsx("input", { type: inputType, value: inputValue, onChange: handleChange, onBlur: onBlur, min: props?.minDate ? VariableValueConverter.serialize(props.minDate, variable.typeCode) : undefined, max: props?.maxDate ? VariableValueConverter.serialize(props.maxDate, variable.typeCode) : undefined, disabled: disabled, readOnly: isReadonly, style: textStyle, className: getInputClasses() }) }));
+    }, [isDateTime, variable.typeCode, onChange]);
+    // Ouvrir le picker natif
+    const handleCalendarClick = useCallback(() => {
+        if (hiddenInputRef.current) {
+            try {
+                hiddenInputRef.current.showPicker();
+            }
+            catch {
+                // Fallback: focus si showPicker() n'est pas supporté
+                hiddenInputRef.current.focus();
+                hiddenInputRef.current.click();
+            }
+        }
+    }, []);
+    return (_jsxs("div", { style: containerStyle, className: "relative", children: [_jsx("input", { type: "text", value: displayValue, onChange: handleTextChange, onBlur: handleBlur, placeholder: placeholder, maxLength: maxLength, disabled: disabled, readOnly: isReadonly, style: textStyle, className: getInputClasses() }), !disabled && !isReadonly && (_jsx("button", { type: "button", onClick: handleCalendarClick, className: "absolute right-2 top-1/2 -translate-y-1/2 p-1 text-gray-400 hover:text-gray-600 focus:outline-none", tabIndex: -1, "aria-label": "Ouvrir le calendrier", children: _jsx(Calendar, { className: "h-4 w-4" }) })), _jsx("input", { ref: hiddenInputRef, type: inputType, value: isoValue, onChange: handlePickerChange, min: props?.minDate ? dateToIso(props.minDate, isDateTime) : undefined, max: props?.maxDate ? dateToIso(props.maxDate, isDateTime) : undefined, className: "sr-only", tabIndex: -1, "aria-hidden": "true" })] }));
 };
 export default DatePicker;

package/dist/components/inputs/GeographicCascadeInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GeographicCascadeInput.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/GeographicCascadeInput.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAA4D,MAAM,OAAO,CAAC;AAWjF;;GAEG;AACH,UAAU,SAAS;IACjB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;CACrB;AAWD,UAAU,2BAA2B;IACnC,QAAQ,EAAE,GAAG,CAAC;IACd,KAAK,EAAE,GAAG,CAAC;IACX,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI,KAAK,IAAI,CAAC;IAC5C,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAkPxE,CAAC;AAEF,eAAe,sBAAsB,CAAC"}
+{"version":3,"file":"GeographicCascadeInput.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/GeographicCascadeInput.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAA4D,MAAM,OAAO,CAAC;AAWjF;;GAEG;AACH,UAAU,SAAS;IACjB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;CACrB;AAWD,UAAU,2BAA2B;IACnC,QAAQ,EAAE,GAAG,CAAC;IACd,KAAK,EAAE,GAAG,CAAC;IACX,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI,KAAK,IAAI,CAAC;IAC5C,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CAwPxE,CAAC;AAEF,eAAe,sBAAsB,CAAC"}

package/dist/components/inputs/GeographicCascadeInput.js

@@ -15,6 +15,10 @@ export const GeographicCascadeInput = ({ variable, value, onChange, reponses, di
     const [error, setError] = useState(null);
     // 1. Déterminer si ce type nécessite un parent
     const needsParent = requiresParent(variable.typeCode);
+    // 1b. Vérifier si un parent est CONFIGURÉ dans la variable (valeur non vide)
+    const hasParentConfigured = !!extractVariableCode(variable);
+    // Le champ a besoin d'un parent SEULEMENT si le type le requiert ET qu'un parent est configuré
+    const effectiveNeedsParent = needsParent && hasParentConfigured;
     // 2. Résoudre la valeur du parent depuis les réponses
     const parentValue = resolveParentValue(variable, reponses);
     // Debug temporaire - À SUPPRIMER après validation
@@ -34,11 +38,11 @@ export const GeographicCascadeInput = ({ variable, value, onChange, reponses, di
         ? (variable.valeur || 'CIV')
         : undefined;
     // 4. Déterminer l'endpoint API à appeler
-    const apiEndpoint = getApiEndpoint(variable.typeCode, parentValue, countryCode);
+    const apiEndpoint = getApiEndpoint(variable.typeCode, parentValue, countryCode, hasParentConfigured);
     // 4. Fonction pour charger les données
     const fetchData = useCallback(async () => {
-        // Si un parent est requis mais absent, ne rien charger
-        if (needsParent && !parentValue) {
+        // Si un parent est requis (configuré) mais absent, ne rien charger
+        if (effectiveNeedsParent && !parentValue) {
             setItems([]);
             setLoading(false);
             setError(null);
@@ -90,7 +94,7 @@ export const GeographicCascadeInput = ({ variable, value, onChange, reponses, di
         finally {
             setLoading(false);
         }
-    }, [apiEndpoint, needsParent, parentValue, variable.type, variable.libelle]);
+    }, [apiEndpoint, effectiveNeedsParent, parentValue, variable.type, variable.libelle]);
     // 5. Charger les données quand l'endpoint ou le parent change
     useEffect(() => {
         fetchData();
@@ -98,8 +102,8 @@ export const GeographicCascadeInput = ({ variable, value, onChange, reponses, di
     // 6. Réinitialiser la valeur si le parent change
     const previousParentRef = useRef(undefined);
     useEffect(() => {
-        // Si un parent est requis et que la valeur du parent a changé
-        if (needsParent) {
+        // Si un parent est requis (configuré) et que la valeur du parent a changé
+        if (effectiveNeedsParent) {
             // Premier rendu : initialiser la référence sans réinitialiser
             if (previousParentRef.current === undefined) {
                 previousParentRef.current = parentValue;
@@ -111,7 +115,7 @@ export const GeographicCascadeInput = ({ variable, value, onChange, reponses, di
             }
             previousParentRef.current = parentValue;
         }
-    }, [parentValue, needsParent, value, onChange]);
+    }, [parentValue, effectiveNeedsParent, value, onChange]);
     // 7. Gérer le changement de valeur
     const handleChange = (option) => {
         if (!option) {
@@ -128,12 +132,12 @@ export const GeographicCascadeInput = ({ variable, value, onChange, reponses, di
     };
     // 8. Déterminer si le champ est désactivé (select ne supporte pas readonly, on utilise disabled)
     const isReadonly = isComponentReadonly(variable, isConsultationMode);
-    const isDisabled = disabled || isReadonly || loading || (needsParent && !parentValue);
+    const isDisabled = disabled || isReadonly || loading || (effectiveNeedsParent && !parentValue);
     // 9. Déterminer le message du placeholder
     const getPlaceholder = () => {
         if (loading)
             return 'Chargement...';
-        if (needsParent && !parentValue) {
+        if (effectiveNeedsParent && !parentValue) {
             return `Sélectionnez d'abord ${getParentLabel(variable.typeCode)}`;
         }
         if (items.length === 0 && !loading) {
@@ -176,11 +180,11 @@ export const GeographicCascadeInput = ({ variable, value, onChange, reponses, di
         designation: parsedValue.designation
     } : null;
     // 13. Rendu du composant
-    return (_jsxs("div", { className: "w-full", children: [_jsx(SearchableSelect, { options: options, value: currentValue, onChange: handleChange, placeholder: getPlaceholder(), searchPlaceholder: "Rechercher...", disabled: isDisabled, required: required, loading: loading, error: error || undefined, className: className, noOptionsMessage: needsParent && !parentValue
+    return (_jsxs("div", { className: "w-full", children: [_jsx(SearchableSelect, { options: options, value: currentValue, onChange: handleChange, placeholder: getPlaceholder(), searchPlaceholder: "Rechercher...", disabled: isDisabled, required: required, loading: loading, error: error || undefined, className: className, noOptionsMessage: effectiveNeedsParent && !parentValue
                     ? `Veuillez d'abord sélectionner ${getParentLabel(variable.typeCode)}`
                     : `Aucun(e) ${variable.designation?.toLowerCase() || 'élément'} disponible`, formatOptionLabel: (option) => {
                     // Afficher uniquement la désignation
                     return option.designation;
-                } }), needsParent && !parentValue && !loading && !error && (_jsxs("p", { className: "mt-1 text-sm text-gray-500 flex items-center", children: [_jsx("svg", { className: "w-4 h-4 mr-1", fill: "currentColor", viewBox: "0 0 20 20", children: _jsx("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" }) }), "Veuillez d'abord s\u00E9lectionner ", getParentLabel(variable.typeCode)] })), loading && (_jsxs("p", { className: "mt-1 text-sm text-blue-600 flex items-center", children: [_jsxs("svg", { className: "animate-spin h-4 w-4 mr-1", fill: "none", viewBox: "0 0 24 24", children: [_jsx("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), _jsx("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })] }), "Chargement des donn\u00E9es..."] }))] }));
+                } }), effectiveNeedsParent && !parentValue && !loading && !error && (_jsxs("p", { className: "mt-1 text-sm text-gray-500 flex items-center", children: [_jsx("svg", { className: "w-4 h-4 mr-1", fill: "currentColor", viewBox: "0 0 20 20", children: _jsx("path", { fillRule: "evenodd", d: "M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z", clipRule: "evenodd" }) }), "Veuillez d'abord s\u00E9lectionner ", getParentLabel(variable.typeCode)] })), loading && (_jsxs("p", { className: "mt-1 text-sm text-blue-600 flex items-center", children: [_jsxs("svg", { className: "animate-spin h-4 w-4 mr-1", fill: "none", viewBox: "0 0 24 24", children: [_jsx("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), _jsx("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })] }), "Chargement des donn\u00E9es..."] }))] }));
 };
 export default GeographicCascadeInput;

package/dist/utils/variableDependencyResolver.d.ts

@@ -40,7 +40,7 @@ export declare function resolveParentValue(variable: any, reponses: Record<strin
  * getApiEndpoint('REGION', 1) // Returns: '/api/v1/Regions/1/select'
  * getApiEndpoint('REGION') // Returns: null (parent requis mais absent)
  */
-export declare function getApiEndpoint(variableType: string, parentId?: number | null, defaultCountryCode?: string): string | null;
+export declare function getApiEndpoint(variableType: string, parentId?: number | null, defaultCountryCode?: string, hasParentConfigured?: boolean): string | null;
 /**
  * Détermine le libellé du parent selon le type de variable
  * @param variableType - Type de la variable

package/dist/utils/variableDependencyResolver.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"variableDependencyResolver.d.ts","sourceRoot":"","sources":["../../src/utils/variableDependencyResolver.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;;;;;;;;;;;GAYG;AACH,wBAAgB,mBAAmB,CAAC,gBAAgB,EAAE,MAAM,GAAG,GAAG,GAAG,IAAI,GAAG,SAAS,GAAG,MAAM,GAAG,IAAI,CAmCpG;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB,CAChC,QAAQ,EAAE,GAAG,EACb,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAC5B,MAAM,GAAG,IAAI,CA+Cf;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,cAAc,CAC5B,YAAY,EAAE,MAAM,EACpB,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,EACxB,kBAAkB,GAAE,MAAc,GACjC,MAAM,GAAG,IAAI,CA2Bf;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,YAAY,EAAE,MAAM,GAAG,MAAM,CAa3D;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAW5D;AAED;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAY9D"}
+{"version":3,"file":"variableDependencyResolver.d.ts","sourceRoot":"","sources":["../../src/utils/variableDependencyResolver.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;;;;;;;;;;;GAYG;AACH,wBAAgB,mBAAmB,CAAC,gBAAgB,EAAE,MAAM,GAAG,GAAG,GAAG,IAAI,GAAG,SAAS,GAAG,MAAM,GAAG,IAAI,CAmCpG;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB,CAChC,QAAQ,EAAE,GAAG,EACb,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAC5B,MAAM,GAAG,IAAI,CA+Cf;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,cAAc,CAC5B,YAAY,EAAE,MAAM,EACpB,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,EACxB,kBAAkB,GAAE,MAAc,EAClC,mBAAmB,GAAE,OAAc,GAClC,MAAM,GAAG,IAAI,CA+Bf;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,YAAY,EAAE,MAAM,GAAG,MAAM,CAa3D;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAW5D;AAED;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAAC,YAAY,EAAE,MAAM,GAAG,OAAO,CAY9D"}

package/dist/utils/variableDependencyResolver.js

@@ -114,23 +114,32 @@ export function resolveParentValue(variable, reponses) {
  * getApiEndpoint('REGION', 1) // Returns: '/api/v1/Regions/1/select'
  * getApiEndpoint('REGION') // Returns: null (parent requis mais absent)
  */
-export function getApiEndpoint(variableType, parentId, defaultCountryCode = 'CIV') {
+export function getApiEndpoint(variableType, parentId, defaultCountryCode = 'CIV', hasParentConfigured = true) {
     const type = variableType?.toUpperCase();
     switch (type) {
         case 'DISTRICT':
-            // Pour DISTRICT, pas besoin de code pays dans l'URL
             return `/api/v1/Districts/select`;
         case 'REGION':
-            return parentId ? `/api/v1/Regions/${parentId}/select` : null;
+            if (parentId)
+                return `/api/v1/Regions/${parentId}/select`;
+            return hasParentConfigured ? null : `/api/v1/Regions/select`;
         case 'DEPARTEMENT':
-            return parentId ? `/api/v1/Departements/${parentId}/select` : null;
+            if (parentId)
+                return `/api/v1/Departements/${parentId}/select`;
+            return hasParentConfigured ? null : `/api/v1/Departements/select`;
         case 'SOUS_PREFECTURE':
         case 'SOUSPREFECTURE':
-            return parentId ? `/api/v1/SousPrefectures/${parentId}/select` : null;
+            if (parentId)
+                return `/api/v1/SousPrefectures/${parentId}/select`;
+            return hasParentConfigured ? null : `/api/v1/SousPrefectures/select`;
         case 'QUARTIER':
-            return parentId ? `/api/v1/Quartiers/${parentId}/select` : null;
+            if (parentId)
+                return `/api/v1/Quartiers/${parentId}/select`;
+            return hasParentConfigured ? null : `/api/v1/Quartiers/select`;
         case 'VILLAGE':
-            return parentId ? `/api/v1/Villages/${parentId}/select` : null;
+            if (parentId)
+                return `/api/v1/Villages/${parentId}/select`;
+            return hasParentConfigured ? null : `/api/v1/Villages/select`;
         default:
             return null;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rsuci/shared-form-components",
-  "version": "1.0.83",
+  "version": "1.0.85",
   "description": "Composants partagés de rendu de formulaires RSU v2 - Package local pour frontend Admin et Public",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",