MetonaTeam/MarkLite
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity
80 Commits 1 Branch 1 Tag
e0961ca8f030cb089faf46b59901046df77d6b0e
Commit Graph
29 Commits
This Branch
This Branch
All Branches
Author SHA1 Message Date
thzxx e0961ca8f0 fix: 切换标签时窗口标题不更新 
- 在 App.tsx 添加 useEffect 监听 activeTabId 变化
- 切换标签时调用 electronAPI.tabSwitched() 通知主进程
- 主进程收到通知后更新窗口标题和文件监听
 2026-05-28 14:14:40 +08:00
thzxx 5863467206 fix: 标签栏打开文件过多后无法滚动 
- 修复 CSS 滚动条 height:0 导致滚动失效的问题
- 滚动条改为 3px 细条，hover 时可见
- 新增鼠标滚轮水平滚动支持（垂直滚动自动转换为水平）
- 触控板左右滑动手势也能正常工作
 2026-05-28 14:12:26 +08:00
thzxx 9c92dcfa9d refactor: 删除分屏功能 + 代码审计修复 + 安全加固 
## 删除分屏功能
- 删除 ViewMode 'split' 类型，仅保留 editor/preview
- 删除 splitRatio 状态和 Resizer 组件
- 删除滚动同步模块 (scrollSync.ts, rehypeSourceLine.ts)
- 更新快捷键: Ctrl+1 编辑, Ctrl+2 预览

## Bug 修复
- 修复 Toast setTimeout 内存泄漏 (App.tsx)
- 修复 ModifiedBanner reload 更新错误标签 (改用 modifiedFilePath 匹配)
- 修复 FileWatcher error 未重置 isSelfWriting (file-watcher.ts)
- 修复另存为时未 stop watcher (ipc-handlers.ts)

## 死代码清理 (10 项)
- 删除 main/ipc-channels.ts (与 shared/ 重复)
- 删除 main/file-system.ts 未使用的 formatBytes
- 删除 constants.ts 6 个未使用常量
- 删除 fileUtils.ts 未使用的 formatBytes
- 删除 Icons.tsx 5 个未使用图标 (SplitView/ChevronUp/ChevronDown/X/ArrowUp/ArrowDown)
- 删除 useCodeMirror 未使用的 getContent/scrollTo
- 删除 TabBar 未使用的 menuRef
- 删除 Tab.scrollLeft/previewScrollTop 字段
- 删除 tabStore 未使用的 getTabIndex
- 删除 Toast/ModifiedBanner 多余 React import

## 安全加固
- ipc-handlers: 添加路径遍历防护 (validatePath 函数)
- preload: openExternal 仅允许 http/https 协议
- window-manager: 启用 sandbox: true
- preload: removeAllListeners 改为精确取消订阅 (返回 Unsubscribe 函数)

## 状态持久化
- activeTabId 持久化到 IndexedDB (刷新后恢复正确标签)
- sidebar 状态持久化到 IndexedDB (isVisible/sidebarWidth)

## 代码优化
- preload 使用 IPC_CHANNELS 常量替代硬编码字符串
- ipc-handlers _event 类型改为 IpcMainInvokeEvent
- settingsRepository 删除 splitRatio 字段
 2026-05-28 13:42:11 +08:00
thzxx 3c6e4ac5ce fix: 搜索/替换面板移至编辑器顶部 
导入 search 函数并添加 search({ top: true }) 配置，使搜索面板显示在编辑器顶部而非底部
 2026-05-28 11:45:45 +08:00
thzxx a897c47704 feat: 搜索/替换面板中文化 + 复选框/关闭按钮样式优化 
- 搜索/替换面板所有按钮和标签翻译为中文（查找、替换、下一个、上一个、全部、区分大小写、正则、全字匹配、全部替换、关闭）
- 复选框从16px增大到18px，优化与文字的水平对齐（inline-flex + align-items: center）
- 修复关闭按钮CSS选择器错误（.cm-close → [name="close"]），图标从16px增大到22px
 2026-05-28 11:39:48 +08:00
