inertia-bootstrap-forms 1.0.89 → 1.0.91

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "inertia-bootstrap-forms",
-    "version": "1.0.89",
+    "version": "1.0.91",
     "description": "Create bootstrap forms with inertia and twitter bootstrap",
     "main": "dist/inertia-bootstrap-forms.cjs.js",
     "module": "dist/inertia-bootstrap-forms.es.js",

package/src/Select2Input.vue

@@ -13,7 +13,11 @@ export default defineComponent({
     modelValue: '',
     label: {
       type: String,
-      default: 'name',
+      default: null,
+    },
+    key: {
+      type: String,
+      default: null,
     },
     placeholder: {
       type: String,
@@ -125,17 +129,11 @@ export default defineComponent({
     },
     async setLoading() {
       this.loading = true;
-      this.choices.clearChoices();
       await this.choices.setChoices(
-          [
-            {
-              value: '',
-              label: this.localeTranslates[this.currentLocale]['searchingPlaceholder'] || 'Searching...',
-            }
-          ],
+          [{ value: '', label: this.localeTranslates[this.currentLocale]['searchingPlaceholder'] || 'Searching...', disabled: true }],
           'value',
           'label',
-          true
+          true  // replaceChoices
       );
     },
     async doSearch(searchTerm) {
@@ -149,33 +147,30 @@ export default defineComponent({
       this.searchController = new AbortController();
 
       try {
-        const res = await fetch(this.search?.url + '?query=' + encodeURIComponent(searchTerm), {
+        const res = await fetch(this.search.url + '?query=' + encodeURIComponent(searchTerm), {
           method: 'POST',
           signal: this.searchController.signal,
         });
         const data = await res.json();
 
-        this.choices.clearChoices();
         await this.choices.setChoices(
             data.map(item => ({
-              id: item.id,
-              name: item.name,
+              value: item.id,
+              label: item.name || item.label || item.value,
             })),
-            'id',
-            'name',
+            'value',
+            'label',
             true
         );
         this.loading = false;
       } catch (err) {
         this.loading = false;
-        this.choices.clearChoices();
         if (err.name !== 'AbortError') {
           console.error(err);
+          await this.choices.setChoices([], 'value', 'label', true);
         }
       }
-
-    }
-  },
+    }  },
   mounted() {
     if (this.locale === 'en' && document.dir === 'rtl') {
       this.currentLocale = 'fa';
@@ -223,9 +218,9 @@ export default defineComponent({
         :placeholder="placeholder"
         ref="input">
       <option
-          :value="(item.id || item)" v-for="(item, key) in options"
+          :value="((key ? item[key] : item?.name ?? item?.label ?? item?.value) ?? item)" v-for="(item, index) in options"
           :selected="multiple ? (selectedValue || []).includes(item.id || item) : (item?.id?.toString() || item) === modelValue?.toString()">
-        {{ (label ? item[label] : item.name) || item }}
+        {{ (label ? item[label] : item?.name ?? item?.label ?? item?.value) ?? item }}
       </option>
     </select>
   </div>