From 4e63870180e839fdb604855cb70f6d025a7cff83 Mon Sep 17 00:00:00 2001
From: thzxx <1440196015@qq.com>
Date: Fri, 24 Jul 2026 16:10:51 +0800
Subject: [PATCH] =?UTF-8?q?release:=20v0.1.12=20=E2=80=94=20accessibility,?=
 =?UTF-8?q?=20Zen=20mode,=20scroll=20sync=20v2,=20shortcutHelp=20plugin?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

feat(a11y): toolbar keyboard navigation (Arrow keys, Home, End)
feat(a11y): aria-live region for screen reader announcements on mode change
feat(a11y): enhance focus-visible style (outline-offset: 2px, hide on mouse focus)

feat(core): Zen mode (editor.toggleZen() / exec('zen'))
- Toggle with Ctrl+Shift+Z shortcut concept
- Auto-hide toolbar and statusbar, mouse to top edge reveals toolbar
- Centered editor pane with max-width constraint

feat(core): heading-aware scroll sync v2
- Sync preview scroll to nearest heading before cursor position
- Falls back to proportional sync when no headings found

feat(core): Word wrap toggle (editor.toggleWordWrap() / setWordWrap(bool))

feat(plugins): shortcutHelp preset plugin
- Press '?' to open keyboard shortcuts overlay panel
- Lists built-in + user-registered shortcuts
- Click overlay or press Escape to close

style: Zen mode CSS, sr-only class, focus-visible refinement

test: 3 new tests for Zen mode, WordWrap, shortcutHelp (535 total)

chore: bump version 0.1.11 → 0.1.12 across all files
---
 README.md          |   2 +-
 package.json       |   2 +-
 site/demo.html     |   8 +--
 site/docs.html     |   4 +-
 src/animations.js  |   2 +-
 src/constants.js   |   6 +-
 src/core.js        | 172 +++++++++++++++++++++++++++++++++++++++++----
 src/i18n.js        |   2 +-
 src/icons.js       |   2 +-
 src/index.js       |   4 +-
 src/locales.js     |   2 +-
 src/parser.js      |   2 +-
 src/plugins.js     |  92 +++++++++++++++++++++++-
 src/styles.js      |  15 +++-
 src/themes.js      |   2 +-
 src/utils.js       |   2 +-
 tests/core.test.js |  50 +++++++++++++
 types/index.d.ts   |   2 +-
 18 files changed, 337 insertions(+), 34 deletions(-)

diff --git a/README.md b/README.md
index 7be3c61..59e66d8 100644
--- a/README.md
+++ b/README.md
@@ -2,7 +2,7 @@
 
 > 轻量、零依赖、精致美观的 Markdown Editor 库。单文件，开箱即用，中文优先。
 