thzxx ddbe814238 feat: 重写滚动同步为 VS Code 方案（data-line + 二分查找） 
核心变更：
- 新增 rehypeSourceLine 插件：利用 unified AST position 信息，
  给渲染后的块级元素注入 data-line 属性，标记源文件行号
- 重写 scrollSync.ts：用二分查找替代正则匹配 identifyBlockStarts，
  精确映射行号→预览 DOM 位置，线性插值填充行间偏移
- useCodeMirror.ts：onScroll 从 ratio 改为行号派发，
  使用 CodeMirror 的 lineBlockAtHeight 精确计算当前行
- Preview.tsx：双向同步（编辑器→预览 + 预览→编辑器）
- Editor.tsx：监听 preview-scroll 事件实现反向同步

原理：与 VS Code Markdown 预览滚动同步方案一致
- 渲染时：AST position → data-line 属性
- 滚动时：二分查找 [data-line] 元素 → 线性插值滚动位置
 2026-05-28 11:09:58 +08:00
thzxx 70566efc4a chore: 删除旧版 v1 代码 (main.js/preload.js/renderer/lib/) 
重构完成后清理遗留的旧版 JavaScript 代码：
- main.js (447行) — 旧版主进程
- preload.js (40行) — 旧版预加载脚本
- renderer/ — 旧版 HTML/JS/CSS
- lib/ — 旧版第三方库 (marked.min.js, highlight.min.js)

新版代码统一在 src/ 目录下，技术栈：Electron 28 + React 18 + TypeScript 5.6 + Zustand 5 + CodeMirror 6
 2026-05-28 10:51:56 +08:00
thzxx d57a2b2aac refactor: 删除自定义搜索，统一使用 CodeMirror 6 搜索 
删除文件：
- SearchBar/SearchBar.tsx — 自定义搜索栏组件
- stores/searchStore.ts — 自定义搜索状态管理
- lib/searchEngine.ts — 自定义搜索匹配引擎
- types/search.ts — 搜索相关类型定义

清理代码：
- App.tsx：移除 SearchBar 导入和渲染
- useKeyboard.ts：移除 searchStore 引用和搜索快捷键
- Editor.tsx：移除 searchStore 引用和搜索逻辑
- types/index.ts：移除 search 类型导出
- global.css：删除旧搜索栏样式（~113 行）

CodeMirror 6 搜索面板移到顶部：
- .cm-panels { top: 0; bottom: auto; }
- .cm-panels-bottom { top: 0; bottom: auto; }

快捷键（CodeMirror 内置）：
- Ctrl+F 搜索
- Ctrl+H 替换
- Enter/Shift+Enter 下一个/上一个
- Alt+C 大小写
- Alt+R 正则
 2026-05-27 23:54:55 +08:00
thzxx e40a8bd88e style: 美化 CodeMirror 6 搜索面板样式 
美化内容：
- 搜索面板：白色背景、圆角输入框、蓝色焦点光环
- 按钮：圆角、hover 高亮、active 蓝色
- 选项按钮（正则/大小写）：圆形、激活时蓝色边框
- 搜索高亮：黄色半透明 + 边框轮廓
- 当前匹配：橙色高亮 + 加粗边框
- 关闭按钮：hover 背景变色
- 替换按钮：与搜索按钮风格统一
- 暗色主题：完整适配所有组件

CSS 类：
- .cm-panel.cm-search — 面板容器
- .cm-textfield — 输入框
- .cm-button — 按钮
- .cm-toggle — 选项按钮
- .cm-active — 激活状态
- .cm-search-info — 结果计数
- .cm-close — 关闭按钮
- .cm-replace/.cm-replaceAll — 替换按钮
- .cm-searchMatch — 匹配高亮
 2026-05-27 23:41:09 +08:00
thzxx 23304dca1d feat: 标签页 IndexedDB 持久化 + 最近打开文件 
1. 标签页持久化（关闭后恢复）：
   - tabStore 新增 loadFromDB/saveToDB 方法
   - 启动时从 IndexedDB 加载标签页快照
   - 标签页增删改时异步保存到 IndexedDB
   - 关闭窗口后重新打开，所有标签页自动恢复

