@deepseek-ai/dsh-client-ui-sidebar-files 0.1.5-alpha.1 → 0.1.5-alpha.2

package/README.i18n.yaml

@@ -2,5 +2,5 @@
 # side as of the last confirmed-consistent state. Both languages carry equal authority;
 # after editing either side, bring the other along and re-record with:
 #   pnpm run verify-translation-pairing --write packages/client/ui-sidebar-files/README.md
-README.md: 6e9e305b15058797156f832a56a29c095b0641f3
-README.zh.md: 95a15444182a988fdf512735be4e0fbfcaad6bdd
+README.md: cadadc03f96f39f9b48813f25179f4506b6de791
+README.zh.md: e25d86b27556bac746c53abf016b37ce1ded81df

package/README.md

@@ -25,14 +25,15 @@ The right Sidebar's navigator tab type: the session's workspace root as a tree,
 ## What it registers
 
 - **The type** — `ctx.sidebarRightTabs.register(...)` with kind `files`, id `@deepseek-ai/dsh-client-ui-sidebar-files`, band `builtin`, no patterns, and one guide entry (order 10, titled from the `sidebarFiles` namespace) that opens the type.
-- **The body** — the keyed `sidebar.right.pane.tab` seat under that id: the tree, with its one control, reload, at the right of its header row.
+- **The body** — the keyed `sidebar.right.pane.tab` seat under that id: a header row under the strip, then the tree. The header row is the document preview's (`ui-sidebar-documentpreview`): the root path, its directories greyed and its last segment in full ink, never ellipsized (a path wider than the row keeps its end and fades its start), with the one control, reload, at its right. The row is copied rather than shared because a plugin bundle shares runtime code only through the platform modules; once the artifact and slot surfaces settle, one copy in `ui-primitives` could serve every pane header.
+- **The chip title** — the keyed `sidebar.right.pane.tab.title` seat under that id: a shared `FileTypeIcon` folder glyph at 16px before the type's label. The tree's own rows never draw this sheet.
 
-Six source files under `src/client/`: `definition.ts` (the type), `store.ts` (what it keeps), `face.ts` (how it lists, Remote binding included), `FilesBody.tsx` (what it draws, with its ordering and failure-line helpers), `locales.ts` (what it says), and `index.ts` (the wiring).
+Seven source files under `src/client/`: `definition.ts` (the type), `store.ts` (what it keeps), `face.ts` (how it lists, Remote binding included), `FilesBody.tsx` (what it draws, with its ordering and failure-line helpers), `FilesTitle.tsx` (the chip title), `locales.ts` (what it says), and `index.ts` (the wiring).
 
 <a id="the-tree"></a>
 ## The tree
 
-The root is the session's working directory, read from `useSessions().byId[sessionId].cwd`, and labelled by `workspaceTitleOf` from `@deepseek-ai/dsh-util-workspace-path`. Every level is keyed by absolute path; a child's path is its parent's joined with the entry name by `/`. A level is listed when it is first expanded, through `remote.workspaceFiles.list(sessionId, absolutePath)` on the `@deepseek-ai/dsh-api-workspace-files` namespace; the adapter keeps the listing's entries and truncation flag and drops its workspace-relative path. Rows are ordered directories first, then by natural, case-insensitive name; dotfiles are shown like any other entry.
+The root is the session's working directory, read from `useSessions().byId[sessionId].cwd`, and split for the header row by `pathPartsOf` from `@deepseek-ai/dsh-util-workspace-path`. Every level is keyed by absolute path; a child's path is its parent's joined with the entry name by `/`. A level is listed when it is first expanded, through `remote.workspaceFiles.list(sessionId, absolutePath)` on the `@deepseek-ai/dsh-api-workspace-files` namespace; the adapter keeps the listing's entries and truncation flag and drops its workspace-relative path. Rows are ordered directories first, then by natural, case-insensitive name; dotfiles are shown like any other entry.
 
 | Entry type | Row |
 |---|---|

package/README.zh.md

