@rsuci/shared-form-components 1.0.14 → 1.0.16
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/GroupRenderer.d.ts +9 -1
- package/dist/components/GroupRenderer.d.ts.map +1 -1
- package/dist/components/GroupRenderer.js +62 -36
- package/dist/components/VariableRenderer.d.ts.map +1 -1
- package/dist/components/VariableRenderer.js +6 -1
- package/dist/components/index.d.ts +4 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +4 -0
- package/dist/components/inputs/EmailEnqueteurInput.d.ts +21 -0
- package/dist/components/inputs/EmailEnqueteurInput.d.ts.map +1 -0
- package/dist/components/inputs/EmailEnqueteurInput.js +23 -0
- package/dist/components/inputs/EmailInput.d.ts +19 -0
- package/dist/components/inputs/EmailInput.d.ts.map +1 -0
- package/dist/components/inputs/EmailInput.js +31 -0
- package/dist/components/inputs/EnqueteurInput.d.ts +21 -0
- package/dist/components/inputs/EnqueteurInput.d.ts.map +1 -0
- package/dist/components/inputs/EnqueteurInput.js +26 -0
- package/dist/components/inputs/TelephoneEnqueteurInput.d.ts +21 -0
- package/dist/components/inputs/TelephoneEnqueteurInput.d.ts.map +1 -0
- package/dist/components/inputs/TelephoneEnqueteurInput.js +23 -0
- package/dist/hooks/useFormTree.d.ts +69 -0
- package/dist/hooks/useFormTree.d.ts.map +1 -0
- package/dist/hooks/useFormTree.js +86 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +7 -0
- package/dist/lib/form-tree.d.ts +76 -0
- package/dist/lib/form-tree.d.ts.map +1 -0
- package/dist/lib/form-tree.js +371 -0
- package/dist/types/enquete.d.ts +1 -1
- package/dist/types/enquete.d.ts.map +1 -1
- package/dist/types/form-tree.d.ts +164 -0
- package/dist/types/form-tree.d.ts.map +1 -0
- package/dist/types/form-tree.js +5 -0
- package/dist/types/services.d.ts +8 -0
- package/dist/types/services.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -1,14 +1,22 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Composant de rendu des groupes pour les formulaires d'enquête
|
|
3
3
|
* RSU v2 - Moteur de Rendu des Formulaires d'Enquête
|
|
4
|
+
*
|
|
5
|
+
* Supporte deux modes:
|
|
6
|
+
* 1. Mode FormTree (nouveau): Utilise le FormTree pour la gestion centralisée de visibilité et jumps
|
|
7
|
+
* 2. Mode ConditionEngine (legacy): Utilise le ConditionEngine directement
|
|
4
8
|
*/
|
|
5
9
|
import React from 'react';
|
|
6
10
|
import { GroupeFormulaire, EnqueteReponse, VariableValue, ValidationError, AutoAction } from '../types/enquete';
|
|
7
11
|
import { ConditionEngine } from '../lib/condition-engine';
|
|
12
|
+
import { FormTree } from '../lib/form-tree';
|
|
8
13
|
interface GroupRendererProps {
|
|
9
14
|
groupe: GroupeFormulaire;
|
|
10
15
|
responses: Record<string, EnqueteReponse>;
|
|
11
|
-
|
|
16
|
+
/** @deprecated Utiliser formTree à la place */
|
|
17
|
+
conditionEngine?: ConditionEngine;
|
|
18
|
+
/** Nouveau: FormTree pour gestion centralisée (recommandé) */
|
|
19
|
+
formTree?: FormTree;
|
|
12
20
|
onChange: (variableCode: string, value: VariableValue, iteration?: number) => void;
|
|
13
21
|
onValidation: (errors: ValidationError[]) => void;
|
|
14
22
|
onAutoAction?: (actions: AutoAction[]) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GroupRenderer.d.ts","sourceRoot":"","sources":["../../src/components/GroupRenderer.tsx"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"GroupRenderer.d.ts","sourceRoot":"","sources":["../../src/components/GroupRenderer.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,OAAO,KAAuC,MAAM,OAAO,CAAC;AAE5D,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,eAAe,EACf,UAAU,EAEX,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,UAAU,kBAAkB;IAC1B,MAAM,EAAE,gBAAgB,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;IAC1C,+CAA+C;IAC/C,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,QAAQ,EAAE,CAAC,YAAY,EAAE,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,SAAS,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IACnF,YAAY,EAAE,CAAC,MAAM,EAAE,eAAe,EAAE,KAAK,IAAI,CAAC;IAClD,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,KAAK,IAAI,CAAC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAsID,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAmU/C,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Composant de rendu des groupes pour les formulaires d'enquête
|
|
3
3
|
* RSU v2 - Moteur de Rendu des Formulaires d'Enquête
|
|
4
|
+
*
|
|
5
|
+
* Supporte deux modes:
|
|
6
|
+
* 1. Mode FormTree (nouveau): Utilise le FormTree pour la gestion centralisée de visibilité et jumps
|
|
7
|
+
* 2. Mode ConditionEngine (legacy): Utilise le ConditionEngine directement
|
|
4
8
|
*/
|
|
5
9
|
'use client';
|
|
6
10
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
7
|
-
import { useState, useEffect } from 'react';
|
|
11
|
+
import { useState, useEffect, useMemo } from 'react';
|
|
8
12
|
import { Plus, Trash2, Users, AlertCircle } from 'lucide-react';
|
|
9
13
|
import VariableRenderer from './VariableRenderer';
|
|
10
14
|
// Composant pour gérer les groupes multiples
|
|
@@ -25,23 +29,22 @@ const MultipleGroupEntry = ({ groupe, iterationNumber, totalIterations, visibleV
|
|
|
25
29
|
const rosterVariables = (variable.typeCode === 'ROSTERCHECK' || variable.typeCode === 'ROSTERLIST')
|
|
26
30
|
? variable.rosterVariables
|
|
27
31
|
: undefined;
|
|
28
|
-
// 🔍 LOG: Vérifier la transmission des rosterVariables dans MultipleGroupEntry
|
|
29
|
-
if (variable.typeCode === 'ROSTERCHECK' || variable.typeCode === 'ROSTERLIST') {
|
|
30
|
-
console.log(`🔍 [GroupRenderer/MultipleGroupEntry] Variable ${variable.code}:`, {
|
|
31
|
-
typeCode: variable.typeCode,
|
|
32
|
-
rosterVariables: rosterVariables,
|
|
33
|
-
rosterVariablesType: typeof rosterVariables,
|
|
34
|
-
isArray: Array.isArray(rosterVariables),
|
|
35
|
-
length: Array.isArray(rosterVariables) ? rosterVariables.length : 'N/A'
|
|
36
|
-
});
|
|
37
|
-
}
|
|
38
32
|
return (_jsx(VariableRenderer, { variable: variable, value: responses[responseKey]?.valeur, onChange: (value) => onChange(responseKey, value, iterationNumber), numeroMembre: iterationNumber, disabled: disabled, rosterVariables: rosterVariables }, responseKey));
|
|
39
33
|
}) })] }));
|
|
40
34
|
};
|
|
41
35
|
// Composant principal GroupRenderer
|
|
42
|
-
const GroupRenderer = ({ groupe, responses, conditionEngine, onChange, onValidation, onAutoAction, disabled = false }) => {
|
|
36
|
+
const GroupRenderer = ({ groupe, responses, conditionEngine, formTree, onChange, onValidation, onAutoAction, disabled = false }) => {
|
|
43
37
|
const [multipleEntries, setMultipleEntries] = useState([1]);
|
|
44
38
|
const [validationErrors, setValidationErrors] = useState([]);
|
|
39
|
+
// Déterminer le mode d'utilisation
|
|
40
|
+
const useFormTreeMode = !!formTree;
|
|
41
|
+
// Obtenir le ConditionEngine (depuis formTree ou directement)
|
|
42
|
+
const engine = useMemo(() => {
|
|
43
|
+
if (formTree) {
|
|
44
|
+
return formTree.getConditionEngine();
|
|
45
|
+
}
|
|
46
|
+
return conditionEngine;
|
|
47
|
+
}, [formTree, conditionEngine]);
|
|
45
48
|
// Obtenir le nombre d'itérations depuis la variable de contrôle
|
|
46
49
|
const getIterationCount = () => {
|
|
47
50
|
if (!groupe.estMultiple || !groupe.configMultiple?.variableControle) {
|
|
@@ -53,26 +56,25 @@ const GroupRenderer = ({ groupe, responses, conditionEngine, onChange, onValidat
|
|
|
53
56
|
}
|
|
54
57
|
return Math.min(controlValue, groupe.configMultiple.maxIterations || 50);
|
|
55
58
|
};
|
|
56
|
-
// Filtrer les variables visibles selon les conditions
|
|
57
|
-
const
|
|
58
|
-
|
|
59
|
+
// Filtrer les variables visibles selon les conditions
|
|
60
|
+
const visibleVariables = useMemo(() => {
|
|
61
|
+
// Mode FormTree: utiliser directement getVisibleVariables
|
|
62
|
+
if (useFormTreeMode && formTree) {
|
|
63
|
+
return formTree.getVisibleVariables(groupe.code);
|
|
64
|
+
}
|
|
65
|
+
// Mode Legacy: filtrage manuel avec ConditionEngine
|
|
66
|
+
if (!engine) {
|
|
67
|
+
return groupe.variables.filter(v => v.estVisible);
|
|
68
|
+
}
|
|
59
69
|
return groupe.variables.filter(variable => {
|
|
60
|
-
console.log(`📋 [GroupRenderer] Processing variable: ${variable.code} (${variable.designation})`);
|
|
61
|
-
console.log(`📋 [GroupRenderer] - estVisible: ${variable.estVisible}`);
|
|
62
|
-
console.log(`📋 [GroupRenderer] - conditionsAffichage: ${variable.conditionsAffichage}`);
|
|
63
70
|
if (!variable.conditionsAffichage) {
|
|
64
|
-
console.log(`📋 [GroupRenderer] - No condition, returning estVisible: ${variable.estVisible}`);
|
|
65
71
|
return variable.estVisible;
|
|
66
72
|
}
|
|
67
|
-
// Évaluer la condition avec le moteur
|
|
68
|
-
const isVisible =
|
|
69
|
-
|
|
70
|
-
const finalResult = variable.estVisible && isVisible;
|
|
71
|
-
console.log(`📋 [GroupRenderer] - Final visibility: ${finalResult} (estVisible: ${variable.estVisible} && condition: ${isVisible})`);
|
|
72
|
-
return finalResult;
|
|
73
|
+
// Évaluer la condition avec le moteur
|
|
74
|
+
const isVisible = engine.evaluate(variable.conditionsAffichage);
|
|
75
|
+
return variable.estVisible && isVisible;
|
|
73
76
|
});
|
|
74
|
-
};
|
|
75
|
-
const visibleVariables = getVisibleVariables();
|
|
77
|
+
}, [useFormTreeMode, formTree, engine, groupe, responses]);
|
|
76
78
|
// Mettre à jour le nombre d'itérations quand la variable de contrôle change
|
|
77
79
|
useEffect(() => {
|
|
78
80
|
if (groupe.estMultiple && groupe.configMultiple?.variableControle) {
|
|
@@ -95,6 +97,19 @@ const GroupRenderer = ({ groupe, responses, conditionEngine, onChange, onValidat
|
|
|
95
97
|
}, [responses[groupe.configMultiple?.variableControle || '']?.valeur, groupe]);
|
|
96
98
|
// Validation du groupe
|
|
97
99
|
useEffect(() => {
|
|
100
|
+
// Mode FormTree: utiliser la validation du FormTree
|
|
101
|
+
if (useFormTreeMode && formTree) {
|
|
102
|
+
const { errors } = formTree.validateGroup(groupe.code);
|
|
103
|
+
const validationErrs = errors.map(msg => ({
|
|
104
|
+
variableCode: groupe.code,
|
|
105
|
+
message: msg,
|
|
106
|
+
type: 'required'
|
|
107
|
+
}));
|
|
108
|
+
setValidationErrors(validationErrs);
|
|
109
|
+
onValidation(validationErrs);
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
// Mode Legacy: validation manuelle
|
|
98
113
|
const errors = [];
|
|
99
114
|
visibleVariables.forEach(variable => {
|
|
100
115
|
if (variable.estObligatoire) {
|
|
@@ -129,10 +144,10 @@ const GroupRenderer = ({ groupe, responses, conditionEngine, onChange, onValidat
|
|
|
129
144
|
});
|
|
130
145
|
setValidationErrors(errors);
|
|
131
146
|
onValidation(errors);
|
|
132
|
-
}, [responses, visibleVariables, multipleEntries, groupe, onValidation]);
|
|
133
|
-
// Exécuter les actions automatiques quand les réponses changent
|
|
147
|
+
}, [responses, visibleVariables, multipleEntries, groupe, onValidation, useFormTreeMode, formTree]);
|
|
148
|
+
// Exécuter les actions automatiques quand les réponses changent (mode legacy uniquement)
|
|
134
149
|
useEffect(() => {
|
|
135
|
-
if (!onAutoAction)
|
|
150
|
+
if (!onAutoAction || !engine || useFormTreeMode)
|
|
136
151
|
return;
|
|
137
152
|
const executeAutoActions = () => {
|
|
138
153
|
const allActions = [];
|
|
@@ -140,21 +155,21 @@ const GroupRenderer = ({ groupe, responses, conditionEngine, onChange, onValidat
|
|
|
140
155
|
visibleVariables.forEach(variable => {
|
|
141
156
|
if (variable.conditionsAffichage && variable.conditionsAffichage.includes('setValeur(')) {
|
|
142
157
|
// Évaluer la condition pour déclencher les actions automatiques
|
|
143
|
-
|
|
158
|
+
engine.evaluate(variable.conditionsAffichage);
|
|
144
159
|
// Récupérer les actions générées
|
|
145
|
-
const actions =
|
|
160
|
+
const actions = engine.getAutoActions();
|
|
146
161
|
allActions.push(...actions);
|
|
147
162
|
}
|
|
148
163
|
});
|
|
149
164
|
if (allActions.length > 0) {
|
|
150
165
|
onAutoAction(allActions);
|
|
151
|
-
|
|
166
|
+
engine.clearAutoActions(); // Nettoyer après exécution
|
|
152
167
|
}
|
|
153
168
|
};
|
|
154
169
|
// Exécuter avec un délai pour éviter les boucles infinies
|
|
155
170
|
const timeoutId = setTimeout(executeAutoActions, 100);
|
|
156
171
|
return () => clearTimeout(timeoutId);
|
|
157
|
-
}, [responses, visibleVariables,
|
|
172
|
+
}, [responses, visibleVariables, engine, onAutoAction, useFormTreeMode]);
|
|
158
173
|
// Gestion des entrées multiples
|
|
159
174
|
const addEntry = () => {
|
|
160
175
|
if (!groupe.configMultiple?.allowManualControl)
|
|
@@ -188,8 +203,19 @@ const GroupRenderer = ({ groupe, responses, conditionEngine, onChange, onValidat
|
|
|
188
203
|
(Array.isArray(value) && value.length === 0);
|
|
189
204
|
};
|
|
190
205
|
// Vérifier si le groupe doit être affiché
|
|
191
|
-
const shouldShowGroup =
|
|
192
|
-
|
|
206
|
+
const shouldShowGroup = useMemo(() => {
|
|
207
|
+
// Mode FormTree: vérifier l'état du groupe
|
|
208
|
+
if (useFormTreeMode && formTree) {
|
|
209
|
+
const groupState = formTree.getGroupState(groupe.code);
|
|
210
|
+
return groupState?.isVisible ?? true;
|
|
211
|
+
}
|
|
212
|
+
// Mode Legacy: évaluer la condition
|
|
213
|
+
if (!groupe.conditionsAffichage)
|
|
214
|
+
return true;
|
|
215
|
+
if (!engine)
|
|
216
|
+
return true;
|
|
217
|
+
return engine.evaluate(groupe.conditionsAffichage);
|
|
218
|
+
}, [useFormTreeMode, formTree, engine, groupe]);
|
|
193
219
|
if (!shouldShowGroup) {
|
|
194
220
|
return null;
|
|
195
221
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"VariableRenderer.d.ts","sourceRoot":"","sources":["../../src/components/VariableRenderer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"VariableRenderer.d.ts","sourceRoot":"","sources":["../../src/components/VariableRenderer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAC;AA+BxC,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC1F,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AACzD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAGlE,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,kBAAkB,CAAC;IAC7B,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,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oBAAoB,CAAC,EAAE,CAAC,UAAU,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC9D,qBAAqB,CAAC,EAAE,CAAC,WAAW,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACjE,mBAAmB,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAC3C,eAAe,CAAC,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAC;QAAC,cAAc,CAAC,EAAE,OAAO,CAAC;QAAC,YAAY,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC1L,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;IAC9C,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAG/B,gBAAgB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAC;IAC9D,eAAe,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAC;IAC7D,wBAAwB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,EAAE,YAAY,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;IAGvH,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,oBAAoB,CAAC,EAAE,GAAG,CAAC;CAC5B;AAGD,QAAA,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAQvD,CAAC;AAGF,QAAA,MAAM,mBAAmB,GACvB,UAAU,MAAM,EAChB,mBAAmB,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC,EAC7D,kBAAkB,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC,KAC3D,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAsD3C,CAAC;AAGF,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAmGrD,CAAC;AAEF,eAAe,gBAAgB,CAAC;AAChC,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,CAAC"}
|
|
@@ -3,7 +3,7 @@ import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
|
|
|
3
3
|
import { Suspense } from 'react';
|
|
4
4
|
import { AlertCircle, HelpCircle } from 'lucide-react';
|
|
5
5
|
// Import des composants depuis l'index
|
|
6
|
-
import { IdDocInput, LabelDisplay, PanelDisplay, GeographicCascadeInput, StringInput, NumberInput, DatePicker, SelectInput, RadioInput, CheckboxInput, ComboboxInput, PhoneInput, GPSInput, HourInput, RSUInput, MenageInput, EnqueteInput, PhotoCapture, ImageUpload } from './index';
|
|
6
|
+
import { IdDocInput, LabelDisplay, PanelDisplay, GeographicCascadeInput, StringInput, NumberInput, DatePicker, SelectInput, RadioInput, CheckboxInput, ComboboxInput, PhoneInput, EmailInput, GPSInput, HourInput, RSUInput, MenageInput, EnqueteInput, PhotoCapture, ImageUpload, EnqueteurInput, EmailEnqueteurInput, TelephoneEnqueteurInput } from './index';
|
|
7
7
|
// Composant générique pour les types géographiques non encore implémentés
|
|
8
8
|
const GeographicFallback = ({ variable }) => {
|
|
9
9
|
return (_jsx("div", { className: "p-3 bg-yellow-50 border border-yellow-200 rounded-lg", children: _jsxs("p", { className: "text-yellow-800 text-sm", children: ["Composant ", variable.typeCode, " en cours d'impl\u00E9mentation"] }) }));
|
|
@@ -25,8 +25,13 @@ const getVariableRenderer = (typeCode, RosterCheckInput, RosterListInput) => {
|
|
|
25
25
|
'PHOTO': PhotoCapture,
|
|
26
26
|
'IMAGE': ImageUpload,
|
|
27
27
|
'PHONE': PhoneInput,
|
|
28
|
+
'EMAIL': EmailInput,
|
|
28
29
|
'LABEL': LabelDisplay,
|
|
29
30
|
'PANEL': PanelDisplay,
|
|
31
|
+
// Composants Enquêteur (lecture seule, données utilisateur connecté)
|
|
32
|
+
'ENQUETEUR': EnqueteurInput,
|
|
33
|
+
'EMAIL_ENQUETEUR': EmailEnqueteurInput,
|
|
34
|
+
'TELEPHONE_ENQUETEUR': TelephoneEnqueteurInput,
|
|
30
35
|
// Composants géographiques - Utilisation du composant unifié GeographicCascadeInput
|
|
31
36
|
'PAYS': GeographicFallback,
|
|
32
37
|
'DISTRICT': GeographicCascadeInput,
|
|
@@ -19,8 +19,12 @@ export { default as RadioInput } from './inputs/RadioInput';
|
|
|
19
19
|
export { default as CheckboxInput } from './inputs/CheckboxInput';
|
|
20
20
|
export { default as ComboboxInput } from './inputs/ComboboxInput';
|
|
21
21
|
export { default as PhoneInput } from './inputs/PhoneInput';
|
|
22
|
+
export { default as EmailInput } from './inputs/EmailInput';
|
|
22
23
|
export { default as GPSInput } from './inputs/GPSInput';
|
|
23
24
|
export { default as HourInput } from './inputs/HourInput';
|
|
25
|
+
export { default as EnqueteurInput } from './inputs/EnqueteurInput';
|
|
26
|
+
export { default as EmailEnqueteurInput } from './inputs/EmailEnqueteurInput';
|
|
27
|
+
export { default as TelephoneEnqueteurInput } from './inputs/TelephoneEnqueteurInput';
|
|
24
28
|
export { default as RosterCheckInput } from './roster/RosterCheckInput';
|
|
25
29
|
export { default as RosterListInput } from './roster/RosterListInput';
|
|
26
30
|
export { default as RosterPanel } from './roster/RosterPanel';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AAErD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAI3D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAGjE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAGpE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,iCAAiC,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AAErD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAI3D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,wBAAwB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAGjE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAGpE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,iCAAiC,CAAC;AACpF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAC9E,OAAO,EAAE,OAAO,IAAI,uBAAuB,EAAE,MAAM,kCAAkC,CAAC;AAGtF,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,0BAA0B,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAG9D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGnE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAC"}
|
package/dist/components/index.js
CHANGED
|
@@ -24,8 +24,12 @@ export { default as RadioInput } from './inputs/RadioInput';
|
|
|
24
24
|
export { default as CheckboxInput } from './inputs/CheckboxInput';
|
|
25
25
|
export { default as ComboboxInput } from './inputs/ComboboxInput';
|
|
26
26
|
export { default as PhoneInput } from './inputs/PhoneInput';
|
|
27
|
+
export { default as EmailInput } from './inputs/EmailInput';
|
|
27
28
|
export { default as GPSInput } from './inputs/GPSInput';
|
|
28
29
|
export { default as HourInput } from './inputs/HourInput';
|
|
30
|
+
export { default as EnqueteurInput } from './inputs/EnqueteurInput';
|
|
31
|
+
export { default as EmailEnqueteurInput } from './inputs/EmailEnqueteurInput';
|
|
32
|
+
export { default as TelephoneEnqueteurInput } from './inputs/TelephoneEnqueteurInput';
|
|
29
33
|
// Roster Components
|
|
30
34
|
export { default as RosterCheckInput } from './roster/RosterCheckInput';
|
|
31
35
|
export { default as RosterListInput } from './roster/RosterListInput';
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Composant EmailEnqueteurInput - Affichage de l'email de l'utilisateur connecté (lecture seule)
|
|
3
|
+
* RSU v2 - Moteur de Rendu des Formulaires d'Enquête
|
|
4
|
+
*/
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import { VariableFormulaire, VariableValue } from '../../types/enquete';
|
|
7
|
+
import { FormRendererServices } from '../../types/services';
|
|
8
|
+
export interface EmailEnqueteurInputProps {
|
|
9
|
+
variable: VariableFormulaire & {
|
|
10
|
+
typeCode: 'EMAIL_ENQUETEUR';
|
|
11
|
+
};
|
|
12
|
+
value: VariableValue;
|
|
13
|
+
onChange: (value: VariableValue) => void;
|
|
14
|
+
onBlur?: () => void;
|
|
15
|
+
error?: string;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
services?: FormRendererServices;
|
|
18
|
+
}
|
|
19
|
+
declare const EmailEnqueteurInput: React.FC<EmailEnqueteurInputProps>;
|
|
20
|
+
export default EmailEnqueteurInput;
|
|
21
|
+
//# sourceMappingURL=EmailEnqueteurInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmailEnqueteurInput.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/EmailEnqueteurInput.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACxE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAE5D,MAAM,WAAW,wBAAwB;IACvC,QAAQ,EAAE,kBAAkB,GAAG;QAAE,QAAQ,EAAE,iBAAiB,CAAA;KAAE,CAAC;IAC/D,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,QAAQ,CAAC,EAAE,oBAAoB,CAAC;CACjC;AAED,QAAA,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA2B3D,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Composant EmailEnqueteurInput - Affichage de l'email de l'utilisateur connecté (lecture seule)
|
|
3
|
+
* RSU v2 - Moteur de Rendu des Formulaires d'Enquête
|
|
4
|
+
*/
|
|
5
|
+
'use client';
|
|
6
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
7
|
+
import { useEffect, useRef } from 'react';
|
|
8
|
+
import { Mail } from 'lucide-react';
|
|
9
|
+
const EmailEnqueteurInput = ({ variable, value, onChange, services }) => {
|
|
10
|
+
const hasInitialized = useRef(false);
|
|
11
|
+
const currentUser = services?.currentUser;
|
|
12
|
+
const displayValue = currentUser?.email || 'Non renseigné';
|
|
13
|
+
useEffect(() => {
|
|
14
|
+
if (!hasInitialized.current && currentUser?.email) {
|
|
15
|
+
if (currentUser.email !== value) {
|
|
16
|
+
onChange(currentUser.email);
|
|
17
|
+
}
|
|
18
|
+
hasInitialized.current = true;
|
|
19
|
+
}
|
|
20
|
+
}, [currentUser, onChange, value]);
|
|
21
|
+
return (_jsxs("div", { className: "relative", children: [_jsx(Mail, { className: "absolute left-3 top-1/2 transform -translate-y-1/2 w-5 h-5 text-gray-400" }), _jsx("input", { type: "email", value: displayValue, readOnly: true, disabled: true, className: "w-full pl-10 pr-3 py-2 border border-gray-300 rounded-lg bg-gray-100 text-gray-700 cursor-not-allowed" })] }));
|
|
22
|
+
};
|
|
23
|
+
export default EmailEnqueteurInput;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Composant EmailInput - Saisie d'adresse email avec validation
|
|
3
|
+
* RSU v2 - Moteur de Rendu des Formulaires d'Enquête
|
|
4
|
+
*/
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import { VariableFormulaire, VariableValue } from '../../types/enquete';
|
|
7
|
+
export interface EmailInputProps {
|
|
8
|
+
variable: VariableFormulaire & {
|
|
9
|
+
typeCode: 'EMAIL';
|
|
10
|
+
};
|
|
11
|
+
value: VariableValue;
|
|
12
|
+
onChange: (value: VariableValue) => void;
|
|
13
|
+
onBlur?: () => void;
|
|
14
|
+
error?: string;
|
|
15
|
+
disabled?: boolean;
|
|
16
|
+
}
|
|
17
|
+
declare const EmailInput: React.FC<EmailInputProps>;
|
|
18
|
+
export default EmailInput;
|
|
19
|
+
//# sourceMappingURL=EmailInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmailInput.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/EmailInput.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAExE,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,kBAAkB,GAAG;QAAE,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC;IACrD,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;CACpB;AAID,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAoCzC,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Composant EmailInput - Saisie d'adresse email avec validation
|
|
3
|
+
* RSU v2 - Moteur de Rendu des Formulaires d'Enquête
|
|
4
|
+
*/
|
|
5
|
+
'use client';
|
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
+
import { useState } from 'react';
|
|
8
|
+
const EMAIL_REGEX = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
|
|
9
|
+
const EmailInput = ({ variable, value, onChange, onBlur, error, disabled }) => {
|
|
10
|
+
const stringValue = value || '';
|
|
11
|
+
const [localError, setLocalError] = useState(null);
|
|
12
|
+
const handleBlur = () => {
|
|
13
|
+
if (stringValue && !EMAIL_REGEX.test(stringValue)) {
|
|
14
|
+
setLocalError('Veuillez saisir une adresse email valide');
|
|
15
|
+
}
|
|
16
|
+
else {
|
|
17
|
+
setLocalError(null);
|
|
18
|
+
}
|
|
19
|
+
onBlur?.();
|
|
20
|
+
};
|
|
21
|
+
const handleChange = (e) => {
|
|
22
|
+
const newValue = e.target.value;
|
|
23
|
+
onChange(newValue);
|
|
24
|
+
if (localError && EMAIL_REGEX.test(newValue)) {
|
|
25
|
+
setLocalError(null);
|
|
26
|
+
}
|
|
27
|
+
};
|
|
28
|
+
const displayError = error || localError;
|
|
29
|
+
return (_jsx("input", { type: "email", value: stringValue, onChange: handleChange, onBlur: handleBlur, placeholder: variable.proprietes?.placeholder || "exemple@domaine.com", disabled: disabled, className: `w-full px-3 py-2 border rounded-lg focus:ring-2 focus:ring-green-500 focus:border-transparent text-gray-900 ${displayError ? 'border-red-500' : 'border-gray-300'} ${disabled ? 'bg-gray-100 cursor-not-allowed text-gray-500' : 'bg-white'}` }));
|
|
30
|
+
};
|
|
31
|
+
export default EmailInput;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Composant EnqueteurInput - Affichage du nom complet de l'utilisateur connecté (lecture seule)
|
|
3
|
+
* RSU v2 - Moteur de Rendu des Formulaires d'Enquête
|
|
4
|
+
*/
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import { VariableFormulaire, VariableValue } from '../../types/enquete';
|
|
7
|
+
import { FormRendererServices } from '../../types/services';
|
|
8
|
+
export interface EnqueteurInputProps {
|
|
9
|
+
variable: VariableFormulaire & {
|
|
10
|
+
typeCode: 'ENQUETEUR';
|
|
11
|
+
};
|
|
12
|
+
value: VariableValue;
|
|
13
|
+
onChange: (value: VariableValue) => void;
|
|
14
|
+
onBlur?: () => void;
|
|
15
|
+
error?: string;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
services?: FormRendererServices;
|
|
18
|
+
}
|
|
19
|
+
declare const EnqueteurInput: React.FC<EnqueteurInputProps>;
|
|
20
|
+
export default EnqueteurInput;
|
|
21
|
+
//# sourceMappingURL=EnqueteurInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EnqueteurInput.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/EnqueteurInput.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACxE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAE5D,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,kBAAkB,GAAG;QAAE,QAAQ,EAAE,WAAW,CAAA;KAAE,CAAC;IACzD,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,QAAQ,CAAC,EAAE,oBAAoB,CAAC;CACjC;AAED,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA8BjD,CAAC;AAEF,eAAe,cAAc,CAAC"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Composant EnqueteurInput - Affichage du nom complet de l'utilisateur connecté (lecture seule)
|
|
3
|
+
* RSU v2 - Moteur de Rendu des Formulaires d'Enquête
|
|
4
|
+
*/
|
|
5
|
+
'use client';
|
|
6
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
7
|
+
import { useEffect, useRef } from 'react';
|
|
8
|
+
import { User } from 'lucide-react';
|
|
9
|
+
const EnqueteurInput = ({ variable, value, onChange, services }) => {
|
|
10
|
+
const hasInitialized = useRef(false);
|
|
11
|
+
const currentUser = services?.currentUser;
|
|
12
|
+
const displayValue = currentUser
|
|
13
|
+
? `${currentUser.prenom} ${currentUser.nom}`.trim()
|
|
14
|
+
: 'Non renseigné';
|
|
15
|
+
useEffect(() => {
|
|
16
|
+
if (!hasInitialized.current && currentUser) {
|
|
17
|
+
const fullName = `${currentUser.prenom} ${currentUser.nom}`.trim();
|
|
18
|
+
if (fullName && fullName !== value) {
|
|
19
|
+
onChange(fullName);
|
|
20
|
+
}
|
|
21
|
+
hasInitialized.current = true;
|
|
22
|
+
}
|
|
23
|
+
}, [currentUser, onChange, value]);
|
|
24
|
+
return (_jsxs("div", { className: "relative", children: [_jsx(User, { className: "absolute left-3 top-1/2 transform -translate-y-1/2 w-5 h-5 text-gray-400" }), _jsx("input", { type: "text", value: displayValue, readOnly: true, disabled: true, className: "w-full pl-10 pr-3 py-2 border border-gray-300 rounded-lg bg-gray-100 text-gray-700 cursor-not-allowed" })] }));
|
|
25
|
+
};
|
|
26
|
+
export default EnqueteurInput;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Composant TelephoneEnqueteurInput - Affichage du téléphone de l'utilisateur connecté (lecture seule)
|
|
3
|
+
* RSU v2 - Moteur de Rendu des Formulaires d'Enquête
|
|
4
|
+
*/
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import { VariableFormulaire, VariableValue } from '../../types/enquete';
|
|
7
|
+
import { FormRendererServices } from '../../types/services';
|
|
8
|
+
export interface TelephoneEnqueteurInputProps {
|
|
9
|
+
variable: VariableFormulaire & {
|
|
10
|
+
typeCode: 'TELEPHONE_ENQUETEUR';
|
|
11
|
+
};
|
|
12
|
+
value: VariableValue;
|
|
13
|
+
onChange: (value: VariableValue) => void;
|
|
14
|
+
onBlur?: () => void;
|
|
15
|
+
error?: string;
|
|
16
|
+
disabled?: boolean;
|
|
17
|
+
services?: FormRendererServices;
|
|
18
|
+
}
|
|
19
|
+
declare const TelephoneEnqueteurInput: React.FC<TelephoneEnqueteurInputProps>;
|
|
20
|
+
export default TelephoneEnqueteurInput;
|
|
21
|
+
//# sourceMappingURL=TelephoneEnqueteurInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TelephoneEnqueteurInput.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/TelephoneEnqueteurInput.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAIH,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,OAAO,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACxE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAE5D,MAAM,WAAW,4BAA4B;IAC3C,QAAQ,EAAE,kBAAkB,GAAG;QAAE,QAAQ,EAAE,qBAAqB,CAAA;KAAE,CAAC;IACnE,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,QAAQ,CAAC,EAAE,oBAAoB,CAAC;CACjC;AAED,QAAA,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CA2BnE,CAAC;AAEF,eAAe,uBAAuB,CAAC"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Composant TelephoneEnqueteurInput - Affichage du téléphone de l'utilisateur connecté (lecture seule)
|
|
3
|
+
* RSU v2 - Moteur de Rendu des Formulaires d'Enquête
|
|
4
|
+
*/
|
|
5
|
+
'use client';
|
|
6
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
7
|
+
import { useEffect, useRef } from 'react';
|
|
8
|
+
import { Phone } from 'lucide-react';
|
|
9
|
+
const TelephoneEnqueteurInput = ({ variable, value, onChange, services }) => {
|
|
10
|
+
const hasInitialized = useRef(false);
|
|
11
|
+
const currentUser = services?.currentUser;
|
|
12
|
+
const displayValue = currentUser?.telephone || 'Non renseigné';
|
|
13
|
+
useEffect(() => {
|
|
14
|
+
if (!hasInitialized.current && currentUser?.telephone) {
|
|
15
|
+
if (currentUser.telephone !== value) {
|
|
16
|
+
onChange(currentUser.telephone);
|
|
17
|
+
}
|
|
18
|
+
hasInitialized.current = true;
|
|
19
|
+
}
|
|
20
|
+
}, [currentUser, onChange, value]);
|
|
21
|
+
return (_jsxs("div", { className: "relative", children: [_jsx(Phone, { className: "absolute left-3 top-1/2 transform -translate-y-1/2 w-5 h-5 text-gray-400" }), _jsx("input", { type: "tel", value: displayValue, readOnly: true, disabled: true, className: "w-full pl-10 pr-3 py-2 border border-gray-300 rounded-lg bg-gray-100 text-gray-700 cursor-not-allowed" })] }));
|
|
22
|
+
};
|
|
23
|
+
export default TelephoneEnqueteurInput;
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook React pour utiliser le FormTree
|
|
3
|
+
* RSU v2 - Gestion centralisée de l'état de visibilité et des jumps
|
|
4
|
+
*/
|
|
5
|
+
import { GroupeFormulaire, EnqueteReponse, VariableFormulaire } from '../types/enquete';
|
|
6
|
+
import { FormTree } from '../lib/form-tree';
|
|
7
|
+
import { JumpError, JumpRange, VariableNodeState, GroupNodeState } from '../types/form-tree';
|
|
8
|
+
export interface UseFormTreeOptions {
|
|
9
|
+
/** Callback appelé en cas d'erreur de jump */
|
|
10
|
+
onJumpError?: (error: JumpError) => void;
|
|
11
|
+
/** Activer le logging de debug */
|
|
12
|
+
debug?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export interface UseFormTreeReturn {
|
|
15
|
+
/** Instance du FormTree */
|
|
16
|
+
formTree: FormTree;
|
|
17
|
+
/** Retourne les variables visibles d'un groupe */
|
|
18
|
+
getVisibleVariables: (groupeCode: string) => VariableFormulaire[];
|
|
19
|
+
/** Retourne les codes des variables sautées dans un groupe */
|
|
20
|
+
getJumpedVariableCodes: (groupeCode: string) => Set<string>;
|
|
21
|
+
/** Valide un groupe et retourne les erreurs */
|
|
22
|
+
validateGroup: (groupeCode: string) => {
|
|
23
|
+
isValid: boolean;
|
|
24
|
+
errors: string[];
|
|
25
|
+
};
|
|
26
|
+
/** Retourne les codes des variables à effacer lors de la sauvegarde */
|
|
27
|
+
getVariablesToClearOnSave: () => string[];
|
|
28
|
+
/** Retourne l'état d'une variable */
|
|
29
|
+
getVariableState: (variableCode: string) => VariableNodeState | undefined;
|
|
30
|
+
/** Retourne l'état d'un groupe */
|
|
31
|
+
getGroupState: (groupeCode: string) => GroupNodeState | undefined;
|
|
32
|
+
/** Liste des erreurs de jump actuelles */
|
|
33
|
+
jumpErrors: JumpError[];
|
|
34
|
+
/** Liste des jumps actifs */
|
|
35
|
+
activeJumps: JumpRange[];
|
|
36
|
+
/** Force une réévaluation de toutes les conditions */
|
|
37
|
+
forceEvaluate: () => void;
|
|
38
|
+
/** Compteur de mise à jour (pour forcer le re-render) */
|
|
39
|
+
updateCount: number;
|
|
40
|
+
}
|
|
41
|
+
/**
|
|
42
|
+
* Hook pour utiliser le FormTree dans les composants React
|
|
43
|
+
*
|
|
44
|
+
* @param groupes Liste des groupes du formulaire
|
|
45
|
+
* @param responses Dictionnaire des réponses
|
|
46
|
+
* @param options Options de configuration
|
|
47
|
+
* @returns Objet avec les méthodes et états du FormTree
|
|
48
|
+
*
|
|
49
|
+
* @example
|
|
50
|
+
* ```tsx
|
|
51
|
+
* const {
|
|
52
|
+
* getVisibleVariables,
|
|
53
|
+
* validateGroup,
|
|
54
|
+
* jumpErrors,
|
|
55
|
+
* activeJumps
|
|
56
|
+
* } = useFormTree(formulaire.groupes, responses, {
|
|
57
|
+
* onJumpError: (error) => toast.error(error.message)
|
|
58
|
+
* });
|
|
59
|
+
*
|
|
60
|
+
* // Obtenir les variables visibles d'un groupe
|
|
61
|
+
* const visibleVars = getVisibleVariables(groupe.code);
|
|
62
|
+
*
|
|
63
|
+
* // Valider avant navigation
|
|
64
|
+
* const { isValid, errors } = validateGroup(groupe.code);
|
|
65
|
+
* ```
|
|
66
|
+
*/
|
|
67
|
+
export declare function useFormTree(groupes: GroupeFormulaire[], responses: Record<string, EnqueteReponse>, options?: UseFormTreeOptions): UseFormTreeReturn;
|
|
68
|
+
export default useFormTree;
|
|
69
|
+
//# sourceMappingURL=useFormTree.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useFormTree.d.ts","sourceRoot":"","sources":["../../src/hooks/useFormTree.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAKH,OAAO,EAAE,gBAAgB,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACxF,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAE7F,MAAM,WAAW,kBAAkB;IACjC,8CAA8C;IAC9C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IACzC,kCAAkC;IAClC,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,MAAM,WAAW,iBAAiB;IAChC,2BAA2B;IAC3B,QAAQ,EAAE,QAAQ,CAAC;IAEnB,kDAAkD;IAClD,mBAAmB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,kBAAkB,EAAE,CAAC;IAElE,8DAA8D;IAC9D,sBAAsB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,GAAG,CAAC,MAAM,CAAC,CAAC;IAE5D,+CAA+C;IAC/C,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,MAAM,EAAE,MAAM,EAAE,CAAA;KAAE,CAAC;IAE9E,uEAAuE;IACvE,yBAAyB,EAAE,MAAM,MAAM,EAAE,CAAC;IAE1C,qCAAqC;IACrC,gBAAgB,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,iBAAiB,GAAG,SAAS,CAAC;IAE1E,kCAAkC;IAClC,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,cAAc,GAAG,SAAS,CAAC;IAElE,0CAA0C;IAC1C,UAAU,EAAE,SAAS,EAAE,CAAC;IAExB,6BAA6B;IAC7B,WAAW,EAAE,SAAS,EAAE,CAAC;IAEzB,sDAAsD;IACtD,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B,yDAAyD;IACzD,WAAW,EAAE,MAAM,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,WAAW,CACzB,OAAO,EAAE,gBAAgB,EAAE,EAC3B,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,EACzC,OAAO,GAAE,kBAAuB,GAC/B,iBAAiB,CAyFnB;AAED,eAAe,WAAW,CAAC"}
|