From 3698568d0b0dfaec5766566601a4004f995d04ee Mon Sep 17 00:00:00 2001
From: wanger <wanger@example.com>
Date: Wed, 29 Apr 2026 11:54:50 +0800
Subject: [PATCH 1/2] fix(dashboard): use v-autocomplete for list+options
 config field (#7884)

Replace v-select with v-autocomplete in the list+options branch of
ConfigItemRenderer. v-select's keyboard typeahead auto-toggles the
first prefix-matching item in multiple mode, which is unusable for
long option lists (e.g. plugin language pickers). v-autocomplete
filters the dropdown by typed text instead.

Bind v-model:search and clear it in @update:model-value so the search
box resets after each selection, allowing consecutive keyword search.
---
 dashboard/src/components/shared/ConfigItemRenderer.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/dashboard/src/components/shared/ConfigItemRenderer.vue b/dashboard/src/components/shared/ConfigItemRenderer.vue
index 58e41f3ab7..3c9eccb6ed 100644
--- a/dashboard/src/components/shared/ConfigItemRenderer.vue
+++ b/dashboard/src/components/shared/ConfigItemRenderer.vue
@@ -87,10 +87,11 @@
       ></v-checkbox>
     </div>
 
-    <v-select
+    <v-autocomplete
       v-else-if="itemMeta?.type === 'list' && itemMeta?.options"
       :model-value="modelValue"
-      @update:model-value="emitUpdate"
+      @update:model-value="val => { emitUpdate(val); listSearchText = '' }"
+      v-model:search="listSearchText"
       :items="getSelectItems(itemMeta)"
       item-title="title"
       item-value="value"
@@ -101,7 +102,7 @@
       hide-details
       chips
       multiple
-    ></v-select>
+    ></v-autocomplete>
 
     <v-select
       v-else-if="itemMeta?.options"
@@ -242,6 +243,7 @@ import { ref } from 'vue'
 import { useI18n, useModuleI18n } from '@/i18n/composables'
 
 const numericTemp = ref(null)
+const listSearchText = ref('')
 
 const props = defineProps({
   modelValue: {

From ed314024a58cf41c7068a781619ad28e9e347eee Mon Sep 17 00:00:00 2001
From: wanger <wanger@example.com>
Date: Wed, 29 Apr 2026 12:25:11 +0800
Subject: [PATCH 2/2] perf(dashboard): memoize list config select items via
 computed

Wrap getSelectItems(itemMeta) in a computed so the options array
is only re-mapped when itemMeta changes, not on every keystroke
in the v-autocomplete search input. Avoids quadratic-ish work for
long option lists
---
 dashboard/src/components/shared/ConfigItemRenderer.vue | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/dashboard/src/components/shared/ConfigItemRenderer.vue b/dashboard/src/components/shared/ConfigItemRenderer.vue
index 3c9eccb6ed..35a9dfc657 100644
--- a/dashboard/src/components/shared/ConfigItemRenderer.vue
+++ b/dashboard/src/components/shared/ConfigItemRenderer.vue
@@ -92,7 +92,7 @@
       :model-value="modelValue"
       @update:model-value="val => { emitUpdate(val); listSearchText = '' }"
       v-model:search="listSearchText"
-      :items="getSelectItems(itemMeta)"
+      :items="listSelectItems"
       item-title="title"
       item-value="value"
       :disabled="itemMeta?.readonly"
@@ -239,7 +239,7 @@ import PersonaSelector from './PersonaSelector.vue'
 import KnowledgeBaseSelector from './KnowledgeBaseSelector.vue'
 import PluginSetSelector from './PluginSetSelector.vue'
 import T2ITemplateEditor from './T2ITemplateEditor.vue'
-import { ref } from 'vue'
+import { computed, ref } from 'vue'
 import { useI18n, useModuleI18n } from '@/i18n/composables'
 
 const numericTemp = ref(null)
@@ -280,6 +280,12 @@ function emitUpdate(val) {
   emit('update:modelValue', val)
 }
 
+const listSelectItems = computed(() =>
+  props.itemMeta?.type === 'list' && props.itemMeta?.options
+    ? getSelectItems(props.itemMeta)
+    : []
+)
+
 function toNumber(val) {
   const n = parseFloat(val)
   return isNaN(n) ? 0 : n