inertia-bootstrap-forms 1.0.74 → 1.0.76

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "inertia-bootstrap-forms",
-    "version": "1.0.74",
+    "version": "1.0.76",
     "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/EditorInput.vue

@@ -91,4 +91,8 @@ textarea.tiny-editor-input-el {
 .tox .tox-edit-area::before {
   display: none;
 }
+
+.tox .tox-throbber{
+  z-index: var(--bs-dropdown-zindex, 900) !important;
+}
 </style>

package/src/Select2Input.vue

@@ -88,8 +88,20 @@ export default defineComponent({
       return (typeof this.modelValue == 'object') ? Object.values(this.modelValue) : (this.modelValue ? [this.modelValue] : null)
     }
   },
+  watch: {
+    'options': {
+      handler: function (val, old) {
+        setTimeout(() => this.init(), 300);
+      },
+      deep: true
+    }
+  },
   methods: {
     init() {
+      if (this.choices) {
+        this.destroy();
+      }
+
       this.choices = new Choices(this.$refs.input, {
         searchEnabled: (this.searchEnabled || !!this.search?.url),
         searchChoices: (this.searchEnabled && !this.search?.url),
@@ -126,7 +138,7 @@ export default defineComponent({
       );
     },
     async doSearch(searchTerm) {
-      if(!this.search?.url) return;
+      if (!this.search?.url) return;
 
       await this.setLoading();
 

package/src/css/from-select.scss

@@ -300,7 +300,7 @@
 }
 
 .choices__list--dropdown .choices__item--selectable.is-highlighted, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
-    background-color: var(--bs-secondary-bg, #ddd)
+    background-color: var(--bs-tertiary-bg, #ddd)
 }
 
 .choices__list--dropdown .choices__item--selectable.is-highlighted::after, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted::after {