-[![npm version](https://img.shields.io/badge/version-0.1.11-blue.svg)](https://www.npmjs.com/package/@metona-team/metona-editor)
+[![npm version](https://img.shields.io/badge/version-0.1.12-blue.svg)](https://www.npmjs.com/package/@metona-team/metona-editor)
 [![license](https://img.shields.io/badge/license-MIT-green.svg)](./LICENSE)
 [![tests](https://img.shields.io/badge/tests-532%20passed-brightgreen.svg)](./tests)
 [![coverage](https://img.shields.io/badge/coverage-97%25-brightgreen.svg)](./tests)
diff --git a/package.json b/package.json
index be5ca17..6dd51d9 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@metona-team/metona-editor",
-  "version": "0.1.11",
+  "version": "0.1.12",
   "description": "轻量、零依赖、精致美观的 Markdown Editor 库。单文件，开箱即用。",
   "type": "module",
   "main": "dist/metona-editor.js",
diff --git a/site/demo.html b/site/demo.html
index daacbed..739d5e7 100644
--- a/site/demo.html
+++ b/site/demo.html
@@ -4,7 +4,7 @@
 <meta charset="utf-8"/>
 <meta name="viewport" content="width=device-width, initial-scale=1"/>
 <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>📝</text></svg>"/>
-<title>MetonaEditor v0.1.11 — 在线演示</title>
+<title>MetonaEditor v0.1.12 — 在线演示</title>
 <style>
   *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
   :root {
@@ -201,7 +201,7 @@
 <header class="header">
   <h1><span class="grad">Metona</span>Editor</h1>
   <div class="badges">
-    <span class="badge">v0.1.11</span>
+    <span class="badge">v0.1.12</span>
     <span class="badge">零依赖</span>
     <span class="badge">532 tests</span>
     <span class="badge">MIT</span>
@@ -291,7 +291,7 @@
 </div>
 
 <footer class="footer">
-  MetonaEditor v0.1.11 ·
+  MetonaEditor v0.1.12 ·
   <a href="index.html">首页</a> ·
   <a href="docs.html">API 文档</a> ·
   <a href="https://git.metona.cn/MetonaTeam/MetonaEditor" target="_blank" rel="noopener">源码仓库</a> ·
@@ -329,7 +329,7 @@
     '',
     '| 版本 | 日期 | 测试数 |',
     '| :--- | :---: | ---: |',
-    '| v0.1.11 | 2026-07 | 532+ |',
+    '| v0.1.12 | 2026-07 | 532+ |',
     '| v0.1.6 | 2026-07 | 521 |',
     '| v0.1.5 | 2026-07 | 499 |',
     '',
diff --git a/site/docs.html b/site/docs.html
index 8e3bdf8..8e08483 100644
--- a/site/docs.html
+++ b/site/docs.html
@@ -176,7 +176,7 @@
 
 <header class="docs-header">
   <h1><span class="grad">文档</span></h1>
-  <p class="sub">MetonaEditor v0.1.11 完整 API、配置与使用指南</p>
+  <p class="sub">MetonaEditor v0.1.12 完整 API、配置与使用指南</p>
 </header>
 
 <div class="container">
@@ -619,7 +619,7 @@ i18nUtils<span class="c-punc">.</span><span class="c-fn">formatDate</span><span
 
 <footer>
   <div class="container">
-    MetonaEditor v0.1.11 · <a href="https://git.metona.cn/MetonaTeam/MetonaEditor" target="_blank" rel="noopener">源码仓库</a> · MIT License
+    MetonaEditor v0.1.12 · <a href="https://git.metona.cn/MetonaTeam/MetonaEditor" target="_blank" rel="noopener">源码仓库</a> · MIT License
   </div>
 </footer>
 
diff --git a/src/animations.js b/src/animations.js
index 91d4745..59f0c2e 100644
--- a/src/animations.js
+++ b/src/animations.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor Animations - 动画管理
  * @module animations
- * @version 0.1.11
+ * @version 0.1.12
  * @description 动画注册与管理（当前为 CSS 动画元数据管理，供未来扩展如 Toast/通知组件的进出场动画使用；
  *              内置 7 种预设动画曲线配置；编辑器核心当前未直接调用此模块）
  */
diff --git a/src/constants.js b/src/constants.js
index 94f4e28..34db40d 100644
--- a/src/constants.js
+++ b/src/constants.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor Constants - 常量定义
  * @module constants
- * @version 0.1.11
+ * @version 0.1.12
  * @description 默认配置、主题、动画、工具栏等常量
  */
 
@@ -56,6 +56,10 @@ export const DEFAULTS = Object.freeze({
   outline: false,
   // 自动括号闭合（v0.1.7）
   autoBrackets: true,
+  // Zen 专注模式（v0.1.12）
+  zenMode: false,
+  // 自动换行（v0.1.12）
+  wordWrap: true,
   // 主题：light / dark / auto / warm / 自定义
   theme: 'auto',
   // 国际化
diff --git a/src/core.js b/src/core.js
index 455dae0..efc5d01 100644
--- a/src/core.js
+++ b/src/core.js
@@ -1,10 +1,11 @@
 /**
  * MetonaEditor Core - 编辑器核心
  * @module core
- * @version 0.1.11
+ * @version 0.1.12
  * @description MarkdownEditor 类实现：DOM 构建、事件、渲染、历史栈、选区操作、模式切换
  * v0.1.6: 插件依赖拓扑排序、实例 i18n、快捷键/工具栏定制、右键菜单、Toast
  * v0.1.7: 行号装订线、自动格式化、括号自动闭合、拖放、大纲面板
+ * v0.1.12: 工具栏键盘导航、aria-live、Zen模式、滚动同步v2、WordWrap
  */
 
 import { generateId, escapeHTML, isBrowser } from './utils.js';
@@ -110,6 +111,8 @@ class MarkdownEditor {
     this._contextMenuItems = [];   // v0.1.6: 右键菜单项
     this._customActions = {};      // 自定义工具栏动作
     this._outlineTimer = null;     // 大纲防抖计时器
+    this._zenMode = false;         // v0.1.12: Zen 模式
+    this._wordWrap = true;         // v0.1.12: 自动换行
 
     // 渲染函数：自定义覆盖内置解析器
     this._renderFn = (typeof this.config.render === 'function') ? this.config.render : parseMarkdown;
@@ -139,6 +142,8 @@ class MarkdownEditor {
 
     this._buildToolbar();
     this._updateModeButtons();  // 初始化按钮状态
+    this._bindToolbarKeyboard(); // v0.1.12: 键盘导航
+    this._initAriaLive();        // v0.1.12: 屏幕阅读器
     this._bindEvents();
 
     // 初始内容
@@ -352,17 +357,11 @@ class MarkdownEditor {
     ta.addEventListener('keyup', onCursorActivity);
 
     const onScroll = () => {
-      // 同步行号滚动（始终同步，不限于分屏模式）
-      if (this.gutter) {
-        this.gutter.scrollTop = ta.scrollTop;
+      if (this.gutter) this.gutter.scrollTop = ta.scrollTop;
+      // v0.1.12: 标题感知同步
+      if (this.config.syncScroll && this._mode === 'split') {
+        this._syncScrollByHeading();
       }
-      // 同步预览滚动（仅分屏模式）
-      if (!this.config.syncScroll || this._mode !== 'split') return;
-      const max = ta.scrollHeight - ta.clientHeight;
-      if (max <= 0) return;
-      const ratio = ta.scrollTop / max;
-      const pmax = this.previewPane.scrollHeight - this.previewPane.clientHeight;
-      this.previewPane.scrollTop = ratio * pmax;
     };
     ta.addEventListener('scroll', onScroll);
 
@@ -913,6 +912,8 @@ class MarkdownEditor {
       split: () => this.setMode('split'),
       preview: () => this.setMode('preview'),
       fullscreen: () => this.toggleFullscreen(),
+      zen: () => this.toggleZen(),             // v0.1.12
+      wordwrap: () => this.toggleWordWrap(),   // v0.1.12
     };
     const fn = actions[action];
     if (fn) { fn.apply(this, args); return this; }
@@ -1059,6 +1060,7 @@ class MarkdownEditor {
     if (this.textarea) this.textarea.scrollTop = taScroll;
     if (this.previewPane) this.previewPane.scrollTop = pvScroll;
     this._emit('modeChange', mode);
+    this._announce(`${i18nT(mode) || mode} ${i18nT('mode') || 'mode'}`); // v0.1.12
     if (typeof this.config.onModeChange === 'function') {
       try { this.config.onModeChange(mode, this); } catch (e) { console.error(e); }
     }
@@ -1126,7 +1128,153 @@ class MarkdownEditor {
     return this;
   }
 
-  // ============ 字数统计 ============
+  // ============ Zen 模式（v0.1.12） ============
+
+  toggleZen() {
+    this._zenMode = !this._zenMode;
+    if (this.el) this.el.classList.toggle('me-zen', this._zenMode);
+
+    // 鼠标移到顶部时显示工具栏
+    if (this._zenMode && this.toolbarEl) {
+      this._zenMouseHandler = (e) => {
+        this.toolbarEl.style.opacity = e.clientY < 40 ? '1' : '0';
+        this.toolbarEl.style.pointerEvents = e.clientY < 40 ? 'auto' : 'none';
+      };
+      this.toolbarEl.style.transition = 'opacity 0.2s';
+      this.toolbarEl.style.opacity = '0';
+      this.toolbarEl.style.pointerEvents = 'none';
+      document.addEventListener('mousemove', this._zenMouseHandler);
+      // 隐藏状态栏
+      if (this.statusEl) this.statusEl.style.display = 'none';
+    } else {
+      if (this._zenMouseHandler) {
+        document.removeEventListener('mousemove', this._zenMouseHandler);
+        this._zenMouseHandler = null;
+      }
+      if (this.toolbarEl) {
+        this.toolbarEl.style.opacity = '';
+        this.toolbarEl.style.pointerEvents = '';
+        this.toolbarEl.style.transition = '';
+      }
+      if (this.statusEl) this.statusEl.style.display = '';
+    }
+
+    this._emit('zenChange', this._zenMode);
+    return this;
+  }
+
+  isZen() { return this._zenMode; }
+
+  // ============ Word Wrap（v0.1.12） ============
+
+  toggleWordWrap() {
+    this._wordWrap = !this._wordWrap;
+    if (this.textarea) {
+      this.textarea.style.whiteSpace = this._wordWrap ? 'pre-wrap' : 'pre';
+    }
+    return this;
+  }
+
+  setWordWrap(on) {
+    this._wordWrap = !!on;
+    if (this.textarea) {
+      this.textarea.style.whiteSpace = this._wordWrap ? 'pre-wrap' : 'pre';
+    }
+    return this;
+  }
+
+  isWordWrap() { return this._wordWrap; }
+
+  // ============ 工具栏键盘导航（v0.1.12 无障碍） ============
+
+  _bindToolbarKeyboard() {
+    if (!this.toolbarEl) return;
+
+    const onKeydown = (e) => {
+      const btns = [...this.toolbarEl.querySelectorAll('.me-btn:not(:disabled)')];
+      if (!btns.length) return;
+      const idx = btns.indexOf(document.activeElement);
+      if (idx === -1) return;
+
+      if (e.key === 'ArrowRight') {
+        e.preventDefault();
+        const next = (idx + 1) % btns.length;
+        btns[next].focus();
+      } else if (e.key === 'ArrowLeft') {
+        e.preventDefault();
+        const prev = (idx - 1 + btns.length) % btns.length;
+        btns[prev].focus();
+      } else if (e.key === 'Home') {
+        e.preventDefault();
+        btns[0].focus();
+      } else if (e.key === 'End') {
+        e.preventDefault();
+        btns[btns.length - 1].focus();
+      }
+    };
+
+    this.toolbarEl.addEventListener('keydown', onKeydown);
+    this._cleanups.push(() => this.toolbarEl.removeEventListener('keydown', onKeydown));
+  }
+
+  // ============ aria-live 区域（v0.1.12 无障碍） ============
+
+  _initAriaLive() {
+    if (!this.el) return;
+    const live = document.createElement('div');
+    live.className = 'me-sr-only';
+    live.setAttribute('aria-live', 'polite');
+    live.setAttribute('aria-atomic', 'true');
+    this.el.appendChild(live);
+    this._ariaLive = live;
+  }
+
+  _announce(msg) {
+    if (this._ariaLive) {
+      this._ariaLive.textContent = '';
+      requestAnimationFrame(() => { this._ariaLive.textContent = msg; });
+    }
+  }
+
+  // ============ 滚动同步 v2 — 标题感知（v0.1.12） ============
+
+  _syncScrollByHeading() {
+    if (!this.config.syncScroll || this._mode !== 'split') return;
+    const ta = this.textarea;
+    if (!ta) return;
+
+    // 找到光标所在位置最近的标题
+    const pos = ta.selectionStart;
+    const before = this._value.substring(0, pos);
+    const headings = [...before.matchAll(/^(#{1,6})\s+(.+)$/gm)];
+    if (!headings.length) {
+      // 无标题，回退到比例同步
+      const max = ta.scrollHeight - ta.clientHeight;
+      if (max <= 0) return;
+      const ratio = ta.scrollTop / max;
+      const pmax = this.previewPane.scrollHeight - this.previewPane.clientHeight;
+      this.previewPane.scrollTop = ratio * pmax;
+      return;
+    }
+
+    // 取最后一个标题（光标之前最近的标题）
+    const lastH = headings[headings.length - 1];
+    const headingText = lastH[2].trim();
+
+    // 在预览区查找对应标题元素
+    const previewEls = this.previewEl.querySelectorAll('h1, h2, h3, h4, h5, h6');
+    for (const el of previewEls) {
+      if (el.textContent.trim() === headingText) {
+        el.scrollIntoView({ block: 'start', behavior: 'instant' });
+        return;
+      }
+    }
+
+    // fallback
+    const max = ta.scrollHeight - ta.clientHeight;
+    if (max <= 0) return;
+    this.previewPane.scrollTop = (ta.scrollTop / max) * (this.previewPane.scrollHeight - this.previewPane.clientHeight);
+  }
 
   _updateWordCount() {
     if (!this.config.wordCount || !this.statusEl) return;
diff --git a/src/i18n.js b/src/i18n.js
index 4c1cf85..84b0f1f 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor i18n — 国际化管理（增强版）
  * @module i18n
- * @version 0.1.11
+ * @version 0.1.12
  * @description 多语言支持、实例级语言隔离、复数规则、动态加载、命名空间
  *
  * v0.1.6 增强：
diff --git a/src/icons.js b/src/icons.js
index 18e7971..42422c5 100644
--- a/src/icons.js
+++ b/src/icons.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor Icons — 工具栏图标SVG定义
  * @module icons
- * @version 0.1.11
+ * @version 0.1.12
  * @description 工具栏格式化按钮 SVG 图标
  */
 
diff --git a/src/index.js b/src/index.js
index 2f51941..2d33293 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor - 轻量级 Markdown Editor 库
  * @module metona-editor
- * @version 0.1.11
+ * @version 0.1.12
  * @author thzxx
  * @description 现代化、零依赖、易扩展、易维护、易使用的 Markdown 编辑器库。单文件，开箱即用。
  * @license MIT
@@ -29,7 +29,7 @@ import { animationUtils } from './animations.js';
 import { DEFAULTS, ICONS, THEMES, EDIT_MODES, DEFAULT_TOOLBAR, TOOLBAR_ACTIONS } from './constants.js';
 
 // 版本信息
-const VERSION = '0.1.11';
+const VERSION = '0.1.12';
 
 /**
  * 全局默认插件队列
diff --git a/src/locales.js b/src/locales.js
index 547320f..dcdbf51 100644
--- a/src/locales.js
+++ b/src/locales.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor Locales — 国际化翻译数据
  * @module locales
- * @version 0.1.11
+ * @version 0.1.12
  * @description 内置 zh-CN / en-US 完整翻译
  */
 
diff --git a/src/parser.js b/src/parser.js
index d1e3800..70024cf 100644
--- a/src/parser.js
+++ b/src/parser.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor Parser - 轻量 Markdown 解析器（增强版）
  * @module parser
- * @version 0.1.11
+ * @version 0.1.12
  * @description 自研零依赖 Markdown 解析器，覆盖 CommonMark 子集 + GFM 扩展
  *
  * v0.1.4 增强：
diff --git a/src/plugins.js b/src/plugins.js
index 8a2939b..0b50667 100644
--- a/src/plugins.js
+++ b/src/plugins.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor Plugins — 插件系统 v2
  * @module plugins
- * @version 0.1.11
+ * @version 0.1.12
  * @description 插件管理器 + 预设插件 + 依赖/生命周期/异步/卸载
  *
  * v0.1.6 增强：
@@ -510,6 +510,95 @@ const imagePastePlugin = {
   },
 };
 
+/**
+ * 快捷键帮助插件（v0.1.12）
+ * 按 ? 弹出快捷键列表面板
+ */
+const shortcutHelpPlugin = {
+  name: 'shortcutHelp',
+  version: '0.1.0',
+  description: '按 ? 查看快捷键列表',
+  priority: 200,
+
+  _onKeydown: null,
+  _panel: null,
+
+  install(editor) {
+    if (!editor || !editor.textarea || typeof document === 'undefined') return;
+
+    this._injectStyle();
+    this._onKeydown = (e) => {
+      // ? 键（Shift+/），且不在输入框中时
+      if (e.key === '?' && !e.ctrlKey && !e.metaKey && !e.altKey) {
+        e.preventDefault();
+        this._open(editor);
+      }
+      if (e.key === 'Escape' && this._panel) {
+        this._close();
+      }
+    };
+    editor.textarea.addEventListener('keydown', this._onKeydown);
+  },
+
+  _injectStyle() {
+    if (document.getElementById('me-shortcut-style')) return;
+    const style = document.createElement('style');
+    style.id = 'me-shortcut-style';
+    style.textContent = `.me-shortcut-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:50;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center}.me-shortcut-panel{background:var(--md-bg,#fff);border-radius:12px;padding:24px;max-width:560px;width:90%;max-height:80vh;overflow-y:auto;box-shadow:0 12px 40px rgba(0,0,0,0.3)}.me-shortcut-panel h3{font-size:16px;margin:0 0 16px;color:var(--md-text)}.me-shortcut-panel table{width:100%;border-collapse:collapse;font-size:13px}.me-shortcut-panel td{padding:6px 10px;border-bottom:1px solid var(--md-border)}.me-shortcut-panel td:first-child{font-family:var(--md-mono);font-size:12px;color:var(--md-accent);white-space:nowrap;width:40%}.me-shortcut-panel td:last-child{color:var(--md-text)}.me-shortcut-panel .me-shortcut-close{position:absolute;top:16px;right:20px;background:none;border:none;font-size:20px;cursor:pointer;color:var(--md-muted)}`;
+    document.head.appendChild(style);
+  },
+
+  _open(editor) {
+    if (this._panel) { this._close(); return; }
+
+    const builtin = [
+      ['Ctrl+B', '粗体'], ['Ctrl+I', '斜体'], ['Ctrl+U', '下划线'],
+      ['Ctrl+K', '链接'], ['Ctrl+E', '行内代码'],
+      ['Ctrl+1/2/3', '标题 H1/H2/H3'], ['Ctrl+Q', '引用'],
+      ['Ctrl+Z', '撤销'], ['Ctrl+Y / Ctrl+Shift+Z', '重做'],
+      ['Ctrl+S', '保存'], ['Ctrl+F', '查找'], ['Ctrl+H', '替换'],
+      ['Tab', '缩进'], ['Shift+Tab', '反缩进'],
+      ['Ctrl+Shift+T', 'Zen 模式演示快捷键'],
+      ['?', '显示/隐藏快捷键帮助'],
+    ];
+
+    const custom = (editor.getShortcuts && editor.getShortcuts()) || [];
+    const customRows = custom.map((s) => [s.combo, s.description || s.combo]);
+    const allRows = [...builtin, ...customRows];
+
+    let rows = '';
+    allRows.forEach(([combo, desc]) => {
+      rows += `<tr><td>${combo}</td><td>${desc}</td></tr>`;
+    });
+
+    const overlay = document.createElement('div');
+    overlay.className = 'me-shortcut-overlay';
+    overlay.innerHTML = `<div class="me-shortcut-panel"><h3>⌨️ 快捷键</h3><button class="me-shortcut-close">×</button><table>${rows}</table></div>`;
+    overlay.addEventListener('click', (e) => {
+      if (e.target === overlay || e.target.classList.contains('me-shortcut-close')) {
+        this._close();
+      }
+    });
+    document.body.appendChild(overlay);
+    this._panel = overlay;
+  },
+
+  _close() {
+    if (this._panel) {
+      this._panel.remove();
+      this._panel = null;
+    }
+  },
+
+  destroy(editor) {
+    this._close();
+    if (this._onKeydown && editor && editor.textarea) {
+      editor.textarea.removeEventListener('keydown', this._onKeydown);
+    }
+    this._onKeydown = null;
+  },
+};
+
 // ============ 预设插件表 ============
 
 const presetPlugins = {
@@ -517,6 +606,7 @@ const presetPlugins = {
   exportTool: exportToolPlugin,
   searchReplace: searchReplacePlugin,
   imagePaste: imagePastePlugin,
+  shortcutHelp: shortcutHelpPlugin,
 };
 
 // ============ 实用工具 ============
diff --git a/src/styles.js b/src/styles.js
index 3be122a..107c2f5 100644
--- a/src/styles.js
+++ b/src/styles.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor Styles - 编辑器样式
  * @module styles
- * @version 0.1.11
+ * @version 0.1.12
  * @description 编辑器 UI 样式注入与管理
  */
 
@@ -94,7 +94,8 @@ const generateCSS = () => {
     .me-btn:active { transform: scale(0.92); }
     .me-btn.me-active { background: var(--md-accent); color: #fff; }
     .me-btn:disabled { opacity: 0.35; cursor: not-allowed; pointer-events: none; }
-    .me-btn:focus-visible { outline: 2px solid var(--md-accent); outline-offset: 1px; }
+    .me-btn:focus-visible { outline: 2px solid var(--md-accent); outline-offset: 2px; }
+    .me-btn:focus:not(:focus-visible) { outline: none; }
     .me-btn svg { width: 17px; height: 17px; display: block; }
     .me-btn span { font-size: 12px; font-weight: 500; }
 
@@ -521,6 +522,16 @@ const generateCSS = () => {
     .me-outline-l3 a { padding-left: 20px; font-size: 12px; }
     .me-outline-l4 a { padding-left: 28px; font-size: 12px; }
 
+    /* ============ Zen 模式（v0.1.12） ============ */
+    .me-wrapper.me-zen .me-body { max-width: 820px; margin: 0 auto; }
+    .me-wrapper.me-zen .me-textarea { font-size: 15px; line-height: 1.8; }
+
+    /* ============ 屏幕阅读器专用（v0.1.12） ============ */
+    .me-sr-only {
+      position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
+      overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
+    }
+
     /* ============ 打印样式 ============ */
     @media print {
       .me-wrapper { border: 0 !important; box-shadow: none !important; }
diff --git a/src/themes.js b/src/themes.js
index cdaf73b..272396b 100644
--- a/src/themes.js
+++ b/src/themes.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor Themes — 主题系统（增强版）
  * @module themes
- * @version 0.1.11
+ * @version 0.1.12
  * @description 全局+实例级主题管理、CSS 变量隔离、外部主题跟随、主题继承
  *
  * v0.1.5 增强：
diff --git a/src/utils.js b/src/utils.js
index 61c9959..177bc67 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -1,7 +1,7 @@
 /**
  * MetonaEditor Utils - 工具函数
  * @module utils
- * @version 0.1.11
+ * @version 0.1.12
  * @description 通用工具函数集合
  */
 
diff --git a/tests/core.test.js b/tests/core.test.js
index b09a12f..99067a4 100644
--- a/tests/core.test.js
+++ b/tests/core.test.js
@@ -1482,3 +1482,53 @@ describe('MarkdownEditor - v0.1.7 outline', () => {
     ed.destroy();
   });
 });
+
+// ============ v0.1.12 新增测试 ============
+
+describe('MarkdownEditor - v0.1.12 Zen 模式', () => {
+  test('toggleZen 切换状态', () => {
+    document.body.innerHTML = '';
+    const c = document.createElement('div');
+    document.body.appendChild(c);
+    const ed = new MarkdownEditor(c, {});
+    expect(ed.isZen()).toBe(false);
+    ed.toggleZen();
+    expect(ed.isZen()).toBe(true);
+    expect(ed.el.classList.contains('me-zen')).toBe(true);
+    ed.toggleZen();
+    expect(ed.isZen()).toBe(false);
+    ed.destroy();
+  });
+});
+
+describe('MarkdownEditor - v0.1.12 Word Wrap', () => {
+  test('toggleWordWrap 切换换行', () => {
+    document.body.innerHTML = '';
+    const c = document.createElement('div');
+    document.body.appendChild(c);
+    const ed = new MarkdownEditor(c, {});
+    expect(ed.isWordWrap()).toBe(true);
+    ed.toggleWordWrap();
+    expect(ed.isWordWrap()).toBe(false);
+    expect(ed.textarea.style.whiteSpace).toBe('pre');
+    ed.toggleWordWrap();
+    expect(ed.isWordWrap()).toBe(true);
+    ed.destroy();
+  });
+});
+
+describe('MarkdownEditor - v0.1.12 shortcutHelp 插件', () => {
+  test('按 ? 弹出快捷键面板', () => {
+    document.body.innerHTML = '';
+    const c = document.createElement('div');
+    document.body.appendChild(c);
+    const ed = new MarkdownEditor(c, { value: 'test' });
+    ed.use('shortcutHelp');
+    ed.textarea.dispatchEvent(new KeyboardEvent('keydown', { key: '?', bubbles: true }));
+    expect(document.querySelector('.me-shortcut-overlay')).not.toBeNull();
+    // cleanup
+    const panel = document.querySelector('.me-shortcut-overlay');
+    if (panel) panel.remove();
+    ed.destroy();
+  });
+});
diff --git a/types/index.d.ts b/types/index.d.ts
index ce78b0a..ee6de07 100644
--- a/types/index.d.ts
+++ b/types/index.d.ts
@@ -1,4 +1,4 @@
-// Type definitions for MetonaEditor v0.1.11
+// Type definitions for MetonaEditor v0.1.12
 // Project: https://git.metona.cn/MetonaTeam/MetonaEditor
 // Author: thzxx