Lazy bookshelf finalized

client/components/ui/Btn.vue

@@ -8,7 +8,7 @@
       </svg>
     </div>
   </nuxt-link>
-  <button v-else class="btn outline-none rounded-md shadow-md relative border border-gray-600" :disabled="disabled || loading" :type="type" :class="classList" @click="click">
+  <button v-else class="btn outline-none rounded-md shadow-md relative border border-gray-600" :disabled="disabled || loading" :type="type" :class="classList" @mousedown.prevent @click="click">
     <slot />
     <div v-if="loading" class="text-white absolute top-0 left-0 w-full h-full flex items-center justify-center text-opacity-100">
       <!-- <span class="material-icons animate-spin">refresh</span> -->

client/components/ui/InputDropdown.vue

@@ -89,7 +89,24 @@ export default {
     inputFocus() {
       this.isFocused = true
     },
+    blur() {
+      // Handle blur immediately
+      this.isFocused = false
+      if (this.input !== this.textInput) {
+        var val = this.textInput ? this.textInput.trim() : null
+        this.input = val
+        if (val && !this.items.includes(val)) {
+          this.$emit('newItem', val)
+        }
+      }
+
+      if (this.$refs.input) {
+        this.$refs.input.blur()
+      }
+    },
     inputBlur() {
+      if (!this.isFocused) return
+
       setTimeout(() => {
         if (document.activeElement === this.$refs.input) {
           return

client/components/ui/LibrariesDropdown.vue

@@ -79,7 +79,9 @@ export default {
       this.disabled = true
       await this.$store.dispatch('libraries/fetch', library.id)
 
-      if (this.$route.name.startsWith('library')) {
+      if (this.$route.name.startsWith('config')) {
+        // No need to refresh
+      } else if (this.$route.name.startsWith('library')) {
         var newRoute = this.$route.path.replace(currLibraryId, library.id)
         this.$router.push(newRoute)
       } else {

client/components/ui/MultiSelect.vue

@@ -122,6 +122,8 @@ export default {
       this.recalcMenuPos()
     },
     inputBlur() {
+      if (!this.isFocused) return
+
       setTimeout(() => {
         if (document.activeElement === this.$refs.input) {
           return
@@ -136,6 +138,11 @@ export default {
     blur() {
       if (this.$refs.input) this.$refs.input.blur()
     },
+    forceBlur() {
+      this.isFocused = false
+      if (this.textInput) this.submitForm()
+      if (this.$refs.input) this.$refs.input.blur()
+    },
     clickedOption(e, itemValue) {
       if (e) {
         e.stopPropagation()