@deepseek-ai/dsh-client-ui-model-selection 0.1.7-rc.2 → 0.2.0-rc.2

package/README.i18n.yaml

@@ -6,8 +6,8 @@
   en: f39813648aeef5a0
   zh: eea25094e8bfc031
 /deepseek-ai-dsh-client-ui-model-selection:
-  en: 5e007d579a0e22f0
-  zh: edfff0d021712077
+  en: 4cb6feb12e46f3a0
+  zh: eea39dd76fe1fa8b
 /deepseek-ai-dsh-client-ui-model-selection/summary:
   en: 2fb361ef704528fb
   zh: 2537d2afb4d2cb45
@@ -15,11 +15,11 @@
   en: d152484eb41ac6b4
   zh: 09388d293f9be9cb
 /deepseek-ai-dsh-client-ui-model-selection/use-this-package:
-  en: e5a1df3a4dfe5041
-  zh: 6269e73026b32a33
+  en: 62235f8c8c9e1e7e
+  zh: c18dc9c38ef9d4f9
 /deepseek-ai-dsh-client-ui-model-selection/use-this-package/model-and-effort:
-  en: e38d0195677a7b69
-  zh: 4eea8a9b1664afd9
+  en: 48f8157ffdfe6e69
+  zh: 64ec9a533e2aa8f4
 /deepseek-ai-dsh-client-ui-model-selection/use-this-package/unroutable-sessions:
   en: 7f20428c747ff052
   zh: 975e6de728e02fa0
@@ -27,8 +27,8 @@
   en: 261bbf42296243af
   zh: 72779fb7b8fbc473
 /deepseek-ai-dsh-client-ui-model-selection/understand-the-implementation:
-  en: 493088e8de6be91c
-  zh: 9ecee4605b4dbad4
+  en: f3d38594439eab3d
+  zh: f255974e61696dca
 /deepseek-ai-dsh-client-ui-model-selection/further-exploration:
   en: 14acd4692e923480
   zh: ff89aed852aa0da8

package/README.md

@@ -7,6 +7,8 @@ kind: "package-reference"
 
 English | [中文](README.zh.md)
 
+Desktop product events use the optional [product analytics service](../product-analytics/README.md); ordinary Web interactions are excluded.
+
 ## Summary
 
 The Web GUI lets users switch the model and reasoning effort for an existing session through either the `/model` popup or the composer's model control. Both surfaces present the same provider-grouped choices, and the selected model determines the available effort names and default. A complete selection applies to the next request; a running step keeps the model and effort it started with. If the selected model is unavailable, the composer stays disabled until the user selects an available model or that exact model becomes available again.
@@ -29,13 +31,17 @@ DeepSeek account and API-key routes appear as separate provider groups, each exp
 
 The unselected model label uses the same regular weight as an available model name and retains the saved reasoning effort caption for existing and new sessions; effort editing requires an available model. Clicking the unselected trigger opens the model list directly; Escape closes it.
 
-Mount this plugin alongside `ui-conversation` and the commands package; the composer then shows the model seat next to the pending indicator, and `/model` opens the same directory as a popup. While the seat's menu is open, `↑`/`↓` move focus across the rows of the shown pane, Tab settles the focused row, and Escape and `Shift+Tab` leave a drilled pane first and otherwise close back to the trigger. Drilling lands on the row of the value in use, and going back lands on the cell that opened the pane left. The composer shows the catalog name while the selected model is available, and its saved `provider/model` ID when the model or provider is removed, including account sign-out. The stored provider, model, and reasoning effort remain unchanged.
+Mount this plugin alongside `ui-conversation` and the commands package; the composer then shows the model seat next to the pending indicator, and `/model` opens the same directory as a popup. While the seat's menu is open, `↑`/`↓` move focus through root and effort rows, or move the model-list highlight without leaving search. Enter and Tab settle the highlighted model or focused row; Escape and `Shift+Tab` leave a drilled pane first and otherwise close back to the trigger. Drilling focuses model search when shown, otherwise the current model or effort row, and going back lands on the cell that opened the pane left. The composer shows the catalog name while the selected model is available, and its saved `provider/model` ID when the model or provider is removed, including account sign-out. The stored provider, model, and reasoning effort remain unchanged.
 
-Mouse selection uses native browser clicks, including their cancellation behavior; a press alone never selects. Opening the menu focuses its trigger, and clicking the trigger again closes the menu and returns focus there. While a selection from either entry is pending, focus stays on the trigger, the trigger shows a spinner in place of its chevron, and each row whose value the selection carries shows one in place of its check; a rejected selection leaves the menu open, and Tab returns to the current row.
+Mouse selection uses native browser clicks, including their cancellation behavior; a press alone never selects. Opening the root menu focuses its trigger, and clicking the trigger again closes the menu and returns focus there. Root rows and the search-clear button show the same fill for keyboard focus and hover, without a native outline. Selecting a model or effort returns focus to the trigger without a focus ring; leaving the trigger or reopening the menu restores its normal focus indication. While a selection from either entry is pending, focus stays on the trigger, the trigger shows a spinner in place of its chevron, and each row whose value the selection carries shows one in place of its check; a rejected selection leaves the menu open. Tab returns to model search with the current model highlighted when search is shown, otherwise to the current row.
 
 ### Model and effort
 
