dsh-obsidian-notes 0.6.0 → 0.6.2

package/README.md

@@ -14,32 +14,33 @@ English | [中文](https://github.com/revive123456/dsh-obsidian-notes/blob/main/
 
 ---
 
-## Why this one
-
-There is already an Obsidian-ish plugin in the DSH ecosystem
-([DedsecLemon/dsh-obsidian](https://github.com/DedsecLemon/dsh-obsidian)), and it
-is a good fit if you want an outline pane and backlinks. This plugin bet on a
-different set of things — the three that matter if you write next to a chat:
-
-1. **Rendering fidelity is the feature.** The preview is line-numbered and keeps
-   the Obsidian details other viewers flatten: all 13 callout types plus 15
-   aliases, table alignment, fenced code with info strings, task lists, setext
-   headings, and frontmatter that round-trips byte-for-byte on save.
-2. **Pasted screenshots stay attached.** Paste an image while editing and the
-   host writes an Obsidian-native `![[Pasted image …]]` embed. Move the
-   attachment folder later and every embed in the vault is rewritten to match.
-3. **The note can talk to the chat.** Cite a whole note as an `@path` mention, or
-   select a passage and ask about it — the prompt carries the absolute path, the
-   line range and the quoted text.
-
-> **What it does not do:** no backlinks, no outline pane, no graph view, and no
-> math/mermaid/transclusion rendering. If those are your priority, use a real
-> Obsidian vault (or the plugin above) instead. The [comparison](#comparison) is
-> spelled out below.
+## What it does
+
+A local-first Markdown notes panel that sits in the DSH sidebar and hands notes
+to the chat without copy-paste:
+
+1. **Your notes stay beside the conversation.** Point it at a folder of Markdown
+   files and you get the vault tree, an Obsidian-flavoured preview, edit/save,
+   and search across titles and bodies — no import, no sync, no cloud.
+2. **The handoff is the feature.** Cite a whole note as an `@path` mention, or
+   select a passage and press **Ask** — the prompt in the composer carries the
+   absolute path, the line range and the quoted text, so the model can refer to
+   exactly what you read.
+3. **Screenshots become part of the vault.** Paste an image while editing and it
+   is saved into the attachment folder as an Obsidian-native
+   `![[Pasted image …]]` embed; moving that folder later rewrites the embeds.
+4. **Two ways to see the shape of a vault.** Turn a note into a **mind map**
+   built from its headings and list items, or open the **relation graph**
+   computed from `[[links]]` and `#tags` — vault-wide, locally around the open
+   note with 1–5 hops, or focused: the whole graph with the camera framed on the
+   open note and its neighbours.
+
+Everything runs on your machine: the plugin reads and writes only the folder you
+choose, and the client talks to the host over its own loopback routes.
 
 ## Screenshots
 
-| Notes tree + docked preview | Callouts, line numbers, badges |
+| Notes tree + docked preview | Callouts, task lists, badges |
 | --- | --- |
 | ![Sidebar notes tree with the preview dock open](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-sidebar.png) | ![Coloured Obsidian callouts with one source line per rendered line](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-callouts.png) |
 
@@ -47,7 +48,7 @@ different set of things — the three that matter if you write next to a chat:
 | --- | --- |
 | ![Table with column alignment and a TypeScript code fence](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-markdown.png) | ![Editor with line numbers and Save button](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-editing.png) |
 
-| Mind map from headings + lists | Vault-wide graph view (notes, links, tags) |
+| Mind map from headings + lists | Vault-wide graph — Vault / Local / Focus |
 | --- | --- |
 | ![Mind map view built from the note headings and list items](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-mindmap.png) | ![Relation graph of the whole vault: notes as circles, tags as squares, links as lines](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-graph.png) |
 
@@ -79,7 +80,7 @@ host-side route.
 2. Search for **`dsh-obsidian-notes`** and install it.
 3. Restart DeepSeek Harness.
 
-> This path requires the package to be published on npm (current release **0.6.0**).
+> This path requires the package to be published on npm.
 > If search shows nothing, use one of the two paths below.
 
 ### 2. CLI (after the npm release)
@@ -125,17 +126,31 @@ configured, choose one:
 The default vault is `$DSH_WORKSPACE/obsidian_vault`, falling back to
 `./obsidian_vault` under the directory you started `dsh web` from.
 
+### Typical workflow
+
+1. Open **📚 Notes** and pick a vault (above).
+2. Click a note to read the preview; **Edit** to change it, then **Save** or
+   <kbd>Ctrl/Cmd+S</kbd>.
+3. To bring a note into the chat, press **⤴ Cite to chat** for the whole note, or
+   select text and press **Ask** to attach a question to that passage.
+4. Paste a screenshot while editing to store it in the vault.
+5. Switch the dock to **🧠 Mind map** to explore the note's structure, or open
+   **🕸 Graph view** above the tree to see the vault as a graph (**Local** = around
+   the open note, **Depth 1–5**; **Focus** = whole graph, camera on the open note).
+
 ## Features
 
 - **Vault sidebar** — lazy directory tree; open a note with one click, create,
   rename or delete notes and folders, and search titles **and** file contents.
   Shows a live note count.
-- **Line-numbered Obsidian preview** — every source line keeps its line number.
-  Real tables with alignment, fenced code with language labels, nested lists and
-  task lists, all heading levels, setext headings, horizontal rules, and
-  clickable `[[wikilinks]]` (aliases and `#sections` included). Inline Obsidian
-  styles render too: `==highlight==`, `~~strikethrough~~`, backslash escapes,
-  hidden `%%comments%%`, and `<https://…>` / bare URLs as links.
+- **Obsidian-style preview** — every source line renders as its own row, so
+  tables, fenced code, nested lists and callouts line up the way they do in
+  Obsidian. Line numbers stay out of the reading view and show only while you
+  edit. Real tables with alignment, fenced code with language labels, nested
+  lists and task lists, all heading levels, setext headings, horizontal rules,
+  and clickable `[[wikilinks]]` (aliases and `#sections` included). Inline
+  Obsidian styles render too: `==highlight==`, `~~strikethrough~~`, backslash
+  escapes, hidden `%%comments%%`, and `<https://…>` / bare URLs as links.
 - **Graph view** — a vault-wide relation graph built from every note's `[[links]]`
   and `#tags` (no graph file, no export step: it is computed from your Markdown on
   the fly, like Obsidian's own graph). A vault-level entry above the note tree
@@ -143,7 +158,8 @@ The default vault is `$DSH_WORKSPACE/obsidian_vault`, falling back to
   neighbours, click a note to open it in the dock. **Local** shows the
   neighbourhood of the note that is currently open; the depth is adjustable
   from 1 to 5 hops (same range as Obsidian's local graph depth slider, default
-  1), and **Focus current note** jumps from the vault view straight to it.
+  1). **Focus** keeps the whole graph but frames the open note and its
+  neighbours — click it again to re-centre.
 - **Mind map view** — toggle the preview into a horizontal mind map built from the
   note's headings and list items. Scroll to zoom, drag to pan; select a node to
   jump to its source line, or insert that whole branch (node + descendants) into
@@ -182,28 +198,6 @@ The default vault is `$DSH_WORKSPACE/obsidian_vault`, falling back to
 The UI is bilingual (English / Chinese) and uses DSH theme tokens, so it follows
 the app's light and dark themes.
 
-## Comparison
-
-| | This plugin | [DedsecLemon/dsh-obsidian](https://github.com/DedsecLemon/dsh-obsidian) |
-| --- | --- | --- |
-| Vault tree, search | ✅ tree, title + body search | ✅ tree, whole-vault matching-line search |
-| Obsidian callouts | ✅ 13 types + 15 aliases, line-numbered spine | ✅ rendered, fold state kept |
-| Tables, fenced code, setext headings | ✅ | ✅ |
-| Frontmatter | ✅ preserved on save | ✅ shown as properties |
-| Paste screenshots + attachment folder moves | ✅ | — |
-| Cite a note / ask about a selection | ✅ | — |
-| Session & workspace housekeeping | ✅ | — |
-| Backlinks | ❌ | ✅ |
-| Outline pane | ❌ | ✅ |
-| Mind map view (headings + lists) | ✅ | — |
-| Graph view (vault-wide links + tags) | ✅ | — |
-| `==highlight==` | ✅ | ✅ |
-
-The point is not "more features" — it is a different trade-off. If you need
-outline and backlinks, use the other plugin (or Obsidian itself); if you want a
-faithful Obsidian reading/editing experience with a clean hand-off into the chat,
-this one is built for that.
-
 ## Configuration
 
 Everything lives inside the notes pane; there is no YAML to edit.
@@ -297,7 +291,7 @@ Repository layout:
 | --- | --- |
 | `src/index.js` | Host half: `/obsidian/*` routes, path containment, attachment migration |
 | `src/client.js` | Browser half: sidebar, notes tree, preview dock, session/workspace UI |
-| `src/markdown.js` | Zero-dependency line-numbered Markdown renderer |
+| `src/markdown.js` | Zero-dependency Markdown renderer (one row per source line) |
 | `src/vault-store.js` | Vault + attachment settings persistence |
 | `src/session-store.js` | Session log discovery and deletion |
 | `lib/client.js` | Build artifact (gitignored; produced by `npm run build`) |

package/README.zh.md

@@ -14,21 +14,20 @@
 
 ---
 
-## 为什么是这一个
+## 它能做什么
 
-DSH 生态里已经有一个 Obsidian 方向的插件
-（[DedsecLemon/dsh-obsidian](https://github.com/DedsecLemon/dsh-obsidian)），
-它适合需要大纲和反链的人。本插件押的是另外三件事 —— 如果你习惯「一边写笔记、一边和模型讨论」，这三件更重要：
+一个本地优先的 Markdown 笔记面板：在 DSH 侧边栏里读笔记，并把笔记顺手递进对话，不用复制粘贴。
 
-1. **渲染细节本身就是功能。** 预览带行号，并保留 Obsidian 的渲染细节：13 种 callout 类型 + 15 个别名、表格对齐、带语言标签的围栏代码、任务列表、setext 标题；frontmatter 不进编辑器，保存时按原文拼回。
-2. **粘贴的截图不会丢。** 编辑时粘贴图片，host 落盘为 Obsidian 原生引用 `![[Pasted image …]]`；以后迁移附件目录，全库笔记里的引用会一并改写。
-3. **笔记能接进对话。** 整篇引用为 `@绝对路径`；选中一段再提问，注入的内容带文件路径、行号区间和原文。
+1. **笔记就在对话旁边。** 指向一个 Markdown 文件夹，就有目录树、Obsidian 风格预览、编辑保存，以及标题和正文搜索——不导入、不同步、不上云。
+2. **「递进对话」本身就是功能。** 整篇引用为 `@绝对路径`；选中一段点 **Ask**，输入框里的 prompt 带着绝对路径、行号区间和原文，模型能准确引用你正在看的这一段。
+3. **截图直接进笔记库。** 编辑时粘贴图片会存进附件目录，并写成 Obsidian 原生的 `![[Pasted image …]]`；以后迁移附件目录，全库引用会一起改写。
+4. **两种看结构的方式。** 把笔记切换成由标题和列表生成的**思维导图**；或打开由 `[[双链]]` 和 `#标签` 现算的**关系图谱**——全库视角、当前笔记周围 1–5 跳的局部视角，或保留全库、只把镜头对准当前笔记的聚焦视角。
 
-> **它不做什么：** 没有反链、没有大纲面板、没有关系图，也不渲染数学公式 / mermaid / transclusion。这些是你的刚需就用真 Obsidian（或上面那个插件）。对比在[下方](#对比)写清楚。
+全部在本机运行：插件只读写你选择的文件夹，客户端只走宿主自己的 loopback 路由。
 
 ## 截图
 
-| 侧边栏笔记树 + 右侧预览 | Callout、行号、类型徽标 |
+| 侧边栏笔记树 + 右侧预览 | Callout、任务列表、类型徽标 |
 | --- | --- |
 | ![侧边栏笔记树与右侧预览](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-sidebar.png) | ![彩色 Obsidian callout，一行源码对应一行渲染](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-callouts.png) |
 
@@ -36,7 +35,7 @@ DSH 生态里已经有一个 Obsidian 方向的插件
 | --- | --- |
 | ![带列对齐的表格与 TypeScript 代码块](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-markdown.png) | ![带行号的编辑器与保存按钮](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-editing.png) |
 
-| 由标题 + 列表生成的思维导图 | 全库关系图谱（笔记、双链、标签） |
+| 由标题 + 列表生成的思维导图 | 全库关系图谱——全库 / 局部 / 聚焦 |
 | --- | --- |
 | ![由笔记标题与列表生成的思维导图](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-mindmap.png) | ![全库关系图谱：圆圈是笔记、方块是标签、线是双链/标签关系](https://raw.githubusercontent.com/revive123456/dsh-obsidian-notes/main/docs/assets/screenshot-graph.png) |
 
@@ -58,7 +57,7 @@ DSH 生态里已经有一个 Obsidian 方向的插件
 2. 搜索 **`dsh-obsidian-notes`** 并安装；
 3. 重启 DeepSeek Harness。
 
-> 这条路径要求 npm 上已有该包（当前版本 **0.6.0**）。搜不到时用下面两种方式。
+> 这条路径要求 npm 上已有该包。搜不到时用下面两种方式。
 
 ### 2. CLI（npm 发布后）
 
@@ -99,11 +98,19 @@ dsh plugin --profile web add "$(pwd)"            # PowerShell 用 "$PWD"
 默认 Vault 为 `$DSH_WORKSPACE/obsidian_vault`，缺省回落到启动 `dsh web` 目录下的
 `./obsidian_vault`。
 
+### 典型用法
+
+1. 打开 **📚 笔记**，先选一个 Vault（见上）。
+2. 点击笔记读预览；点 **编辑** 修改，再点 **保存** 或 <kbd>Ctrl/Cmd+S</kbd>。
+3. 把笔记带进对话：整篇点 **⤴ 引用到对话**；选中一段点 **Ask**，把问题附着在那段文字上。
+4. 编辑时粘贴截图，会存进 Vault 的附件目录。
+5. 把 Dock 切成 **🧠 思维导图** 看笔记结构；或点笔记树上方的 **🕸 关系图谱** 看全库图（**局部** = 当前笔记周围，**跳数 1–5**）。
+
 ## 功能
 
 - **Vault 侧边栏**：按需加载的目录树；单击打开笔记，新建 / 重命名 / 删除笔记与文件夹，按标题**和正文**搜索，显示笔记数徽标。
-- **带行号的 Obsidian 预览**：一行源码对应一行渲染并带行号。真表格（支持 `:---` / `:---:` / `---:` 对齐）、带语言标签的围栏代码、嵌套列表与任务列表、`#`～`######` 标题、setext 标题、分隔线、可点击的 `[[双链]]`（含别名与 `#章节`）；行内也支持 `==高亮==`、`~~删除线~~`、反斜杠转义、隐藏的 `%%注释%%`，以及 `<https://…>` / 裸 URL 自动成链。
-- **关系图谱**：全库关系图，节点/连线直接由每篇笔记的 `[[双链]]` 与 `#标签` 现算（没有额外图谱文件，也不导出——和 Obsidian 自己的图谱一样从 Markdown 推导）。入口在笔记树上方的 vault 级「🕸 关系图谱」行，点击后在独立视图里显示；滚轮缩放、拖动平移、悬停高亮邻居、点笔记节点在 Dock 里打开。切到「局部」可看当前打开笔记的邻居，跳数可在 1–5 之间调（与 Obsidian 局部图谱的 depth 范围一致，默认 1）；「聚焦当前笔记」可从全库一键切到该视角。
+- **Obsidian 风格预览**：一行源码对应一行渲染，表格、围栏代码、嵌套列表和 callout 都按 Obsidian 的排版排好；只读预览不显示行号，行号只在编辑时出现。真表格（支持 `:---` / `:---:` / `---:` 对齐）、带语言标签的围栏代码、嵌套列表与任务列表、`#`～`######` 标题、setext 标题、分隔线、可点击的 `[[双链]]`（含别名与 `#章节`）；行内也支持 `==高亮==`、`~~删除线~~`、反斜杠转义、隐藏的 `%%注释%%`，以及 `<https://…>` / 裸 URL 自动成链。
+- **关系图谱**：全库关系图，节点/连线直接由每篇笔记的 `[[双链]]` 与 `#标签` 现算（没有额外图谱文件，也不导出——和 Obsidian 自己的图谱一样从 Markdown 推导）。入口在笔记树上方的 vault 级「🕸 关系图谱」行，点击后在独立视图里显示；滚轮缩放、拖动平移、悬停高亮邻居、点笔记节点在 Dock 里打开。切到「局部」可看当前打开笔记的邻居，跳数可在 1–5 之间调（与 Obsidian 局部图谱的 depth 范围一致，默认 1）；「聚焦」保留全库，只把镜头对准当前笔记、把笔记和邻居框进画面，再点一次重新居中。
 - **思维导图视图**：把预览切换成由标题 + 列表生成的横向思维导图。滚轮缩放、拖动平移；选中节点可跳到对应源码行，或把「该分支（节点 + 全部后代）」作为上下文插入对话。纯渲染，不改动 Markdown 文件。
 - **Callout**：`> [!type] 标题` 按类型渲染颜色、图标与徽标。13 种规范类型（`note`、`abstract`、`info`、`todo`、`tip`、`success`、`question`、`warning`、`failure`、`danger`、`bug`、`example`、`quote`）+ 15 个 Obsidian 别名（`summary`、`tldr`、`hint`、`important`、`check`、`done`、`help`、`faq`、`caution`、`attention`、`fail`、`missing`、`error`、`cite`、`none`）。
 - **编辑与保存**：带行号的源码编辑器，点 `保存` 或按 <kbd>Ctrl/Cmd+S</kbd>。YAML frontmatter 不进编辑器，保存时原样拼回；外部对 YAML 的改动不会被覆盖。
@@ -115,25 +122,6 @@ dsh plugin --profile web add "$(pwd)"            # PowerShell 用 "$PWD"
 
 界面中英双语，使用 DSH 主题变量，跟随应用的浅色 / 深色主题。
 
-## 对比
-
-| | 本插件 | [DedsecLemon/dsh-obsidian](https://github.com/DedsecLemon/dsh-obsidian) |
-| --- | --- | --- |
-| Vault 目录树、搜索 | ✅ 目录树 + 标题/正文搜索 | ✅ 目录树 + 全库命中行搜索 |
-| Obsidian callout | ✅ 13 种类型 + 15 别名，逐行渲染 | ✅ 渲染，保留折叠状态 |
-| 表格、围栏代码、setext 标题 | ✅ | ✅ |
-| frontmatter | ✅ 保存时原样拼回 | ✅ 以属性区展示 |
-| 粘贴截图 + 附件目录迁移 | ✅ | — |
-| 整篇引用 / 选中片段提问 | ✅ | — |
-| 会话与工作区整理 | ✅ | — |
-| 反链 | ❌ | ✅ |
-| 大纲面板 | ❌ | ✅ |
-| 思维导图视图（标题 + 列表） | ✅ | — |
-| 关系图谱（全库双链 + 标签） | ✅ | — |
-| `==高亮==` | ✅ | ✅ |
-
-比的不是「功能多少」，而是取舍：需要大纲和反链，用另一个插件（或真 Obsidian）；想要忠实的 Obsidian 阅读/编辑体验、并顺手把笔记递进对话，这个插件就是为此写的。
-
 ## 配置
 
 所有配置都在笔记面板里完成，不用手改 YAML。
@@ -196,7 +184,7 @@ npm run check:bundle   # bundle 清单一致性（patch 文件、module id、fil
 | --- | --- |
 | `src/index.js` | host 半边：`/obsidian/*` 路由、路径包含性、附件迁移 |
 | `src/client.js` | 浏览器半边：侧边栏、笔记树、预览 Dock、会话/工作区 UI |
-| `src/markdown.js` | 零依赖、带行号的 Markdown 渲染器 |
+| `src/markdown.js` | 零依赖、逐行渲染的 Markdown 渲染器 |
 | `src/vault-store.js` | Vault 与附件设置的持久化 |
 | `src/session-store.js` | 会话日志发现与删除 |
 | `lib/client.js` | 构建产物（gitignore；由 `npm run build` 生成） |

package/lib/client.js

@@ -9,7 +9,8 @@ window.__ModuleLoader__.load({
 		 * 轻量 Markdown 渲染器（无第三方依赖，纯 React.createElement），两个出口、
 		 * 两套块级能力，共同复用行内解析 renderInline（粗斜体/行内代码/链接/图片/双链）：
 		 *
-		 * 1) renderNumbered —— 笔记面板预览**实际使用**的渲染器（一行源码 = 一行 + 行号）。
+		 * 1) renderNumbered —— 笔记面板预览**实际使用**的渲染器（一行源码 = 一行 + 行号节点；
+		 *    面板只读态的 CSS 把这批行号收起来，编辑态的行号走 client 里的 editor gutter）。
 		 *    块级支持：引用（逐行、嵌套，不再吞行）、callout（类型/别名/标题，正文里的
 		 *    列表与标题）、代码围栏（```/~~~、info string、未闭合到文末，行号保留）、
 		 *    列表（无序/有序/嵌套，按实际缩进，tab=4）、任务列表（只读复选框）、
@@ -846,7 +847,8 @@ window.__ModuleLoader__.load({
 		  }
 
 		  /**
-		   * 行号预览模式（预览态「每行一个行标号」）：
+		   * 行号预览模式（每个源码行一个行号节点；面板只读态用 CSS 隐藏行号，节点本身
+		   * 还要撑住空行行高、承载 data-line 供思维导图跳行）：
 		   * 每个源码行渲染为一行 <div class="dsh-obs-md-row">，左侧行号 .dsh-obs-md-ln、
 		   * 内容 .dsh-obs-md-lc（行内 markdown 保留，且允许自然折行）。行号与源码行一一对应，
 		   * 不依赖固定宽度/不折行，长行折行也不影响后续行号对齐。选中映射（.dsh-obs-src 偏移）
@@ -1595,6 +1597,57 @@ window.__ModuleLoader__.load({
 		  }
 
 
+		  /**
+		   * 「聚焦」模式的镜头：全库不裁剪，只把视口对准某篇笔记和它的一跳邻居。
+		   *
+		   * 和 localSubgraph 的分工：局部是「只留这块节点」，聚焦是「节点都在，镜头对准这块」。
+		   * 输入是 layoutGraph 的布局坐标与画布像素尺寸，输出直接可用的 SVG 平移/缩放。
+		   *
+		   * @param plan - `layoutGraph()` 的返回值（nodes 带 x/y）。
+		   * @param edges - 与 `plan.nodes` 对应的连线（`[{ source, target }]`）。
+		   * @param focusId - 焦点节点 id（笔记节点是 `note:<rel>`）。
+		   * @param viewport - `{ width, height }` 画布像素尺寸。
+		   * @param options - `{ padding, maxScale }`：padding 为布局坐标里的留白（默认 80），
+		   *   maxScale 限制推近倍数（默认 1.6，邻居很少时不至于糊脸）。
+		   * @returns `{ x, y, s }`；焦点不在布局里时返回 null（调用方退回整图适配）。
+		   */
+		  function focusViewport(plan, edges, focusId, viewport, options = {}) {
+		    const nodes = plan && Array.isArray(plan.nodes) ? plan.nodes : [];
+		    const center = nodes.find((node) => node.id === focusId);
+		    if (center === undefined) return null;
+		    const near = new Set([focusId]);
+		    for (const edge of edges ?? []) {
+		      if (edge.source === focusId) near.add(edge.target);
+		      else if (edge.target === focusId) near.add(edge.source);
+		    }
+		    let minX = center.x;
+		    let maxX = center.x;
+		    let minY = center.y;
+		    let maxY = center.y;
+		    for (const node of nodes) {
+		      if (!near.has(node.id)) continue;
+		      if (node.x < minX) minX = node.x;
+		      if (node.x > maxX) maxX = node.x;
+		      if (node.y < minY) minY = node.y;
+		      if (node.y > maxY) maxY = node.y;
+		    }
+		    const padding = options.padding ?? 80;
+		    const maxScale = options.maxScale ?? 1.6;
+		    const width = viewport && Number.isFinite(viewport.width) ? viewport.width : 900;
+		    const height = viewport && Number.isFinite(viewport.height) ? viewport.height : 560;
+		    // 单点邻居（焦点没有连线）时包围盒是 0×0，+padding 后仍可算；max(1) 只为除零兜底
+		    const boxW = Math.max(1, maxX - minX + padding * 2);
+		    const boxH = Math.max(1, maxY - minY + padding * 2);
+		    const raw = Math.min((width - 30) / boxW, (height - 30) / boxH, maxScale);
+		    const scale = Math.max(0.18, raw);
+		    return {
+		      x: width / 2 - ((minX + maxX) / 2) * scale,
+		      y: height / 2 - ((minY + maxY) / 2) * scale,
+		      s: scale,
+		    };
+		  }
+
+
 		  /** POSIX 风格拼接 + 折叠 `.`/`..`（客户端兜底构建时与 host 同一套链接解析）。 */
 		  function joinPosix(dir, rel) {
 		    const parts = dir === "" ? [] : dir.split("/");
@@ -1737,7 +1790,7 @@ window.__ModuleLoader__.load({
 		    return [...tags];
 		  }
 
-		  return { layoutGraph, localSubgraph, adjacency, rng, resolveGraphLink, buildGraphFromNotes, extractTags };
+		  return { layoutGraph, localSubgraph, focusViewport, adjacency, rng, resolveGraphLink, buildGraphFromNotes, extractTags };
 		})();
 
 		/**
@@ -1865,7 +1918,7 @@ window.__ModuleLoader__.load({
 		    graphHint: "滚轮缩放 · 拖动平移 · 点击笔记打开 · 悬停看邻居",
 		    graphGlobal: "全库",
 		    graphLocal: "局部",
-		    graphLocalHint: "以当前打开的笔记为中心显示 2 跳邻居",
+		    graphLocalHint: "以当前打开的笔记为中心显示邻居（跳数可调）",
 		    graphRefresh: "重新读取 vault",
 		    graphRerun: "重新布局",
 		    graphClose: "关闭图谱",
@@ -1882,7 +1935,7 @@ window.__ModuleLoader__.load({
 		    graphErrorTitle: "关系图谱加载失败",
 		    graphBuilding: "正在从笔记构建图谱（{done}/{total}）…",
 		    graphFocus: "聚焦",
-		    graphFocusHint: "一键切到以当前打开笔记为中心的局部图谱（局部模式下再点 = 重新居中）",
+		    graphFocusHint: "把镜头对准当前打开笔记：保留全库，把笔记和它的一跳邻居框进画面（再点 = 重新居中）",
 		    graphLegendNote: "笔记",
 		    graphLegendTag: "标签",
 		    graphLegendFocus: "当前笔记",
@@ -1920,11 +1973,10 @@ window.__ModuleLoader__.load({
 		    wikilinkNotFound: "未找到笔记",
 		    error: "出错了",
 		    imageInserted: "已插入图片",
-		    attachDir: "附件目录",
+		    attachDir: "附件文件夹",
 		    attachDirPick: "选择附件目录（Vault 内）",
-		    attachDirEdit: "手写附件目录",
-		    attachDirClear: "清空（回到 Vault 根）",
-		    attachDirPlaceholder: "Vault 相对路径，如 docs/images",
+		    attachDirPlaceholder: "Vault 相对路径，如 attachments",
+		    attachDirHint: "留空 = Vault 根目录，回车保存",
 		    imageRemoved: "已同步删除未引用的图片",
 		    attachDirConfirm: "更改截图落盘目录：{from} → {to}。会**自动把原目录下的截图移动到新目录**、删除原目录（若空），并同步更新笔记里的引用路径。确认更改？",
 		    attachSettings: "附件设置（位置 / 显示 / 清理）",
@@ -1933,7 +1985,9 @@ window.__ModuleLoader__.load({
 		    attachMode_fixed: "固定目录",
 		    attachMode_note: "与笔记同目录",
 		    attachMode_sub: "笔记目录下子目录",
-		    attachSubfolder: "子目录名（如 attachments）",
+		    attachSubfolder: "子目录名称",
+		    attachSubfolderPlaceholder: "如 attachments",
+		    attachSubHint: "回车保存",
 		    attachHideDir: "隐藏图片目录（只含图片、没有笔记的目录）",
 		    attachDeleteOrphans: "保存笔记时自动删除无用附件（默认关）",
 		    migrated: "迁移 {n} 张截图，更新 {m} 篇笔记",
@@ -2040,7 +2094,7 @@ window.__ModuleLoader__.load({
 		    graphHint: "Scroll to zoom · drag to pan · click a note to open it · hover to see neighbours",
 		    graphGlobal: "Vault",
 		    graphLocal: "Local",
-		    graphLocalHint: "Show the 2-hop neighbourhood of the note that is open",
+		    graphLocalHint: "Show the open note's neighbourhood (depth adjustable)",
 		    graphRefresh: "Re-read the vault",
 		    graphRerun: "Re-run the layout",
 		    graphClose: "Close the graph",
@@ -2057,7 +2111,7 @@ window.__ModuleLoader__.load({
 		    graphErrorTitle: "The graph view failed to load",
 		    graphBuilding: "Building the graph from notes ({done}/{total})…",
 		    graphFocus: "Focus",
-		    graphFocusHint: "Jump to the local graph centred on the open note (click again to re-centre)",
+		    graphFocusHint: "Aim the camera at the open note: keep the whole graph, frame the note and its neighbours (click again to re-centre)",
 		    graphLegendNote: "note",
 		    graphLegendTag: "tag",
 		    graphLegendFocus: "current note",
@@ -2095,11 +2149,10 @@ window.__ModuleLoader__.load({
 		    wikilinkNotFound: "Note not found",
 		    error: "Error",
 		    imageInserted: "Image inserted",
-		    attachDir: "Attachment dir",
+		    attachDir: "Attachment folder",
 		    attachDirPick: "Choose attachment dir (inside vault)",
-		    attachDirEdit: "Type an attachment dir",
-		    attachDirClear: "Clear (back to vault root)",
-		    attachDirPlaceholder: "Vault-relative path, e.g. docs/images",
+		    attachDirPlaceholder: "Vault-relative path, e.g. attachments",
+		    attachDirHint: "Empty = vault root; press Enter to save",
 		    imageRemoved: "Deleted unreferenced image(s)",
 		    attachDirConfirm: "Change screenshot dir: {from} → {to}. This will automatically move existing screenshots to the new dir, remove the old dir (if empty), and update note references. Continue?",
 		    attachSettings: "Attachment settings (location / visibility / cleanup)",
@@ -2108,7 +2161,9 @@ window.__ModuleLoader__.load({
 		    attachMode_fixed: "Fixed folder",
 		    attachMode_note: "Same folder as note",
 		    attachMode_sub: "Subfolder under note",
-		    attachSubfolder: "Subfolder name (e.g. attachments)",
+		    attachSubfolder: "Subfolder name",
+		    attachSubfolderPlaceholder: "e.g. attachments",
+		    attachSubHint: "Press Enter to save",
 		    attachHideDir: "Hide image folders (folders without any notes)",
 		    attachDeleteOrphans: "Auto-delete orphaned attachments on save (off by default)",
 		    migrated: "moved {n} image(s), updated {m} note(s)",
@@ -2484,6 +2539,7 @@ window.__ModuleLoader__.load({
 		    `.dsh-obs-ws-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;font-weight:500}`,
 		    `.dsh-obs-mini{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:0;border-radius:6px;background:transparent;color:var(--dsw-alias-label-tertiary);cursor:pointer;font-size:14px;line-height:1;flex:none}`,
 		    `.dsh-obs-mini:hover{background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-primary)}`,
+		    `.dsh-obs-mini.dsh-obs-on{background:var(--dsw-alias-interactive-bg-hover-accent);color:var(--dsw-alias-brand-primary)}`,
 		    // 行尾管理动作（工作区/会话 的 重命名 / 删除，常显）
 		    `.dsh-obs-actions{display:flex;align-items:center;gap:2px;flex:none}`,
 		    `.dsh-obs-actions button{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border:0;border-radius:6px;background:transparent;color:var(--dsw-alias-label-tertiary);cursor:pointer;font-size:12px;line-height:1}`,
@@ -2532,9 +2588,21 @@ window.__ModuleLoader__.load({
 		    `.dsh-obs-tree-head button{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;padding:0 6px;border:0;border-radius:7px;background:transparent;color:var(--dsw-alias-label-secondary);cursor:pointer;font-size:14px;line-height:1}`,
 		    `.dsh-obs-tree-head button:hover{background:var(--dsw-alias-interactive-bg-hover)}`,
 		    `.dsh-obs-tree-head button.dsh-obs-on{background:var(--dsw-alias-interactive-bg-hover-accent);color:var(--dsw-alias-brand-primary)}`,
-		    `.dsh-obs-attachcfg{display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:2px 6px 6px}`,
-		    `.dsh-obs-attachcfg input:not([type=checkbox]){flex:1;min-width:110px;height:24px;padding:0 6px;border:1px solid var(--dsw-alias-border-l1);border-radius:6px;background:transparent;color:var(--dsw-alias-label-primary);font-size:12px}`,
-		    `.dsh-obs-cfgline{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--dsw-alias-label-secondary);cursor:pointer}`,
+		    // 附件设置面板：窄侧边栏里的表单卡片。位置模式用下拉框，四个中文标签都能整行放下；
+		    // 旧版把四个标签塞进 24×24 的图标按钮，汉字被挤成一列，盖住下面的输入框和开关。
+		    `.dsh-obs-attachcfg{display:flex;flex-direction:column;gap:8px;margin:2px 4px 8px;padding:8px 8px 10px;border:1px solid var(--dsw-alias-border-l1);border-radius:9px;background:var(--dsw-alias-interactive-bg-hover)}`,
+		    `.dsh-obs-field{display:flex;flex-direction:column;gap:4px;min-width:0}`,
+		    `.dsh-obs-field-label{font-size:11px;line-height:15px;color:var(--dsw-alias-label-tertiary)}`,
+		    `.dsh-obs-select{width:100%;height:28px;padding:0 28px 0 8px;border:1px solid var(--dsw-alias-border-l2);border-radius:7px;background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5L6 7.5L9 4.5' stroke='%2381858C' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;background-size:12px 12px;color:var(--dsw-alias-label-primary);font-size:12px;line-height:26px;appearance:none;outline:none;cursor:pointer}`,
+		    `.dsh-obs-select:focus{border-color:var(--dsw-alias-brand-primary)}`,
+		    `.dsh-obs-inputrow{display:flex;align-items:center;gap:4px;min-width:0}`,
+		    `.dsh-obs-inputrow input{flex:1;min-width:0;height:28px;padding:0 8px;border:1px solid var(--dsw-alias-border-l2);border-radius:7px;background:transparent;color:var(--dsw-alias-label-primary);font-size:12px;outline:none}`,
+		    `.dsh-obs-inputrow input:focus{border-color:var(--dsw-alias-brand-primary)}`,
+		    `.dsh-obs-inputrow .dsh-obs-mini{width:26px;height:26px;border:1px solid var(--dsw-alias-border-l2)}`,
+		    `.dsh-obs-hint{font-size:11px;line-height:15px;color:var(--dsw-alias-label-tertiary)}`,
+		    `.dsh-obs-checks{display:flex;flex-direction:column;gap:6px;padding-top:2px}`,
+		    `.dsh-obs-cfgline{display:flex;align-items:flex-start;gap:6px;font-size:12px;line-height:1.5;color:var(--dsw-alias-label-secondary);cursor:pointer;user-select:none}`,
+		    `.dsh-obs-cfgline input[type=checkbox]{flex:none;margin:2px 0 0;cursor:pointer}`,
 		    `.dsh-obs-root-row{display:flex;align-items:center;gap:6px;padding:4px 10px;font-size:11px;color:var(--dsw-alias-label-tertiary)}`,
 		    `.dsh-obs-root-row .dsh-obs-root-path{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}`,
 		    `.dsh-obs-root-row .dsh-obs-mini,.dsh-obs-row .dsh-obs-mini{flex:none;width:22px;height:22px}`,
@@ -2568,6 +2636,13 @@ window.__ModuleLoader__.load({
 		    `.dsh-obs-md-row{display:flex;align-items:flex-start;gap:10px}`,
 		    `.dsh-obs-md-ln{flex:none;min-width:2ch;text-align:right;color:var(--dsw-alias-label-tertiary);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;line-height:1.7;user-select:none;-webkit-user-select:none}`,
 		    `.dsh-obs-md-lc{flex:1;min-width:0}`,
+		    // 只读预览不显示行号。行号节点留在 DOM 里但收成零宽、visibility:hidden：
+		    // 一是空源码行还要靠它的行高撑住段落间距；二是 data-line 仍供思维导图跳行，
+		    // 选区反查脚本行号走的是 .dsh-obs-src 偏移，和行号节点无关。
+		    // 编辑态的行号走 .dsh-obs-editor-gutter，不受这三条影响。
+		    `.dsh-obs-dock-body .dsh-obs-md .dsh-obs-md-row{gap:0}`,
+		    `.dsh-obs-dock-body .dsh-obs-md .dsh-obs-md-ln{width:0;min-width:0;overflow:hidden;visibility:hidden}`,
+		    `.dsh-obs-dock-body .dsh-obs-md .dsh-obs-md-tln{display:none}`,
 		    `.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc p,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h1,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h2,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h3,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h4,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h5,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h6,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc blockquote{margin:0;padding:0}`,
 		    `.dsh-obs-md-row.dsh-obs-md-heading .dsh-obs-md-lc{font-weight:600}`,
 		    // 行内 Obsidian 语法：==高亮== / ~~删除线~~ / 裸链接与自动链接
@@ -2798,7 +2873,14 @@ window.__ModuleLoader__.load({
 
 		  function injectCss() {
 		    if (typeof document === "undefined") return;
-		    if (document.querySelector('style[data-plugin-css="dsh-obsidian-vault/core.css"]')) return;
+		    // 已注入过就只更新内容：插件被 HMR 重新装载时 apply() 会再跑一遍，旧实现直接
+		    // return，页面会继续用上一次的 CSS —— 新加的类名没有样式，界面半新半旧，只能
+		    // 整页刷新才正常。
+		    const existing = document.querySelector('style[data-plugin-css="dsh-obsidian-vault/core.css"]');
+		    if (existing !== null) {
+		      if (existing.textContent !== CSS) existing.textContent = CSS;
+		      return;
+		    }
 		    const tag = document.createElement("style");
 		    tag.dataset.plugin = "dsh-obsidian-vault";
 		    tag.dataset.pluginCss = "dsh-obsidian-vault/core.css";
@@ -3052,6 +3134,7 @@ window.__ModuleLoader__.load({
 		    const [attachDir, setAttachDirState] = useState(null);
 		    const [attachOpen, setAttachOpen] = useState(false);
 		    const [attachInput, setAttachInput] = useState("");
+		    const [attachSubInput, setAttachSubInput] = useState("");
 		    // 附件位置模式 / 子目录 / 两个开关（对齐 Obsidian 的附件位置设置）
 		    const [attachCfg, setAttachCfg] = useState(null);
 
@@ -3101,6 +3184,14 @@ window.__ModuleLoader__.load({
 		      void loadRoot();
 		    }, [loadRoot, vaultRev]);
 
+		    // 面板每次打开都把输入框填成当前设置：旧版只有铅笔按钮会带值，点齿轮打开时
+		    // 输入框是空的，看起来像「设置丢了」。
+		    useEffect(() => {
+		      if (!attachOpen) return;
+		      setAttachInput(typeof attachDir === "string" ? attachDir : "");
+		      setAttachSubInput(attachCfg !== null ? attachCfg.subfolder : "attachments");
+		    }, [attachOpen]);
+
 		    const toggleDir = useCallback(async (rel) => {
 		      const willOpen = !expanded.has(rel);
 		      setExpanded((prev) => {
@@ -3402,63 +3493,85 @@ window.__ModuleLoader__.load({
 		          onClick: (e) => { e.stopPropagation(); patchShared({ graphOpen: true }); },
 		        }, "↗"),
 		      ),
-		      rootInfo && rootInfo.exists && attachDir !== null && createElement("div", { className: "dsh-obs-root-row", title: t("attachSettings") },
+		      rootInfo && rootInfo.exists && attachDir !== null && createElement("div", {
+		        className: "dsh-obs-root-row",
+		        title: `${t("attachLocation")}: ${attachLocationLabel(attachCfg, attachDir, t)}`,
+		      },
 		        createElement("span", { className: "dsh-obs-root-path" },
 		          `📎 ${t("attachLocation")}: ${attachLocationLabel(attachCfg, attachDir, t)}`),
-		        attachCfg !== null && attachCfg.mode === "fixed" && createElement("button", {
-		          className: "dsh-obs-mini",
-		          title: t("attachDirPick"),
-		          onClick: (e) => { e.stopPropagation(); void pickAttachDir(); },
-		        }, "📂"),
-		        attachCfg !== null && attachCfg.mode === "fixed" && createElement("button", {
-		          className: "dsh-obs-mini",
-		          title: t("attachDirEdit"),
-		          onClick: (e) => { e.stopPropagation(); setAttachInput(attachDir); setAttachOpen((v) => !v); },
-		        }, "✎"),
 		        createElement("button", {
-		          className: "dsh-obs-mini",
+		          className: `dsh-obs-mini${attachOpen ? " dsh-obs-on" : ""}`,
 		          title: t("attachSettings"),
+		          "aria-expanded": attachOpen === true,
 		          onClick: (e) => { e.stopPropagation(); setAttachOpen((v) => !v); },
 		        }, "⚙"),
 		      ),
-		      // 附件设置面板：位置模式（Obsidian 的四种）+ 子目录名 + 两个开关
+		      // 附件设置面板：窄侧边栏里当表单排（下拉框 + 输入行 + 开关），长标签整行放得下
 		      attachOpen && rootInfo && rootInfo.exists && attachCfg !== null && createElement("div", { className: "dsh-obs-attachcfg" },
-		        ...["root", "fixed", "note", "sub"].map((m) => createElement("button", {
-		          key: m,
-		          className: `dsh-obs-mini${attachCfg.mode === m ? " dsh-obs-on" : ""}`,
-		          title: t(`attachMode_${m}`),
-		          onClick: (e) => { e.stopPropagation(); void applyAttachSettings({ mode: m }); },
-		        }, t(`attachMode_${m}`))),
-		        attachCfg.mode === "fixed" && createElement("input", {
-		          autoFocus: true,
-		          placeholder: t("attachDirPlaceholder"),
-		          value: attachInput,
-		          onChange: (e) => setAttachInput(e.target.value),
-		          onKeyDown: (e) => {
-		            if (e.key === "Enter") void applyAttachDir(attachInput);
-		            if (e.key === "Escape") setAttachOpen(false);
+		        createElement("label", { className: "dsh-obs-field" },
+		          createElement("span", { className: "dsh-obs-field-label" }, t("attachLocation")),
+		          createElement("select", {
+		            className: "dsh-obs-select",
+		            value: attachCfg.mode,
+		            onChange: (e) => { void applyAttachSettings({ mode: e.target.value }); },
 		          },
-		        }),
-		        attachCfg.mode === "sub" && createElement("input", {
-		          placeholder: t("attachSubfolder"),
-		          defaultValue: attachCfg.subfolder,
-		          onKeyDown: (e) => { if (e.key === "Enter") void applyAttachSettings({ subfolder: e.target.value }); },
-		        }),
-		        createElement("label", { className: "dsh-obs-cfgline" },
-		          createElement("input", {
-		            type: "checkbox",
-		            checked: attachCfg.hideDir,
-		            onChange: (e) => { e.stopPropagation(); void applyAttachSettings({ hideAttachmentDir: e.target.checked === true }); },
-		          }),
-		          t("attachHideDir"),
+		            ["root", "fixed", "note", "sub"].map((m) => createElement("option", { key: m, value: m }, t(`attachMode_${m}`))),
+		          ),
 		        ),
-		        createElement("label", { className: "dsh-obs-cfgline" },
-		          createElement("input", {
-		            type: "checkbox",
-		            checked: attachCfg.deleteOrphans,
-		            onChange: (e) => { e.stopPropagation(); void applyAttachSettings({ deleteOrphanAttachments: e.target.checked === true }); },
-		          }),
-		          t("attachDeleteOrphans"),
+		        attachCfg.mode === "fixed" && createElement("div", { className: "dsh-obs-field" },
+		          createElement("span", { className: "dsh-obs-field-label" }, t("attachDir")),
+		          createElement("div", { className: "dsh-obs-inputrow" },
+		            createElement("input", {
+		              "aria-label": t("attachDir"),
+		              placeholder: t("attachDirPlaceholder"),
+		              value: attachInput,
+		              onChange: (e) => setAttachInput(e.target.value),
+		              onKeyDown: (e) => {
+		                if (e.key === "Enter") void applyAttachDir(attachInput);
+		                if (e.key === "Escape") setAttachOpen(false);
+		              },
+		            }),
+		            createElement("button", {
+		              className: "dsh-obs-mini",
+		              title: t("attachDirPick"),
+		              onClick: (e) => { e.stopPropagation(); void pickAttachDir(); },
+		            }, "📂"),
+		          ),
+		          createElement("span", { className: "dsh-obs-hint" }, t("attachDirHint")),
+		        ),
+		        attachCfg.mode === "sub" && createElement("div", { className: "dsh-obs-field" },
+		          createElement("span", { className: "dsh-obs-field-label" }, t("attachSubfolder")),
+		          createElement("div", { className: "dsh-obs-inputrow" },
+		            createElement("input", {
+		              "aria-label": t("attachSubfolder"),
+		              placeholder: t("attachSubfolderPlaceholder"),
+		              value: attachSubInput,
+		              onChange: (e) => setAttachSubInput(e.target.value),
+		              onKeyDown: (e) => {
+		                if (e.key === "Enter") void applyAttachSettings({ subfolder: attachSubInput });
+		                if (e.key === "Escape") setAttachOpen(false);
+		              },
+		            }),
+		          ),
+		          createElement("span", { className: "dsh-obs-hint" }, t("attachSubHint")),
+		        ),
+		        createElement("div", { className: "dsh-obs-checks" },
+		          createElement("label", { className: "dsh-obs-cfgline" },
+		            createElement("input", {
+		              type: "checkbox",
+		              checked: attachCfg.hideDir,
+		              onChange: (e) => { e.stopPropagation(); void applyAttachSettings({ hideAttachmentDir: e.target.checked === true }); },
+		            }),
+		            createElement("span", null, t("attachHideDir")),
+		          ),
+		          createElement("label", { className: "dsh-obs-cfgline" },
+		            createElement("input", {
+		              type: "checkbox",
+		              checked: attachCfg.deleteOrphans,
+		              onChange: (e) => { e.stopPropagation(); void applyAttachSettings({ deleteOrphanAttachments: e.target.checked === true }); },
+		            }),
+		            createElement("span", null, t("attachDeleteOrphans")),
+		          ),
 		        ),
 		      ),
 		      body,
@@ -4476,7 +4589,8 @@ window.__ModuleLoader__.load({
 
 		  /**
 		   * 关系图谱视图：全库 .md + [[双链]] + 标签（host `/obsidian/graph` 计算，
-		   * 力导向布局在 src/graph.js）。可切到「局部」= 当前打开笔记的 2 跳邻居。
+		   * 力导向布局在 src/graph.js）。「局部」= 当前打开笔记周围 1–5 跳邻居；
+		   * 「聚焦」保留全库，只把镜头对准当前笔记。
 		   */
 		  function GraphView({ t, currentNote, onOpenNote, onClose }) {
 		    const [data, setData] = useState(null);
@@ -4648,28 +4762,46 @@ window.__ModuleLoader__.load({
 		    const currentRel = currentNote && currentNote.rel ? currentNote.rel : null;
 		    const focusId = currentRel !== null ? `note:${currentRel}` : null;
 		    const localAvailable = data !== null && focusId !== null && data.nodes.some((node) => node.id === focusId);
+		    // 全库数据只包一次：全库 ↔ 聚焦之间切换不重跑力导向布局（同一 seed 结果一样，重跑一遍纯属浪费）
+		    const fullGraph = useMemo(
+		      () => (data === null ? { nodes: [], edges: [] } : { nodes: data.nodes, edges: data.edges }),
+		      [data],
+		    );
 		    const shown = useMemo(() => {
-		      if (data === null) return { nodes: [], edges: [] };
-		      if (mode === "local" && localAvailable) {
+		      if (mode === "local" && localAvailable && data !== null) {
 		        const sub = graphModule.localSubgraph(data, focusId, localDepth);
 		        return { nodes: sub.nodes, edges: sub.edges };
 		      }
-		      return { nodes: data.nodes, edges: data.edges };
-		    }, [data, mode, localAvailable, focusId, localDepth]);
+		      return fullGraph;
+		    }, [fullGraph, data, mode, localAvailable, focusId, localDepth]);
 		    const plan = useMemo(
 		      () => graphModule.layoutGraph(shown.nodes, shown.edges, { seed, maxNodes: 420 }),
 		      [shown, seed],
 		    );
 
-		    // 打开 / 切换范围 / 重新布局后把整张图适配进画布
+		    // 打开 / 切换范围 / 重新布局后摆好镜头：全库与局部把整张图适配进画布；
+		    // 聚焦模式保留全库，但把镜头对准当前笔记：笔记和它的一跳邻居框进画面（不裁节点）。
 		    useEffect(() => {
 		      const el = wrapRef.current;
 		      if (!el || plan.nodes.length === 0) return;
 		      const w = el.clientWidth || 900;
 		      const h = el.clientHeight || 560;
+		      if (mode === "focus") {
+		        const framed = graphModule.focusViewport(plan, shown.edges, focusId, { width: w, height: h });
+		        if (framed !== null) {
+		          setTransform(framed);
+		          return;
+		        }
+		      }
 		      const fit = Math.min((w - 30) / plan.width, (h - 30) / plan.height, 1);
 		      setTransform({ x: (w - plan.width * fit) / 2, y: (h - plan.height * fit) / 2, s: fit });
-		    }, [plan, fitKey]);
+		    }, [plan, fitKey, mode, focusId, shown.edges]);
+
+		    // 当前笔记被关掉 / 从图里消失后，局部与聚焦都没有中心：退回全库，
+		    // 否则会留下一个「按不动却亮着」的分段按钮。
+		    useEffect(() => {
+		      if (!localAvailable && (mode === "local" || mode === "focus")) setMode("global");
+		    }, [localAvailable, mode]);
 
 		    const onWheel = useCallback((e) => {
 		      if (plan.nodes.length === 0) return;
@@ -4791,10 +4923,11 @@ window.__ModuleLoader__.load({
 		            disabled: !localAvailable,
 		            title: localAvailable ? t("graphLocalHint") : t("graphNoNote"),
 		          }),
-		          modeButton(t("graphFocus"), false, () => {
+		          modeButton(t("graphFocus"), mode === "focus", () => {
 		            if (!localAvailable) return;
-		            setMode("local");
-		            setFitKey((v) => v + 1);
+		            // 聚焦是独立模式（全库图 + 镜头对准当前笔记）：再点一次 = 重新居中
+		            if (mode === "focus") setFitKey((v) => v + 1);
+		            else setMode("focus");
 		          }, {
 		            disabled: !localAvailable,
 		            title: localAvailable ? t("graphFocusHint") : t("graphNoNote"),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-obsidian-notes",
-  "version": "0.6.0",
+  "version": "0.6.2",
   "description": "Obsidian-style notes panel for DeepSeek Harness Web: vault directory tree, Markdown preview/edit/save, cite-to-chat, batch archive/delete of sessions and workspaces. DSH 内嵌 Obsidian 风格笔记面板：目录树 + Markdown 预览/编辑/保存 + 引用到对话 + 会话/工作区批量操作。",
   "engines": {
     "node": "^22.19 || >=24"

package/src/client.js

@@ -123,7 +123,7 @@
     graphHint: "滚轮缩放 · 拖动平移 · 点击笔记打开 · 悬停看邻居",
     graphGlobal: "全库",
     graphLocal: "局部",
-    graphLocalHint: "以当前打开的笔记为中心显示 2 跳邻居",
+    graphLocalHint: "以当前打开的笔记为中心显示邻居（跳数可调）",
     graphRefresh: "重新读取 vault",
     graphRerun: "重新布局",
     graphClose: "关闭图谱",
@@ -140,7 +140,7 @@
     graphErrorTitle: "关系图谱加载失败",
     graphBuilding: "正在从笔记构建图谱（{done}/{total}）…",
     graphFocus: "聚焦",
-    graphFocusHint: "一键切到以当前打开笔记为中心的局部图谱（局部模式下再点 = 重新居中）",
+    graphFocusHint: "把镜头对准当前打开笔记：保留全库，把笔记和它的一跳邻居框进画面（再点 = 重新居中）",
     graphLegendNote: "笔记",
     graphLegendTag: "标签",
     graphLegendFocus: "当前笔记",
@@ -178,11 +178,10 @@
     wikilinkNotFound: "未找到笔记",
     error: "出错了",
     imageInserted: "已插入图片",
-    attachDir: "附件目录",
+    attachDir: "附件文件夹",
     attachDirPick: "选择附件目录（Vault 内）",
-    attachDirEdit: "手写附件目录",
-    attachDirClear: "清空（回到 Vault 根）",
-    attachDirPlaceholder: "Vault 相对路径，如 docs/images",
+    attachDirPlaceholder: "Vault 相对路径，如 attachments",
+    attachDirHint: "留空 = Vault 根目录，回车保存",
     imageRemoved: "已同步删除未引用的图片",
     attachDirConfirm: "更改截图落盘目录：{from} → {to}。会**自动把原目录下的截图移动到新目录**、删除原目录（若空），并同步更新笔记里的引用路径。确认更改？",
     attachSettings: "附件设置（位置 / 显示 / 清理）",
@@ -191,7 +190,9 @@
     attachMode_fixed: "固定目录",
     attachMode_note: "与笔记同目录",
     attachMode_sub: "笔记目录下子目录",
-    attachSubfolder: "子目录名（如 attachments）",
+    attachSubfolder: "子目录名称",
+    attachSubfolderPlaceholder: "如 attachments",
+    attachSubHint: "回车保存",
     attachHideDir: "隐藏图片目录（只含图片、没有笔记的目录）",
     attachDeleteOrphans: "保存笔记时自动删除无用附件（默认关）",
     migrated: "迁移 {n} 张截图，更新 {m} 篇笔记",
@@ -298,7 +299,7 @@
     graphHint: "Scroll to zoom · drag to pan · click a note to open it · hover to see neighbours",
     graphGlobal: "Vault",
     graphLocal: "Local",
-    graphLocalHint: "Show the 2-hop neighbourhood of the note that is open",
+    graphLocalHint: "Show the open note's neighbourhood (depth adjustable)",
     graphRefresh: "Re-read the vault",
     graphRerun: "Re-run the layout",
     graphClose: "Close the graph",
@@ -315,7 +316,7 @@
     graphErrorTitle: "The graph view failed to load",
     graphBuilding: "Building the graph from notes ({done}/{total})…",
     graphFocus: "Focus",
-    graphFocusHint: "Jump to the local graph centred on the open note (click again to re-centre)",
+    graphFocusHint: "Aim the camera at the open note: keep the whole graph, frame the note and its neighbours (click again to re-centre)",
     graphLegendNote: "note",
     graphLegendTag: "tag",
     graphLegendFocus: "current note",
@@ -353,11 +354,10 @@
     wikilinkNotFound: "Note not found",
     error: "Error",
     imageInserted: "Image inserted",
-    attachDir: "Attachment dir",
+    attachDir: "Attachment folder",
     attachDirPick: "Choose attachment dir (inside vault)",
-    attachDirEdit: "Type an attachment dir",
-    attachDirClear: "Clear (back to vault root)",
-    attachDirPlaceholder: "Vault-relative path, e.g. docs/images",
+    attachDirPlaceholder: "Vault-relative path, e.g. attachments",
+    attachDirHint: "Empty = vault root; press Enter to save",
     imageRemoved: "Deleted unreferenced image(s)",
     attachDirConfirm: "Change screenshot dir: {from} → {to}. This will automatically move existing screenshots to the new dir, remove the old dir (if empty), and update note references. Continue?",
     attachSettings: "Attachment settings (location / visibility / cleanup)",
@@ -366,7 +366,9 @@
     attachMode_fixed: "Fixed folder",
     attachMode_note: "Same folder as note",
     attachMode_sub: "Subfolder under note",
-    attachSubfolder: "Subfolder name (e.g. attachments)",
+    attachSubfolder: "Subfolder name",
+    attachSubfolderPlaceholder: "e.g. attachments",
+    attachSubHint: "Press Enter to save",
     attachHideDir: "Hide image folders (folders without any notes)",
     attachDeleteOrphans: "Auto-delete orphaned attachments on save (off by default)",
     migrated: "moved {n} image(s), updated {m} note(s)",
@@ -742,6 +744,7 @@
     `.dsh-obs-ws-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;font-weight:500}`,
     `.dsh-obs-mini{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:0;border-radius:6px;background:transparent;color:var(--dsw-alias-label-tertiary);cursor:pointer;font-size:14px;line-height:1;flex:none}`,
     `.dsh-obs-mini:hover{background:var(--dsw-alias-interactive-bg-hover);color:var(--dsw-alias-label-primary)}`,
+    `.dsh-obs-mini.dsh-obs-on{background:var(--dsw-alias-interactive-bg-hover-accent);color:var(--dsw-alias-brand-primary)}`,
     // 行尾管理动作（工作区/会话 的 重命名 / 删除，常显）
     `.dsh-obs-actions{display:flex;align-items:center;gap:2px;flex:none}`,
     `.dsh-obs-actions button{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border:0;border-radius:6px;background:transparent;color:var(--dsw-alias-label-tertiary);cursor:pointer;font-size:12px;line-height:1}`,
@@ -790,9 +793,21 @@
     `.dsh-obs-tree-head button{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:26px;padding:0 6px;border:0;border-radius:7px;background:transparent;color:var(--dsw-alias-label-secondary);cursor:pointer;font-size:14px;line-height:1}`,
     `.dsh-obs-tree-head button:hover{background:var(--dsw-alias-interactive-bg-hover)}`,
     `.dsh-obs-tree-head button.dsh-obs-on{background:var(--dsw-alias-interactive-bg-hover-accent);color:var(--dsw-alias-brand-primary)}`,
-    `.dsh-obs-attachcfg{display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:2px 6px 6px}`,
-    `.dsh-obs-attachcfg input:not([type=checkbox]){flex:1;min-width:110px;height:24px;padding:0 6px;border:1px solid var(--dsw-alias-border-l1);border-radius:6px;background:transparent;color:var(--dsw-alias-label-primary);font-size:12px}`,
-    `.dsh-obs-cfgline{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--dsw-alias-label-secondary);cursor:pointer}`,
+    // 附件设置面板：窄侧边栏里的表单卡片。位置模式用下拉框，四个中文标签都能整行放下；
+    // 旧版把四个标签塞进 24×24 的图标按钮，汉字被挤成一列，盖住下面的输入框和开关。
+    `.dsh-obs-attachcfg{display:flex;flex-direction:column;gap:8px;margin:2px 4px 8px;padding:8px 8px 10px;border:1px solid var(--dsw-alias-border-l1);border-radius:9px;background:var(--dsw-alias-interactive-bg-hover)}`,
+    `.dsh-obs-field{display:flex;flex-direction:column;gap:4px;min-width:0}`,
+    `.dsh-obs-field-label{font-size:11px;line-height:15px;color:var(--dsw-alias-label-tertiary)}`,
+    `.dsh-obs-select{width:100%;height:28px;padding:0 28px 0 8px;border:1px solid var(--dsw-alias-border-l2);border-radius:7px;background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M3 4.5L6 7.5L9 4.5' stroke='%2381858C' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;background-size:12px 12px;color:var(--dsw-alias-label-primary);font-size:12px;line-height:26px;appearance:none;outline:none;cursor:pointer}`,
+    `.dsh-obs-select:focus{border-color:var(--dsw-alias-brand-primary)}`,
+    `.dsh-obs-inputrow{display:flex;align-items:center;gap:4px;min-width:0}`,
+    `.dsh-obs-inputrow input{flex:1;min-width:0;height:28px;padding:0 8px;border:1px solid var(--dsw-alias-border-l2);border-radius:7px;background:transparent;color:var(--dsw-alias-label-primary);font-size:12px;outline:none}`,
+    `.dsh-obs-inputrow input:focus{border-color:var(--dsw-alias-brand-primary)}`,
+    `.dsh-obs-inputrow .dsh-obs-mini{width:26px;height:26px;border:1px solid var(--dsw-alias-border-l2)}`,
+    `.dsh-obs-hint{font-size:11px;line-height:15px;color:var(--dsw-alias-label-tertiary)}`,
+    `.dsh-obs-checks{display:flex;flex-direction:column;gap:6px;padding-top:2px}`,
+    `.dsh-obs-cfgline{display:flex;align-items:flex-start;gap:6px;font-size:12px;line-height:1.5;color:var(--dsw-alias-label-secondary);cursor:pointer;user-select:none}`,
+    `.dsh-obs-cfgline input[type=checkbox]{flex:none;margin:2px 0 0;cursor:pointer}`,
     `.dsh-obs-root-row{display:flex;align-items:center;gap:6px;padding:4px 10px;font-size:11px;color:var(--dsw-alias-label-tertiary)}`,
     `.dsh-obs-root-row .dsh-obs-root-path{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}`,
     `.dsh-obs-root-row .dsh-obs-mini,.dsh-obs-row .dsh-obs-mini{flex:none;width:22px;height:22px}`,
@@ -826,6 +841,13 @@
     `.dsh-obs-md-row{display:flex;align-items:flex-start;gap:10px}`,
     `.dsh-obs-md-ln{flex:none;min-width:2ch;text-align:right;color:var(--dsw-alias-label-tertiary);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;line-height:1.7;user-select:none;-webkit-user-select:none}`,
     `.dsh-obs-md-lc{flex:1;min-width:0}`,
+    // 只读预览不显示行号。行号节点留在 DOM 里但收成零宽、visibility:hidden：
+    // 一是空源码行还要靠它的行高撑住段落间距；二是 data-line 仍供思维导图跳行，
+    // 选区反查脚本行号走的是 .dsh-obs-src 偏移，和行号节点无关。
+    // 编辑态的行号走 .dsh-obs-editor-gutter，不受这三条影响。
+    `.dsh-obs-dock-body .dsh-obs-md .dsh-obs-md-row{gap:0}`,
+    `.dsh-obs-dock-body .dsh-obs-md .dsh-obs-md-ln{width:0;min-width:0;overflow:hidden;visibility:hidden}`,
+    `.dsh-obs-dock-body .dsh-obs-md .dsh-obs-md-tln{display:none}`,
     `.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc p,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h1,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h2,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h3,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h4,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h5,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc h6,.dsh-obs-dock-body .dsh-obs-md-row .dsh-obs-md-lc blockquote{margin:0;padding:0}`,
     `.dsh-obs-md-row.dsh-obs-md-heading .dsh-obs-md-lc{font-weight:600}`,
     // 行内 Obsidian 语法：==高亮== / ~~删除线~~ / 裸链接与自动链接
@@ -1056,7 +1078,14 @@
 
   function injectCss() {
     if (typeof document === "undefined") return;
-    if (document.querySelector('style[data-plugin-css="dsh-obsidian-vault/core.css"]')) return;
+    // 已注入过就只更新内容：插件被 HMR 重新装载时 apply() 会再跑一遍，旧实现直接
+    // return，页面会继续用上一次的 CSS —— 新加的类名没有样式，界面半新半旧，只能
+    // 整页刷新才正常。
+    const existing = document.querySelector('style[data-plugin-css="dsh-obsidian-vault/core.css"]');
+    if (existing !== null) {
+      if (existing.textContent !== CSS) existing.textContent = CSS;
+      return;
+    }
     const tag = document.createElement("style");
     tag.dataset.plugin = "dsh-obsidian-vault";
     tag.dataset.pluginCss = "dsh-obsidian-vault/core.css";
@@ -1310,6 +1339,7 @@
     const [attachDir, setAttachDirState] = useState(null);
     const [attachOpen, setAttachOpen] = useState(false);
     const [attachInput, setAttachInput] = useState("");
+    const [attachSubInput, setAttachSubInput] = useState("");
     // 附件位置模式 / 子目录 / 两个开关（对齐 Obsidian 的附件位置设置）
     const [attachCfg, setAttachCfg] = useState(null);
 
@@ -1359,6 +1389,14 @@
       void loadRoot();
     }, [loadRoot, vaultRev]);
 
+    // 面板每次打开都把输入框填成当前设置：旧版只有铅笔按钮会带值，点齿轮打开时
+    // 输入框是空的，看起来像「设置丢了」。
+    useEffect(() => {
+      if (!attachOpen) return;
+      setAttachInput(typeof attachDir === "string" ? attachDir : "");
+      setAttachSubInput(attachCfg !== null ? attachCfg.subfolder : "attachments");
+    }, [attachOpen]);
+
     const toggleDir = useCallback(async (rel) => {
       const willOpen = !expanded.has(rel);
       setExpanded((prev) => {
@@ -1660,63 +1698,85 @@
           onClick: (e) => { e.stopPropagation(); patchShared({ graphOpen: true }); },
         }, "↗"),
       ),
-      rootInfo && rootInfo.exists && attachDir !== null && createElement("div", { className: "dsh-obs-root-row", title: t("attachSettings") },
+      rootInfo && rootInfo.exists && attachDir !== null && createElement("div", {
+        className: "dsh-obs-root-row",
+        title: `${t("attachLocation")}: ${attachLocationLabel(attachCfg, attachDir, t)}`,
+      },
         createElement("span", { className: "dsh-obs-root-path" },
           `📎 ${t("attachLocation")}: ${attachLocationLabel(attachCfg, attachDir, t)}`),
-        attachCfg !== null && attachCfg.mode === "fixed" && createElement("button", {
-          className: "dsh-obs-mini",
-          title: t("attachDirPick"),
-          onClick: (e) => { e.stopPropagation(); void pickAttachDir(); },
-        }, "📂"),
-        attachCfg !== null && attachCfg.mode === "fixed" && createElement("button", {
-          className: "dsh-obs-mini",
-          title: t("attachDirEdit"),
-          onClick: (e) => { e.stopPropagation(); setAttachInput(attachDir); setAttachOpen((v) => !v); },
-        }, "✎"),
         createElement("button", {
-          className: "dsh-obs-mini",
+          className: `dsh-obs-mini${attachOpen ? " dsh-obs-on" : ""}`,
           title: t("attachSettings"),
+          "aria-expanded": attachOpen === true,
           onClick: (e) => { e.stopPropagation(); setAttachOpen((v) => !v); },
         }, "⚙"),
       ),
-      // 附件设置面板：位置模式（Obsidian 的四种）+ 子目录名 + 两个开关
+      // 附件设置面板：窄侧边栏里当表单排（下拉框 + 输入行 + 开关），长标签整行放得下
       attachOpen && rootInfo && rootInfo.exists && attachCfg !== null && createElement("div", { className: "dsh-obs-attachcfg" },
-        ...["root", "fixed", "note", "sub"].map((m) => createElement("button", {
-          key: m,
-          className: `dsh-obs-mini${attachCfg.mode === m ? " dsh-obs-on" : ""}`,
-          title: t(`attachMode_${m}`),
-          onClick: (e) => { e.stopPropagation(); void applyAttachSettings({ mode: m }); },
-        }, t(`attachMode_${m}`))),
-        attachCfg.mode === "fixed" && createElement("input", {
-          autoFocus: true,
-          placeholder: t("attachDirPlaceholder"),
-          value: attachInput,
-          onChange: (e) => setAttachInput(e.target.value),
-          onKeyDown: (e) => {
-            if (e.key === "Enter") void applyAttachDir(attachInput);
-            if (e.key === "Escape") setAttachOpen(false);
+        createElement("label", { className: "dsh-obs-field" },
+          createElement("span", { className: "dsh-obs-field-label" }, t("attachLocation")),
+          createElement("select", {
+            className: "dsh-obs-select",
+            value: attachCfg.mode,
+            onChange: (e) => { void applyAttachSettings({ mode: e.target.value }); },
           },
-        }),
-        attachCfg.mode === "sub" && createElement("input", {
-          placeholder: t("attachSubfolder"),
-          defaultValue: attachCfg.subfolder,
-          onKeyDown: (e) => { if (e.key === "Enter") void applyAttachSettings({ subfolder: e.target.value }); },
-        }),
-        createElement("label", { className: "dsh-obs-cfgline" },
-          createElement("input", {
-            type: "checkbox",
-            checked: attachCfg.hideDir,
-            onChange: (e) => { e.stopPropagation(); void applyAttachSettings({ hideAttachmentDir: e.target.checked === true }); },
-          }),
-          t("attachHideDir"),
+            ["root", "fixed", "note", "sub"].map((m) => createElement("option", { key: m, value: m }, t(`attachMode_${m}`))),
+          ),
         ),
-        createElement("label", { className: "dsh-obs-cfgline" },
-          createElement("input", {
-            type: "checkbox",
-            checked: attachCfg.deleteOrphans,
-            onChange: (e) => { e.stopPropagation(); void applyAttachSettings({ deleteOrphanAttachments: e.target.checked === true }); },
-          }),
-          t("attachDeleteOrphans"),
+        attachCfg.mode === "fixed" && createElement("div", { className: "dsh-obs-field" },
+          createElement("span", { className: "dsh-obs-field-label" }, t("attachDir")),
+          createElement("div", { className: "dsh-obs-inputrow" },
+            createElement("input", {
+              "aria-label": t("attachDir"),
+              placeholder: t("attachDirPlaceholder"),
+              value: attachInput,
+              onChange: (e) => setAttachInput(e.target.value),
+              onKeyDown: (e) => {
+                if (e.key === "Enter") void applyAttachDir(attachInput);
+                if (e.key === "Escape") setAttachOpen(false);
+              },
+            }),
+            createElement("button", {
+              className: "dsh-obs-mini",
+              title: t("attachDirPick"),
+              onClick: (e) => { e.stopPropagation(); void pickAttachDir(); },
+            }, "📂"),
+          ),
+          createElement("span", { className: "dsh-obs-hint" }, t("attachDirHint")),
+        ),
+        attachCfg.mode === "sub" && createElement("div", { className: "dsh-obs-field" },
+          createElement("span", { className: "dsh-obs-field-label" }, t("attachSubfolder")),
+          createElement("div", { className: "dsh-obs-inputrow" },
+            createElement("input", {
+              "aria-label": t("attachSubfolder"),
+              placeholder: t("attachSubfolderPlaceholder"),
+              value: attachSubInput,
+              onChange: (e) => setAttachSubInput(e.target.value),
+              onKeyDown: (e) => {
+                if (e.key === "Enter") void applyAttachSettings({ subfolder: attachSubInput });
+                if (e.key === "Escape") setAttachOpen(false);
+              },
+            }),
+          ),
+          createElement("span", { className: "dsh-obs-hint" }, t("attachSubHint")),
+        ),
+        createElement("div", { className: "dsh-obs-checks" },
+          createElement("label", { className: "dsh-obs-cfgline" },
+            createElement("input", {
+              type: "checkbox",
+              checked: attachCfg.hideDir,
+              onChange: (e) => { e.stopPropagation(); void applyAttachSettings({ hideAttachmentDir: e.target.checked === true }); },
+            }),
+            createElement("span", null, t("attachHideDir")),
+          ),
+          createElement("label", { className: "dsh-obs-cfgline" },
+            createElement("input", {
+              type: "checkbox",
+              checked: attachCfg.deleteOrphans,
+              onChange: (e) => { e.stopPropagation(); void applyAttachSettings({ deleteOrphanAttachments: e.target.checked === true }); },
+            }),
+            createElement("span", null, t("attachDeleteOrphans")),
+          ),
         ),
       ),
       body,
@@ -2734,7 +2794,8 @@
 
   /**
    * 关系图谱视图：全库 .md + [[双链]] + 标签（host `/obsidian/graph` 计算，
-   * 力导向布局在 src/graph.js）。可切到「局部」= 当前打开笔记的 2 跳邻居。
+   * 力导向布局在 src/graph.js）。「局部」= 当前打开笔记周围 1–5 跳邻居；
+   * 「聚焦」保留全库，只把镜头对准当前笔记。
    */
   function GraphView({ t, currentNote, onOpenNote, onClose }) {
     const [data, setData] = useState(null);
@@ -2906,28 +2967,46 @@
     const currentRel = currentNote && currentNote.rel ? currentNote.rel : null;
     const focusId = currentRel !== null ? `note:${currentRel}` : null;
     const localAvailable = data !== null && focusId !== null && data.nodes.some((node) => node.id === focusId);
+    // 全库数据只包一次：全库 ↔ 聚焦之间切换不重跑力导向布局（同一 seed 结果一样，重跑一遍纯属浪费）
+    const fullGraph = useMemo(
+      () => (data === null ? { nodes: [], edges: [] } : { nodes: data.nodes, edges: data.edges }),
+      [data],
+    );
     const shown = useMemo(() => {
-      if (data === null) return { nodes: [], edges: [] };
-      if (mode === "local" && localAvailable) {
+      if (mode === "local" && localAvailable && data !== null) {
         const sub = graphModule.localSubgraph(data, focusId, localDepth);
         return { nodes: sub.nodes, edges: sub.edges };
       }
-      return { nodes: data.nodes, edges: data.edges };
-    }, [data, mode, localAvailable, focusId, localDepth]);
+      return fullGraph;
+    }, [fullGraph, data, mode, localAvailable, focusId, localDepth]);
     const plan = useMemo(
       () => graphModule.layoutGraph(shown.nodes, shown.edges, { seed, maxNodes: 420 }),
       [shown, seed],
     );
 
-    // 打开 / 切换范围 / 重新布局后把整张图适配进画布
+    // 打开 / 切换范围 / 重新布局后摆好镜头：全库与局部把整张图适配进画布；
+    // 聚焦模式保留全库，但把镜头对准当前笔记：笔记和它的一跳邻居框进画面（不裁节点）。
     useEffect(() => {
       const el = wrapRef.current;
       if (!el || plan.nodes.length === 0) return;
       const w = el.clientWidth || 900;
       const h = el.clientHeight || 560;
+      if (mode === "focus") {
+        const framed = graphModule.focusViewport(plan, shown.edges, focusId, { width: w, height: h });
+        if (framed !== null) {
+          setTransform(framed);
+          return;
+        }
+      }
       const fit = Math.min((w - 30) / plan.width, (h - 30) / plan.height, 1);
       setTransform({ x: (w - plan.width * fit) / 2, y: (h - plan.height * fit) / 2, s: fit });
-    }, [plan, fitKey]);
+    }, [plan, fitKey, mode, focusId, shown.edges]);
+
+    // 当前笔记被关掉 / 从图里消失后，局部与聚焦都没有中心：退回全库，
+    // 否则会留下一个「按不动却亮着」的分段按钮。
+    useEffect(() => {
+      if (!localAvailable && (mode === "local" || mode === "focus")) setMode("global");
+    }, [localAvailable, mode]);
 
     const onWheel = useCallback((e) => {
       if (plan.nodes.length === 0) return;
@@ -3049,10 +3128,11 @@
             disabled: !localAvailable,
             title: localAvailable ? t("graphLocalHint") : t("graphNoNote"),
           }),
-          modeButton(t("graphFocus"), false, () => {
+          modeButton(t("graphFocus"), mode === "focus", () => {
             if (!localAvailable) return;
-            setMode("local");
-            setFitKey((v) => v + 1);
+            // 聚焦是独立模式（全库图 + 镜头对准当前笔记）：再点一次 = 重新居中
+            if (mode === "focus") setFitKey((v) => v + 1);
+            else setMode("focus");
           }, {
             disabled: !localAvailable,
             title: localAvailable ? t("graphFocusHint") : t("graphNoNote"),

package/src/graph.js

@@ -202,6 +202,57 @@ const graphModule = (() => {
   }
 
 
+  /**
+   * 「聚焦」模式的镜头：全库不裁剪，只把视口对准某篇笔记和它的一跳邻居。
+   *
+   * 和 localSubgraph 的分工：局部是「只留这块节点」，聚焦是「节点都在，镜头对准这块」。
+   * 输入是 layoutGraph 的布局坐标与画布像素尺寸，输出直接可用的 SVG 平移/缩放。
+   *
+   * @param plan - `layoutGraph()` 的返回值（nodes 带 x/y）。
+   * @param edges - 与 `plan.nodes` 对应的连线（`[{ source, target }]`）。
+   * @param focusId - 焦点节点 id（笔记节点是 `note:<rel>`）。
+   * @param viewport - `{ width, height }` 画布像素尺寸。
+   * @param options - `{ padding, maxScale }`：padding 为布局坐标里的留白（默认 80），
+   *   maxScale 限制推近倍数（默认 1.6，邻居很少时不至于糊脸）。
+   * @returns `{ x, y, s }`；焦点不在布局里时返回 null（调用方退回整图适配）。
+   */
+  function focusViewport(plan, edges, focusId, viewport, options = {}) {
+    const nodes = plan && Array.isArray(plan.nodes) ? plan.nodes : [];
+    const center = nodes.find((node) => node.id === focusId);
+    if (center === undefined) return null;
+    const near = new Set([focusId]);
+    for (const edge of edges ?? []) {
+      if (edge.source === focusId) near.add(edge.target);
+      else if (edge.target === focusId) near.add(edge.source);
+    }
+    let minX = center.x;
+    let maxX = center.x;
+    let minY = center.y;
+    let maxY = center.y;
+    for (const node of nodes) {
+      if (!near.has(node.id)) continue;
+      if (node.x < minX) minX = node.x;
+      if (node.x > maxX) maxX = node.x;
+      if (node.y < minY) minY = node.y;
+      if (node.y > maxY) maxY = node.y;
+    }
+    const padding = options.padding ?? 80;
+    const maxScale = options.maxScale ?? 1.6;
+    const width = viewport && Number.isFinite(viewport.width) ? viewport.width : 900;
+    const height = viewport && Number.isFinite(viewport.height) ? viewport.height : 560;
+    // 单点邻居（焦点没有连线）时包围盒是 0×0，+padding 后仍可算；max(1) 只为除零兜底
+    const boxW = Math.max(1, maxX - minX + padding * 2);
+    const boxH = Math.max(1, maxY - minY + padding * 2);
+    const raw = Math.min((width - 30) / boxW, (height - 30) / boxH, maxScale);
+    const scale = Math.max(0.18, raw);
+    return {
+      x: width / 2 - ((minX + maxX) / 2) * scale,
+      y: height / 2 - ((minY + maxY) / 2) * scale,
+      s: scale,
+    };
+  }
+
+
   /** POSIX 风格拼接 + 折叠 `.`/`..`（客户端兜底构建时与 host 同一套链接解析）。 */
   function joinPosix(dir, rel) {
     const parts = dir === "" ? [] : dir.split("/");
@@ -344,5 +395,5 @@ const graphModule = (() => {
     return [...tags];
   }
 
-  return { layoutGraph, localSubgraph, adjacency, rng, resolveGraphLink, buildGraphFromNotes, extractTags };
+  return { layoutGraph, localSubgraph, focusViewport, adjacency, rng, resolveGraphLink, buildGraphFromNotes, extractTags };
 })();

package/src/markdown.js

@@ -2,7 +2,8 @@
  * 轻量 Markdown 渲染器（无第三方依赖，纯 React.createElement），两个出口、
  * 两套块级能力，共同复用行内解析 renderInline（粗斜体/行内代码/链接/图片/双链）：
  *
- * 1) renderNumbered —— 笔记面板预览**实际使用**的渲染器（一行源码 = 一行 + 行号）。
+ * 1) renderNumbered —— 笔记面板预览**实际使用**的渲染器（一行源码 = 一行 + 行号节点；
+ *    面板只读态的 CSS 把这批行号收起来，编辑态的行号走 client 里的 editor gutter）。
  *    块级支持：引用（逐行、嵌套，不再吞行）、callout（类型/别名/标题，正文里的
  *    列表与标题）、代码围栏（```/~~~、info string、未闭合到文末，行号保留）、
  *    列表（无序/有序/嵌套，按实际缩进，tab=4）、任务列表（只读复选框）、
@@ -839,7 +840,8 @@ const renderMarkdownModule = (() => {
   }
 
   /**
-   * 行号预览模式（预览态「每行一个行标号」）：
+   * 行号预览模式（每个源码行一个行号节点；面板只读态用 CSS 隐藏行号，节点本身
+   * 还要撑住空行行高、承载 data-line 供思维导图跳行）：
    * 每个源码行渲染为一行 <div class="dsh-obs-md-row">，左侧行号 .dsh-obs-md-ln、
    * 内容 .dsh-obs-md-lc（行内 markdown 保留，且允许自然折行）。行号与源码行一一对应，
    * 不依赖固定宽度/不折行，长行折行也不影响后续行号对齐。选中映射（.dsh-obs-src 偏移）