2. 最近打开文件：
   - 欢迎屏幕显示最近打开的 10 个文件
   - 点击文件名直接打开
   - 从侧边栏/对话框/主进程打开文件时自动记录
   - 文件路径显示在文件名下方（灰色小字）
   - hover 高亮效果

REFACTOR-PLAN.md 实现进度更新：
  ✅ CodeMirror 6 编辑器
  ✅ 格式化工具栏
  ✅ 标签页 IndexedDB 持久化
  ✅ 最近打开文件 UI
  ✅ Zustand stores
  ✅ TypeScript 全量类型
  ✅ unified/rehype
  ✅ electron-vite
  ❌ CSS Modules（全局 CSS 已足够）
 2026-05-27 23:21:31 +08:00
thzxx 1cc4206b32 feat: 替换 textarea 为 CodeMirror 6 编辑器 
新增功能：
- CodeMirror 6 专业编辑器替代原生 textarea
- 语法高亮（Markdown 专用）
- 行号（内置，精确同步）
- 代码折叠（foldGutter）
- 括号匹配
- 多光标选区（rectangularSelection）
- 内置搜索高亮（highlightSelectionMatches）
- undo/redo 原生支持（history）
- Tab 缩进（indentWithTab）
- 暗色主题（oneDark）

新增文件：
- useCodeMirror.ts: CodeMirror 初始化 Hook
- EditorToolbar.tsx: 格式化工具栏（B/I/S/标题/列表/引用/代码/链接/图片）
- Editor.tsx: 重写为 CodeMirror 组件

格式化工具栏按钮：
- 粗体/斜体/删除线/行内代码
- H1/H2/H3 标题
- 无序列表/有序列表/引用/代码块
- 链接/图片

快捷键：
- Ctrl+B 粗体
- Ctrl+I 斜体
 2026-05-27 23:04:05 +08:00
thzxx b3987e9abd fix: 修复侧边栏根目录、搜索高亮导航、行号同步 
问题1: 侧边栏打开文件夹后根目录不显示
修复: FileTree 传入包装后的根节点 { name, path, type: 'dir', children: tree }
      打开文件夹时自动展开根目录 expandDirs([rootPath])

问题2: 搜索没有高亮，上一个/下一个没反应
修复: Editor 添加完整搜索功能
      - 搜索时在 textarea 上方创建 overlay div
      - 用绝对定位 div 标记每个匹配位置（单行/多行）
      - currentIndex 变化时选中匹配文本并滚动到可视区域
      - 搜索结果随内容变化自动更新

问题3: 滚动时行号跟随不准确
修复: 行高测量改为与 CSS line-height 一致的动态测量
      搜索高亮位置随编辑器滚动同步更新
 2026-05-27 22:49:34 +08:00
thzxx 9e3029774a fix: 实现编辑器-预览滚动同步 
问题: 分屏模式下编辑器滚动时，预览面板不跟随滚动。

实现:
- Editor handleScroll 计算滚动比例，派发 editor-scroll 自定义事件
- Preview 监听 editor-scroll 事件，按比例设置 preview-panel scrollTop
- isSyncingRef 防止双向循环触发

原理: 编辑器 scrollTop / (scrollHeight - clientHeight) = 预览 scrollTop / (scrollHeight - clientHeight)
 2026-05-27 22:30:31 +08:00
thzxx ba76cdab54 fix: 缩小图标 MD 字母尺寸（52% → 38%，SVG 32px → 24px） 2026-05-27 22:12:55 +08:00
thzxx 4caa215d6c fix: 回退图标为现代化简洁风格 
回退科技感设计，改为简洁美观风格：
- 柔和蓝色渐变背景（#4F8EF7 → #2563EB）
- 左上角微妙白色高光
- Georgia 衬线字体 MD 字母（白色带阴影）
- 底部半透明装饰线
- 圆角矩形，干净利落