-Models stay grouped by provider. The composer menu shows model and effort names only, with DeepSeek Account first and DeepSeek second; third-party providers retain their catalog order. Navigation chevrons use `--dsw-alias-menu-icon`. The `/model` popup shows provider names and catalog descriptions; it localizes the two built-in DeepSeek descriptions and leaves external provider descriptions verbatim. The popup applies the selected model's default effort; the composer can then choose any advertised effort. An adapter without reasoning metadata leaves the Effort row absent; there is no arbitrary effort input.
+The button's model menu shows search only when its full catalog contains more than four models; smaller catalogs focus the current model or first row and support keyboard navigation directly. The `/model` command always keeps its search field. Both search fields match model names case-insensitively, including nonconsecutive characters in order; leading and trailing spaces are ignored. Within each provider, prefix matches come first, followed by alignment score and then catalog order. Empty groups are hidden. Empty catalogs and queries without matches are announced through a status region. Search keeps focus while arrow keys cycle the highlighted result across provider groups; Enter or Tab selects it. Left and right arrows keep their native caret behavior. Opening highlights the current model or the first available row, and editing the query resets the highlight to the first result. Reopening the model pane clears the query.
+
+Model and reasoning-effort names use weight 400 (regular) in the composer menu, including the selected item. The search field follows the command popup's compact treatment with transparent background and border in both palettes, with no leading icon and a caption-tone placeholder. The clear button appears for a nonempty query and restores the full list with focus in the search field.
+
+Both entries group models by provider, with DeepSeek Account first and DeepSeek second; third-party providers retain their catalog order. Both use the shared, asynchronously observed sticky headings from [ui-primitives](../ui-primitives/README.md#understand-the-implementation): transparent at rest, with the theme's 94%-opaque fill only while pinned, and `md` corners outside macOS Desktop. The composer menu shows model and effort names only. Navigation chevrons use `--dsw-alias-menu-icon`. The `/model` popup shows provider names as group headings and model names as rows, without repeating the provider on each row or showing catalog descriptions. Its search placeholder, no-match text, and empty-catalog text use the same localized labels as the composer model menu. The popup applies the selected model's default effort; the composer can then choose any advertised effort. An adapter without reasoning metadata leaves the Effort row absent; there is no arbitrary effort input.
 
 The composer replaces the model and effort text with the Models icon when the expanded controls cannot share one line, and restores the text when space permits. The full selection remains available in the trigger's accessible name, tooltip, and menu.
 
@@ -57,6 +63,8 @@ Menus use the shared `MenuSurface` material, including the macOS backing for bac
 <details>
 <summary>Implementation internals — click to expand</summary>
 
+The composer `ModelSelect` and `/model` option builder share [provider ordering](src/client/provider-order.ts), while both searches use `rankByName` within each provider. The command supplies optional groups and `searchMode: 'fuzzy-label'` through the [popupSelect API](../ui-commands/README.md#use-this-package); both entries use `MenuGroup` and rebuild its sticky observer when the rendered groups change. The command popup fills the composer overlay, while the button retains its compact menu.
+
 Two entries over ONE per-session directory owned by `ModelDirectoryResolver` (`ctx.modelDirectories`): the `/model` popupSelect contribution (registered through `ctx.commandUi`) and the composer's named `conversation.input.model` seat both load the session's available directory through `session.models` and submit through `session.selectModel` via the same `ModelDirectory` instance, so a switch made in either entry is what the other shows next. Directory loads and selections share a generation counter so an older response never overwrites a newer one. The directory publishes the latest submitted selection as `pending` until it settles or a connection reset invalidates it; a connection reset drops every resident projection and repulls the Host-restored selection before display. Directories are per-session, resolved lazily, and disposed with the session scope; addressed subagent sessions expose neither entry. Every resident directory refetches directly on forwarded `llm/adapters-updated`, `settings/document-updated`, and credential update events.
 
 </details>

package/README.zh.md

@@ -7,6 +7,8 @@ kind: "package-reference"
 
 [English](README.md) | 中文
 
+桌面端产品事件使用可选的[产品埋点服务](../product-analytics/README.zh.md)，不包含普通 Web 交互。
+
 ## 概述
 
 Web GUI 允许用户通过 `/model` 弹窗或 composer 模型控件切换既有会话使用的模型与推理（reasoning）强度。两个界面呈现同一组按提供方分组的选择；所选模型决定可用的推理强度名称与默认值。完整选择从下一次请求开始生效；运行中的步骤保留其启动时的模型与推理强度。所选模型不可用时，composer 保持停用，直到用户选择可用模型或同一模型恢复可用。
@@ -29,13 +31,17 @@ DeepSeek 账号和 API Key 路由显示为独立提供方分组，各自展示
 
 未选模型文案与可用模型名使用相同的常规字重，并在既有会话与新会话中保留已保存的推理强度显示；调整推理强度需要先选择可用模型。点击未选模型控件直接打开模型列表，Escape 关闭列表。
 
-与 `ui-conversation` 及命令包一起挂载本插件；composer 随即在待处理指示器旁显示模型位，`/model` 则以弹窗打开同一份目录。模型位菜单打开期间，`↑`／`↓` 在所显示面板的行间移动焦点，`Tab` 选定聚焦行，Escape 与 `Shift+Tab` 先退出已下钻的面板，否则关闭并回到触发器。下钻落在正在使用的那一行，返回则落在打开该面板的格子上。所选模型可用时，composer 显示目录中的模型名称；模型或提供方被删除时（包括账号退登），改为显示已保存的 `provider/model` ID。保存的提供方、模型和推理强度均保持不变。
+与 `ui-conversation` 及命令包一起挂载本插件；composer 随即在待处理指示器旁显示模型位，`/model` 则以弹窗打开同一份目录。模型位菜单打开期间，`↑`／`↓` 在根菜单和推理等级行间移动焦点，或在模型列表中移动高亮并让焦点保留在搜索框。Enter 和 Tab 选定高亮模型或聚焦行；Escape 与 `Shift+Tab` 先退出已下钻的面板，否则关闭并回到触发器。下钻时若显示模型搜索框则聚焦搜索框，否则聚焦当前模型或推理强度行，返回则落在打开该面板的格子上。所选模型可用时，composer 显示目录中的模型名称；模型或提供方被删除时（包括账号退登），改为显示已保存的 `provider/model` ID。保存的提供方、模型和推理强度均保持不变。
 
-鼠标选择沿用浏览器原生点击及其取消行为；仅按下按钮不会选定。打开菜单时聚焦触发按钮，再次点击触发按钮会关闭菜单并把焦点还给它。等待任一入口发起的选择结果时，焦点停在触发按钮，触发按钮以加载图标代替下拉箭头，该选择包含的值所在行以加载图标代替勾选标记；选择被拒绝后菜单保持打开，Tab 可回到当前选中的行。
+鼠标选择沿用浏览器原生点击及其取消行为；仅按下按钮不会选定。打开根菜单时聚焦触发按钮，再次点击触发按钮会关闭菜单并把焦点还给它。根菜单行和搜索清除按钮的键盘焦点与悬停使用相同底色，不显示原生焦点轮廓。选定模型或推理等级后，焦点返回触发按钮但不显示焦点环；焦点离开按钮或重新打开菜单后恢复正常焦点提示。等待任一入口发起的选择结果时，焦点停在触发按钮，触发按钮以加载图标代替下拉箭头，该选择包含的值所在行以加载图标代替勾选标记；选择被拒绝后菜单保持打开。显示模型搜索框时，Tab 返回搜索框并高亮当前模型，否则返回当前选中行。
 
 ### 模型与推理强度
 
-模型按提供方分组。composer 菜单只显示模型与推理强度名称，DeepSeek 账号排第一，DeepSeek 排第二，第三方提供方保持目录原有顺序。导航箭头使用 `--dsw-alias-menu-icon` 文本色。`/model` 弹窗显示提供方名称与目录说明；其中两个内置 DeepSeek 模型的说明使用当前语言，外部提供方说明保持原文。弹窗应用所选模型的默认推理强度；composer 随后可以选择任一已公布的推理强度。适配器没有推理元数据时不显示 Effort 行；不存在任意推理强度输入。
+按钮模型菜单仅在完整目录超过四个模型时显示搜索框；较小目录聚焦当前模型或首行，直接支持键盘导航。`/model` 命令始终保留搜索框。两个搜索框均按模型名称进行不区分大小写的匹配，支持按顺序输入不连续字符，并忽略首尾空格。每个提供方内的结果优先按前缀匹配、其次按匹配得分、最后按目录顺序排列。没有匹配项的分组会隐藏。空目录和无匹配结果均通过状态区域通知屏幕阅读器。方向键在各提供方分组的结果间循环移动高亮，焦点保留在搜索框；Enter 或 Tab 选定高亮项。左右方向键仍用于移动输入光标。打开时高亮当前模型或首个可用选项，修改搜索内容后高亮首个结果。重新打开模型面板会清空搜索内容。
+
+composer 菜单中的模型名称和推理等级均使用 400（regular）字重，包括选中项。搜索框沿用 command 弹窗的紧凑样式，在浅／深色主题下均保持背景和边框透明，不显示前置图标，占位文字使用 caption 色。搜索内容非空时显示清除按钮；点击后恢复完整列表，并将焦点留在搜索框。
+
+两个入口均按提供方分组，DeepSeek 账号排第一，DeepSeek 排第二，第三方提供方保持目录原有顺序。两者采用 [ui-primitives](../ui-primitives/README.zh.md#understand-the-implementation) 异步观察的共享吸顶标题：原位透明，仅吸顶时使用主题的 94% 不透明填充，macOS 桌面端以外使用 `md` 圆角。composer 菜单只显示模型与推理强度名称。导航箭头使用 `--dsw-alias-menu-icon` 文本色。`/model` 弹窗以提供方名称作为分组标题、模型名称作为选项行，不在每行重复提供方，也不显示目录说明。搜索占位文字、无匹配提示和空目录提示与 composer 模型菜单共用同一组本地化文案。弹窗应用所选模型的默认推理强度；composer 随后可以选择任一已公布的推理强度。适配器没有推理元数据时不显示 Effort 行；不存在任意推理强度输入。
 
 展开的控件无法排在同一行时，composer 将模型与推理强度文字替换为模型图标；空间足够后恢复文字。触发器的无障碍名称、提示和菜单仍提供完整选择。
 
@@ -57,6 +63,8 @@ DeepSeek 账号和 API Key 路由显示为独立提供方分组，各自展示
 <details>
 <summary>实现细节——点击展开</summary>
 
+composer 的 `ModelSelect` 与 `/model` 选项构建器共用[提供方排序](src/client/provider-order.ts)，两个搜索框均在每个提供方内使用 `rankByName`。命令通过 [popupSelect API](../ui-commands/README.zh.md#use-this-package) 提供可选分组与 `searchMode: 'fuzzy-label'`；两个入口均使用 `MenuGroup`，并在渲染分组变化时重建其吸顶观察器。命令弹窗撑满 composer 浮层，按钮则保留紧凑菜单。
+
 两个入口共用一份由 `ModelDirectoryResolver`（`ctx.modelDirectories`）持有的会话级目录：`/model` popupSelect 贡献项（经 `ctx.commandUi` 注册）与 composer 的具名 `conversation.input.model` 位都经 `session.models` 加载会话的可用目录、经 `session.selectModel` 通过同一个 `ModelDirectory` 实例提交，因此任一入口所做的切换正是另一个入口接下来显示的。目录加载与选择共享一个代次计数器，旧响应不会覆盖新结果。目录把最近一次提交的选择发布为 `pending`，直到它完成或被连接重置作废；连接重置丢弃所有常驻投影，并在显示前重新拉取 Host 恢复的选择。目录按会话惰性解析，随会话作用域一并 dispose（资源释放）；已寻址 subagent 会话不公开任一入口。每份常驻目录都会直接在转发的 `llm/adapters-updated`、`settings/document-updated` 与凭据更新事件上重拉。
 
 </details>

package/lib/client.js

@@ -173,6 +173,8 @@ window.__ModuleLoader__.load({
 			available;
 			catalog;
 			projected;
+			isBlank;
+			track;
 			/** The shared snapshot both entries render from (uSES-safe store). */
 			store = (0, _deepseek_ai_dsh_client_store.createSnapshotStore)({
 				current: null,
@@ -194,13 +196,17 @@ window.__ModuleLoader__.load({
 			* @param available - whether this session may use Agent-bound model RPCs.
 			* @param catalog - Host-generation catalog shared by every Session.
 			* @param projected - durable model selection projected from Session history.
+			* @param isBlank - whether this Session has no first message yet.
+			* @param track - desktop-only callback after a successful user selection.
 			*/
-			constructor(sessions, sessionId, available, catalog, projected) {
+			constructor(sessions, sessionId, available, catalog, projected, isBlank, track) {
 				this.sessions = sessions;
 				this.sessionId = sessionId;
 				this.available = available;
 				this.catalog = catalog;
 				this.projected = projected;
+				this.isBlank = isBlank;
+				this.track = track;
 				this.unsubscribeCatalog = catalog.store.subscribe(() => {
 					this.syncInputs();
 				});
@@ -228,6 +234,9 @@ window.__ModuleLoader__.load({
 			*/
 			async select(selection) {
 				this.assertAvailable();
+				const previous = this.store.getSnapshot().current;
+				const previousEffort = previous?.reasoningEffort ?? (previous === null ? void 0 : this.catalog.reasoningFor(previous)?.defaultEffort);
+				const nextEffort = selection.reasoningEffort ?? this.catalog.reasoningFor(selection)?.defaultEffort;
 				const generation = ++this.generation;
 				this.store.update((s) => {
 					s.status = "selecting";
@@ -252,6 +261,21 @@ window.__ModuleLoader__.load({
 					});
 					return result;
 				}
+				if (previous !== null) {
+					const from = `${previous.provider}/${previous.model}`;
+					const to = `${selection.provider}/${selection.model}`;
+					if (from !== to) this.track?.("model_switch", {
+						...this.isBlank() ? {} : { session_id: this.sessionId },
+						switch_from: from,
+						switch_to: to
+					});
+					if (from === to && previousEffort !== nextEffort) this.track?.("thinking_level_switch", {
+						...this.isBlank() ? {} : { session_id: this.sessionId },
+						model_name: to,
+						switch_from: previousEffort ?? "default",
+						switch_to: nextEffort ?? "default"
+					});
+				}
 				this.store.update((s) => {
 					s.status = "ready";
 					s.pending = null;
@@ -325,20 +349,6 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region lib/types/client/service.js
-		/**
-		* ModelDirectoryResolver (`ctx.modelDirectories`): the root owner of per-session
-		* {@link ModelDirectory} instances. Both selection entries (the /model popup
-		* and the composer model seat) resolve their session's directory through
-		* this service, which is what makes the dual entry one shared state.
-		*
-		* Per-session storage follows the client service pattern (InputTriggerService /
-		* CommandUiRuntime): a lazy service-internal map whose entry is deleted by the
-		* owning scope's disposer. The host `dsh-scope` ScopedLayers registry does
-		* does not belong here: it derives scope from the host carrier mechanism
-		* (object-keyed), while client scopes tag contexts with branded SessionId
-		* strings, and it models global+shadow named registries — this is a
-		* per-session singleton with no global layer to merge.
-		*/
 		/** The `ctx.modelDirectories` session model-selection service. */
 		var ModelDirectoryResolver = class extends _deepseek_ai_cordis.Service {
 			static inject = [
@@ -387,7 +397,7 @@ window.__ModuleLoader__.load({
 				if (binding === void 0) throw new Error(`ui-model-selection: session "${String(sessionId)}" resolved no binding`);
 				const existing = live.directories.get(binding);
 				if (existing !== void 0) return existing;
-				const directory = new ModelDirectory(this.ctx.remote.session, sessionId, () => sessions.subagentAddress(sessionId) === void 0, this.catalog, binding.session.projections.faceOf("modelSelection"));
+				const directory = new ModelDirectory(this.ctx.remote.session, sessionId, () => sessions.subagentAddress(sessionId) === void 0, this.catalog, binding.session.projections.faceOf("modelSelection"), () => binding.session.getSnapshot().blank, (name, attributes) => this.ctx.get("productAnalytics")?.track(name, attributes));
 				live.directories.set(binding, directory);
 				actx.effect(() => () => {
 					directory.dispose();
@@ -413,7 +423,7 @@ window.__ModuleLoader__.load({
 		}
 		//#endregion
 		//#region \0dsh-css:/home/runner/work/deepseek-harness/deepseek-harness/packages/client/ui-model-selection/src/client/ModelSelect.module.css.mjs
-		const css = "._7KE1Ra_root{min-width:0;position:relative}._7KE1Ra_trigger{border-radius:var(--dsw-radius-sm);min-width:0;max-width:min(360px,45cqw);height:28px;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:none;outline:none;align-items:center;gap:4px;padding:0 4px 0 8px;font-size:13px;font-weight:400;line-height:20px;display:flex}._7KE1Ra_trigger:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}._7KE1Ra_trigger:focus-visible{box-shadow:0 0 0 2px var(--dsw-focus-ring-color,var(--dsw-alias-state-business-primary))}._7KE1Ra_trigger:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}._7KE1Ra_triggerLabel{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}._7KE1Ra_triggerEffort{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--dsw-alias-label-caption);flex-shrink:1000;overflow:hidden}._7KE1Ra_triggerIcon{display:var(--dsh-composer-model-icon-display,none);flex:none}._7KE1Ra_triggerLabel,._7KE1Ra_triggerEffort{display:var(--dsh-composer-model-text-display,block)}._7KE1Ra_chevron{color:var(--dsw-alias-label-caption);flex:none;transition:transform .12s}._7KE1Ra_chevronOpen{transform:rotate(180deg)}._7KE1Ra_menu{z-index:1100;--dsw-elevation-stroke-color:var(--dsw-alias-border-l1);width:max-content;min-width:min(240px,100vw - 32px);max-width:min(420px,100vw - 32px);max-height:min(360px,100vh - 96px);box-shadow:var(--dsw-elevation-prominent);color:var(--dsw-alias-label-primary);--dsh-scrollbar-thumb:var(--dsw-alias-scrollbar-bg-l2);--dsh-scrollbar-thumb-hover:var(--dsw-alias-scrollbar-hover-l2);border:0;flex-direction:column;padding:4px;display:flex;position:fixed;overflow:hidden}._7KE1Ra_status,._7KE1Ra_empty{color:var(--dsw-alias-label-tertiary);padding:8px;font-size:12px;line-height:18px}._7KE1Ra_error,._7KE1Ra_warning{border-radius:var(--dsw-radius-md);background:var(--dsw-alias-interactive-bg-hover-danger);color:var(--dsw-alias-state-error-primary);justify-content:space-between;align-items:flex-start;gap:6px;margin-bottom:3px;padding:6px 7px;font-size:11px;line-height:16px;display:flex}._7KE1Ra_warning{background:var(--dsw-alias-bg-module-platform);color:var(--dsw-alias-state-warn-label)}._7KE1Ra_retry{color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;flex:none;padding:0;font-weight:600}._7KE1Ra_groups{min-height:0;overflow-y:auto}._7KE1Ra_group+._7KE1Ra_group{margin-top:3px}._7KE1Ra_groupTitle{z-index:1;background:var(--dsw-specific-menu);color:var(--dsw-alias-label-tertiary);padding:4px 7px 2px;font-size:11px;font-weight:500;line-height:16px;position:sticky;top:0}._7KE1Ra_option{box-sizing:border-box;border-radius:var(--dsw-radius-md);width:auto;min-width:100%;min-height:34px;color:inherit;text-align:left;cursor:pointer;background:0 0;border:none;outline:none;align-items:center;gap:6px;padding:5px 7px;display:flex}._7KE1Ra_option:hover:not(:disabled),._7KE1Ra_option:focus-visible{background:var(--dsw-alias-interactive-bg-hover)}._7KE1Ra_selected{background:0 0}._7KE1Ra_option:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}._7KE1Ra_optionCopy{flex-direction:column;flex:1;min-width:0;display:flex}._7KE1Ra_modelName{color:inherit;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:500;line-height:18px;overflow:hidden}._7KE1Ra_check{color:var(--dsw-alias-label-primary);flex:0 0 14px;place-items:center;display:grid}._7KE1Ra_check svg{width:14px;height:14px}._7KE1Ra_cell{box-sizing:border-box;border-radius:var(--dsw-radius-md);width:auto;min-width:100%;height:34px;color:var(--dsw-alias-label-primary);cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:6px;padding:0 8px;font-size:13px;line-height:20px;display:flex}._7KE1Ra_cell:hover{background:var(--dsw-alias-interactive-bg-hover)}._7KE1Ra_cellLabel{white-space:nowrap;flex:none}._7KE1Ra_cellValue{text-overflow:ellipsis;white-space:nowrap;text-align:right;min-width:0;color:var(--dsw-alias-label-tertiary);flex:auto;overflow:hidden}._7KE1Ra_cellChevron{width:12px;height:12px;color:var(--dsw-alias-menu-icon);flex:none}";
+		const css = "._7KE1Ra_root{min-width:0;position:relative}._7KE1Ra_trigger{border-radius:var(--dsw-radius-sm);min-width:0;max-width:min(360px,45cqw);height:28px;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:none;outline:none;align-items:center;gap:4px;padding:0 4px 0 8px;font-size:13px;font-weight:400;line-height:20px;display:flex}._7KE1Ra_trigger:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}._7KE1Ra_trigger:focus-visible:not([data-selection-focus]){box-shadow:0 0 0 2px var(--dsw-focus-ring-color,var(--dsw-alias-state-business-primary))}._7KE1Ra_trigger:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}._7KE1Ra_triggerLabel{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}._7KE1Ra_triggerEffort{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--dsw-alias-label-caption);flex-shrink:1000;overflow:hidden}._7KE1Ra_triggerIcon{display:var(--dsh-composer-model-icon-display,none);flex:none}._7KE1Ra_triggerLabel,._7KE1Ra_triggerEffort{display:var(--dsh-composer-model-text-display,block)}._7KE1Ra_chevron{color:var(--dsw-alias-label-caption);flex:none;transition:transform .12s}._7KE1Ra_chevronOpen{transform:rotate(180deg)}._7KE1Ra_menu{z-index:1100;--dsw-elevation-stroke-color:var(--dsw-alias-border-l1);width:max-content;min-width:min(240px,100vw - 32px);max-width:min(420px,100vw - 32px);max-height:min(360px,100vh - 96px);box-shadow:var(--dsw-elevation-prominent);color:var(--dsw-alias-label-primary);--dsh-scrollbar-thumb:var(--dsw-alias-scrollbar-bg-l2);--dsh-scrollbar-thumb-hover:var(--dsw-alias-scrollbar-hover-l2);border:0;flex-direction:column;padding:4px;display:flex;position:fixed;overflow:hidden}._7KE1Ra_status,._7KE1Ra_empty{color:var(--dsw-alias-label-tertiary);padding:8px;font-size:12px;line-height:18px}._7KE1Ra_error,._7KE1Ra_warning{border-radius:var(--dsw-radius-md);background:var(--dsw-alias-interactive-bg-hover-danger);color:var(--dsw-alias-state-error-primary);justify-content:space-between;align-items:flex-start;gap:6px;margin-bottom:3px;padding:6px 7px;font-size:11px;line-height:16px;display:flex}._7KE1Ra_warning{background:var(--dsw-alias-bg-module-platform);color:var(--dsw-alias-state-warn-label)}._7KE1Ra_retry{color:inherit;font:inherit;cursor:pointer;background:0 0;border:none;flex:none;padding:0;font-weight:600}._7KE1Ra_searchRow{flex-shrink:0;margin:2px 0 3px;position:relative}._7KE1Ra_searchRow ._7KE1Ra_search{border-radius:var(--dsw-radius-md);background:0 0;border:0 solid #0000;height:auto;padding:5px 7px;display:flex}._7KE1Ra_searchRow ._7KE1Ra_searchWithQuery{padding-right:34px}._7KE1Ra_searchClear{corner-shape:round;width:24px;height:24px;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;display:inline-flex;position:absolute;top:50%;right:4px;transform:translateY(-50%)}._7KE1Ra_searchClear:hover,._7KE1Ra_searchClear:focus-visible{background:var(--dsw-alias-interactive-bg-hover);outline:none}._7KE1Ra_searchRow ._7KE1Ra_search:focus-within{border-color:#0000}._7KE1Ra_searchRow ._7KE1Ra_search input{padding:0;font-size:12px;line-height:normal}._7KE1Ra_searchRow ._7KE1Ra_search input::placeholder{color:var(--dsw-alias-label-caption)}._7KE1Ra_groups{min-height:0;overflow-y:auto}._7KE1Ra_option{box-sizing:border-box;border-radius:var(--dsw-radius-md);width:auto;min-width:100%;min-height:34px;color:inherit;text-align:left;cursor:pointer;background:0 0;border:none;outline:none;align-items:center;gap:6px;padding:5px 7px;display:flex}._7KE1Ra_option:not(._7KE1Ra_modelOption):hover:not(:disabled),._7KE1Ra_option:focus-visible,._7KE1Ra_optionActive:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}._7KE1Ra_selected{background:0 0}._7KE1Ra_option:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}._7KE1Ra_optionCopy{flex-direction:column;flex:1;min-width:0;display:flex}._7KE1Ra_modelName{color:inherit;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:400;line-height:18px;overflow:hidden}._7KE1Ra_check{color:var(--dsw-alias-label-primary);flex:0 0 14px;place-items:center;display:grid}._7KE1Ra_check svg{width:14px;height:14px}._7KE1Ra_cell{box-sizing:border-box;border-radius:var(--dsw-radius-md);width:auto;min-width:100%;height:34px;color:var(--dsw-alias-label-primary);cursor:pointer;text-align:left;background:0 0;border:none;outline:none;align-items:center;gap:6px;padding:0 8px;font-size:13px;line-height:20px;display:flex}._7KE1Ra_cell:hover,._7KE1Ra_cell:focus-visible{background:var(--dsw-alias-interactive-bg-hover)}._7KE1Ra_cellLabel{white-space:nowrap;flex:none}._7KE1Ra_cellValue{text-overflow:ellipsis;white-space:nowrap;text-align:right;min-width:0;color:var(--dsw-alias-label-tertiary);flex:auto;overflow:hidden}._7KE1Ra_cellChevron{width:12px;height:12px;color:var(--dsw-alias-menu-icon);flex:none}";
 		const tagId = "@deepseek-ai/dsh-client-ui-model-selection/ModelSelect.module.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId) + "]") === null) {
 			const tag = document.createElement("style");
@@ -432,15 +442,19 @@ window.__ModuleLoader__.load({
 			"chevronOpen": "_7KE1Ra_chevronOpen",
 			"empty": "_7KE1Ra_empty",
 			"error": "_7KE1Ra_error",
-			"group": "_7KE1Ra_group",
-			"groupTitle": "_7KE1Ra_groupTitle",
 			"groups": "_7KE1Ra_groups",
 			"menu": "_7KE1Ra_menu",
 			"modelName": "_7KE1Ra_modelName",
+			"modelOption": "_7KE1Ra_modelOption",
 			"option": "_7KE1Ra_option",
+			"optionActive": "_7KE1Ra_optionActive",
 			"optionCopy": "_7KE1Ra_optionCopy",
 			"retry": "_7KE1Ra_retry",
 			"root": "_7KE1Ra_root",
+			"search": "_7KE1Ra_search",
+			"searchClear": "_7KE1Ra_searchClear",
+			"searchRow": "_7KE1Ra_searchRow",
+			"searchWithQuery": "_7KE1Ra_searchWithQuery",
 			"selected": "_7KE1Ra_selected",
 			"status": "_7KE1Ra_status",
 			"trigger": "_7KE1Ra_trigger",
@@ -450,6 +464,17 @@ window.__ModuleLoader__.load({
 			"warning": "_7KE1Ra_warning"
 		};
 		//#endregion
+		//#region lib/types/client/provider-order.js
+		/** Shared provider display order for the composer and command model pickers. */
+		/**
+		* Put the account and official providers first, preserving every other relative order.
+		* @param groups - Provider groups in catalog order.
+		* @returns a sorted copy; model order within each group is unchanged.
+		*/
+		function orderModelProviders(groups) {
+			return groups.toSorted((left, right) => (left.id === "deepseek-account" ? 0 : left.id === "deepseek-official" ? 1 : 2) - (right.id === "deepseek-account" ? 0 : right.id === "deepseek-official" ? 1 : 2));
+		}
+		//#endregion
 		//#region lib/types/client/ModelSelect.js
 		/**
 		* ModelSelect: the composer's named model seat (`conversation.input.model`).
@@ -458,19 +483,25 @@ window.__ModuleLoader__.load({
 		* each drilling into its own list — the provider-grouped model list over
 		* the shared directory, and the effort levels. The trigger (313:14108's
 		* ToggleButton) shows both: model name + effort in the caption tone.
-		* While open, ↑/↓ move focus across the rows of the shown pane (wrapping; a
-		* step taken while the trigger still holds focus enters at the near end), Tab
-		* settles like Enter, and Escape and Shift+Tab leave a drilled pane first and
-		* otherwise close back to the trigger. A drilled pane hands focus to the row
-		* of the value in use, and returning to the root pane hands it back to the
-		* cell that opened it. Data and submission ride the SAME per-session
-		* ModelDirectory as the /model popup; exact-model reasoning metadata and the
-		* selected effort come from the Host rather than a client-owned vocabulary. A
-		* rejected selection announces through the shared transient Toast anchored to
-		* the composer card; the in-menu strip with Retry remains the catalog-load
-		* surface. While the directory's pending selection is unsettled, the trigger
-		* shows a spinner in place of its chevron, and each row whose value that
-		* selection carries shows one in place of its check mark.
+		* Model catalogs above four entries show search, which retains focus while
+		* ↑/↓ cycle the highlighted result; Enter and Tab accept it. Smaller model
+		* catalogs, root panes, and effort panes move focus between rows. Escape and Shift+Tab leave a drilled pane first and otherwise close
+		* back to the trigger. A drilled pane focuses the current effort or model
+		* search field. Provider headings paint their background only while pinned
+		* by scrolling. Clearing a query restores the full list and search focus.
+		* Selecting restores trigger focus without a ring until the trigger loses focus
+		* or the menu reopens. Model names match a case-insensitive ordered subsequence
+		* within each provider group, ranked by
+		* prefix, alignment score, then catalog order. Returning to the root pane
+		* hands focus back to the cell that opened it. Data and submission ride the
+		* same per-session ModelDirectory as the /model popup; exact-model reasoning
+		* metadata and the selected effort come from the Host rather than a
+		* client-owned vocabulary. A rejected selection announces through the shared
+		* transient Toast anchored to the composer card; the in-menu strip with
+		* Retry remains the catalog-load surface. While the directory's pending
+		* selection is unsettled, the trigger shows a spinner in place of its
+		* chevron, and each row whose value that selection carries shows one in place
+		* of its check mark.
 		*/
 		/** Unplaced portal card: hidden but laid out at a fixed origin so offsetWidth/offsetHeight are real (Menu primitive's measure pass). */
 		const MEASURE_STYLE = {
@@ -488,16 +519,21 @@ window.__ModuleLoader__.load({
 			const state = (0, react.useSyncExternalStore)((fn) => directory.subscribe(fn), () => directory.getSnapshot());
 			const [open, setOpen] = (0, react.useState)(false);
 			const [pane, setPane] = (0, react.useState)("root");
+			const [query, setQuery] = (0, react.useState)("");
+			const [highlightedIndex, setHighlightedIndex] = (0, react.useState)(null);
+			const [selectionFocus, setSelectionFocus] = (0, react.useState)(false);
 			const lastActionRef = (0, react.useRef)("load");
 			const [toast, setToast] = (0, react.useState)(null);
 			const toastSeq = (0, react.useRef)(0);
 			const rootRef = (0, react.useRef)(null);
 			const triggerRef = (0, react.useRef)(null);
+			const searchRef = (0, react.useRef)(null);
 			const menuRef = (0, react.useRef)(null);
+			const groupsRef = (0, react.useRef)(null);
 			const [menuPos, setMenuPos] = (0, react.useState)(null);
 			const itemRefs = (0, react.useRef)([]);
 			const id = (0, react.useId)();
-			const groups = (0, react.useMemo)(() => state.groups.toSorted((left, right) => (left.id === "deepseek-account" ? 0 : left.id === "deepseek-official" ? 1 : 2) - (right.id === "deepseek-account" ? 0 : right.id === "deepseek-official" ? 1 : 2)), [state.groups]);
+			const groups = (0, react.useMemo)(() => orderModelProviders(state.groups), [state.groups]);
 			const choices = (0, react.useMemo)(() => groups.flatMap((group) => group.models.map((model) => ({
 				group,
 				model,
@@ -507,6 +543,21 @@ window.__ModuleLoader__.load({
 					...model.reasoning?.defaultEffort === void 0 ? {} : { reasoningEffort: model.reasoning.defaultEffort }
 				}
 			}))), [groups]);
+			const showSearch = choices.length > 4;
+			const filteredGroups = (0, react.useMemo)(() => groups.map((group) => ({
+				...group,
+				models: (0, _deepseek_ai_dsh_client_ui_primitives.rankByName)(group.models, showSearch ? query.trim() : "")
+			})).filter((group) => group.models.length > 0), [
+				groups,
+				query,
+				showSearch
+			]);
+			const visibleModels = (0, react.useMemo)(() => filteredGroups.flatMap((group) => group.models.map((model) => ({
+				provider: group.id,
+				model: model.id
+			}))), [filteredGroups]);
+			const currentVisibleIndex = visibleModels.findIndex((model) => model.provider === state.current?.provider && model.model === state.current.model);
+			const activeModelIndex = Math.min(highlightedIndex ?? Math.max(0, currentVisibleIndex), visibleModels.length - 1);
 			const currentChoice = choices[state.current === null ? -1 : choices.findIndex((c) => c.selection.provider === state.current?.provider && c.selection.model === state.current.model)];
 			const reasoning = currentChoice?.model.reasoning;
 			const effectiveEffort = state.current?.reasoningEffort ?? reasoning?.defaultEffort;
@@ -538,18 +589,53 @@ window.__ModuleLoader__.load({
 					document.removeEventListener("mousedown", closeOutside);
 				};
 			}, [open]);
+			(0, react.useLayoutEffect)(() => {
+				if (!showSearch) {
+					setQuery("");
+					setHighlightedIndex(null);
+				}
+			}, [showSearch]);
 			const paneFocus = (0, react.useRef)(null);
+			const previousShowSearch = (0, react.useRef)(showSearch);
 			(0, react.useEffect)(() => {
-				const intent = paneFocus.current;
+				const changedSearchMode = previousShowSearch.current !== showSearch;
+				previousShowSearch.current = showSearch;
+				const intent = paneFocus.current ?? (changedSearchMode && pane === "model" ? "drill" : null);
 				paneFocus.current = null;
 				if (!open || intent === null) return;
 				if (intent === "drill") {
+					if (pane === "model" && showSearch) {
+						searchRef.current?.focus();
+						return;
+					}
 					(menuRef.current?.querySelector("[role=\"menuitemradio\"][aria-checked=\"true\"]:not([disabled])") ?? itemRefs.current.find((item) => item !== null && !item.disabled) ?? triggerRef.current)?.focus();
 					return;
 				}
 				const cell = itemRefs.current[intent === "effort" ? 1 : 0];
 				(cell !== null && cell !== void 0 && !cell.disabled ? cell : triggerRef.current)?.focus();
-			}, [open, pane]);
+			}, [
+				open,
+				pane,
+				showSearch
+			]);
+			(0, react.useEffect)(() => {
+				const viewport = groupsRef.current;
+				if (viewport === null) return;
+				return (0, _deepseek_ai_dsh_client_ui_primitives.observeStickyMenuGroups)(viewport);
+			}, [
+				available,
+				open,
+				pane,
+				filteredGroups
+			]);
+			(0, react.useLayoutEffect)(() => {
+				if (open && pane === "model" && activeModelIndex >= 0) itemRefs.current[activeModelIndex]?.scrollIntoView({ block: "nearest" });
+			}, [
+				open,
+				pane,
+				activeModelIndex,
+				visibleModels
+			]);
 			(0, react.useLayoutEffect)(() => {
 				if (!open) {
 					setMenuPos(null);
@@ -581,16 +667,24 @@ window.__ModuleLoader__.load({
 			}, [
 				open,
 				pane,
-				state
+				state,
+				query
 			]);
 			if (!available) return null;
 			const show = () => {
+				setSelectionFocus(false);
 				triggerRef.current?.focus();
+				setQuery("");
+				setHighlightedIndex(null);
 				if (state.current === null) paneFocus.current = "drill";
 				setPane(state.current === null ? "model" : "root");
 				setOpen(true);
 				reload();
 			};
+			const changeQuery = (next) => {
+				setQuery(next);
+				setHighlightedIndex(0);
+			};
 			const close = (restoreFocus = false) => {
 				setOpen(false);
 				setPane("root");
@@ -598,7 +692,13 @@ window.__ModuleLoader__.load({
 					triggerRef.current?.focus();
 				});
 			};
+			const closeAfterSelection = () => {
+				setSelectionFocus(true);
+				close(true);
+			};
 			const drill = (next) => {
+				setQuery("");
+				setHighlightedIndex(null);
 				paneFocus.current = "drill";
 				setPane(next);
 			};
@@ -614,6 +714,7 @@ window.__ModuleLoader__.load({
 				items[active === -1 ? offset > 0 ? 0 : items.length - 1 : (active + offset + items.length) % items.length]?.focus();
 			};
 			const onRootKeyDown = (event) => {
+				if (event.nativeEvent.isComposing) return;
 				if (event.key === "Escape" && open) {
 					event.preventDefault();
 					if (pane !== "root" && state.current !== null) back(pane);
@@ -621,6 +722,21 @@ window.__ModuleLoader__.load({
 					return;
 				}
 				if (!open) return;
+				if (pane === "model" && showSearch && (event.key === "ArrowDown" || event.key === "ArrowUp")) {
+					event.preventDefault();
+					if (!busy && visibleModels.length > 0) {
+						setHighlightedIndex((activeModelIndex + (event.key === "ArrowDown" ? 1 : -1) + visibleModels.length) % visibleModels.length);
+						searchRef.current?.focus();
+					}
+					return;
+				}
+				if (pane === "model" && showSearch && event.target instanceof HTMLInputElement && (event.key === "Enter" || event.key === "Tab" && !event.shiftKey)) {
+					if (event.key === "Tab" && visibleModels.length === 0) return;
+					event.preventDefault();
+					const highlighted = visibleModels[activeModelIndex];
+					if (!busy && highlighted !== void 0) choose(highlighted);
+					return;
+				}
 				if (event.key === "Tab") {
 					if (event.shiftKey) {
 						event.preventDefault();
@@ -637,6 +753,11 @@ window.__ModuleLoader__.load({
 					}
 					if (focused !== triggerRef.current) return;
 					event.preventDefault();
+					if (pane === "model" && showSearch) {
+						setHighlightedIndex(null);
+						searchRef.current?.focus();
+						return;
+					}
 					(menuRef.current?.querySelector("[role=\"menuitemradio\"][aria-checked=\"true\"]:not([disabled])") ?? rows.find((item) => !item.disabled))?.focus();
 					return;
 				}
@@ -652,7 +773,7 @@ window.__ModuleLoader__.load({
 			const settleSelection = (result) => {
 				if (result === void 0) return;
 				if (result.ok) {
-					if (rootRef.current !== null) close(true);
+					if (rootRef.current !== null) closeAfterSelection();
 					return;
 				}
 				const { error } = result;
@@ -664,12 +785,13 @@ window.__ModuleLoader__.load({
 			};
 			const submit = (selection) => {
 				lastActionRef.current = "select";
+				setSelectionFocus(true);
 				triggerRef.current?.focus();
 				select(selection).then(settleSelection);
 			};
 			const choose = (selection) => {
 				if (state.current?.provider === selection.provider && state.current.model === selection.model) {
-					close(true);
+					closeAfterSelection();
 					return;
 				}
 				submit(selection);
@@ -677,7 +799,7 @@ window.__ModuleLoader__.load({
 			const chooseEffort = (effort) => {
 				if (state.current === null) return;
 				if (effectiveEffort === effort) {
-					close(true);
+					closeAfterSelection();
 					return;
 				}
 				submit({
@@ -695,6 +817,7 @@ window.__ModuleLoader__.load({
 			});
 			itemRefs.current = [];
 			let itemIndex = 0;
+			let modelIndex = 0;
 			const itemRef = () => {
 				const at = itemIndex++;
 				return (node) => {
@@ -720,6 +843,10 @@ window.__ModuleLoader__.load({
 						"aria-controls": open ? `${id}-menu` : void 0,
 						title: triggerLabel,
 						"aria-busy": busy,
+						"data-selection-focus": selectionFocus ? "" : void 0,
+						onBlur: () => {
+							setSelectionFocus(false);
+						},
 						disabled: locked,
 						onClick: () => {
 							if (open) close(true);
@@ -746,7 +873,7 @@ window.__ModuleLoader__.load({
 						id: `${id}-menu`,
 						className: ModelSelect_module_css_default.menu,
 						style: menuPos ?? MEASURE_STYLE,
-						role: "menu",
+						role: pane === "model" ? "group" : "menu",
 						"aria-label": t("menu.aria"),
 						"aria-busy": state.status === "loading" || busy,
 						children: [
@@ -790,6 +917,34 @@ window.__ModuleLoader__.load({
 								]
 							})] }),
 							pane === "model" && (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+								showSearch && (0, react_jsx_runtime.jsxs)("div", {
+									className: ModelSelect_module_css_default.searchRow,
+									children: [(0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Input, {
+										ref: searchRef,
+										className: clsx(ModelSelect_module_css_default.search, query !== "" && ModelSelect_module_css_default.searchWithQuery),
+										type: "text",
+										role: "searchbox",
+										"aria-label": t("search.placeholder"),
+										"aria-controls": `${id}-models`,
+										"aria-activedescendant": activeModelIndex < 0 ? void 0 : `${id}-model-${activeModelIndex}`,
+										placeholder: t("search.placeholder"),
+										value: query,
+										readOnly: busy,
+										onChange: (event) => {
+											changeQuery(event.target.value);
+										}
+									}), query !== "" && (0, react_jsx_runtime.jsx)("button", {
+										type: "button",
+										className: ModelSelect_module_css_default.searchClear,
+										"aria-label": t("search.clear"),
+										disabled: busy,
+										onClick: () => {
+											changeQuery("");
+											searchRef.current?.focus();
+										},
+										children: (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCloseFillRegular, {})
+									})]
+								}),
 								state.status === "loading" && (0, react_jsx_runtime.jsx)("div", {
 									className: ModelSelect_module_css_default.status,
 									children: t("status.loading")
@@ -816,25 +971,34 @@ window.__ModuleLoader__.load({
 									})]
 								}, failure.id)),
 								(0, react_jsx_runtime.jsx)("div", {
+									ref: groupsRef,
+									id: `${id}-models`,
 									className: clsx(ModelSelect_module_css_default.groups, "scrollable"),
-									children: groups.map((group) => {
-										const headingId = `${id}-${group.id}`;
-										return (0, react_jsx_runtime.jsxs)("section", {
-											role: "group",
-											"aria-labelledby": headingId,
-											className: ModelSelect_module_css_default.group,
-											children: [(0, react_jsx_runtime.jsx)("div", {
-												className: ModelSelect_module_css_default.groupTitle,
-												id: headingId,
-												children: group.id === "deepseek-account" ? t("provider.account") : group.name
-											}), group.models.map((model) => {
+									role: "menu",
+									"aria-label": t("menu.model"),
+									hidden: filteredGroups.length === 0,
+									children: filteredGroups.map((group) => {
+										return (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.MenuGroup, {
+											label: group.id === "deepseek-account" ? t("provider.account") : group.name,
+											children: group.models.map((model) => {
+												const index = modelIndex++;
 												const selected = state.current?.provider === group.id && state.current.model === model.id;
 												return (0, react_jsx_runtime.jsxs)("button", {
 													ref: itemRef(),
 													type: "button",
 													role: "menuitemradio",
 													"aria-checked": selected,
-													className: clsx(ModelSelect_module_css_default.option, selected && ModelSelect_module_css_default.selected),
+													id: `${id}-model-${index}`,
+													tabIndex: showSearch ? -1 : 0,
+													onFocus: () => {
+														setHighlightedIndex(index);
+													},
+													"data-highlighted": index === activeModelIndex ? "" : void 0,
+													className: clsx(ModelSelect_module_css_default.option, ModelSelect_module_css_default.modelOption, selected && ModelSelect_module_css_default.selected, index === activeModelIndex && ModelSelect_module_css_default.optionActive),
+													onMouseMove: busy || index === activeModelIndex ? void 0 : () => {
+														if (showSearch) setHighlightedIndex(index);
+														else itemRefs.current[index]?.focus();
+													},
 													title: model.name,
 													disabled: busy,
 													onClick: () => {
@@ -854,13 +1018,14 @@ window.__ModuleLoader__.load({
 														children: pending?.provider === group.id && pending.model === model.id ? (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.StateDot, { state: "ongoing" }) : selected ? (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconCheckOutlineRegular, {}) : null
 													})]
 												}, model.id);
-											})]
+											})
 										}, group.id);
 									})
 								}),
-								state.status === "ready" && choices.length === 0 && (0, react_jsx_runtime.jsx)("div", {
+								state.status === "ready" && filteredGroups.length === 0 && (0, react_jsx_runtime.jsx)("div", {
 									className: ModelSelect_module_css_default.empty,
-									children: t("empty.models")
+									role: "status",
+									children: t(choices.length === 0 ? "empty.models" : "search.empty")
 								})
 							] }),
 							pane === "effort" && (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [state.error !== null && lastActionRef.current === "load" && (0, react_jsx_runtime.jsxs)("div", {
@@ -925,8 +1090,6 @@ window.__ModuleLoader__.load({
 			"command.label": "模型",
 			"command.description": "选择本会话使用的模型",
 			"option.loadError": "目录加载失败：{message}",
-			"option.deepseekV4Flash.description": "快速、高效且经济；适合目标明确、常规或并行任务。",
-			"option.deepseekV4Pro.description": "更强的自主编码、知识与复杂推理能力；适合复杂或质量优先的任务，但成本更高。",
 			"trigger.fallback": "请选择模型",
 			"trigger.loading": "正在加载模型…",
 			"trigger.selectAria": "请选择模型",
@@ -941,6 +1104,9 @@ window.__ModuleLoader__.load({
 			"error.sessionInUse": "当前会话已被占用，可能是其他正在运行的 DSH 导致的（如其他 dsh web、桌面端），请退出其他正在运行的 DSH 后重试。",
 			"action.reload": "重新加载",
 			"warning.groupLoad": "{name} 加载失败：{message}",
+			"search.placeholder": "搜索模型…",
+			"search.clear": "清除搜索",
+			"search.empty": "没有匹配的模型。",
 			"empty.models": "没有可用的模型。",
 			"empty.efforts": "当前模型未提供推理等级。"
 		};
@@ -950,8 +1116,6 @@ window.__ModuleLoader__.load({
 			"command.label": "Model",
 			"command.description": "Select the model for this conversation",
 			"option.loadError": "Catalog failed to load: {message}",
-			"option.deepseekV4Flash.description": "Fast, efficient, and economical; suited to focused, routine, or parallel tasks.",
-			"option.deepseekV4Pro.description": "Stronger agentic coding, knowledge, and difficult reasoning; suited to complex or quality-critical tasks at higher cost.",
 			"trigger.fallback": "Select model",
 			"trigger.loading": "Loading models…",
 			"trigger.selectAria": "Select model",
@@ -966,6 +1130,9 @@ window.__ModuleLoader__.load({
 			"error.sessionInUse": "This session is already in use, possibly by another running DSH instance (such as dsh web or the desktop app). Quit other running DSH instances and try again.",
 			"action.reload": "Reload",
 			"warning.groupLoad": "{name} failed to load: {message}",
+			"search.placeholder": "Search models…",
+			"search.clear": "Clear search",
+			"search.empty": "No matching models.",
 			"empty.models": "No models available.",
 			"empty.efforts": "This model provides no reasoning effort levels."
 		};
@@ -975,30 +1142,20 @@ window.__ModuleLoader__.load({
 		function rowId(providerId, modelId) {
 			return `${providerId}/${modelId}`;
 		}
-		const BUILTIN_DESCRIPTION_KEYS = {
-			"deepseek-account/deepseek-v4-flash": "option.deepseekV4Flash.description",
-			"deepseek-account/deepseek-v4-pro": "option.deepseekV4Pro.description",
-			"deepseek-official/deepseek-v4-flash": "option.deepseekV4Flash.description",
-			"deepseek-official/deepseek-v4-pro": "option.deepseekV4Pro.description"
-		};
-		function descriptionOf(providerId, model, t) {
-			const key = BUILTIN_DESCRIPTION_KEYS[rowId(providerId, model.id)];
-			return key !== void 0 && model.description === en[key] ? t(key) : model.description;
-		}
 		/** Flatten the directory into popup rows; failure rows are listed for visibility but never selectable. */
 		function optionsOf(directory, t) {
 			const rows = [];
-			for (const group of directory.groups) {
+			for (const group of orderModelProviders(directory.groups)) {
 				const name = group.id === "deepseek-account" ? t("provider.account") : group.name;
-				for (const model of group.models) {
-					const description = descriptionOf(group.id, model, t);
-					rows.push({
-						id: rowId(group.id, model.id),
-						label: model.name,
-						detail: description !== void 0 ? `${name} · ${description}` : name,
-						...directory.current !== null && directory.current.provider === group.id && directory.current.model === model.id ? { active: true } : {}
-					});
-				}
+				for (const model of group.models) rows.push({
+					id: rowId(group.id, model.id),
+					label: model.name,
+					group: {
+						name: group.id,
+						label: name
+					},
+					...directory.current !== null && directory.current.provider === group.id && directory.current.model === model.id ? { active: true } : {}
+				});
 			}
 			for (const failure of directory.failures) rows.push({
 				id: `failure/${failure.id}`,
@@ -1061,6 +1218,12 @@ window.__ModuleLoader__.load({
 					available: (session) => sessions.subagentAddress(session.sessionId) === void 0,
 					ui: {
 						kind: "popupSelect",
+						searchMode: "fuzzy-label",
+						searchLabels: () => ({
+							placeholder: t("search.placeholder"),
+							empty: t("empty.models"),
+							noResults: t("search.empty")
+						}),
 						options: async (session) => {
 							if (sessions.subagentAddress(session.sessionId) !== void 0) throw new Error("model selection is unavailable for addressed subagent sessions");
 							return optionsOf(await models.directoryFor(session.sessionId).load(), t);

package/lib/types/client/directory.d.ts

@@ -4,6 +4,7 @@
  * Session's durable selection projection, then submit through the same
  * selectModel call. A switch made in either entry updates this shared state.
  */
+import type { TrackProductEvent } from '@deepseek-ai/dsh-client-product-analytics/client';
 import type { ModelCatalogFailure, ModelProviderGroup, ModelSelection } from '@deepseek-ai/dsh-api-session-controller/types';
 import type { SessionId } from '@deepseek-ai/dsh-api-remotes/client';
 import type { RemoteResult, TypertClientRemote } from '@deepseek-ai/dsh-typert-protocol';
@@ -35,6 +36,8 @@ export declare class ModelDirectory {
     private readonly available;
     private readonly catalog;
     private readonly projected;
+    private readonly isBlank;
+    private readonly track?;
     /** The shared snapshot both entries render from (uSES-safe store). */
     readonly store: SnapshotStore<ModelDirectoryState>;
     /** Latest selection operation wins; an older response never overwrites a newer one. */
@@ -48,8 +51,10 @@ export declare class ModelDirectory {
      * @param available - whether this session may use Agent-bound model RPCs.
      * @param catalog - Host-generation catalog shared by every Session.
      * @param projected - durable model selection projected from Session history.
+     * @param isBlank - whether this Session has no first message yet.
+     * @param track - desktop-only callback after a successful user selection.
      */
-    constructor(sessions: Pick<TypertClientRemote['session'], 'selectModel'>, sessionId: SessionId, available: () => boolean, catalog: ModelCatalogDirectory, projected: ObservableSnapshot<unknown>);
+    constructor(sessions: Pick<TypertClientRemote['session'], 'selectModel'>, sessionId: SessionId, available: () => boolean, catalog: ModelCatalogDirectory, projected: ObservableSnapshot<unknown>, isBlank: () => boolean, track?: TrackProductEvent | undefined);
     /**
      * Ensure the Host generation's shared available catalog is loaded.
      * @returns the fresh directory value.

package/lib/types/client/locales.d.ts

@@ -13,8 +13,6 @@ export declare const zh: {
     'command.label': string;
     'command.description': string;
     'option.loadError': string;
-    'option.deepseekV4Flash.description': string;
-    'option.deepseekV4Pro.description': string;
     'trigger.fallback': string;
     'trigger.loading': string;
     'trigger.selectAria': string;
@@ -29,6 +27,9 @@ export declare const zh: {
     'error.sessionInUse': string;
     'action.reload': string;
     'warning.groupLoad': string;
+    'search.placeholder': string;
+    'search.clear': string;
+    'search.empty': string;
     'empty.models': string;
     'empty.efforts': string;
 };
@@ -40,8 +41,6 @@ export declare const en: {
     'command.label': string;
     'command.description': string;
     'option.loadError': string;
-    'option.deepseekV4Flash.description': string;
-    'option.deepseekV4Pro.description': string;
     'trigger.fallback': string;
     'trigger.loading': string;
     'trigger.selectAria': string;
@@ -56,6 +55,9 @@ export declare const en: {
     'error.sessionInUse': string;
     'action.reload': string;
     'warning.groupLoad': string;
+    'search.placeholder': string;
+    'search.clear': string;
+    'search.empty': string;
     'empty.models': string;
     'empty.efforts': string;
 };

package/lib/types/client/provider-order.d.ts

@@ -0,0 +1,10 @@
+/** Shared provider display order for the composer and command model pickers. */
+/**
+ * Put the account and official providers first, preserving every other relative order.
+ * @param groups - Provider groups in catalog order.
+ * @returns a sorted copy; model order within each group is unchanged.
+ */
+export declare function orderModelProviders<T extends {
+    readonly id: string;
+}>(groups: readonly T[]): T[];
+//# sourceMappingURL=provider-order.d.ts.map

package/lib/types/client/service.d.ts

@@ -1,17 +1,3 @@
-/**
- * ModelDirectoryResolver (`ctx.modelDirectories`): the root owner of per-session
- * {@link ModelDirectory} instances. Both selection entries (the /model popup
- * and the composer model seat) resolve their session's directory through
- * this service, which is what makes the dual entry one shared state.
- *
- * Per-session storage follows the client service pattern (InputTriggerService /
- * CommandUiRuntime): a lazy service-internal map whose entry is deleted by the
- * owning scope's disposer. The host `dsh-scope` ScopedLayers registry does
- * does not belong here: it derives scope from the host carrier mechanism
- * (object-keyed), while client scopes tag contexts with branded SessionId
- * strings, and it models global+shadow named registries — this is a
- * per-session singleton with no global layer to merge.
- */
 import { Service } from '@deepseek-ai/cordis';
 import type { Context } from '@deepseek-ai/cordis';
 import type { SessionId } from '@deepseek-ai/dsh-session/types';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@deepseek-ai/dsh-client-ui-model-selection",
   "description": "Model selection over the shared model catalog, Session projection, and session.selectModel",
-  "version": "0.1.7-rc.2",
+  "version": "0.2.0-rc.2",
   "publishConfig": {
     "access": "public"
   },
@@ -46,22 +46,23 @@
     "react-dom": "^18.2.0",
     "@types/react-dom": "~18.3.0",
     "clsx": "^2.1.1",
-    "@deepseek-ai/dsh-api-remotes": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-api-session-controller": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-client-locale": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-client-test-runtime": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-client-ui-commands": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-client-ui-conversation": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-client-ui-input-trigger": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-client-ui-primitives": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-client-ui-slots": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-typert-protocol": "0.1.7-rc.2",
+    "@deepseek-ai/dsh-api-session-controller": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-client-locale": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-api-remotes": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-client-ui-commands": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-client-test-runtime": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-client-ui-input-trigger": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-client-ui-slots": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-typert-protocol": "0.2.0-rc.2",
     "@deepseek-ai/cordis": "~4.0.4",
-    "@deepseek-ai/dsh-client-store": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-session": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-util-values": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-client-ui-renderer": "0.1.7-rc.2",
-    "@deepseek-ai/dsh-client-ui-session": "0.1.7-rc.2"
+    "@deepseek-ai/dsh-client-store": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-client-ui-primitives": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-client-ui-conversation": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-session": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-util-values": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-client-ui-renderer": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-client-ui-session": "0.2.0-rc.2",
+    "@deepseek-ai/dsh-client-product-analytics": "0.2.0-rc.2"
   },
   "files": [
     "lib/index.js",