@rsuci/shared-form-components 1.0.29 → 1.0.32

package/dist/components/form-renderer/ConfirmationModal.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Composant Modal de Confirmation
+ * RSU v2 - Composant partagé pour les confirmations utilisateur
+ */
+import React from 'react';
+export type ConfirmationModalType = 'danger' | 'warning' | 'info' | 'success';
+export interface ConfirmationModalProps {
+    isOpen: boolean;
+    title: string;
+    message: string;
+    confirmText?: string;
+    cancelText?: string;
+    onConfirm: () => void;
+    onCancel: () => void;
+    type?: ConfirmationModalType;
+    isProcessing?: boolean;
+}
+declare const ConfirmationModal: React.FC<ConfirmationModalProps>;
+export default ConfirmationModal;
+//# sourceMappingURL=ConfirmationModal.d.ts.map

package/dist/components/form-renderer/ConfirmationModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConfirmationModal.d.ts","sourceRoot":"","sources":["../../../src/components/form-renderer/ConfirmationModal.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,MAAM,MAAM,qBAAqB,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC;AAE9E,MAAM,WAAW,sBAAsB;IACrC,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,IAAI,CAAC,EAAE,qBAAqB,CAAC;IAC7B,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA8JvD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/dist/components/form-renderer/ConfirmationModal.js

@@ -0,0 +1,79 @@
+/**
+ * Composant Modal de Confirmation
+ * RSU v2 - Composant partagé pour les confirmations utilisateur
+ */
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef } from 'react';
+import { AlertTriangle, Info, AlertCircle, CheckCircle } from 'lucide-react';
+const ConfirmationModal = ({ isOpen, title, message, confirmText = 'Confirmer', cancelText = 'Annuler', onConfirm, onCancel, type = 'warning', isProcessing = false }) => {
+    const modalRef = useRef(null);
+    const confirmButtonRef = useRef(null);
+    // Focus sur le bouton de confirmation à l'ouverture
+    useEffect(() => {
+        if (isOpen && confirmButtonRef.current) {
+            confirmButtonRef.current.focus();
+        }
+    }, [isOpen]);
+    // Gérer la fermeture avec Escape
+    useEffect(() => {
+        const handleEscape = (e) => {
+            if (e.key === 'Escape' && isOpen && !isProcessing) {
+                onCancel();
+            }
+        };
+        document.addEventListener('keydown', handleEscape);
+        return () => document.removeEventListener('keydown', handleEscape);
+    }, [isOpen, isProcessing, onCancel]);
+    if (!isOpen)
+        return null;
+    // Configuration du style selon le type
+    const getTypeConfig = () => {
+        switch (type) {
+            case 'danger':
+                return {
+                    icon: _jsx(AlertTriangle, { className: "h-6 w-6 text-red-500" }),
+                    iconBg: 'bg-red-100',
+                    confirmBg: 'bg-red-600 hover:bg-red-700 focus:ring-red-500',
+                    confirmText: 'text-white'
+                };
+            case 'warning':
+                return {
+                    icon: _jsx(AlertCircle, { className: "h-6 w-6 text-yellow-500" }),
+                    iconBg: 'bg-yellow-100',
+                    confirmBg: 'bg-yellow-600 hover:bg-yellow-700 focus:ring-yellow-500',
+                    confirmText: 'text-white'
+                };
+            case 'info':
+                return {
+                    icon: _jsx(Info, { className: "h-6 w-6 text-blue-500" }),
+                    iconBg: 'bg-blue-100',
+                    confirmBg: 'bg-blue-600 hover:bg-blue-700 focus:ring-blue-500',
+                    confirmText: 'text-white'
+                };
+            case 'success':
+                return {
+                    icon: _jsx(CheckCircle, { className: "h-6 w-6 text-green-500" }),
+                    iconBg: 'bg-green-100',
+                    confirmBg: 'bg-green-600 hover:bg-green-700 focus:ring-green-500',
+                    confirmText: 'text-white'
+                };
+            default:
+                return {
+                    icon: _jsx(AlertCircle, { className: "h-6 w-6 text-yellow-500" }),
+                    iconBg: 'bg-yellow-100',
+                    confirmBg: 'bg-yellow-600 hover:bg-yellow-700 focus:ring-yellow-500',
+                    confirmText: 'text-white'
+                };
+        }
+    };
+    const config = getTypeConfig();
+    // Empêcher le clic sur l'overlay de fermer le modal pendant le traitement
+    const handleOverlayClick = (e) => {
+        if (e.target === e.currentTarget && !isProcessing) {
+            onCancel();
+        }
+    };
+    return (_jsxs("div", { className: "fixed inset-0 z-50 overflow-y-auto", "aria-labelledby": "modal-title", role: "dialog", "aria-modal": "true", children: [_jsx("div", { className: "fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity", onClick: handleOverlayClick }), _jsx("div", { className: "flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0", children: _jsxs("div", { ref: modalRef, className: "relative transform overflow-hidden rounded-lg bg-white text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-lg", children: [_jsx("div", { className: "bg-white px-4 pb-4 pt-5 sm:p-6 sm:pb-4", children: _jsxs("div", { className: "sm:flex sm:items-start", children: [_jsx("div", { className: `mx-auto flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-full ${config.iconBg} sm:mx-0 sm:h-10 sm:w-10`, children: config.icon }), _jsxs("div", { className: "mt-3 text-center sm:ml-4 sm:mt-0 sm:text-left", children: [_jsx("h3", { className: "text-base font-semibold leading-6 text-gray-900", id: "modal-title", children: title }), _jsx("div", { className: "mt-2", children: _jsx("p", { className: "text-sm text-gray-500", children: message }) })] })] }) }), _jsxs("div", { className: "bg-gray-50 px-4 py-3 sm:flex sm:flex-row-reverse sm:px-6", children: [_jsx("button", { ref: confirmButtonRef, type: "button", disabled: isProcessing, onClick: onConfirm, className: `inline-flex w-full justify-center rounded-md px-3 py-2 text-sm font-semibold shadow-sm ${config.confirmBg} ${config.confirmText} sm:ml-3 sm:w-auto focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed`, children: isProcessing ? (_jsxs("span", { className: "flex items-center", children: [_jsx("span", { className: "animate-spin rounded-full h-4 w-4 border-b-2 border-white mr-2" }), "Traitement..."] })) : (confirmText) }), _jsx("button", { type: "button", disabled: isProcessing, onClick: onCancel, className: "mt-3 inline-flex w-full justify-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 sm:mt-0 sm:w-auto disabled:opacity-50 disabled:cursor-not-allowed", children: cancelText })] })] }) })] }));
+};
+export default ConfirmationModal;

