fix: reactivity issues

src/options/views/edit/index.vue

@@ -25,7 +25,7 @@
     <div class="frame-block flex-auto pos-rel">
       <vm-code
         class="abs-full"
-        v-model="code"
+        :value="code"
         ref="code"
         v-show="nav === 'code'"
         :active="nav === 'code'"
@@ -48,7 +48,7 @@
       <vm-externals
         class="abs-full"
         v-if="nav === 'externals'"
-        v-model="script"
+        :value="script"
       />
       <vm-help
         class="abs-full edit-body"

src/options/views/tab-installed.vue

@@ -144,6 +144,7 @@
 </template>
 
 <script>
+import { reactive } from 'vue';
 import Dropdown from 'vueleton/lib/dropdown';
 import Tooltip from 'vueleton/lib/tooltip';
 import { i18n, sendCmdDirectly, debounce, makePause } from '@/common';
@@ -428,7 +429,7 @@ export default {
       if (!this.canRenderScripts) return;
       const { length } = this.sortedScripts;
       let limit = 9;
-      const batchRender = { limit };
+      const batchRender = reactive({ limit });
       this.batchRender = batchRender;
       const startTime = performance.now();
       // If we entered a new loop of rendering, this.batchRender will no longer be batchRender

src/options/views/tab-settings/index.vue

@@ -131,6 +131,7 @@
 </template>
 
 <script>
+import { reactive } from 'vue';
 import Tooltip from 'vueleton/lib/tooltip';
 import { debounce, i18n } from '@/common';
 import { INJECT_AUTO, INJECT_PAGE, INJECT_CONTENT } from '@/common/consts';
@@ -215,7 +216,7 @@ const getItemUpdater = (name, normalize) => (
     if (value !== oldValue) options.set(name, value);
   }, 50)
 );
-const settings = items::mapEntry(() => null);
+const settings = reactive({});
 
 export default {
   components: {

src/popup/views/app.vue

@@ -104,7 +104,7 @@
                  @mousedown.middle.exact.stop="onEditScript(item)" />
           </div>
           <div class="submenu-buttons"
-               v-show="activeExtras === item || focusedItem === item || focusBug">
+               v-show="showButtons(item)">
             <!-- Using a standard tooltip that's shown after a delay to avoid nagging the user -->
             <div class="submenu-button" :tabIndex="tabIndex" @click="onEditScript(item)"
                  :title="i18n('buttonEditClickHint')">
@@ -480,6 +480,9 @@ export default {
     updateMessage() {
       this.message = document.activeElement?.dataset.message || '';
     },
+    showButtons(item) {
+      return this.activeExtras?.id === item.id || this.focusedItem?.id === item.id || this.focusBug;
+    },
   },
   mounted() {
     keyboardService.enable();