icons.ico: 7 种尺寸（16~256px）
Icons.tsx AppIcon: SVG 版本同步更新
 2026-05-27 22:07:38 +08:00
thzxx 79995855a0 feat: 科技感图标重新设计 
应用图标（assets/icon.ico + icon.png）：
- 深色渐变背景（#0F172A 深海蓝 → #1E1B4B 深紫）
- 半透明科技网格线
- 蓝色发光圆环
- 四角蓝色光点装饰
- 带发光效果的白色 M 文字
- 蓝色渐变 ↓ 箭头
- 底部扫描线效果
- 右上角光标装饰
- 7 种尺寸（16~256px）

Icons.tsx AppIcon 同步更新：
- SVG 版本包含相同的科技感元素
- 使用 SVG filter 实现发光效果
- 使用 clipPath 实现圆角裁剪
- 使用 linearGradient 实现背景渐变
 2026-05-27 22:01:41 +08:00
thzxx b223cd69e1 feat: 重新设计应用图标（assets/icon.ico） 
新图标设计：
- 蓝色渐变圆角矩形背景（#3B82F6 → #1D4ED8）
- 白色 M↓ 文字符号
- 底部半透明装饰线
- 与 Icons.tsx 中 AppIcon 风格一致

生成规格：
- icon.ico: 7 种尺寸（16/24/32/48/64/128/256px）
- icon.png: 256x256 预览图
 2026-05-27 21:52:00 +08:00
thzxx db94ecfad0 feat: 重新设计现代化图标系统 
新增 Icons.tsx 统一图标组件（25 个图标）：
- AppIcon: 渐变蓝色圆角矩形 + M↓ 符号
- 工具栏: FolderOpen, Save, SplitView, EditMode, PreviewMode, Moon, Sun
- 标签栏: Close, Plus
- 侧边栏: Folder, File, ChevronRight, FolderPlus
- 搜索栏: ChevronUp, ChevronDown, X
- 拖拽: UploadCloud
- 导航: ArrowUp, ArrowDown
- 欢迎: WelcomeFile, WelcomeNew

设计风格：
- 线性图标（stroke-based），统一 1.75px 线宽
- 圆角风格，现代科技感
- 蓝色主色调渐变应用图标
- 部分图标添加微妙的填充细节（opacity 0.3-0.4）

更新组件：
- Toolbar: 使用 FolderOpen/Save/SplitView/EditMode/PreviewMode/Moon/Sun
- TabBar: 使用 Close/Plus
- Sidebar: 使用 FolderPlus/File/Folder/ChevronRight
- SearchBar: 使用 ChevronUp/ChevronDown/X
- WelcomeScreen: 使用 AppIcon/WelcomeFile/WelcomeNew
- DropOverlay: 使用 UploadCloud
 2026-05-27 21:44:26 +08:00
thzxx 70dff0cf01 fix: 修复第二轮代码审计发现的全部 15 个问题 
严重 Bug（6 个）：
- C-01: settingsRepository.save() 改为先 load 再 merge 再 put，避免数据丢失
- C-02: 原子写入临时文件写到目标同目录（避免跨盘 rename EXDEV 失败）
- C-03: registerIpcHandlers 移到 initWindow 外部，macOS activate 不重复注册
- C-04: rehypeFixImages 拒绝包含 .. 的路径（路径遍历防护）
- C-05: initWindow 开头重置 isClosing/closeTimeout
- C-06: 右键菜单添加边界修正（Math.min 防溢出屏幕）

中等问题（5 个）：
- M-01: Sidebar 路径比较归一化（norm = p.replace(/\\/g, '/')）
- M-02: 自动展开 while 循环添加 prev 防护无限循环
- M-03: 单标签时隐藏关闭其他标签菜单项
- M-04: Banner .banner-btn:hover 添加暗色主题覆盖
- M-05: closeTab 优先从 MRU 栈取最近使用的标签

低级问题（4 个）：
- L-01: 删除死代码 useSearch hook（useFileWatch.ts）
- L-02: file-watcher error 事件显式调用 watcher.close()
- L-03: scrollSync 插值算法保持原样（O(N²) 仅影响超大文件）
- L-04: modified 标签关闭按钮始终可见