@@ -25,14 +25,15 @@ kind: "package-reference"
 ## 注册了什么
 
 - **类型**：`ctx.sidebarRightTabs.register(...)`，kind 为 `files`，id 为 `@deepseek-ai/dsh-client-ui-sidebar-files`，档位 `builtin`，没有 patterns，另有一个打开该类型的引导页入口（order 10，标题取自 `sidebarFiles` 命名空间）。
-- **正文**：以该 id 为键的 `sidebar.right.pane.tab` 坑位：树本身，以及它唯一的控件、位于标题行右端的重新读取。
+- **正文**：以该 id 为键的 `sidebar.right.pane.tab` 坑位：strip 下的一行标题行，然后是树。标题行与文档预览（`ui-sidebar-documentpreview`）的相同：根路径，目录部分灰色、最后一段正色，从不省略号截断（比行宽的路径保留末尾、淡出开头），右端是它唯一的控件、重新读取。这一行是复制而非共享，因为插件 bundle 只经平台模块共享运行时代码；待 artifact 与各 slot 的形态定下来后，可以在 `ui-primitives` 放一份供每个 pane 标题行使用。
+- **标签页标题**：以该 id 为键的 `sidebar.right.pane.tab.title` 坑位：类型标签前的一枚 16px 共享 `FileTypeIcon` 文件夹图标。树本身的行不画这枚图标。
 
-`src/client/` 下六个源文件：`definition.ts`（类型是什么）、`store.ts`（它保存什么）、`face.ts`（它如何列目录，含 Remote 绑定）、`FilesBody.tsx`（它画什么，含排序与失败行两个辅助函数）、`locales.ts`（它说什么）、`index.ts`（接线）。
+`src/client/` 下七个源文件：`definition.ts`（类型是什么）、`store.ts`（它保存什么）、`face.ts`（它如何列目录，含 Remote 绑定）、`FilesBody.tsx`（它画什么，含排序与失败行两个辅助函数）、`FilesTitle.tsx`（标签页标题）、`locales.ts`（它说什么）、`index.ts`（接线）。
 
 <a id="the-tree"></a>
 ## 树
 
-根是会话的工作目录，读自 `useSessions().byId[sessionId].cwd`，标签由 `@deepseek-ai/dsh-util-workspace-path` 的 `workspaceTitleOf` 给出。每一层以绝对路径为键；子路径是父路径以 `/` 拼上条目名。一层在首次展开时经 `@deepseek-ai/dsh-api-workspace-files` 命名空间的 `remote.workspaceFiles.list(sessionId, absolutePath)` 列出；适配层保留列表的条目与截断标志，丢弃其工作区相对路径。行序为目录优先，其后按自然序、不分大小写的名称排列；dotfiles 与其他条目一样显示。
+根是会话的工作目录，读自 `useSessions().byId[sessionId].cwd`，标题行里的拆分由 `@deepseek-ai/dsh-util-workspace-path` 的 `pathPartsOf` 给出。每一层以绝对路径为键；子路径是父路径以 `/` 拼上条目名。一层在首次展开时经 `@deepseek-ai/dsh-api-workspace-files` 命名空间的 `remote.workspaceFiles.list(sessionId, absolutePath)` 列出；适配层保留列表的条目与截断标志，丢弃其工作区相对路径。行序为目录优先，其后按自然序、不分大小写的名称排列；dotfiles 与其他条目一样显示。
 
 | 条目类型 | 行 |
 |---|---|

package/lib/client.js

