reneco-advanced-input-module 0.0.24 → 0.0.26

package/dist/collection/components/voice-input-module/voice-input-module.css

@@ -59,9 +59,6 @@
   transform: scale(1.05);
 }
 
-.upload-record-button svg path {
-  /* Color applied via inline style from theme */
-}
 
 .record-button {
   display: flex;
@@ -341,6 +338,32 @@ input[type="date"].form-input {
   user-select: none;
 }
 
+/* Confidence score badges */
+.confidence-badge {
+  display: inline-flex;
+  align-items: center;
+  margin-left: 4px;
+  padding: 1px 5px;
+  border-radius: 3px;
+  font-size: 0.65rem;
+  font-weight: 700;
+  vertical-align: middle;
+  line-height: 1.4;
+  cursor: help;
+}
+
+.confidence-medium {
+  background: #fef3c7;
+  color: #92400e;
+  border: 1px solid #fde68a;
+}
+
+.confidence-low {
+  background: #fee2e2;
+  color: #991b1b;
+  border: 1px solid #fca5a5;
+}
+
 /* Skeleton loading state */
 @keyframes skeleton-shimmer {
   0% { background-position: -200% 0; }

package/dist/collection/components/voice-input-module/voice-input-module.js

@@ -40,6 +40,7 @@ export class VoiceFormRecorder {
         this.hasTransientError = false;
         this.transcription = '';
         this.filledData = null;
+        this.confidenceScores = null;
         this.debugInfo = {};
         this.isReadonlyMode = true; // Start in readonly preview mode
         this.isInitializing = true;
@@ -74,9 +75,17 @@ export class VoiceFormRecorder {
         this.audioRecorder = new AudioRecorderService();
     }
     componentWillLoad() {
-        this.initializeServices();
+        // Parse theme only so the skeleton can be styled correctly on first render.
+        // Full initialization runs in componentDidLoad() to give the skeleton time to paint.
+        try {
+            this.parsedTheme = this.theme ? JSON.parse(this.theme) : this.getDefaultTheme();
+        }
+        catch (_a) {
+            this.parsedTheme = this.getDefaultTheme();
+        }
     }
     componentDidLoad() {
+        this.initializeServices();
         this.isInitializing = false;
     }
     initializeServices() {
@@ -279,6 +288,7 @@ export class VoiceFormRecorder {
             return;
         this.isProcessing = true;
         this.hasTransientError = false;
+        this.confidenceScores = null;
         this.statusMessage = ((_a = this.parsedTheme.texts) === null || _a === void 0 ? void 0 : _a.processing) || (this.language == 'en' ? 'Processing document...' : 'Traitement du document ...');
         try {
             const extractedData = (ocrData === null || ocrData === void 0 ? void 0 : ocrData.content) || ocrData;
@@ -296,10 +306,11 @@ export class VoiceFormRecorder {
                 throw Object.assign(new Error(llmError.message), { phase: 'llm' });
             }
             this.filledData = this.extractFilledData(filledSchema);
-            this.updateDebugInfo('Form Filled', { filledSchema, extractedData: this.filledData });
+            this.confidenceScores = this.extractConfidenceScores(filledSchema);
+            this.updateDebugInfo('Form Filled', { filledSchema, extractedData: this.filledData, confidence: this.confidenceScores });
             this.parsedSchema = this.filledData;
             this.statusMessage = ((_c = this.parsedTheme.texts) === null || _c === void 0 ? void 0 : _c.completed) || (this.language == 'en' ? 'Form completed!' : 'Formulaire rempli !');
-            this.formFilled.emit({ success: true, data: this.filledData, jsonForm });
+            this.formFilled.emit({ success: true, data: this.filledData, jsonForm, confidence: this.confidenceScores });
         }
         catch (error) {
             console.error('OCR processing error:', error);
@@ -318,6 +329,7 @@ export class VoiceFormRecorder {
             return;
         this.isProcessing = true;
         this.hasTransientError = false;
+        this.confidenceScores = null;
         this.updateDebugInfo('Audio Captured', { size: audioFile.size, type: audioFile.type });
         try {
             // Validate audio file before sending to API
@@ -338,7 +350,6 @@ export class VoiceFormRecorder {
                 this.formFilled.emit({ success: false, error: 'Audio file too large' });
                 return;
             }
-            // Step 1: Transcription
             let transcription;
             try {
                 this.statusMessage = ((_a = this.parsedTheme.texts) === null || _a === void 0 ? void 0 : _a.transcribing) || (this.language == 'en' ? 'Transcribing speech...' : 'Transcription du texte ...');
@@ -357,7 +368,6 @@ export class VoiceFormRecorder {
                 this.formFilled.emit({ success: false, error: 'No speech detected', transcription: '' });
                 return;
             }
-            // Step 2: LLM form filling
             let filledSchema;
             try {
                 this.statusMessage = ((_b = this.parsedTheme.texts) === null || _b === void 0 ? void 0 : _b.filling) || (this.language == 'en' ? 'Filling form fields...' : 'Remplissage du formulaire ...');
@@ -368,10 +378,11 @@ export class VoiceFormRecorder {
                 throw Object.assign(new Error(llmError.message), { phase: 'llm' });
             }
             this.filledData = this.extractFilledData(filledSchema);
-            this.updateDebugInfo('Form Filled', { filledSchema, extractedData: this.filledData });
+            this.confidenceScores = this.extractConfidenceScores(filledSchema);
+            this.updateDebugInfo('Form Filled', { filledSchema, extractedData: this.filledData, confidence: this.confidenceScores });
             this.parsedSchema = this.filledData;
             this.statusMessage = ((_c = this.parsedTheme.texts) === null || _c === void 0 ? void 0 : _c.completed) || (this.language == 'en' ? 'Form completed!' : 'Formulaire rempli !');
-            this.formFilled.emit({ success: true, data: this.filledData, transcription });
+            this.formFilled.emit({ success: true, data: this.filledData, transcription, confidence: this.confidenceScores });
         }
         catch (error) {
             console.error('Audio processing error:', error);
@@ -395,7 +406,8 @@ export class VoiceFormRecorder {
         try {
             const audioBlob = await this.audioRecorder.stopRecording();
             const audioContent = new File([audioBlob], 'audio.wav', { type: 'audio/wav' });
-            // processAudioContent manages isProcessing itself; await ensures we don't return early
+            // Reset isProcessing so the guard inside processAudioContent doesn't block this internal call
+            this.isProcessing = false;
             await this.processAudioContent(audioContent);
         }
         catch (error) {
@@ -412,12 +424,52 @@ export class VoiceFormRecorder {
             this.recordingStateChanged.emit({ isRecording: false, state: 'idle' });
         }
     }
+    extractConfidenceScores(filledData) {
+        const scores = {};
+        if (!filledData)
+            return scores;
+        // Fields array format: [{"id": "...", "name": "...", "value": "...", "confidence": 0.87}]
+        if (filledData.fields && Array.isArray(filledData.fields)) {
+            filledData.fields.forEach((field) => {
+                const raw = typeof field.confidence === 'number' ? field.confidence : parseFloat(field.confidence);
+                if (!isNaN(raw)) {
+                    const clamped = Math.min(0.99, Math.max(0.01, Math.round(raw * 100) / 100));
+                    // Store under both id and name so label-based lookups always work
+                    if (field.id)
+                        scores[field.id] = clamped;
+                    if (field.name)
+                        scores[field.name] = clamped;
+                }
+            });
+        }
+        // Simple schema format: {"schema": {...}, "confidence": {"field_name": 0.87}}
+        if (filledData.confidence && typeof filledData.confidence === 'object') {
+            Object.entries(filledData.confidence).forEach(([k, v]) => {
+                const raw = typeof v === 'number' ? v : parseFloat(v);
+                if (!isNaN(raw)) {
+                    scores[k] = Math.min(0.99, Math.max(0.01, Math.round(raw * 100) / 100));
+                }
+            });
+        }
+        return scores;
+    }
+    getFieldConfidence(primary, fallback) {
+        var _a, _b;
+        if (!this.confidenceScores)
+            return null;
+        return (_a = this.confidenceScores[primary]) !== null && _a !== void 0 ? _a : (fallback ? ((_b = this.confidenceScores[fallback]) !== null && _b !== void 0 ? _b : null) : null);
+    }
+    renderConfidenceIndicator(confidence) {
+        if (confidence === null || confidence >= 0.95)
+            return null;
+        const pct = Math.round(confidence * 100);
+        const isApproximate = confidence >= 0.85;
+        return (h("span", { class: `confidence-badge ${isApproximate ? 'confidence-medium' : 'confidence-low'}`, title: this.language === 'en' ? `Confidence: ${pct}%` : `Confiance : ${pct}%` }, pct, "%"));
+    }
     extractFilledData(filledData) {
-        // console.log("extractFilledData", filledData);
         const updatedSchema = JSON.parse(JSON.stringify(this.parsedSchema));
         switch (this.context) {
             case "ecoteka":
-            // console.log("TODO extractFilledData", filledData);
             case "ng":
                 if (filledData === null || filledData === void 0 ? void 0 : filledData.fields) {
                     // Map AI response back to original schema structure
@@ -432,7 +484,6 @@ export class VoiceFormRecorder {
                 }
                 break;
             case "ecoll-veto":
-                // console.log("TODO extractFilledData", filledData, updatedSchema);
                 if (filledData === null || filledData === void 0 ? void 0 : filledData.fields) {
                     // Map AI response back to original schema structure
                     filledData.fields.forEach((field) => {
@@ -473,15 +524,12 @@ export class VoiceFormRecorder {
                 }
                 break;
         }
-        // console.log("extractFilledData result", updatedSchema);
         return updatedSchema;
     }
     async trimSchemaForAI(schema) {
         var _a, _b;
-        // console.log("trimSchemaForAI", schema);
         switch (this.context) {
             case "ecoteka":
-            // console.log("TODO trimSchemaForAI", schema)
             case "ng":
                 const trimmed = { fields: [] };
                 schema.Children.forEach((child) => {
@@ -500,10 +548,8 @@ export class VoiceFormRecorder {
                     }
                     trimmed.fields.push(fieldData);
                 });
-                // console.log("Schema apres transformation, contexte NG:", trimmed);
                 return trimmed;
             case "ecoll-veto":
-                // console.log("TODO trimSchemaForAI", schema)
                 const mergedItemsSchema = (this.parsedSchema[0].items).concat(this.parsedSchema[1].items);
                 if (mergedItemsSchema) {
                     const trimmedSchema = {
@@ -550,7 +596,6 @@ export class VoiceFormRecorder {
                             default: '',
                         };
                     });
-                    // console.log("Schema apres transformation, contexte Track:", trimmedSchema);
                     return trimmedSchema;
                 }
             case "track":
@@ -747,13 +792,11 @@ export class VoiceFormRecorder {
         return (h("div", { class: "form-preview" }, h("div", { class: "form-preview-title" }, title), h("form", { class: "voice-filled-form" }, this.renderFormFields())));
     }
     renderFormFields() {
-        // console.log("renderFormFields", this.parsedSchema);
         if (!this.parsedSchema)
             return null;
         const largeFieldTypes = ['select', 'multiselect', 'classification', 'thesaurus', 'position'];
         switch (this.context) {
             case "ecoteka":
-            // console.log("TODO renderFormFields", this.parsedSchema);
             case "ng":
                 return this.parsedSchema.Children.map((child) => {
                     var _a, _b, _c;
@@ -765,7 +808,7 @@ export class VoiceFormRecorder {
                     const isRequired = child.Required || false;
                     const fieldValue = (_b = child.Settings) === null || _b === void 0 ? void 0 : _b.Default_Value;
                     const isLargeField = largeFieldTypes.includes(fieldType) || (child.Children && child.Children.length > 5);
-                    return (h("div", { class: isLargeField ? "form-group full-width" : "form-group", key: fieldName }, h("label", { htmlFor: fieldName, class: "form-label" }, fieldLabel, isRequired && h("span", { class: "required" }, "*")), this.renderFormField(fieldName, {
+                    return (h("div", { class: isLargeField ? "form-group full-width" : "form-group", key: fieldName }, h("label", { htmlFor: fieldName, class: "form-label" }, fieldLabel, isRequired && h("span", { class: "required" }, "*"), this.renderConfidenceIndicator(this.getFieldConfidence(fieldLabel, fieldName))), this.renderFormField(fieldName, {
                         type: fieldType,
                         title: fieldLabel,
                         required: isRequired,
@@ -773,8 +816,6 @@ export class VoiceFormRecorder {
                     }, fieldValue)));
                 }).filter(Boolean);
             case "ecoll-veto":
-                // NOTE STEP 2
-                // console.log("TODO renderFormFields", this.parsedSchema);
                 const mergedItemsSchema = (this.parsedSchema[0].items).concat(this.parsedSchema[1].items);
                 return Object.entries(mergedItemsSchema).map(([key, field]) => {
                     var _a, _b;
@@ -805,7 +846,7 @@ export class VoiceFormRecorder {
                     //     console.error("Error fetching classification data:", error);
                     //   }
                     // }
-                    return (h("div", { class: "form-group", key: fieldName }, h("label", { htmlFor: fieldName, class: "form-label" }, fieldLabel, isRequired && h("span", { class: "required" }, "*")), this.renderFormField(fieldName, field, ((_b = (_a = this.filledData) === null || _a === void 0 ? void 0 : _a[fieldName]) !== null && _b !== void 0 ? _b : fieldValue))));
+                    return (h("div", { class: "form-group", key: fieldName }, h("label", { htmlFor: fieldName, class: "form-label" }, fieldLabel, isRequired && h("span", { class: "required" }, "*"), this.renderConfidenceIndicator(this.getFieldConfidence(fieldLabel, fieldName))), this.renderFormField(fieldName, field, ((_b = (_a = this.filledData) === null || _a === void 0 ? void 0 : _a[fieldName]) !== null && _b !== void 0 ? _b : fieldValue))));
                 });
             case "track":
             default:
@@ -814,7 +855,7 @@ export class VoiceFormRecorder {
                     if (field.type === 'header') {
                         return (h("div", { class: "form-header", key: fieldName }, field.title || fieldName));
                     }
-                    return (h("div", { class: "form-group", key: fieldName }, h("label", { htmlFor: fieldName, class: "form-label" }, field.title || fieldName, field.required && h("span", { class: "required" }, "*")), this.renderFormField(fieldName, field, ((_b = (_a = this.filledData) === null || _a === void 0 ? void 0 : _a[fieldName]) !== null && _b !== void 0 ? _b : field.value))));
+                    return (h("div", { class: "form-group", key: fieldName }, h("label", { htmlFor: fieldName, class: "form-label" }, field.title || fieldName, field.required && h("span", { class: "required" }, "*"), this.renderConfidenceIndicator(this.getFieldConfidence(fieldName))), this.renderFormField(fieldName, field, ((_b = (_a = this.filledData) === null || _a === void 0 ? void 0 : _a[fieldName]) !== null && _b !== void 0 ? _b : field.value))));
                 });
         }
     }
@@ -890,7 +931,8 @@ export class VoiceFormRecorder {
         };
     }
     getContainerStyle() {
-        const c = this.parsedTheme.container || {};
+        var _a;
+        const c = ((_a = this.parsedTheme) === null || _a === void 0 ? void 0 : _a.container) || {};
         return {
             width: c.width || 'auto',
             height: c.height || 'auto',
@@ -902,7 +944,8 @@ export class VoiceFormRecorder {
         };
     }
     getStatusStyle() {
-        const s = this.parsedTheme.statusText || {};
+        var _a;
+        const s = ((_a = this.parsedTheme) === null || _a === void 0 ? void 0 : _a.statusText) || {};
         return {
             color: s.color || '#1e293b',
             fontSize: s.fontSize || '14px'
@@ -1271,6 +1314,7 @@ export class VoiceFormRecorder {
             "hasTransientError": {},
             "transcription": {},
             "filledData": {},
+            "confidenceScores": {},
             "debugInfo": {},
             "isReadonlyMode": {},
             "isInitializing": {}