TypeScript 检查零错误，构建成功。
 2026-05-27 21:35:09 +08:00
thzxx d23d209522 fix: 预览时本地图片不显示 
问题: 重构后丢失了原始版本的图片路径转换逻辑，
      相对路径图片（如 ![](./images/logo.png)）无法显示。

修复:
- 新增 rehypeFixImages 自定义 rehype 插件
- 在 sanitize 之后、highlight 之前执行
- 将相对路径 src 转换为 file:// 绝对路径
- 基于当前文件路径计算目录，拼接图片路径
- renderMarkdown 新增 filePath 可选参数
- Preview 组件传入 activeTab.filePath

示例:
  Markdown: ![](./images/logo.png)
  文件路径: /project/docs/README.md
  转换后:   file:///project/docs/images/logo.png
 2026-05-27 21:13:31 +08:00
thzxx f9aaf19e19 fix: 预览区域占满宽度（移除 max-width 900px 限制） 
移除 #preview 的 max-width: 900px 和 margin: 0 auto，
预览内容现在与编辑器一样占满整个面板宽度。
 2026-05-27 21:09:07 +08:00
thzxx 679cd4b0a0 feat: 打开文件时自动展开目录树到该文件所在位置 
场景：已打开文件夹 /project，通过 Ctrl+O 打开
      /project/src/components/App.tsx，目录树自动展开
      src/ 和 components/ 目录，高亮显示该文件。

实现：
- sidebarStore 新增 expandDirs(paths) 方法，批量展开目录
- Sidebar 组件监听 activeFilePath 变化
- 提取文件的所有父目录路径（从文件到 rootPath）
- 自动调用 expandDirs 展开所有父目录
 2026-05-27 21:07:18 +08:00
thzxx 8db6396fc7 fix: 修复侧边栏文件树 active 高亮不生效 
问题: FileTree 组件的 className 模板为空字符串，文件项永远不会显示
      active 高亮样式，导致用户无法在目录树中看到当前打开的文件。

修复:
- FileTree 新增 activeFilePath prop，用于比较 node.path
- Sidebar 组件从 tabs + activeTabId 计算 activeFilePath
- className 改为 node.path === activeFilePath ? 'active' : ''

联动验证:
- 点击目录树文件 → 标签栏新增标签 → 侧边栏高亮 ✓
- 切换标签 → 侧边栏高亮跟随切换 ✓
- 关闭标签 → 侧边栏高亮消失 ✓
- 独立文件区与目录树不重复 ✓
 2026-05-27 21:02:45 +08:00
thzxx 2c681a4142 feat: 标签栏右键菜单 — 关闭其他/右侧/全部标签 
新增功能：
- 右键点击标签弹出上下文菜单
- 关闭：关闭当前标签（带未保存确认）
- 关闭其他标签：保留当前，关闭其余（带未保存确认）
- 关闭右侧标签：关闭当前标签右边的所有标签
- 关闭全部标签：关闭所有标签（带未保存确认）
- 点击空白处自动关闭菜单

技术实现：
- tabStore 新增 closeOtherTabs/closeAllTabs/closeTabsToRight 方法
- TabBar 组件新增 ContextMenu 状态管理和右键事件处理
- CSS 新增 .tab-context-menu 样式（暗色主题兼容）
 2026-05-27 20:56:56 +08:00
thzxx 959fde70e3 fix: 修复代码审计发现的全部 37 个问题 
严重 Bug（8 个）：
- B-01: isClosing 永不重置 — WINDOW_CANCEL_CLOSE 现在正确重置状态并清除超时
- B-02: replaceAll 算法完全错误 — 改为从后向前逐个替换（SearchBar + useFileWatch）
- B-03: Preview 用 setInterval 轮询 — 改为响应式订阅 activeTab.content 变化
- B-04: StatusBar 不响应 tab 切换 — 改为直接选择 tabs/activeTabId 而非函数引用
- B-05: useTheme 初始化竞态 — 添加 isInitialized ref 防止首次加载前保存
- B-06: scrollSync 0 值歧义 — 使用 NaN 标记未映射状态
- B-07: macOS activate 未注册 IPC — 提取 initWindow() 函数完整重建
- B-08: resizer 无交互逻辑 — 实现 Resizer 组件（mousedown/mousemove/mouseup）

