package.json

 {
   "name": "@coscine/form-generator",
-  "version": "3.4.0",
+  "version": "3.5.0",
   "main": "./dist/index.umd.cjs",
   "module": "./dist/index.js",
   "browser": "./dist/index.js",

src/components/InputList.vue

@@ -23,7 +23,7 @@ import i18n from '@/plugins/i18n';
 import '@/plugins/deprecated/vue-multiselect';
 
 import type { ObjectLabel } from '@/types/labels';
-import type { Quad_Object } from 'rdf-js';
+import type { Literal, Quad_Object } from 'rdf-js';
 import factory from 'rdf-ext';
 
 export default defineComponent({
@@ -54,6 +54,10 @@ export default defineComponent({
       required: true,
       type: Array as PropType<Array<Quad_Object>>,
     },
+    listLabels: {
+      required: true,
+      type: Array as PropType<Array<Array<Quad_Object>>>,
+    },
   },
   data() {
     return {
@@ -63,20 +67,45 @@ export default defineComponent({
   computed: {
     selectableOptions(): ObjectLabel[] {
       return this.list
-        .map((entry) => {
+        .map((entry, index) => {
+          let name = entry.value;
+          const entryLabels = this.listLabels[index];
+          if (entryLabels && entryLabels.length > 0) {
+            const currentLanguageLabel = entryLabels.find(
+              (label) => (label as Literal).language === this.languageCode
+            );
+            const enLanguageLabel = entryLabels.find(
+              (label) => (label as Literal).language === 'en'
+            );
+            if (currentLanguageLabel) {
+              name = currentLanguageLabel.value;
+            } else if (enLanguageLabel) {
+              name = enLanguageLabel.value;
+            } else {
+              name = entryLabels[0].value;
+            }
+          }
           return {
-            name: entry.value,
+            name: name,
             value: entry,
           };
         })
         .sort((item1, item2) => item1.name.localeCompare(item2.name));
     },
-    selectedOption(): ObjectLabel | undefined {
+    selectedIndex(): number | undefined {
       if (this.object && this.object.value !== '') {
-        return {
-          name: this.object.value,
-          value: this.object,
-        };
+        const index = this.selectableOptions.findIndex(
+          (option) => option.value?.value === this.object?.value
+        );
+        if (index !== -1) {
+          return index;
+        }
+      }
+      return undefined;
+    },
+    selectedOption(): ObjectLabel | undefined {
+      if (this.selectedIndex !== undefined) {
+        return this.selectableOptions[this.selectedIndex];
       }
       return undefined;
     },

src/components/WrapperInput.vue

@@ -49,6 +49,7 @@
           :data-type="dataType"
           :class-object="classObject"
           :list="list"
+          :list-labels="listLabels"
           :single-line="singleLine"
           :state="state"
           :attached-metadata="attachedMetadata[entryIndex]"
@@ -418,6 +419,18 @@ export default defineComponent({
       }
       return [];
     },
+    listLabels(): Quad_Object[][] {
+      const labels: Quad_Object[][] = [];
+      for (const entry of this.list) {
+        const labelQuads = getObject(
+          entry,
+          factory.namedNode(prefixes.rdfs + 'label'),
+          this.dataset
+        );
+        labels.push(labelQuads.map((labelQuad) => labelQuad.object));
+      }
+      return labels;
+    },
     maxCount(): number | undefined {
       const maxCounts = getObject(
         this.property,