package/dist/components/form-renderer/FormActions.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Composant des actions du formulaire (Soumettre, Brouillon, Annuler, Validation DR)
+ * RSU v2 - Package Partagé
+ */
+import React from 'react';
+export interface FormActionsProps {
+    /** Classes CSS additionnelles */
+    className?: string;
+    /** Callback personnalisé pour la soumission */
+    onSubmit?: () => Promise<void>;
+    /** Callback personnalisé pour le brouillon */
+    onSaveDraft?: () => Promise<void>;
+    /** Callback personnalisé pour l'annulation */
+    onCancel?: () => void;
+}
+/**
+ * Boutons d'action du formulaire
+ */
+export declare const FormActions: React.FC<FormActionsProps>;
+export default FormActions;
+//# sourceMappingURL=FormActions.d.ts.map

package/dist/components/form-renderer/FormActions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormActions.d.ts","sourceRoot":"","sources":["../../../src/components/form-renderer/FormActions.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,MAAM,WAAW,gBAAgB;IAC/B,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B,8CAA8C;IAC9C,WAAW,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAClC,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;CACvB;AAED;;GAEG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA4JlD,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/form-renderer/FormActions.js

@@ -0,0 +1,81 @@
+/**
+ * Composant des actions du formulaire (Soumettre, Brouillon, Annuler, Validation DR)
+ * RSU v2 - Package Partagé
+ */
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useFormRendererContext } from './FormRendererContext';
+/**
+ * Boutons d'action du formulaire
+ */
+export const FormActions = ({ className = '', onSubmit: customOnSubmit, onSaveDraft: customOnSaveDraft, onCancel: customOnCancel }) => {
+    const { navigation, validation, responses, config, callbacks, formulaire, isSubmitting, setIsSubmitting, hasUnsavedChanges, effectiveDisabled, groupesWithInstances } = useFormRendererContext();
+    const { isLastGroup } = navigation;
+    const { mode, features } = config;
+    const labels = config.labels || {};
+    // État local pour les actions
+    const [isSavingDraft, setIsSavingDraft] = useState(false);
+    // Textes des boutons
+    const submitText = labels.submitButton || (mode === 'admin' ? 'Valider' : 'Soumettre');
+    const draftText = labels.draftButton || 'Enregistrer brouillon';
+    const cancelText = labels.cancelButton || 'Annuler';
+    // Validation complète du formulaire
+    const groupes = groupesWithInstances.length > 0 ? groupesWithInstances : formulaire?.groupes || [];
+    const isFormValid = validation.validateAllGroups(groupes, responses).isValid;
+    // Handlers
+    const handleSubmit = async () => {
+        if (customOnSubmit) {
+            await customOnSubmit();
+            return;
+        }
+        if (effectiveDisabled || isSubmitting)
+            return;
+        // Valider tout le formulaire
+        const result = validation.validateAllGroups(groupes, responses);
+        if (!result.isValid) {
+            if (callbacks.onValidationError) {
+                callbacks.onValidationError(result.errors);
+            }
+            return;
+        }
+        setIsSubmitting(true);
+        try {
+            await callbacks.onSubmit(responses);
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    };
+    const handleSaveDraft = async () => {
+        if (customOnSaveDraft) {
+            await customOnSaveDraft();
+            return;
+        }
+        if (!callbacks.onSaveDraft || effectiveDisabled || isSavingDraft)
+            return;
+        setIsSavingDraft(true);
+        try {
+            await callbacks.onSaveDraft(responses);
+        }
+        finally {
+            setIsSavingDraft(false);
+        }
+    };
+    const handleCancel = () => {
+        if (customOnCancel) {
+            customOnCancel();
+            return;
+        }
+        callbacks.onCancel();
+    };
+    // Ne pas afficher les boutons si on n'est pas sur le dernier groupe
+    // (sauf pour le bouton annuler et brouillon qui sont toujours disponibles)
+    const showSubmitButton = isLastGroup;
+    return (_jsxs("div", { className: `flex flex-wrap gap-2 justify-end ${className}`, children: [_jsx("button", { type: "button", onClick: handleCancel, disabled: isSubmitting || isSavingDraft, className: "px-4 py-2 rounded-lg font-medium transition-colors bg-red-500 text-white hover:bg-red-600 disabled:opacity-50 disabled:cursor-not-allowed", children: cancelText }), mode === 'admin' && features?.saveDraft && callbacks.onSaveDraft && (_jsx("button", { type: "button", onClick: handleSaveDraft, disabled: effectiveDisabled || isSavingDraft || isSubmitting || !hasUnsavedChanges, className: `px-4 py-2 rounded-lg font-medium transition-colors ${hasUnsavedChanges && !effectiveDisabled
+                    ? 'bg-yellow-500 text-white hover:bg-yellow-600'
+                    : 'bg-gray-300 text-gray-500 cursor-not-allowed'}`, children: isSavingDraft ? (_jsxs("span", { className: "flex items-center", children: [_jsxs("svg", { className: "animate-spin -ml-1 mr-2 h-4 w-4", 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" })] }), "Enregistrement..."] })) : (draftText) })), showSubmitButton && (_jsx("button", { type: "button", onClick: handleSubmit, disabled: effectiveDisabled || isSubmitting || !isFormValid, className: `px-4 py-2 rounded-lg font-medium transition-colors ${isFormValid && !effectiveDisabled
+                    ? 'bg-blue-600 text-white hover:bg-blue-700'
+                    : 'bg-gray-400 text-gray-200 cursor-not-allowed'}`, title: !isFormValid ? 'Veuillez remplir tous les champs obligatoires' : '', children: isSubmitting ? (_jsxs("span", { className: "flex items-center", children: [_jsxs("svg", { className: "animate-spin -ml-1 mr-2 h-4 w-4", 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" })] }), "Envoi en cours..."] })) : (submitText) }))] }));
+};
+export default FormActions;

package/dist/components/form-renderer/FormNavigationButtons.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Composant de navigation du formulaire (boutons Précédent/Suivant)
+ * RSU v2 - Package Partagé
+ */
+import React from 'react';
+export interface FormNavigationButtonsProps {
+    /** Classes CSS additionnelles */
+    className?: string;
+    /** Texte personnalisé pour le bouton Précédent */
+    previousLabel?: string;
+    /** Texte personnalisé pour le bouton Suivant */
+    nextLabel?: string;
+    /** Afficher le bouton Précédent */
+    showPrevious?: boolean;
+    /** Afficher le bouton Suivant */
+    showNext?: boolean;
+}
+/**
+ * Boutons de navigation entre les groupes du formulaire
+ */
+export declare const FormNavigationButtons: React.FC<FormNavigationButtonsProps>;
+export default FormNavigationButtons;
+//# sourceMappingURL=FormNavigationButtons.d.ts.map

package/dist/components/form-renderer/FormNavigationButtons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormNavigationButtons.d.ts","sourceRoot":"","sources":["../../../src/components/form-renderer/FormNavigationButtons.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,0BAA0B;IACzC,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kDAAkD;IAClD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mCAAmC;IACnC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAyFtE,CAAC;AAEF,eAAe,qBAAqB,CAAC"}

package/dist/components/form-renderer/FormNavigationButtons.js

@@ -0,0 +1,35 @@
+/**
+ * Composant de navigation du formulaire (boutons Précédent/Suivant)
+ * RSU v2 - Package Partagé
+ */
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useFormRendererContext } from './FormRendererContext';
+/**
+ * Boutons de navigation entre les groupes du formulaire
+ */
+export const FormNavigationButtons = ({ className = '', previousLabel, nextLabel, showPrevious = true, showNext = true }) => {
+    const { navigation, validation, currentGroup, responses, config, effectiveDisabled } = useFormRendererContext();
+    const { isFirstGroup, isLastGroup, goToNextGroup, goToPreviousGroup } = navigation;
+    const labels = config.labels || {};
+    const prevText = previousLabel || labels.previousButton || 'Précédent';
+    const nextText = nextLabel || labels.nextButton || 'Suivant';
+    // Validation avant navigation
+    const canGoNext = validation.validateCurrentGroupRequiredFields(currentGroup, responses);
+    const handleNext = () => {
+        if (canGoNext && !isLastGroup) {
+            goToNextGroup();
+        }
+    };
+    const handlePrevious = () => {
+        if (!isFirstGroup) {
+            goToPreviousGroup();
+        }
+    };
+    return (_jsxs("div", { className: `flex justify-between items-center ${className}`, children: [showPrevious && (_jsxs("button", { type: "button", onClick: handlePrevious, disabled: isFirstGroup || effectiveDisabled, className: `flex items-center px-4 py-2 rounded-lg font-medium transition-colors ${!isFirstGroup && !effectiveDisabled
+                    ? 'bg-orange-500 text-white hover:bg-orange-600'
+                    : 'bg-gray-100 text-gray-400 cursor-not-allowed'}`, children: [_jsx("svg", { className: "h-4 w-4 mr-2", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }), _jsx("span", { className: "hidden sm:inline", children: prevText }), _jsx("span", { className: "sm:hidden", children: "Pr\u00E9c." })] })), (!showPrevious || !showNext) && _jsx("div", {}), showNext && !isLastGroup && (_jsxs("button", { type: "button", onClick: handleNext, disabled: !canGoNext || effectiveDisabled, className: `flex items-center px-4 py-2 rounded-lg font-medium transition-colors ${canGoNext && !effectiveDisabled
+                    ? 'bg-green-600 text-white hover:bg-green-700'
+                    : 'bg-gray-400 text-gray-200 cursor-not-allowed'}`, title: !canGoNext ? 'Veuillez remplir tous les champs obligatoires' : 'Passer au groupe suivant', children: [_jsx("span", { className: "hidden sm:inline", children: nextText }), _jsx("span", { className: "sm:hidden", children: "Suiv." }), _jsx("svg", { className: "h-4 w-4 ml-2", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" }) })] }))] }));
+};
+export default FormNavigationButtons;

package/dist/components/form-renderer/FormProgress.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Composant de barre de progression du formulaire
+ * RSU v2 - Package Partagé
+ */
+import React from 'react';
+export interface FormProgressProps {
+    /** Afficher les labels des groupes */
+    showLabels?: boolean;
+    /** Afficher le pourcentage */
+    showPercentage?: boolean;
+    /** Classes CSS additionnelles */
+    className?: string;
+}
+/**
+ * Barre de progression indiquant l'avancement dans le formulaire
+ */
+export declare const FormProgress: React.FC<FormProgressProps>;
+export default FormProgress;
+//# sourceMappingURL=FormProgress.d.ts.map

package/dist/components/form-renderer/FormProgress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormProgress.d.ts","sourceRoot":"","sources":["../../../src/components/form-renderer/FormProgress.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,iBAAiB;IAChC,sCAAsC;IACtC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,8BAA8B;IAC9B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,iCAAiC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA8EpD,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/form-renderer/FormProgress.js

@@ -0,0 +1,26 @@
+/**
+ * Composant de barre de progression du formulaire
+ * RSU v2 - Package Partagé
+ */
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useFormRendererContext } from './FormRendererContext';
+/**
+ * Barre de progression indiquant l'avancement dans le formulaire
+ */
+export const FormProgress = ({ showLabels = false, showPercentage = true, className = '' }) => {
+    const { navigation, groupesWithInstances, formulaire } = useFormRendererContext();
+    const { navigationState, progressPercent } = navigation;
+    const groupes = groupesWithInstances.length > 0 ? groupesWithInstances : formulaire?.groupes || [];
+    const currentIndex = navigationState.groupeIndex;
+    const totalGroupes = groupes.length;
+    if (totalGroupes === 0) {
+        return null;
+    }
+    return (_jsxs("div", { className: `w-full ${className}`, children: [_jsxs("div", { className: "relative", children: [_jsx("div", { className: "w-full bg-gray-200 rounded-full h-2.5", children: _jsx("div", { className: "bg-blue-600 h-2.5 rounded-full transition-all duration-300 ease-out", style: { width: `${progressPercent}%` } }) }), _jsx("div", { className: "flex justify-between mt-1", children: groupes.map((groupe, index) => (_jsxs("div", { className: `flex flex-col items-center ${index <= currentIndex ? 'text-blue-600' : 'text-gray-400'}`, style: { width: `${100 / totalGroupes}%` }, children: [_jsx("div", { className: `w-3 h-3 rounded-full -mt-3 border-2 ${index < currentIndex
+                                        ? 'bg-blue-600 border-blue-600'
+                                        : index === currentIndex
+                                            ? 'bg-white border-blue-600'
+                                            : 'bg-white border-gray-300'}` }), showLabels && (_jsx("span", { className: "text-xs mt-1 truncate max-w-full text-center", children: groupe.designation }))] }, groupe.code))) })] }), _jsxs("div", { className: "flex justify-between items-center mt-2 text-sm text-gray-600", children: [_jsxs("span", { children: ["Groupe ", currentIndex + 1, " sur ", totalGroupes] }), showPercentage && (_jsxs("span", { className: "font-medium text-blue-600", children: [progressPercent, "%"] }))] })] }));
+};
+export default FormProgress;

package/dist/components/form-renderer/FormRenderer.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Composant principal FormRenderer unifié
+ * Supporte les modes admin et public via configuration
+ * RSU v2 - Package Partagé
+ */
+import React from 'react';
+import { FormulaireComplet, EnqueteInstance, EnqueteReponse } from '../../types/enquete';
+import { FormRendererConfig, FormRendererCallbacks } from '../../types/form-renderer';
+import { FormRendererServices, GeographicComponents } from '../../types/services';
+/**
+ * Props simplifiées pour FormRenderer
+ */
+export interface FormRendererProps {
+    /** Le formulaire à rendre */
+    formulaire: FormulaireComplet;
+    /** L'instance d'enquête (optionnel pour nouvelle enquête) */
+    enquete?: EnqueteInstance;
+    /** Réponses initiales */
+    initialResponses?: Record<string, EnqueteReponse>;
+    /** Configuration du FormRenderer */
+    config: FormRendererConfig;
+    /** Callbacks pour les actions */
+    callbacks: FormRendererCallbacks;
+    /** Services injectés */
+    services?: FormRendererServices;
+    /** Composants géographiques injectés */
+    geographicComponents?: GeographicComponents;
+    /** Désactiver tous les inputs */
+    disabled?: boolean;
+    /** État de soumission externe */
+    isSubmitting?: boolean;
+}
+/**
+ * Composant principal FormRenderer
+ * Encapsule le Provider et le composant interne
+ */
+export declare const FormRenderer: React.FC<FormRendererProps>;
+export default FormRenderer;
+//# sourceMappingURL=FormRenderer.d.ts.map

package/dist/components/form-renderer/FormRenderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormRenderer.d.ts","sourceRoot":"","sources":["../../../src/components/form-renderer/FormRenderer.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH,OAAO,KAAyC,MAAM,OAAO,CAAC;AAC9D,OAAO,EACL,iBAAiB,EACjB,eAAe,EACf,cAAc,EAIf,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,kBAAkB,EAClB,qBAAqB,EAEtB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAmBlF;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,6BAA6B;IAC7B,UAAU,EAAE,iBAAiB,CAAC;IAC9B,6DAA6D;IAC7D,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,yBAAyB;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;IAClD,oCAAoC;IACpC,MAAM,EAAE,kBAAkB,CAAC;IAC3B,iCAAiC;IACjC,SAAS,EAAE,qBAAqB,CAAC;IACjC,wBAAwB;IACxB,QAAQ,CAAC,EAAE,oBAAoB,CAAC;IAChC,wCAAwC;IACxC,oBAAoB,CAAC,EAAE,oBAAoB,CAAC;IAC5C,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iCAAiC;IACjC,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAwOD;;;GAGG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAgBpD,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/dist/components/form-renderer/FormRenderer.js

@@ -0,0 +1,113 @@
+/**
+ * Composant principal FormRenderer unifié
+ * Supporte les modes admin et public via configuration
+ * RSU v2 - Package Partagé
+ */
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo, useCallback, useState } from 'react';
+// Contexte et Provider
+import { FormRendererProvider, useFormRendererContext } from './FormRendererContext';
+// Sous-composants
+import FormProgress from './FormProgress';
+import FormNavigationButtons from './FormNavigationButtons';
+import FormActions from './FormActions';
+import GroupeInstanceTabs from './GroupeInstanceTabs';
+import ConfirmationModal from './ConfirmationModal';
+// Composants de rendu
+import VariableRenderer from '../VariableRenderer';
+// Hooks et utilitaires
+import { useFormTree } from '../../hooks/useFormTree';
+/**
+ * Composant interne qui utilise le contexte
+ */
+const FormRendererInner = () => {
+    const context = useFormRendererContext();
+    const { formulaire, enquete, config, callbacks, services, geographicComponents, navigation, validation, instances, responses, updateResponse, hasUnsavedChanges, isSubmitting, effectiveDisabled, currentGroup, currentInstance, groupesWithInstances } = context;
+    const { mode, features } = config;
+    // État local pour les modals
+    const [showCancelModal, setShowCancelModal] = useState(false);
+    // FormTree pour la visibilité des variables
+    const { formTree, getVisibleVariables } = useFormTree(groupesWithInstances.length > 0 ? groupesWithInstances : formulaire?.groupes || [], responses, { debug: false });
+    // Vérifier si une variable est visible
+    const isVariableVisible = useCallback((variable) => {
+        if (!currentGroup?.code)
+            return true;
+        const visibleVars = getVisibleVariables(currentGroup.code);
+        return visibleVars.some(v => v.code === variable.code);
+    }, [currentGroup?.code, getVisibleVariables]);
+    // Filtrer les variables selon le mode
+    const getFilteredVariables = useCallback((variables) => {
+        if (!variables)
+            return [];
+        // En mode public, filtrer les variables MENAGE et ENQUETE
+        if (mode === 'public' && !features?.showMenageVariables && !features?.showEnqueteVariables) {
+            return variables.filter(v => v.typeCode !== 'MENAGE' && v.typeCode !== 'ENQUETE');
+        }
+        return variables;
+    }, [mode, features]);
+    // Obtenir les variables visibles du groupe actuel
+    const visibleVariables = useMemo(() => {
+        if (!currentGroup?.variables)
+            return [];
+        const filtered = getFilteredVariables(currentGroup.variables);
+        return filtered.filter(v => isVariableVisible(v));
+    }, [currentGroup, getFilteredVariables, isVariableVisible]);
+    // Handler pour le changement de variable
+    const handleVariableChange = useCallback((variable, value) => {
+        const numeroMembre = currentGroup?.estMultiple
+            ? currentInstance?.numeroInstance
+            : undefined;
+        updateResponse(variable.code, value, variable, numeroMembre);
+    }, [currentGroup, currentInstance, updateResponse]);
+    // Handler pour l'annulation
+    const handleCancelClick = () => {
+        if (hasUnsavedChanges) {
+            setShowCancelModal(true);
+        }
+        else {
+            callbacks.onCancel();
+        }
+    };
+    const handleConfirmCancel = () => {
+        setShowCancelModal(false);
+        callbacks.onCancel();
+    };
+    // Handler pour le changement d'instance
+    const handleInstanceChange = (instanceIndex) => {
+        navigation.changeInstance(instanceIndex);
+    };
+    // Handler pour l'ajout d'instance
+    const handleInstanceAdded = (instance) => {
+        navigation.updateTotalInstances(currentGroup?.instances?.length || 1);
+        // Naviguer vers la nouvelle instance
+        if (currentGroup?.instances) {
+            navigation.changeInstance(currentGroup.instances.length - 1);
+        }
+    };
+    // Handler pour la suppression d'instance
+    const handleInstanceRemoved = (instanceNumber) => {
+        navigation.updateTotalInstances(currentGroup?.instances?.length || 1);
+        // Revenir à la première instance
+        navigation.changeInstance(0);
+    };
+    // Vérification de la présence de groupes
+    if (!formulaire || !formulaire.groupes || formulaire.groupes.length === 0) {
+        return (_jsx("div", { className: "min-h-screen bg-gray-50 flex items-center justify-center", children: _jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-200 p-8 text-center max-w-md", children: [_jsx("div", { className: "text-red-500 mb-4", children: _jsx("svg", { className: "w-12 h-12 mx-auto", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.732-.833-2.5 0L4.268 18.5c-.77.833.192 2.5 1.732 2.5z" }) }) }), _jsx("h3", { className: "text-lg font-medium text-gray-900 mb-2", children: "Formulaire non configur\u00E9" }), _jsx("p", { className: "text-gray-600 mb-4", children: "Ce formulaire ne contient aucun groupe de variables." }), _jsx("button", { onClick: callbacks.onCancel, className: "inline-flex items-center px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700", children: "Retour" })] }) }));
+    }
+    return (_jsxs("div", { className: "min-h-screen bg-gray-50", children: [_jsxs("div", { className: "max-w-4xl mx-auto px-4 py-6", children: [_jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-200 p-4 mb-6", children: [_jsx("h1", { className: "text-xl font-semibold text-gray-900 mb-4", children: formulaire.designation }), _jsx(FormProgress, { showPercentage: true })] }), _jsxs("div", { className: "bg-white rounded-lg shadow-sm border border-gray-200 p-6 mb-6", children: [_jsxs("div", { className: "mb-6", children: [_jsx("h2", { className: "text-lg font-medium text-gray-900", children: currentGroup?.designation }), currentGroup?.estMultiple && (_jsx("p", { className: "text-sm text-gray-500 mt-1", children: "Groupe \u00E0 instances multiples" }))] }), currentGroup?.estMultiple && currentGroup.instances && (_jsx("div", { className: "mb-6", children: _jsx(GroupeInstanceTabs, { groupe: currentGroup, currentInstanceIndex: navigation.navigationState.instanceIndex, responses: responses, onInstanceChange: handleInstanceChange, onInstanceAdded: handleInstanceAdded, onInstanceRemoved: handleInstanceRemoved, disabled: effectiveDisabled }) })), _jsx("div", { className: "space-y-6", children: visibleVariables.map(variable => {
+                                    const responseKey = currentGroup?.estMultiple && currentInstance?.numeroInstance
+                                        ? `${variable.code}_${currentInstance.numeroInstance}`
+                                        : variable.code;
+                                    const currentValue = responses[responseKey]?.valeur;
+                                    return (_jsx(VariableRenderer, { variable: variable, value: currentValue, onChange: (value) => handleVariableChange(variable, value), disabled: effectiveDisabled, numeroMembre: currentGroup?.estMultiple ? currentInstance?.numeroInstance : undefined, services: services, geographicComponents: geographicComponents, formulaireVariables: formulaire.variables, allResponses: responses, reponses: responses }, variable.id));
+                                }) })] }), _jsx("div", { className: "bg-white rounded-lg shadow-sm border border-gray-200 p-4", children: _jsxs("div", { className: "flex flex-col sm:flex-row justify-between items-center gap-4", children: [_jsx(FormNavigationButtons, {}), _jsx(FormActions, { onCancel: handleCancelClick })] }) })] }), _jsx(ConfirmationModal, { isOpen: showCancelModal, title: "Annuler les modifications", message: "Vous avez des modifications non sauvegard\u00E9es. \u00CAtes-vous s\u00FBr de vouloir quitter ?", confirmText: "Quitter", cancelText: "Continuer", onConfirm: handleConfirmCancel, onCancel: () => setShowCancelModal(false), type: "danger" })] }));
+};
+/**
+ * Composant principal FormRenderer
+ * Encapsule le Provider et le composant interne
+ */
+export const FormRenderer = (props) => {
+    return (_jsx(FormRendererProvider, { formulaire: props.formulaire, enquete: props.enquete, initialResponses: props.initialResponses, config: props.config, callbacks: props.callbacks, services: props.services, geographicComponents: props.geographicComponents, disabled: props.disabled, isSubmitting: props.isSubmitting, children: _jsx(FormRendererInner, {}) }));
+};
+export default FormRenderer;

package/dist/components/form-renderer/FormRendererContext.d.ts

@@ -0,0 +1,109 @@
+/**
+ * Contexte React pour le FormRenderer
+ * Partage l'état et les fonctions entre tous les sous-composants
+ * RSU v2 - Package Partagé
+ */
+import React, { ReactNode } from 'react';
+import { FormulaireComplet, EnqueteInstance, EnqueteReponse, VariableFormulaire, VariableValue } from '../../types/enquete';
+import { FormRendererConfig, FormRendererMode, FormRendererFeatures, FormRendererCallbacks } from '../../types/form-renderer';
+import { FormRendererServices, GeographicComponents } from '../../types/services';
+import { UseFormRendererResult } from '../../hooks/useFormRenderer';
+import { UseFormNavigationResult } from '../../hooks/useFormNavigation';
+import { UseFormValidationResult } from '../../hooks/useFormValidation';
+import { UseFormInstancesResult } from '../../hooks/useFormInstances';
+/**
+ * Valeur du contexte FormRenderer
+ */
+export interface FormRendererContextValue extends UseFormRendererResult {
+    /** Le formulaire complet */
+    formulaire: FormulaireComplet;
+    /** L'instance d'enquête */
+    enquete?: EnqueteInstance;
+    /** Configuration complète */
+    config: FormRendererConfig;
+    /** Callbacks pour les actions */
+    callbacks: FormRendererCallbacks;
+    /** Services pour les composants */
+    services?: FormRendererServices;
+    /** Composants géographiques */
+    geographicComponents?: GeographicComponents;
+}
+declare const FormRendererContext: React.Context<FormRendererContextValue>;
+/**
+ * Props du Provider
+ */
+export interface FormRendererProviderProps {
+    children: ReactNode;
+    /** Le formulaire à rendre */
+    formulaire: FormulaireComplet;
+    /** L'instance d'enquête (optionnel pour nouvelle enquête) */
+    enquete?: EnqueteInstance;
+    /** Réponses initiales */
+    initialResponses?: Record<string, EnqueteReponse>;
+    /** Configuration */
+    config: FormRendererConfig;
+    /** Callbacks */
+    callbacks: FormRendererCallbacks;
+    /** Services injectés */
+    services?: FormRendererServices;
+    /** Composants géographiques */
+    geographicComponents?: GeographicComponents;
+    /** Désactiver tous les inputs */
+    disabled?: boolean;
+    /** État de soumission externe */
+    isSubmitting?: boolean;
+    /** Fonction pour vérifier si une variable est visible */
+    isVariableVisible?: (variable: VariableFormulaire) => boolean;
+    /** Mode debug */
+    debug?: boolean;
+}
+/**
+ * Provider pour le contexte FormRenderer
+ * Encapsule useFormRenderer et fournit l'état à tous les enfants
+ */
+export declare const FormRendererProvider: React.FC<FormRendererProviderProps>;
+/**
+ * Hook pour accéder au contexte FormRenderer
+ * Doit être utilisé à l'intérieur d'un FormRendererProvider
+ */
+export declare function useFormRendererContext(): FormRendererContextValue;
+/**
+ * Hook pour accéder uniquement à la navigation
+ */
+export declare function useFormRendererNavigation(): UseFormNavigationResult;
+/**
+ * Hook pour accéder uniquement à la validation
+ */
+export declare function useFormRendererValidation(): UseFormValidationResult;
+/**
+ * Hook pour accéder uniquement aux instances
+ */
+export declare function useFormRendererInstances(): UseFormInstancesResult;
+/**
+ * Hook pour accéder à la configuration
+ */
+export declare function useFormRendererConfig(): {
+    mode: FormRendererMode;
+    features: FormRendererFeatures;
+    config: FormRendererConfig;
+};
+/**
+ * Hook pour accéder aux réponses
+ */
+export declare function useFormRendererResponses(): {
+    responses: Record<string, EnqueteReponse>;
+    updateResponse: (variableCode: string, value: VariableValue, variable: VariableFormulaire, numeroMembre?: number) => void;
+    getResponseValue: (variableCode: string, numeroMembre?: number) => VariableValue;
+};
+/**
+ * Hook pour accéder à l'état global
+ */
+export declare function useFormRendererState(): {
+    hasUnsavedChanges: boolean;
+    isSubmitting: boolean;
+    effectiveDisabled: boolean;
+    isReadOnly: boolean;
+    isConsultationMode: boolean;
+};
+export default FormRendererContext;
+//# sourceMappingURL=FormRendererContext.d.ts.map

package/dist/components/form-renderer/FormRendererContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormRendererContext.d.ts","sourceRoot":"","sources":["../../../src/components/form-renderer/FormRendererContext.tsx"],"names":[],"mappings":"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"}