From d07d71b6f9ce58542e042533ed8a07ee79c153a5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B8=85=E5=87=A4?= <qingf622@outlook.com>
Date: Mon, 14 Sep 2026 08:40:40 -0700
Subject: [PATCH] =?UTF-8?q?feat(web):=20onboarding=20select=20=E5=90=AF?=
 =?UTF-8?q?=E7=94=A8=20hover=20=E6=8F=90=E4=BA=AE=E5=BC=80=E5=85=B3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

三个位于近黑画布上的 select 调用点设置 ui 侧的 data-hover-lighten
（依赖 felinics/ui#26，合并前需先 bump gitlink）：
- Step2 Language、Step3 Client Type：SelectTrigger 直接加属性
- Step4 Chat Model：ModelSelect 新增 hoverLighten prop 透传

dark 下这些 trigger 的 hover 由不可见的纯黑压暗翻转为白色 8% overlay；
light 下该属性为无操作。其余调用点保持默认压黑不动——surface 感知
极性由组件库重构统一裁决。
---
 apps/web/src/pages/bots/components/model-select.vue     | 5 +++++
 apps/web/src/pages/onboarding/steps/Step2Appearance.vue | 5 ++++-
 apps/web/src/pages/onboarding/steps/Step3Provider.vue   | 5 ++++-
 apps/web/src/pages/onboarding/steps/Step4Bot.vue        | 1 +
 4 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/apps/web/src/pages/bots/components/model-select.vue b/apps/web/src/pages/bots/components/model-select.vue
index 6a9e5bdae9..46169ecc93 100644
--- a/apps/web/src/pages/bots/components/model-select.vue
+++ b/apps/web/src/pages/bots/components/model-select.vue
@@ -5,6 +5,7 @@
         data-slot="select-trigger"
         data-size="default"
         :data-placeholder="displayLabel ? undefined : ''"
+        :data-hover-lighten="hoverLighten || undefined"
         type="button"
         :aria-expanded="open"
         :aria-invalid="invalid || undefined"
@@ -56,6 +57,10 @@ const props = defineProps<{
   providers: ProvidersGetResponse[]
   modelType: ModelsModelType
   invalid?: boolean
+  // Opts into the ui package's data-hover-lighten escape hatch (white hover
+  // overlay in dark). For instances sitting directly on the near-black app
+  // canvas (onboarding), where the default pure-black hover fill is invisible.
+  hoverLighten?: boolean
   placeholder?: string
   noneLabel?: string
   showReasoning?: boolean
diff --git a/apps/web/src/pages/onboarding/steps/Step2Appearance.vue b/apps/web/src/pages/onboarding/steps/Step2Appearance.vue
index 8b870bfe53..5c7f5b02f1 100644
--- a/apps/web/src/pages/onboarding/steps/Step2Appearance.vue
+++ b/apps/web/src/pages/onboarding/steps/Step2Appearance.vue
@@ -39,7 +39,10 @@ const { visible, exiting, leave } = useStepTransition()
                 :model-value="language"
                 @update:model-value="(value) => value && setLanguage(value as Locale)"
               >
-                <SelectTrigger class="w-full">
+                <SelectTrigger
+                  class="w-full"
+                  data-hover-lighten
+                >
                   <SelectValue :placeholder="t('settings.languagePlaceholder')" />
                 </SelectTrigger>
                 <SelectContent>
diff --git a/apps/web/src/pages/onboarding/steps/Step3Provider.vue b/apps/web/src/pages/onboarding/steps/Step3Provider.vue
index 4c92eaa183..33a16e95a6 100644
--- a/apps/web/src/pages/onboarding/steps/Step3Provider.vue
+++ b/apps/web/src/pages/onboarding/steps/Step3Provider.vue
@@ -259,7 +259,10 @@ onMounted(() => {
                 </Label>
               </template>
               <Select v-model="formValues.client_type">
-                <SelectTrigger class="w-full">
+                <SelectTrigger
+                  class="w-full"
+                  data-hover-lighten
+                >
                   <SelectValue :placeholder="t('onboarding.provider.form.clientTypePlaceholder')" />
                 </SelectTrigger>
                 <SelectContent>
diff --git a/apps/web/src/pages/onboarding/steps/Step4Bot.vue b/apps/web/src/pages/onboarding/steps/Step4Bot.vue
index f214df808c..a9dba3af13 100644
--- a/apps/web/src/pages/onboarding/steps/Step4Bot.vue
+++ b/apps/web/src/pages/onboarding/steps/Step4Bot.vue
@@ -377,6 +377,7 @@ async function handleSubmit() {
                   :providers="providers"
                   model-type="chat"
                   :placeholder="$t('onboarding.bot.model.selectPlaceholder')"
+                  hover-lighten
                 />
               </template>
             </div>