reneco-advanced-input-module 0.0.1 → 0.0.3

package/dist/cjs/voice-input-module.cjs.js

@@ -19,7 +19,7 @@ var patchBrowser = () => {
 
 patchBrowser().then(async (options) => {
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["file-uploader_2.cjs",[[257,"voice-input-module",{"formJson":[1,"form-json"],"serviceConfig":[1,"service-config"],"apiKey":[1,"api-key"],"context":[1],"classificationRootUrl":[1,"classification-root-url"],"language":[1],"voiceOrOcr":[1,"voice-or-ocr"],"debug":[4],"renderForm":[4,"render-form"],"displayStatus":[4,"display-status"],"isRecording":[32],"isProcessing":[32],"statusMessage":[32],"hasError":[32],"transcription":[32],"filledData":[32],"debugInfo":[32],"isReadonlyMode":[32],"convertXmlToJson":[64],"convertJsonToXml":[64],"convertXmlToJsonLegacy":[64],"convertJsonToXmlLegacy":[64]},null,{"formJson":["initializeServices"],"serviceConfig":["initializeServices"]}],[257,"file-uploader",{"batch":[4],"callback":[16]}]]]], options);
+  return index.bootstrapLazy([["ocr-file-uploader_2.cjs",[[257,"voice-input-module",{"formJson":[1,"form-json"],"serviceConfig":[1,"service-config"],"apiKey":[1,"api-key"],"context":[1],"classificationRootUrl":[1,"classification-root-url"],"language":[1],"inputTypes":[1,"input-types"],"debug":[4],"renderForm":[4,"render-form"],"displayStatus":[4,"display-status"],"isRecording":[32],"isProcessing":[32],"statusMessage":[32],"hasError":[32],"transcription":[32],"filledData":[32],"debugInfo":[32],"isReadonlyMode":[32],"convertXmlToJson":[64],"convertJsonToXml":[64],"convertXmlToJsonLegacy":[64],"convertJsonToXmlLegacy":[64]},null,{"formJson":["initializeServices"],"serviceConfig":["initializeServices"]}],[257,"ocr-file-uploader",{"batch":[4],"callback":[16],"jsonSchema":[1,"json-schema"]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/collection/collection-manifest.json

@@ -1,6 +1,5 @@
 {
   "entries": [
-    "components/file-uploader/file-uploader.js",
     "components/voice-input-module/voice-input-module.js"
   ],
   "compiler": {
@@ -8,6 +7,13 @@
     "version": "4.36.2",
     "typescriptVersion": "5.5.4"
   },
-  "collections": [],
+  "collections": [
+    {
+      "name": "ocr-file-uploader",
+      "tags": [
+        "ocr-file-uploader"
+      ]
+    }
+  ],
   "bundles": []
 }

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

@@ -3,6 +3,11 @@
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
 }
 
+.row-audio-area {
+  display: flex;
+  flex-direction: row;
+}
+
 .voice-recorder-container {
   display: flex;
   flex-direction: column;
@@ -29,6 +34,36 @@
   margin: 0 auto;
 }
 
+.upload-record-container {
+  display: inline-block;
+  cursor: pointer;
+  width: 50px;
+  height: 50px;
+}
+
+.upload-record-button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: transform 0.2s ease, box-shadow 0.2s ease;
+  user-select: none;
+}
+
+.upload-record-button svg {
+  width: 50px;
+  height: 50px;
+  stroke: #4444ee;
+}
+
+.upload-record-button svg path {
+  fill: #4444ee;
+}
+
+.upload-record-button:hover svg {
+  transform: scale(1.05);
+  stroke: #4444ee;
+}
+
 .record-button {
   display: flex;
   align-items: center;
@@ -248,4 +283,45 @@ input[type="date"].form-input {
   border-radius: 0.25rem;
   font-size: 0.875rem;
   color: #374151;
+}
+
+.multiselect-container {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  padding: 0.5rem;
+  border: 1px solid #d1d5db;
+  border-radius: 0.375rem;
+  background: white;
+}
+
+.multiselect-option {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  padding: 0.5rem;
+  border-radius: 0.25rem;
+  cursor: pointer;
+  transition: background 0.2s ease;
+}
+
+.multiselect-option:hover {
+  background: #f3f4f6;
+}
+
+.multiselect-option input[type="checkbox"] {
+  width: 18px;
+  height: 18px;
+  cursor: pointer;
+}
+
+.multiselect-option input[type="checkbox"]:checked + .multiselect-label {
+  font-weight: 600;
+  color: #059669;
+}
+
+.multiselect-label {
+  font-size: 0.875rem;
+  color: #374151;
+  user-select: none;
 }

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

@@ -3,14 +3,27 @@ import { AudioRecorderService } from "../../services/audio-recorder.service";
 import { SpeechToTextServiceFactory } from "../../services/speech-to-text.service";
 import { LLMServiceFactory } from "../../services/llm.service";
 import { SchemaConverter } from "../../utils/schema-converter";
+import { defineCustomElements } from "ocr-file-uploader/loader";
+// Initialize OCR
+defineCustomElements();
 export class VoiceFormRecorder {
+    get parsedInputTypes() {
+        if (!this.inputTypes)
+            return [];
+        try {
+            return JSON.parse(this.inputTypes.replace(/'/g, '"'));
+        }
+        catch (_a) {
+            return this.inputTypes.split(',').map(type => type.trim());
+        }
+    }
     constructor() {
         this.formJson = '{}';
         this.serviceConfig = '{}';
         this.context = undefined;
         this.classificationRootUrl = 'http://localhost';
         this.language = 'en';
-        this.voiceOrOcr = undefined;
+        this.inputTypes = '';
         this.debug = false;
         this.renderForm = false;
         this.displayStatus = false;
@@ -21,6 +34,18 @@ export class VoiceFormRecorder {
         this.filledData = null;
         this.debugInfo = {};
         this.isReadonlyMode = true; // Start in readonly preview mode
+        this.triggerAudioRecordUpload = () => {
+            this.fileInputAudioRecord.click();
+        };
+        this.handleAudioRecordChange = async (event) => {
+            const input = event.target;
+            if (!input.files || input.files.length === 0)
+                return;
+            const file = input.files[0];
+            // Here you can handle the file upload to your API
+            console.log('Selected file:', file);
+            this.processAudioContent(file);
+        };
         this.audioRecorder = new AudioRecorderService();
     }
     componentWillLoad() {
@@ -51,7 +76,10 @@ export class VoiceFormRecorder {
                     config: this.parsedConfig
                 });
                 this.hasError = false;
-                this.statusMessage = (this.language == 'en' ? 'Click to start recording' : 'Cliquer pour enregistrer');
+                this.statusMessage = (this.language == 'en' ? 'Select an input method' : 'Sélectionner une méthode de saisie');
+                if (this.parsedInputTypes.length === 0) {
+                    this.inputTypes = 'voice';
+                }
             }
         }
         catch (error) {
@@ -102,14 +130,17 @@ export class VoiceFormRecorder {
             });
         }
     }
-    async processJsonForm(jsonForm) {
-        // console.log("processJsonForm", jsonForm);
+    async processJsonForm(ocrData) {
+        console.log("processJsonForm", ocrData);
         try {
             this.isProcessing = true;
             this.statusMessage = (this.language == 'en' ? 'Processing json...' : `Traitement du json ...`);
+            // Extract content from OCR format
+            const extractedData = (ocrData === null || ocrData === void 0 ? void 0 : ocrData.content) || ocrData;
+            const jsonForm = JSON.stringify(extractedData);
             // Fill form using LLM
             this.statusMessage = (this.language == 'en' ? 'Filling form fields...' : 'Remplissage du formulaire ...');
-            const trimmedSchema = this.trimSchemaForAI(this.parsedSchema);
+            const trimmedSchema = await this.trimSchemaForAI(this.parsedSchema);
             const filledSchema = await this.llmService.fillFormFromJson(jsonForm, trimmedSchema);
             // Extract filled data
             this.filledData = this.extractFilledData(filledSchema);
@@ -133,13 +164,46 @@ export class VoiceFormRecorder {
             this.formFilled.emit({
                 success: false,
                 error: error.message,
-                jsonForm: jsonForm
+                jsonForm: JSON.stringify(ocrData)
             });
         }
         finally {
             this.isProcessing = false;
         }
     }
+    async processAudioContent(audioFile) {
+        this.updateDebugInfo('Audio Captured', {
+            size: audioFile.size,
+            type: audioFile.type
+        });
+        // Transcribe audio
+        this.statusMessage = (this.language == 'en' ? 'Transcribing speech...' : 'Transcription du texte ...');
+        const transcription = await this.speechToTextService.transcribe(audioFile, this.language);
+        this.transcription = transcription;
+        this.updateDebugInfo('Transcription Complete', { transcription });
+        if (!transcription.trim()) {
+            throw new Error('No speech detected in the recording');
+        }
+        // Fill form using LLM
+        this.statusMessage = (this.language == 'en' ? 'Filling form fields...' : 'Remplissage du formulaire ...');
+        const trimmedSchema = await this.trimSchemaForAI(this.parsedSchema);
+        const filledSchema = await this.llmService.fillFormFromTranscription(transcription, trimmedSchema);
+        // Extract filled data
+        this.filledData = this.extractFilledData(filledSchema);
+        this.updateDebugInfo('Form Filled', {
+            filledSchema,
+            extractedData: this.filledData
+        });
+        this.parsedSchema = this.filledData;
+        this.statusMessage = (this.language == 'en' ? 'Form completed!' : 'Formulaire remplis !');
+        this.hasError = false;
+        // Emit success event
+        this.formFilled.emit({
+            success: true,
+            data: this.filledData,
+            transcription: transcription
+        });
+    }
     async stopRecordingAndProcess() {
         try {
             this.isRecording = false;
@@ -152,37 +216,8 @@ export class VoiceFormRecorder {
             });
             // Stop recording and get audio blob
             const audioBlob = await this.audioRecorder.stopRecording();
-            this.updateDebugInfo('Audio Captured', {
-                size: audioBlob.size,
-                type: audioBlob.type
-            });
-            // Transcribe audio
-            this.statusMessage = (this.language == 'en' ? 'Transcribing speech...' : 'Transcription du texte ...');
-            const transcription = await this.speechToTextService.transcribe(audioBlob, this.language);
-            this.transcription = transcription;
-            this.updateDebugInfo('Transcription Complete', { transcription });
-            if (!transcription.trim()) {
-                throw new Error('No speech detected in the recording');
-            }
-            // Fill form using LLM
-            this.statusMessage = (this.language == 'en' ? 'Filling form fields...' : 'Remplissage du formulaire ...');
-            const trimmedSchema = this.trimSchemaForAI(this.parsedSchema);
-            const filledSchema = await this.llmService.fillFormFromTranscription(transcription, trimmedSchema);
-            // Extract filled data
-            this.filledData = this.extractFilledData(filledSchema);
-            this.updateDebugInfo('Form Filled', {
-                filledSchema,
-                extractedData: this.filledData
-            });
-            this.parsedSchema = this.filledData;
-            this.statusMessage = (this.language == 'en' ? 'Form completed!' : 'Formulaire remplis !');
-            this.hasError = false;
-            // Emit success event
-            this.formFilled.emit({
-                success: true,
-                data: this.filledData,
-                transcription: transcription
-            });
+            const audioContent = new File([audioBlob], 'audio.webm', { type: 'audio/webm' });
+            this.processAudioContent(audioContent);
         }
         catch (error) {
             this.hasError = true;
@@ -206,11 +241,13 @@ export class VoiceFormRecorder {
         // 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
                     filledData.fields.forEach((field) => {
-                        const originalField = updatedSchema.Children.find((child) => child.System_Name === field.name);
+                        const originalField = updatedSchema.Children.find((child) => { var _a; return child.System_Name === field.name || ((_a = child.Settings) === null || _a === void 0 ? void 0 : _a.Label) === field.name; });
                         if (originalField && field.value !== undefined && field.value !== null && field.value !== '') {
                             if (!originalField.Settings)
                                 originalField.Settings = {};
@@ -233,9 +270,6 @@ export class VoiceFormRecorder {
                     });
                 }
                 break;
-            case "ecoteka":
-                // console.log("TODO extractFilledData", filledData);
-                break;
             case "track":
             default:
                 const data = {};
@@ -259,28 +293,33 @@ export class VoiceFormRecorder {
         // console.log("extractFilledData result", updatedSchema);
         return updatedSchema;
     }
-    trimSchemaForAI(schema) {
+    async trimSchemaForAI(schema) {
         var _a, _b;
         // console.log("trimSchemaForAI", schema);
         switch (this.context) {
-            case 'ng':
+            case "ecoteka":
+            // console.log("TODO trimSchemaForAI", schema)
+            case "ng":
                 const trimmed = { fields: [] };
                 schema.Children.forEach((child) => {
+                    var _a;
                     if (!child.System_Name || !child.Type)
                         return;
                     const fieldData = {
-                        name: child.System_Name,
+                        name: child.Label || ((_a = child.Settings) === null || _a === void 0 ? void 0 : _a.Label) || child.System_Name,
                         type: this.mapFieldType(child.Type)
                     };
                     // Add options for classification/select fields
-                    if (child.Type === 'InputClassification' && child.Children && child.Children.length > 0) {
+                    const selectTypes = ['InputClassification', 'select'];
+                    if (selectTypes.includes(child.Type) && child.Children && child.Children.length > 0) {
                         fieldData.options = child.Children.map((option) => option.System_Name || option.Label || option.toString());
                     }
+                    console.log("fieldData", fieldData);
                     trimmed.fields.push(fieldData);
                 });
                 // console.log("Schema apres transformation, contexte NG:", trimmed);
                 return trimmed;
-            case 'ecoll-veto':
+            case "ecoll-veto":
                 // console.log("TODO trimSchemaForAI", schema)
                 const mergedItemsSchema = (this.parsedSchema[0].items).concat(this.parsedSchema[1].items);
                 if (mergedItemsSchema) {
@@ -289,12 +328,37 @@ export class VoiceFormRecorder {
                         description: 'Form Description',
                         schema: {}
                     };
-                    Object.entries(mergedItemsSchema).forEach(([key, field]) => {
+                    Object.entries(mergedItemsSchema).forEach(async ([key, field]) => {
                         const fieldName = field.name;
                         const fieldType = this.mapFieldType(field.type);
                         const fieldLabel = field.label || fieldName;
                         const isRequired = field.required || false;
                         const fieldValue = ''; //TODO
+                        if (['position', 'thesaurus'].includes(fieldType)) {
+                            try {
+                                const response = await fetch(`${this.classificationRootUrl}/ng/api/v1/classification/getList/${fieldType.toLowerCase() == 'position' ? "Position" : "Thesaurus"}/?StartNodeID=${field.config.options.options.startNode}`);
+                                if (!response.ok)
+                                    throw new Error(`HTTP error! status: ${response.status}`);
+                                const data = await response.json();
+                                if (Array.isArray(data)) {
+                                    const options = data.map(item => ({
+                                        value: item.ID,
+                                        label: item.System_Name
+                                    }));
+                                    if (options.length > 0) {
+                                        field.pickerOptions = options;
+                                        // TODO on degage les quotes simples temporairement, a corriger
+                                        field.options = options.map(option => option.label.replace("'", ""));
+                                    }
+                                }
+                                else {
+                                    console.error("Unexpected API response format:", data);
+                                }
+                            }
+                            catch (error) {
+                                console.error("Error fetching classification data:", error);
+                            }
+                        }
                         trimmedSchema.schema[fieldName] = {
                             type: fieldType,
                             title: fieldLabel,
@@ -306,10 +370,7 @@ export class VoiceFormRecorder {
                     // console.log("Schema apres transformation, contexte Track:", trimmedSchema);
                     return trimmedSchema;
                 }
-            case "ecoteka":
-                // console.log("TODO trimSchemaForAI", schema)
-                break;
-            case 'track':
+            case "track":
             default:
                 // Handle simple schema format (backward compatibility)
                 if ((_a = schema === null || schema === void 0 ? void 0 : schema.schema) !== null && _a !== void 0 ? _a : schema === null || schema === void 0 ? void 0 : schema.fields) {
@@ -345,16 +406,20 @@ export class VoiceFormRecorder {
             'InputTextArea': 'string',
             'InputDateTimePicker': 'datetime',
             'InputDecimal': 'number',
-            'InputClassification': 'select',
+            'InputClassification': 'classification',
             'InputCheckbox': 'boolean',
             'InputTextTranslation': 'string',
-            'thesaurus': 'string',
-            'position': 'string',
+            'InputMultiSelect': 'multiselect',
+            'thesaurus': 'thesaurus',
+            'position': 'position',
             'text': 'string',
             'textarea': 'string',
             'number': 'number',
             'date': 'date',
-            'datetime': 'datetime'
+            'datetime': 'datetime',
+            'select': 'select',
+            'multiselect': 'multiselect',
+            'checkbox': 'checkbox'
         };
         return typeMapping[type] || 'string';
     }
@@ -373,12 +438,63 @@ export class VoiceFormRecorder {
         return SchemaConverter.convertJsonToXmlLegacy(jsonForm);
     }
     renderUploadButton() {
-        if (!['ocr', 'both'].includes(this.voiceOrOcr))
+        if (!this.parsedInputTypes.includes('ocr'))
+            return;
+        return (h("ocr-file-uploader", { batch: false, "json-schema": this.convertSchemaToOcrFormat(this.parsedSchema), callback: (data) => { this.processJsonForm(data); } }));
+    }
+    convertSchemaToOcrFormat(schema) {
+        const ocrSchema = {
+            type: "object",
+            additionalProperties: false,
+            properties: {
+                meta: {
+                    type: "object",
+                    additionalProperties: false,
+                    properties: {
+                        page: { type: "integer" },
+                        confiance_global: { type: "number" }
+                    },
+                    required: ["page", "confiance_global"]
+                },
+                content: {
+                    type: "object",
+                    additionalProperties: false,
+                    properties: {},
+                    required: []
+                }
+            },
+            required: ["meta", "content"]
+        };
+        if (schema === null || schema === void 0 ? void 0 : schema.Children) {
+            schema.Children.forEach((child) => {
+                var _a;
+                if (child.System_Name && child.Type) {
+                    const fieldLabel = ((_a = child.Settings) === null || _a === void 0 ? void 0 : _a.Label) || child.System_Name;
+                    const fieldType = this.mapOcrFieldType(child.Type);
+                    ocrSchema.properties.content.properties[fieldLabel] = {
+                        anyOf: [{ type: fieldType }, { type: "null" }]
+                    };
+                }
+            });
+        }
+        return JSON.stringify(ocrSchema);
+    }
+    mapOcrFieldType(type) {
+        const typeMapping = {
+            'InputInteger': 'number',
+            'InputDecimal': 'number',
+            'InputDateTimePicker': 'string',
+            'InputCheckbox': 'boolean'
+        };
+        return typeMapping[type] || 'string';
+    }
+    renderUploadRecordButton() {
+        if (!this.parsedInputTypes.includes('audio'))
             return;
-        return (h("file-uploader", { batch: false, callback: (data) => { this.processJsonForm(data); } }));
+        return (h("div", { class: "upload-record-container", onClick: this.triggerAudioRecordUpload }, h("input", { type: "file", ref: el => (this.fileInputAudioRecord = el), onChange: this.handleAudioRecordChange, style: { display: 'none' } }), h("div", { class: 'upload-record-button' }, h("svg", { width: "800px", height: "800px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12 2.75C6.89137 2.75 2.75 6.89137 2.75 12C2.75 17.1086 6.89137 21.25 12 21.25C12.6345 21.25 13.2534 21.1862 13.8508 21.065C14.2567 20.9826 14.6526 21.2448 14.735 21.6508C14.8174 22.0567 14.5551 22.4526 14.1492 22.535C13.4541 22.6761 12.7353 22.75 12 22.75C6.06294 22.75 1.25 17.9371 1.25 12C1.25 6.06294 6.06294 1.25 12 1.25C17.9371 1.25 22.75 6.06294 22.75 12C22.75 12.7353 22.6761 13.4541 22.535 14.1492C22.4526 14.5551 22.0567 14.8174 21.6508 14.735C21.2448 14.6526 20.9826 14.2567 21.065 13.8508C21.1862 13.2534 21.25 12.6345 21.25 12C21.25 6.89137 17.1086 2.75 12 2.75ZM12.7676 8.52584C12.7661 8.53409 12.7604 8.56729 12.7564 8.64336C12.7502 8.76101 12.75 8.91982 12.75 9.17082C12.75 9.27795 12.7501 9.33904 12.7518 9.38529C12.7528 9.41425 12.7542 9.42649 12.7546 9.42955C12.7662 9.48945 12.7993 9.54303 12.8477 9.58021C12.8502 9.58194 12.8606 9.58864 12.886 9.60252C12.9266 9.62468 12.9812 9.65209 13.0771 9.7L14.3938 10.3584C14.6183 10.4706 14.7604 10.5414 14.8684 10.5885C14.9382 10.6189 14.9705 10.6287 14.9785 10.631C15.0885 10.6405 15.1917 10.5767 15.2324 10.4742C15.2339 10.4659 15.2396 10.4327 15.2436 10.3566C15.2498 10.239 15.25 10.0802 15.25 9.82918C15.25 9.72205 15.2499 9.66096 15.2482 9.61471C15.2472 9.58575 15.2458 9.57351 15.2454 9.57045C15.2338 9.51055 15.2007 9.45697 15.1523 9.41979C15.1498 9.41805 15.1394 9.41136 15.114 9.39748C15.0734 9.37533 15.0188 9.34791 14.9229 9.3L13.6062 8.64164C13.3817 8.52939 13.2396 8.45859 13.1316 8.41151C13.0617 8.38107 13.0295 8.37131 13.0215 8.36896C12.9115 8.35945 12.8083 8.42327 12.7676 8.52584ZM12.75 11.2135L13.7396 11.7083C13.9425 11.8098 14.1204 11.8987 14.269 11.9635C14.4199 12.0293 14.5988 12.097 14.7972 12.1202C15.6037 12.2142 16.3689 11.7413 16.6454 10.978C16.7134 10.7901 16.7328 10.5998 16.7415 10.4355C16.75 10.2735 16.75 10.0747 16.75 9.8479V9.82918C16.75 9.81565 16.75 9.80205 16.75 9.78837C16.7503 9.62647 16.7505 9.45474 16.7188 9.28904C16.638 8.86674 16.4045 8.48898 16.0629 8.22783C15.9289 8.12535 15.7752 8.04877 15.6303 7.97658C15.618 7.97048 15.6059 7.96441 15.5938 7.95836L14.2603 7.29164C14.0575 7.19022 13.8796 7.10128 13.731 7.03647C13.5801 6.97071 13.4012 6.90297 13.2028 6.87982C12.3963 6.78575 11.6311 7.25868 11.3546 8.02203C11.2866 8.20986 11.2672 8.40019 11.2585 8.56454C11.2519 8.68919 11.2504 8.83571 11.2501 9L11.25 9.11944C11.25 9.13026 11.25 9.14115 11.25 9.1521V9.17082C11.25 9.18435 11.25 9.19795 11.25 9.21163C11.2499 9.23918 11.2499 9.26701 11.25 9.29505V12.5499C10.875 12.3581 10.4501 12.25 10 12.25C8.48122 12.25 7.25 13.4812 7.25 15C7.25 16.5188 8.48122 17.75 10 17.75C11.5188 17.75 12.75 16.5188 12.75 15V11.2135ZM11.25 15C11.25 14.3096 10.6904 13.75 10 13.75C9.30964 13.75 8.75 14.3096 8.75 15C8.75 15.6904 9.30964 16.25 10 16.25C10.6904 16.25 11.25 15.6904 11.25 15ZM17.4697 14.4697C17.7626 14.1768 18.2374 14.1768 18.5303 14.4697L21.0303 16.9697C21.3232 17.2626 21.3232 17.7374 21.0303 18.0303C20.7374 18.3232 20.2626 18.3232 19.9697 18.0303L18.75 16.8107V22C18.75 22.4142 18.4142 22.75 18 22.75C17.5858 22.75 17.25 22.4142 17.25 22V16.8107L16.0303 18.0303C15.7374 18.3232 15.2626 18.3232 14.9697 18.0303C14.6768 17.7374 14.6768 17.2626 14.9697 16.9697L17.4697 14.4697Z" })))));
     }
     renderRecordButton() {
-        if (!['voice', 'both', undefined].includes(this.voiceOrOcr))
+        if (!this.parsedInputTypes.includes('voice'))
             return;
         const buttonClass = [
             'record-button',
@@ -408,6 +524,8 @@ export class VoiceFormRecorder {
         if (!this.parsedSchema)
             return null;
         switch (this.context) {
+            case "ecoteka":
+            // console.log("TODO renderFormFields", this.parsedSchema);
             case "ng":
                 return this.parsedSchema.Children.map((child) => {
                     var _a, _b, _c;
@@ -436,11 +554,31 @@ export class VoiceFormRecorder {
                     const fieldLabel = field.label || fieldName;
                     const isRequired = field.required || false;
                     const fieldValue = this.parsedSchema[2][fieldName];
+                    // if (['position', 'thesaurus'].includes(field.type)) {
+                    //   try {
+                    //     const response = await fetch(`${this.classificationRootUrl}/ng/api/v1/classification/getList/${fieldType.toLowerCase() == 'position' ? "Position" : "Thesaurus"}/?StartNodeID=${field.config.options.options.startNode}`);
+                    //     if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
+                    //     const data = await response.json();
+                    //     if (Array.isArray(data)) {
+                    //       const options = data.map(item => ({
+                    //         value: item.ID,
+                    //         label: item.System_Name
+                    //       }));
+                    //       if (options.length > 0) {
+                    //         field.pickerOptions = options;
+                    //         // TODO on degage les quotes simples temporairement, a corriger
+                    //         field.options = options.map(option => option.label.replace("'", ""));
+                    //       }
+                    //     } else {
+                    //       console.error("Unexpected API response format:", data);
+                    //     }
+                    //   } catch (error) {
+                    //     console.error("Error fetching classification data:", error);
+                    //   }
+                    // }
+                    console.log("filling with", field);
                     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))));
                 });
-            case "ecoteka":
-                // console.log("TODO renderFormFields", this.parsedSchema);
-                break;
             case "track":
             default:
                 return Object.entries(this.parsedSchema.fields).map(([fieldName, field]) => {
@@ -448,10 +586,9 @@ export class VoiceFormRecorder {
                     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 null;
     }
     renderFormField(fieldName, field, value) {
-        var _a, _b;
+        var _a, _b, _c, _d;
         const isReadonly = this.isReadonlyMode && !this.filledData;
         const commonProps = {
             id: fieldName,
@@ -461,13 +598,22 @@ export class VoiceFormRecorder {
             disabled: isReadonly
         };
         switch (field.type) {
+            case 'multiselect':
+                if (isReadonly) {
+                    return (h("div", { class: "readonly-select" }, h("div", { class: "select-placeholder" }, "Available options:"), h("ul", { class: "select-options-list" }, (_a = field.options) === null || _a === void 0 ? void 0 : _a.map(option => (h("li", { class: "select-option" }, option))))));
+                }
+                const selectedValues = Array.isArray(value) ? value : (value ? [value] : []);
+                return (h("div", { class: "multiselect-container" }, (_b = field.options) === null || _b === void 0 ? void 0 : _b.map(option => {
+                    const isChecked = selectedValues.some(v => (v === null || v === void 0 ? void 0 : v.toString().toLowerCase()) === (option === null || option === void 0 ? void 0 : option.toString().toLowerCase()));
+                    return (h("label", { class: "multiselect-option" }, h("input", { type: "checkbox", name: fieldName, value: option, checked: isChecked, disabled: isReadonly }), h("span", { class: "multiselect-label" }, option)));
+                })));
             case 'select':
                 if (isReadonly) {
                     // In readonly mode, show all options as a list instead of dropdown
-                    return (h("div", { class: "readonly-select" }, h("div", { class: "select-placeholder" }, "Available options:"), h("ul", { class: "select-options-list" }, (_a = field.options) === null || _a === void 0 ? void 0 : _a.map(option => (h("li", { class: "select-option" }, option))))));
+                    return (h("div", { class: "readonly-select" }, h("div", { class: "select-placeholder" }, "Available options:"), h("ul", { class: "select-options-list" }, (_c = field.options) === null || _c === void 0 ? void 0 : _c.map(option => (h("li", { class: "select-option" }, option))))));
                 }
-                return (h("select", { id: fieldName, name: fieldName, class: "form-input", required: field.required }, h("option", { value: "" }, "-- Select --"), (_b = field.options) === null || _b === void 0 ? void 0 :
-                    _b.map(option => (h("option", { value: option, selected: value === option }, option)))));
+                return (h("select", { id: fieldName, name: fieldName, class: "form-input", required: field.required }, h("option", { value: "" }, "-- Select --"), (_d = field.options) === null || _d === void 0 ? void 0 :
+                    _d.map(option => (h("option", { value: option, selected: value === option }, option)))));
             case 'boolean':
                 return (h("input", Object.assign({}, commonProps, { type: "checkbox", class: "form-checkbox", checked: value === true || value === 'true' })));
             case 'number':
@@ -486,7 +632,7 @@ export class VoiceFormRecorder {
         return (h("div", { class: "debug-panel" }, h("div", { class: "debug-title" }, "Debug Information:"), h("div", { class: "debug-content" }, JSON.stringify(this.debugInfo, null, 2))));
     }
     render() {
-        return (h("div", { key: '40d850c62945b71d22c1fcb6181c9e8aba0f2a05' }, h("div", { key: 'da8aa5b7f122471a8d4d49662d418bd925f1d84c', class: "voice-recorder-container" + (this.debug || this.renderForm ? "-debug" : "") }, this.renderRecordButton(), this.displayStatus ? this.renderStatusMessage() : "", this.renderUploadButton(), this.renderForm ? this.renderFormPreview() : "", this.debug ? this.renderDebugPanel() : "")));
+        return (h("div", { key: '2eddc02481849fda4e6d9e245d4c3c668938b84c' }, h("div", { key: 'eb1bc3cfcf0a19c54f5b2ab1ce488fa289a0dc68', class: "voice-recorder-container" + (this.debug || this.renderForm ? "-debug" : "") }, h("div", { key: 'b93900dce4b0de5d830f4f8517d4e56dc746efbb', class: "row-audio-area" }, this.renderRecordButton(), this.renderUploadRecordButton()), this.displayStatus ? this.renderStatusMessage() : "", this.renderUploadButton(), this.renderForm ? this.renderFormPreview() : "", this.debug ? this.renderDebugPanel() : "")));
     }
     static get is() { return "voice-input-module"; }
     static get encapsulation() { return "shadow"; }
@@ -621,13 +767,13 @@ export class VoiceFormRecorder {
                 "reflect": false,
                 "defaultValue": "'en'"
             },
-            "voiceOrOcr": {
+            "inputTypes": {
                 "type": "string",
-                "attribute": "voice-or-ocr",
+                "attribute": "input-types",
                 "mutable": false,
                 "complexType": {
-                    "original": "'voice'|'ocr'|'both'",
-                    "resolved": "\"both\" | \"ocr\" | \"voice\"",
+                    "original": "string",
+                    "resolved": "string",
                     "references": {}
                 },
                 "required": false,
@@ -639,7 +785,7 @@ export class VoiceFormRecorder {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "defaultValue": "undefined"
+                "defaultValue": "''"
             },
             "debug": {
                 "type": "boolean",