✨ feat(vscode): 用自定义 SelectMenu 替换原生 select 修复暗色样式

vscode/webview-ui/src/components/ManagedSessionsPanel.tsx

@@ -12,6 +12,8 @@ import type { ManagedSession, ManagedSessionsData } from '../types'
 import { Download, Plus, Terminal, Trash2, X } from 'lucide-react'
 import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'
 
+import { SelectMenu } from './ui/select-menu'
+
 interface ManagedSessionsPanelProps {
   data: ManagedSessionsData
   profiles: ClaudeProfile[]
@@ -143,18 +145,15 @@ export function ManagedSessionsPanel({
         <div className="flex flex-col gap-2">
           <div className="flex items-center gap-2">
             <span className="w-12 shrink-0 text-xs text-[var(--vscode-descriptionForeground)]">Profile</span>
-            <select
+            <SelectMenu
               value={selectedProfile}
-              onChange={e => setSelectedProfile(e.target.value)}
-              className="min-w-0 flex-1 rounded border border-[var(--vscode-input-border,var(--vscode-panel-border))] bg-[var(--vscode-input-background)] px-2 py-1 text-xs text-[var(--vscode-input-foreground)] outline-none focus:ring-1 focus:ring-inset focus:ring-[var(--vscode-focusBorder)]"
-            >
-              {profiles.length === 0 && (
-                <option value="">（无可用 profile）</option>
-              )}
-              {profiles.map(p => (
-                <option key={p.path} value={p.path}>{p.name}</option>
-              ))}
-            </select>
+              onChange={setSelectedProfile}
+              options={profiles.length === 0
+                ? [{ value: '', label: '（无可用 profile）' }]
+                : profiles.map(p => ({ value: p.path, label: p.name }))}
+              variant="input"
+              className="min-w-0 flex-1"
+            />
           </div>
           <div className="flex items-center gap-2">
             <span className="w-12 shrink-0 text-xs text-[var(--vscode-descriptionForeground)]">名字</span>
@@ -385,24 +384,18 @@ function SessionRow({ session, profiles, onRename, onResume, onDelete, onCloseTa
                         <span className="truncate">{basename(session.profilePath)}</span>
                       )
                     : (
-                        <select
+                        <SelectMenu
                           value={pickedProfile}
+                          onChange={setUserPicked}
                           title="换 profile 后点行打开；已打开的终端下次才生效"
-                          onClick={e => e.stopPropagation()}
-                          onMouseDown={e => e.stopPropagation()}
-                          onChange={(e) => {
-                            e.stopPropagation()
-                            setUserPicked(e.target.value)
-                          }}
-                          className="min-w-0 bg-transparent py-0 pr-1 text-[10px] text-[var(--vscode-descriptionForeground)] outline-none focus:ring-1 focus:ring-inset focus:ring-[var(--vscode-focusBorder)]"
-                        >
-                          {storedMissing && (
-                            <option value={pickedProfile}>{basename(pickedProfile) || '（未设置）'}</option>
-                          )}
-                          {profiles.map(p => (
-                            <option key={p.path} value={p.path}>{p.name}</option>
-                          ))}
-                        </select>
+                          variant="ghost"
+                          options={[
+                            ...(storedMissing
+                              ? [{ value: pickedProfile, label: basename(pickedProfile) || '（未设置）' }]
+                              : []),
+                            ...profiles.map(p => ({ value: p.path, label: p.name })),
+                          ]}
+                        />
                       )}
                   {created ? <span className="shrink-0">{(profiles.length > 0 || Boolean(basename(session.profilePath))) ? ' · ' : ''}{created}</span> : null}
                 </span>