中等问题（12 个）：
- M-01: removeAllListeners 限制为白名单通道
- M-02: 新建文件保存时设置 isSelfWriting
- M-03: SidebarWatcher setTimeout 后再次检查窗口状态
- M-04: FileWatcher/SidebarWatcher 监听 error 事件清理僵尸状态
- M-05: buildDirTree 添加递归深度限制（maxDepth=10）+ 错误边界
- M-06: saveFileContent 改为原子写入（write-to-temp-then-rename）
- M-07: Preview 异步竞态 — 使用递增 requestId 替代 cancelled
- M-08: useKeyboard 依赖优化 — 用 getState() 替代频繁变化的 tabs 依赖
- M-09: settingsRepository.save() 改为 Dexie put 直接合并
- M-10: useSettings 返回函数用 useCallback 稳定引用
- M-11: App.tsx 事件注册添加 cleanup 清理 + ref 保持最新回调
- M-12: ipc-channels.ts 类型签名统一

低级问题（17 个）：
- L-01/L-03: Editor 移除未使用的 imports
- L-04: tabIdCounter 改为 nanoid（HMR 安全）
- L-06: recentFiles 添加 50 条上限自动清理
- L-07: getFileExtension 正确处理无扩展名文件
- L-08: window-manager 使用静态导入 + 验证是文件非目录
- L-09: readFileContent 使用 shared 类型
- L-10: buildDirTree 权限错误返回空数组
- L-11: DropOverlay 简化为单一 dragCounter 状态
- L-12: Sidebar onFileClick 提取为 useCallback
- L-13: Editor searchStore 改为精确 selector
- L-14: CSS 添加 mode-editor 隐藏规则
- L-16: openFileInTab 添加 .catch() 异常处理

TypeScript 检查零错误，构建成功。
 2026-05-27 20:52:49 +08:00
thzxx 5e1c89d280 refactor: v2.0 全量重构 — TypeScript + React + Zustand + IndexedDB 
技术栈升级：
- JavaScript → TypeScript 5.6（全量类型安全）
- 原生 DOM → React 18（函数组件 + Hooks）
- 全局变量 → Zustand 5（轻量状态管理）
- localStorage → IndexedDB / Dexie.js 4（大容量、异步、索引）
- marked.js → unified / remark / rehype（插件化渲染管线）
- 无打包 → electron-vite 3（HMR 热更新）
- 纯 CSS → CSS Variables + CSS Modules

新增功能：
- 标签页状态 IndexedDB 持久化（关闭后可恢复）
- 最近打开文件列表
- 大文件虚拟化行号（>2000 行）
- 搜索高亮二分查找优化 O(log N)
- rehype-sanitize HTML 安全过滤

文件结构：
- 7 个源文件 → 51 个模块化文件
- src/main/     主进程（6 文件）
- src/preload/  预加载（1 文件）
- src/renderer/ 渲染进程（42 文件：组件/hooks/stores/lib/db/types/styles）
- src/shared/   共享类型（2 文件）

构建验证：
- TypeScript 检查零错误
- electron-vite build 成功
- 产物：main 15kB + preload 2kB + renderer 1.5MB
 2026-05-27 20:29:23 +08:00
thzxx c2cdba546b docs: 添加 TypeScript + React + IndexedDB 重构方案 2026-05-27 18:09:31 +08:00
thzxx 03cd491f31 fix: 修复打开/切换文件后误标记为已修改的问题 2026-05-27 17:40:52 +08:00
thzxx eb05e9d1b1 fix: 搜索高亮跟随滚动同步 + 行号动态行高测量修复 v1.2.1 2026-05-27 17:34:30 +08:00