@@ -27,7 +27,6 @@ window.__ModuleLoader__.load({
 				guide: [{
 					order: 10,
 					title: () => t("guide.title"),
-					description: () => t("guide.description"),
 					icon: _deepseek_ai_dsh_client_ui_primitives.IconFolderClose16
 				}]
 			};
@@ -135,26 +134,14 @@ window.__ModuleLoader__.load({
 			return path.split("/").map(encodeSegment).join("/");
 		}
 		/**
-		* Build the address of a file inside one Session's workspace.
-		* @param sessionId - the Session whose workspace root the path is relative to.
-		* @param path - workspace-relative path; backslashes are normalized to `/`, and a leading `./` or `/` is dropped.
+		* Build the address of a file read through one Session.
+		* @param sessionId - the Session whose Host workspace resolves the path.
+		* @param path - absolute or workspace-relative path; backslashes are normalized to `/`, and leading `./` prefixes are dropped.
 		* @returns the `dsh-resource://file/session/<sessionId>/<path>` address.
 		*/
 		function sessionFileAddress(sessionId, path) {
-			const relative = path.replace(/\\/g, "/").replace(/^(?:\.\/)+/, "").replace(/^\/+/, "");
-			return `${FILE_ADDRESS_PREFIX}session/${encodeSegment(sessionId)}/${encodePath(relative)}`;
-		}
-		/**
-		* Build the address of a file by its absolute path.
-		* @param path - absolute path; backslashes are normalized to `/` and the leading `/` is dropped,
-		*   except that a UNC path (`\\server\share`) keeps one empty first segment.
-		* @returns the `dsh-resource://file/absolute/<path>` address.
-		*/
-		function absoluteFileAddress(path) {
-			const normalized = path.replace(/\\/g, "/");
-			const unc = normalized.startsWith("//");
-			const absolute = normalized.replace(/^\/+/, "");
-			return `${FILE_ADDRESS_PREFIX}absolute/${unc ? "/" : ""}${encodePath(absolute)}`;
+			const normalized = path.replace(/\\/g, "/").replace(/^(?:\.\/)+/, "");
+			return `${FILE_ADDRESS_PREFIX}session/${encodeSegment(sessionId)}/${encodePath(normalized)}`;
 		}
 		//#endregion
 		//#region ../../util/workspace-path/src/index.ts
@@ -175,21 +162,31 @@ window.__ModuleLoader__.load({
 			return path.startsWith("/") || isWindowsStylePath(path);
 		}
 		/**
-		* Read the final non-empty segment of a Workspace path for display.
-		* Workspace-label surfaces use this helper instead of deriving another basename.
-		* @param path - Workspace directory path using POSIX or Windows separators.
-		* @returns the final segment, or an empty string for a separator-only path.
+		* Split a path for display: the directories through their last separator, and
+		* the final segment after it. Both `/` and `\` separate, so a Windows path
+		* splits where its own segments end; trailing separators are dropped first, so
+		* a directory path names its own last segment. A path with no separator, or a
+		* separator-only path, is all name.
+		* @param path - file or directory path using POSIX or Windows separators.
+		* @returns the directory prefix (possibly empty) and the final segment.
 		*/
-		function workspaceTitleOf(path) {
+		function pathPartsOf(path) {
 			const trimmed = path.replace(/[/\\]+$/, "");
-			const separator = Math.max(trimmed.lastIndexOf("/"), trimmed.lastIndexOf("\\"));
-			return trimmed.slice(separator + 1);
+			if (trimmed === "") return {
+				directory: "",
+				name: path
+			};
+			const cut = Math.max(trimmed.lastIndexOf("/"), trimmed.lastIndexOf("\\")) + 1;
+			return {
+				directory: trimmed.slice(0, cut),
+				name: trimmed.slice(cut)
+			};
 		}
 		/**
 		* The address for a path as a caller holds it: a relative path, or an absolute
 		* path inside the Session's workspace, becomes a `session`-scoped address; an
-		* absolute path outside it, or one whose workspace root is unknown, becomes an
-		* `absolute`-scoped address.
+		* absolute path outside it, or one whose workspace root is unknown, keeps its
+		* absolute path in that Session's address.
 		* @param sessionId - the Session the path is read in.
 		* @param cwd - that Session's workspace root, when known.
 		* @param path - absolute or workspace-relative path, in either separator spelling.
@@ -201,11 +198,11 @@ window.__ModuleLoader__.load({
 			const root = cwd === void 0 ? "" : cwd.replace(/\\/g, "/").replace(/\/+$/, "");
 			if (root !== "" && normalized === root) return sessionFileAddress(sessionId, "");
 			if (root !== "" && normalized.startsWith(`${root}/`)) return sessionFileAddress(sessionId, normalized.slice(root.length + 1));
-			return absoluteFileAddress(normalized);
+			return sessionFileAddress(sessionId, normalized);
 		}
 		//#endregion
 		//#region \0dsh-css:/home/runner/work/deepseek-harness/deepseek-harness/packages/client/ui-sidebar-files/src/client/FilesBody.module.css.mjs
-		const css = ".k-1LKG_root{min-height:0;color:var(--dsw-alias-label-primary);font-size:var(--dsh-content-font-size-secondary,13px);flex-direction:column;flex:auto;padding:4px 0 8px;line-height:1.5;display:flex;overflow:auto}.k-1LKG_header{color:var(--dsw-alias-label-secondary);flex:none;align-items:center;gap:6px;padding:4px 10px;font-weight:500;display:flex}.k-1LKG_level{margin:0;padding:0;list-style:none}.k-1LKG_level .k-1LKG_level{padding-left:14px}.k-1LKG_item{margin:0;padding:0}.k-1LKG_row{width:100%;min-width:0;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:6px;align-items:center;gap:6px;padding:3px 10px;display:flex}.k-1LKG_row:hover{background:var(--dsw-alias-interactive-bg-hover)}.k-1LKG_icon{color:var(--dsw-alias-label-secondary);flex:none}.k-1LKG_fileIcon{flex:none;width:14px;height:16px}.k-1LKG_name{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.k-1LKG_other{color:var(--dsw-alias-label-tertiary);cursor:default}.k-1LKG_other:hover{background:0 0}.k-1LKG_note{color:var(--dsw-alias-label-tertiary);margin:0;padding:3px 10px;font-size:12px}.k-1LKG_status{flex-direction:column;padding:12px 10px;display:flex}.k-1LKG_statusLine{color:var(--dsw-alias-label-secondary);font-size:var(--dsh-content-font-size-secondary,13px);margin:0;line-height:1.6}.k-1LKG_tool{width:24px;height:24px;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:0;border-radius:6px;flex:none;justify-content:center;align-items:center;margin-left:auto;padding:0;display:inline-flex}.k-1LKG_tool:hover{background:var(--dsw-alias-interactive-bg-hover)}";
+		const css = ".k-1LKG_root{height:100%;min-height:0;color:var(--dsw-alias-label-primary);font-size:var(--dsh-content-font-size-secondary,13px);flex-direction:column;flex:auto;line-height:1.5;display:flex}.k-1LKG_header{box-sizing:border-box;border-bottom:.5px solid var(--dsw-alias-border-l3);flex:none;align-items:center;gap:4px;height:38px;padding:0 6px 0 16px;display:flex}.k-1LKG_path{white-space:nowrap;flex:auto;justify-content:flex-end;min-width:0;margin-right:12px;font-size:12px;display:flex;overflow:hidden}.k-1LKG_path[data-files-path-clipped]{mask-image:linear-gradient(90deg,#0000,#000 28px)}.k-1LKG_pathText{flex:none;margin-right:auto}.k-1LKG_pathDirectory{color:var(--dsw-alias-label-tertiary)}.k-1LKG_pathName{color:var(--dsw-alias-label-primary)}.k-1LKG_body{scrollbar-gutter:stable;flex:auto;min-height:0;margin-right:2px;padding:8px 0 8px 8px;overflow:auto}.k-1LKG_body::-webkit-scrollbar-track{margin:2px}.k-1LKG_level{margin:0;padding:0;list-style:none}.k-1LKG_level .k-1LKG_level{padding-left:18px}.k-1LKG_item{margin:0;padding:0}.k-1LKG_row{width:100%;min-width:0;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:10px;align-items:center;gap:6px;padding:5px 10px;display:flex}.k-1LKG_row:hover{background:var(--dsw-alias-interactive-bg-hover)}.k-1LKG_icon{color:var(--dsw-alias-label-tertiary);flex:none}.k-1LKG_fileIcon{flex:none}.k-1LKG_name{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.k-1LKG_other{color:var(--dsw-alias-label-tertiary);cursor:default}.k-1LKG_other:hover{background:0 0}.k-1LKG_note{color:var(--dsw-alias-label-tertiary);margin:0;padding:3px 10px;font-size:12px}.k-1LKG_status{flex-direction:column;padding:12px 10px;display:flex}.k-1LKG_statusLine{color:var(--dsw-alias-label-secondary);font-size:var(--dsh-content-font-size-secondary,13px);margin:0;line-height:1.6}.k-1LKG_tool{width:28px;height:28px;color:var(--dsw-alias-label-secondary);cursor:pointer;background:0 0;border:none;border-radius:28px;flex:none;justify-content:center;align-items:center;padding:6px;line-height:1;display:inline-flex}.k-1LKG_tool svg{width:15px;height:15px}.k-1LKG_tool:hover{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-interactive-bg-hover)}.k-1LKG_titleIcon{flex:none}";
 		const tagId = "@deepseek-ai/dsh-client-ui-sidebar-files/FilesBody.module.css";
 		if (typeof document !== "undefined" && document.querySelector("style[data-plugin-css=" + JSON.stringify(tagId) + "]") === null) {
 			const tag = document.createElement("style");
@@ -215,6 +212,7 @@ window.__ModuleLoader__.load({
 			document.head.appendChild(tag);
 		}
 		var FilesBody_module_css_default = {
+			"body": "k-1LKG_body",
 			"fileIcon": "k-1LKG_fileIcon",
 			"header": "k-1LKG_header",
 			"icon": "k-1LKG_icon",
@@ -223,10 +221,15 @@ window.__ModuleLoader__.load({
 			"name": "k-1LKG_name",
 			"note": "k-1LKG_note",
 			"other": "k-1LKG_other",
+			"path": "k-1LKG_path",
+			"pathDirectory": "k-1LKG_pathDirectory",
+			"pathName": "k-1LKG_pathName",
+			"pathText": "k-1LKG_pathText",
 			"root": "k-1LKG_root",
 			"row": "k-1LKG_row",
 			"status": "k-1LKG_status",
 			"statusLine": "k-1LKG_statusLine",
+			"titleIcon": "k-1LKG_titleIcon",
 			"tool": "k-1LKG_tool"
 		};
 		//#endregion
@@ -238,9 +241,10 @@ window.__ModuleLoader__.load({
 		* for goes through its injected face. The component itself only decides what to
 		* draw for each absolute path and what a click means: a directory toggles, a
 		* file opens through the owner's `tabActions` for a `file:` viewer to claim, and
-		* anything else is shown but refuses to open. The header row carries the one
-		* control: reload, which drops every listed level and asks again for the
-		* expanded ones.
+		* anything else is shown but refuses to open. The header row is the text
+		* preview's: the root's path, directories greyed and the last segment in full
+		* ink, then the one control at its end, reload, which drops every listed level
+		* and asks again for the expanded ones.
 		*/
 		/** Natural, case-insensitive name order, so `file2` precedes `file10`. */
 		const byName = new Intl.Collator(void 0, {
@@ -274,6 +278,35 @@ window.__ModuleLoader__.load({
 				default: return t("error.unavailable", { message: failure.message });
 			}
 		}
+		/**
+		* Keep the path row's `data-files-path-clipped` current: set while the path's
+		* text is wider than its box, so the stylesheet fades the clipped start. Read
+		* after each commit that can change the path or mount the header, and whenever
+		* either box resizes; written to the DOM directly because it changes only how
+		* the stylesheet fades what is already rendered.
+		*/
+		function usePathClipped(box, text, path) {
+			(0, react.useLayoutEffect)(() => {
+				const outer = box.current;
+				const inner = text.current;
+				if (outer === null || inner === null) return void 0;
+				const apply = () => {
+					if (inner.offsetWidth > outer.clientWidth) outer.dataset.filesPathClipped = "";
+					else delete outer.dataset.filesPathClipped;
+				};
+				apply();
+				const observer = typeof ResizeObserver === "undefined" ? void 0 : new ResizeObserver(apply);
+				observer?.observe(outer);
+				observer?.observe(inner);
+				return () => {
+					observer?.disconnect();
+				};
+			}, [
+				box,
+				text,
+				path
+			]);
+		}
 		/** One entry's row, and its children when it is an expanded directory. */
 		function Entry({ parent, entry, tree }) {
 			const path = childPath(parent, entry.name);
@@ -313,7 +346,11 @@ window.__ModuleLoader__.load({
 					onClick: () => {
 						tree.onOpen(path);
 					},
-					children: [(0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.DocumentFileIcon, { className: FilesBody_module_css_default.fileIcon }), (0, react_jsx_runtime.jsx)("span", {
+					children: [(0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.FileTypeIcon, {
+						kind: (0, _deepseek_ai_dsh_client_ui_primitives.classifyFileType)(entry.name),
+						size: 16,
+						className: FilesBody_module_css_default.fileIcon
+					}), (0, react_jsx_runtime.jsx)("span", {
 						className: FilesBody_module_css_default.name,
 						children: entry.name
 					})]
@@ -374,6 +411,9 @@ window.__ModuleLoader__.load({
 			const { signal, actions: tabActions } = tab;
 			const cwd = useSessions((sessions) => sessions.byId[sessionId]?.cwd);
 			const state = useStore((store) => store.byTab[tab.id]);
+			const pathRef = (0, react.useRef)(null);
+			const pathTextRef = (0, react.useRef)(null);
+			usePathClipped(pathRef, pathTextRef, state?.root);
 			(0, react.useEffect)(() => {
 				if (state !== void 0 || cwd === void 0 || signal.aborted) return;
 				start(tab.id, cwd, signal);
@@ -407,45 +447,71 @@ window.__ModuleLoader__.load({
 				actions.reset(tab.id);
 				for (const path of state.expanded) load(tab.id, path, signal);
 			};
-			const title = workspaceTitleOf(state.root) || state.root;
+			const { directory, name } = pathPartsOf(state.root);
 			return (0, react_jsx_runtime.jsxs)("div", {
 				className: FilesBody_module_css_default.root,
 				"data-files-state": "tree",
 				"data-files-root": state.root,
 				children: [(0, react_jsx_runtime.jsxs)("div", {
 					className: FilesBody_module_css_default.header,
-					children: [
-						(0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconFolderOpen16, { className: FilesBody_module_css_default.icon }),
-						(0, react_jsx_runtime.jsx)("span", {
-							className: FilesBody_module_css_default.name,
-							children: title
-						}),
-						(0, react_jsx_runtime.jsx)("button", {
-							type: "button",
-							className: FilesBody_module_css_default.tool,
-							"aria-label": t("reload"),
-							title: t("reload"),
-							"data-files-reload": true,
-							onClick: reload,
-							children: (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconRefreshOutline16, {})
+					children: [(0, react_jsx_runtime.jsx)("div", {
+						ref: pathRef,
+						className: FilesBody_module_css_default.path,
+						title: state.root,
+						"data-files-path": true,
+						children: (0, react_jsx_runtime.jsxs)("span", {
+							ref: pathTextRef,
+							className: FilesBody_module_css_default.pathText,
+							children: [directory !== "" && (0, react_jsx_runtime.jsx)("span", {
+								className: FilesBody_module_css_default.pathDirectory,
+								children: directory
+							}), (0, react_jsx_runtime.jsx)("span", {
+								className: FilesBody_module_css_default.pathName,
+								children: name
+							})]
+						})
+					}), (0, react_jsx_runtime.jsx)("button", {
+						type: "button",
+						className: FilesBody_module_css_default.tool,
+						"aria-label": t("reload"),
+						title: t("reload"),
+						"data-files-reload": true,
+						onClick: reload,
+						children: (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconRefreshOutline16, {})
+					})]
+				}), (0, react_jsx_runtime.jsx)("div", {
+					className: FilesBody_module_css_default.body,
+					children: (0, react_jsx_runtime.jsx)("ul", {
+						className: FilesBody_module_css_default.level,
+						children: (0, react_jsx_runtime.jsx)(Level, {
+							path: state.root,
+							tree
 						})
-					]
-				}), (0, react_jsx_runtime.jsx)("ul", {
-					className: FilesBody_module_css_default.level,
-					children: (0, react_jsx_runtime.jsx)(Level, {
-						path: state.root,
-						tree
 					})
 				})]
 			});
 		}
 		//#endregion
+		//#region lib/types/client/FilesTitle.js
+		/**
+		* The title as the chip and a floating panel's header show it.
+		* @param props - the tab information hook.
+		* @returns the folder sheet followed by the tab's title text.
+		*/
+		function FilesTitle({ useTabInfo }) {
+			const { tab } = useTabInfo();
+			return (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [(0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.FileTypeIcon, {
+				kind: "folder",
+				size: 16,
+				className: FilesBody_module_css_default.titleIcon
+			}), tab.title] });
+		}
+		//#endregion
 		//#region lib/types/client/locales.js
 		/** Simplified Chinese dictionary and key-set source of truth. */
 		const zh = {
 			"type.label": "文件",
-			"guide.title": "文件",
-			"guide.description": "浏览这个会话工作区里的文件，点开就能查看。",
+			"guide.title": "工作区文件",
 			loading: "正在读取…",
 			empty: "空目录",
 			truncated: "条目太多，只显示了一部分。",
@@ -460,11 +526,10 @@ window.__ModuleLoader__.load({
 		/** English dictionary, checked against the Chinese key set. */
 		const en = {
 			"type.label": "Files",
-			"guide.title": "Files",
-			"guide.description": "Browse the files in this session's workspace and open any of them.",
+			"guide.title": "Workspace files",
 			loading: "Reading…",
 			empty: "Empty directory",
-			truncated: "Too many entries; showing only some of them.",
+			truncated: "Too many entries, showing only some of them.",
 			noWorkspace: "This session has no workspace directory.",
 			reload: "Reload",
 			"entry.other": "Not a file or a directory, so it cannot be opened.",
@@ -610,7 +675,7 @@ window.__ModuleLoader__.load({
 			"remote.workspaceFiles"
 		];
 		/**
-		* Client plugin body: register the type, its dictionaries, then its body.
+		* Client plugin body: register the type, its dictionaries, its body, and its chip title.
 		* @param ctx - client root context carrying the registry, the slots, and the Remote face.
 		*/
 		function apply(ctx) {
@@ -629,6 +694,10 @@ window.__ModuleLoader__.load({
 				store,
 				inject
 			}, FilesBody)), "ui-sidebar-files: files tab body");
+			ctx.effect(() => ctx.slots.inject("sidebar.right.pane.tab.title", () => ctx.slots.register({
+				name: "sidebar.right.pane.tab.title",
+				key: FILES_ID
+			}, FilesTitle)), "ui-sidebar-files: files tab title");
 		}
 		//#endregion
 		exports.apply = apply;

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

@@ -0,0 +1,15 @@
+/**
+ * The files type's chip title: the folder sheet before the type's label.
+ * Registered under `sidebar.right.pane.tab.title`; without it the chip would
+ * show the bare label. The tree in the body draws its own row glyphs and never
+ * this one.
+ */
+import type { ReactNode } from 'react';
+import type { PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots';
+/**
+ * The title as the chip and a floating panel's header show it.
+ * @param props - the tab information hook.
+ * @returns the folder sheet followed by the tab's title text.
+ */
+export declare function FilesTitle({ useTabInfo }: PropsRuntime<'sidebar.right.pane.tab.title'>): ReactNode;
+//# sourceMappingURL=FilesTitle.d.ts.map

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

@@ -2,12 +2,13 @@
  * Browser half: register `files` as a right-Sidebar tab type.
  *
  * The public two-stage path, unmodified: the type into `ctx.sidebarRightTabs`,
- * the body into the keyed `sidebar.right.pane.tab` seat under the type's `id`.
+ * the body into the keyed `sidebar.right.pane.tab` seat and the chip title into
+ * the keyed `sidebar.right.pane.tab.title` seat, both under the type's `id`.
  *
  * The file split is this package's layering: what the type IS
  * (`definition.ts`), what it keeps (`store.ts`), how it lists (`face.ts`), what
- * it draws (`FilesBody.tsx`), what it says (`locales.ts`), and this module,
- * which only wires them together.
+ * it draws (`FilesBody.tsx`, `FilesTitle.tsx`), what it says (`locales.ts`),
+ * and this module, which only wires them together.
  */
 import type { Context as ClientContext } from '@deepseek-ai/cordis';
 export type { SidebarFilesKey } from './locales.ts';
@@ -20,7 +21,7 @@ export type { FilesBodyProps } from './FilesBody.tsx';
  */
 export declare const inject: string[];
 /**
- * Client plugin body: register the type, its dictionaries, then its body.
+ * Client plugin body: register the type, its dictionaries, its body, and its chip title.
  * @param ctx - client root context carrying the registry, the slots, and the Remote face.
  */
 export declare function apply(ctx: ClientContext): void;

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

@@ -8,7 +8,6 @@ declare module '@deepseek-ai/dsh-client-ui-slots' {
 export declare const zh: {
     'type.label': string;
     'guide.title': string;
-    'guide.description': string;
     loading: string;
     empty: string;
     truncated: string;
@@ -26,7 +25,6 @@ export type SidebarFilesKey = keyof typeof zh;
 export declare const en: {
     'type.label': string;
     'guide.title': string;
-    'guide.description': string;
     loading: string;
     empty: string;
     truncated: string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@deepseek-ai/dsh-client-ui-sidebar-files",
   "description": "Workspace file tree tab type for the right Sidebar: lazy directory listing over the workspaceFiles Remote namespace, opening files into the Sidebar",
-  "version": "0.1.5-alpha.1",
+  "version": "0.1.5-alpha.2",
   "publishConfig": {
     "access": "public"
   },
@@ -37,11 +37,6 @@
     }
   },
   "license": "MIT",
-  "dependencies": {
-    "clsx": "^2.0.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
-  },
   "peerDependencies": {
     "@deepseek-ai/cordis": "^4.0.2"
   },
@@ -49,20 +44,23 @@
     "@testing-library/react": "^16.1.0",
     "@types/react": "~18.3.1",
     "@types/react-dom": "~18.3.0",
+    "react": "^18.2.0",
+    "clsx": "^2.0.0",
+    "react-dom": "^18.2.0",
+    "@deepseek-ai/dsh-api-remotes": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-api-workspace-files": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-client-locale": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-client-store": "^0.1.5-alpha.2",
     "@deepseek-ai/cordis": "^4.0.2",
-    "@deepseek-ai/dsh-api-workspace-files": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-api-remotes": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-client-locale": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-client-store": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-client-test-runtime": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-client-ui-dockkit": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-client-ui-primitives": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-client-ui-renderer": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-client-ui-session": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-client-ui-sidebar-right": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-client-ui-slots": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-session": "^0.1.5-alpha.1",
-    "@deepseek-ai/dsh-util-workspace-path": "^0.1.5-alpha.1"
+    "@deepseek-ai/dsh-client-test-runtime": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-client-ui-dockkit": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-client-ui-renderer": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-client-ui-session": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-client-ui-sidebar-right": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-client-ui-slots": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-util-workspace-path": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-client-ui-primitives": "^0.1.5-alpha.2",
+    "@deepseek-ai/dsh-session": "^0.1.5-alpha.2"
   },
   "files": [
     "lib/index.js",