@nywqs/vue-markdown-editor 0.1.2 → 0.1.3

package/README.md

@@ -206,14 +206,23 @@ const handlePreviewScroll = (percentage) => {
 - **MermaidPlugin**：流程图支持（Ctrl+Shift+D）
 - **AutoCompletePlugin**：自动补全
 - **SyntaxCheckerPlugin**：语法检查
+- **PromptTemplatePlugin**：Prompt模板系统，支持模板化提示词创建、复用和团队协作（Ctrl+Alt+T）
 
 插件会自动激活，无需额外配置。
 
 ---
 
-## ⚙️ 性能优化
+## 📦 架构设计
 
-编辑器采用了多项性能优化技术：
+### 核心模块
+
+- **Document** - 文档模型，管理文本内容和编辑操作
+- **ViewportManager** - 视口管理，处理滚动和坐标转换
+- **MarkdownLexer** - 词法分析器，解析Markdown语法
+- **DOMTextRenderer** - DOM渲染器，清晰的文本显示
+- **TextRenderer** - Canvas渲染器，高性能装饰渲染
+
+### 性能优化策略
 
 1. **视口裁剪**：只渲染可见区域，大文件性能提升 10-40 倍
 2. **虚拟滚动**：缓冲区机制，避免滚动闪烁
@@ -225,26 +234,74 @@ const handlePreviewScroll = (percentage) => {
 
 ---
 
+## 🤝 贡献指南
+
+欢迎贡献代码！请查看 [CONTRIBUTING.md](./CONTRIBUTING.md) 了解详细的贡献流程。
+
+### 快速开始
+
+1. Fork 本仓库
+2. 创建特性分支 (`git checkout -b feature/AmazingFeature`)
+3. 提交更改 (`git commit -m 'Add some AmazingFeature'`)
+4. 推送到分支 (`git push origin feature/AmazingFeature`)
+5. 开启 Pull Request
+
+---
+
+## 📝 变更日志
+
+查看 [CHANGELOG.md](./CHANGELOG.md) 了解版本更新历史。
+
+---
+
 ## 🛠️ 开发与构建
 
 本仓库使用 Vite + Vue 3 进行开发和构建。
 
-本地开发：
+### 本地开发
 
 ```bash
+# 安装依赖
 npm install
+
+# 启动开发服务器
 npm run dev
 ```
 
-构建库：
+### 运行测试
 
 ```bash
-npm run build:lib
+# 运行单元测试
+npm run test
+
+# 运行测试并生成覆盖率报告
+npm run test:coverage
+
+# 运行测试 UI
+npm run test:ui
+```
+
+测试覆盖率：
+- Document.js: 97.89% 语句覆盖率
+- ViewportManager.js: 100% 语句覆盖率  
+- MarkdownLexer.js: 90.06% 语句覆盖率
+
+### 性能测试
+
+```bash
+# 启动开发服务器后访问
+http://localhost:5173/tests/performance/benchmark.html
 ```
 
-类型检查：
+支持测试文档规模：100/1000/5000/10000行
+
+### 构建
 
 ```bash
+# 构建库文件
+npm run build:lib
+
+# 类型检查
 npm run typecheck
 ```
 

package/dist-lib/vue-markdown-editor.css

@@ -1,2 +1,19 @@
-.canvas-toolbar[data-v-46e06aed]{background:#f5f5f5;border-bottom:1px solid #ddd;flex-wrap:wrap;align-items:center;gap:4px;padding:8px 12px;display:flex}.toolbar-btn[data-v-46e06aed]{cursor:pointer;color:#666;white-space:nowrap;background:#fff;border:1px solid #ddd;border-radius:4px;justify-content:center;align-items:center;min-width:32px;height:32px;padding:0 8px;font-size:16px;transition:all .2s;display:flex}.toolbar-btn .icon[data-v-46e06aed]{justify-content:center;align-items:center;width:18px;height:18px;display:flex}.toolbar-btn[data-v-46e06aed]:hover{color:#333;background:#e9e9e9;border-color:#999;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.toolbar-btn[data-v-46e06aed]:active{box-shadow:none;transform:translateY(0)}.toolbar-btn.divider[data-v-46e06aed]{cursor:default;background:#ddd;border:none;width:1px;min-width:1px;height:20px;margin:0 4px;padding:0}.toolbar-btn.divider[data-v-46e06aed]:hover{box-shadow:none;background:#ddd;transform:none}.search-panel[data-v-46382544]{z-index:1000;background:#fff;border:1px solid #e0e0e0;border-radius:8px;min-width:420px;padding:16px;position:absolute;top:8px;right:8px;box-shadow:0 4px 16px #0000001f}.search-row[data-v-46382544],.replace-row[data-v-46382544]{align-items:center;gap:8px;margin-bottom:10px;display:flex}.search-input[data-v-46382544]{border:1px solid #d0d0d0;border-radius:6px;outline:none;flex:1;padding:8px 12px;font-size:13px;transition:all .2s}.search-input[data-v-46382544]:focus{border-color:#4a90e2;box-shadow:0 0 0 3px #4a90e21a}.search-count[data-v-46382544]{color:#666;text-align:center;background:#f5f5f5;border-radius:4px;min-width:45px;padding:4px 8px;font-size:12px;font-weight:500}.search-btn[data-v-46382544],.action-btn[data-v-46382544]{cursor:pointer;color:#555;background:#fff;border:1px solid #d0d0d0;border-radius:6px;padding:8px 12px;font-size:13px;transition:all .2s}.search-btn[data-v-46382544]:hover,.action-btn[data-v-46382544]:hover{color:#4a90e2;background:#f8f8f8;border-color:#4a90e2}.search-btn[data-v-46382544]:active,.action-btn[data-v-46382544]:active{background:#e8e8e8}.close-btn[data-v-46382544]{color:#999;font-weight:700}.close-btn[data-v-46382544]:hover{color:#f44;background:#fff5f5;border-color:#f44}.action-btn[data-v-46382544]{color:#fff;background:#4a90e2;border-color:#4a90e2;padding:8px 16px;font-weight:500}.action-btn[data-v-46382544]:hover{color:#fff;background:#357abd;border-color:#357abd}.search-options[data-v-46382544]{border-top:1px solid #f0f0f0;gap:20px;padding-top:12px;display:flex}.search-options label[data-v-46382544]{color:#666;cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:6px;font-size:12px;transition:color .2s;display:flex}.search-options label[data-v-46382544]:hover{color:#4a90e2}.search-options input[type=checkbox][data-v-46382544]{cursor:pointer;width:14px;height:14px}.canvas-editor-container[data-v-ddb360e3]{flex-direction:column;width:100%;height:100%;display:flex}.canvas-editor[data-v-ddb360e3]{flex:1;width:100%;position:relative;overflow:hidden}canvas[data-v-ddb360e3]{cursor:text;z-index:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smooth:always;text-rendering:optimizeLegibility;display:block;position:absolute;top:0;left:0}.preview-panel[data-v-cef068b8]{background:#fff;width:100%;height:100%;transition:background-color .3s;overflow:hidden auto}.preview-panel[data-v-cef068b8]::-webkit-scrollbar{width:8px}.preview-panel[data-v-cef068b8]::-webkit-scrollbar-track{background:#f1f1f1}.preview-panel[data-v-cef068b8]::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.preview-panel[data-v-cef068b8]::-webkit-scrollbar-thumb:hover{background:#555}.preview-content[data-v-cef068b8]{color:#333;max-width:900px;margin:0 auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:16px;line-height:1.6}.preview-panel[data-theme=dark][data-v-cef068b8]{background:#1e1e1e}.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8]{color:#ccc}.preview-content[data-v-cef068b8] h1,.preview-content[data-v-cef068b8] h2,.preview-content[data-v-cef068b8] h3,.preview-content[data-v-cef068b8] h4,.preview-content[data-v-cef068b8] h5,.preview-content[data-v-cef068b8] h6{margin-top:24px;margin-bottom:16px;font-weight:600;line-height:1.25}.preview-content[data-v-cef068b8] h1{border-bottom:1px solid #eaecef;padding-bottom:.3em;font-size:2em}.preview-content[data-v-cef068b8] h2{border-bottom:1px solid #eaecef;padding-bottom:.3em;font-size:1.5em}.preview-content[data-v-cef068b8] h3{font-size:1.25em}.preview-content[data-v-cef068b8] h4{font-size:1em}.preview-content[data-v-cef068b8] h5{font-size:.875em}.preview-content[data-v-cef068b8] h6{color:#6a737d;font-size:.85em}.preview-content[data-v-cef068b8] p{margin-top:0;margin-bottom:16px}.preview-content[data-v-cef068b8] a{color:#0366d6;text-decoration:none}.preview-content[data-v-cef068b8] a:hover{text-decoration:underline}.preview-content[data-v-cef068b8] strong{font-weight:600}.preview-content[data-v-cef068b8] em{font-style:italic}.preview-content[data-v-cef068b8] code{background-color:#1b1f230d;border-radius:3px;margin:0;padding:.2em .4em;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:85%}.preview-content[data-v-cef068b8] pre{background-color:#f6f8fa;border-radius:6px;margin-bottom:16px;padding:16px;font-size:85%;line-height:1.45;overflow:auto}.preview-content[data-v-cef068b8] pre code{line-height:inherit;word-wrap:normal;background-color:#0000;border:0;margin:0;padding:0;display:inline;overflow:visible}.preview-content[data-v-cef068b8] blockquote{color:#6a737d;border-left:.25em solid #dfe2e5;margin:0 0 16px;padding:0 1em}.preview-content[data-v-cef068b8] ul,.preview-content[data-v-cef068b8] ol{margin-top:0;margin-bottom:16px;padding-left:2em}.preview-content[data-v-cef068b8] li{margin-bottom:.25em}.preview-content[data-v-cef068b8] li>p{margin-bottom:0}.preview-content[data-v-cef068b8] img{box-sizing:content-box;background-color:#fff;max-width:100%}.preview-content[data-v-cef068b8] hr{background-color:#e1e4e8;border:0;height:.25em;margin:24px 0;padding:0}.preview-content[data-v-cef068b8] table{border-spacing:0;border-collapse:collapse;width:100%;margin-bottom:16px;display:block;overflow:auto}.preview-content[data-v-cef068b8] table th{background-color:#f6f8fa;border:1px solid #dfe2e5;padding:6px 13px;font-weight:600}.preview-content[data-v-cef068b8] table td{border:1px solid #dfe2e5;padding:6px 13px}.preview-content[data-v-cef068b8] table tr{background-color:#fff;border-top:1px solid #c6cbd1}.preview-content[data-v-cef068b8] table tr:nth-child(2n){background-color:#f6f8fa}.preview-content[data-v-cef068b8] input[type=checkbox]{margin-right:.5em}.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8] code{background-color:#6e768166}.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8] pre{background-color:#2d2d2d}.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8] table th{background-color:#2d2d2d;border-color:#444}.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8] table td{border-color:#444}.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8] table tr{background-color:#1e1e1e;border-color:#444}.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8] table tr:nth-child(2n){background-color:#252525}.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8] blockquote{color:#8b949e;border-left-color:#3b3b3b}.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8] hr{background-color:#3b3b3b}.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8] h1,.preview-panel[data-theme=dark] .preview-content[data-v-cef068b8] h2{border-bottom-color:#3b3b3b}pre code.hljs{padding:1em;display:block;overflow-x:auto}code.hljs{padding:3px 5px}.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#79c0ff}.hljs-regexp,.hljs-string,.hljs-meta .hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-comment,.hljs-code,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-tag,.hljs-selector-pseudo{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}.editor-config[data-v-2ff40722]{z-index:1000;background:#fff;border-radius:8px;width:600px;max-height:80vh;position:fixed;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%);box-shadow:0 4px 24px #0003}.config-header[data-v-2ff40722]{background:#f9f9f9;border-bottom:1px solid #e5e5e5;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.config-header h3[data-v-2ff40722]{margin:0;font-size:18px;font-weight:600}.close-btn[data-v-2ff40722]{cursor:pointer;color:#666;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;width:32px;height:32px;font-size:24px;transition:all .2s;display:flex}.close-btn[data-v-2ff40722]:hover{color:#333;background:#e5e5e5}.config-body[data-v-2ff40722]{max-height:calc(80vh - 140px);padding:20px;overflow-y:auto}.config-section[data-v-2ff40722]{margin-bottom:24px}.config-section h4[data-v-2ff40722]{color:#333;margin:0 0 12px;font-size:16px;font-weight:600}.hint[data-v-2ff40722]{color:#999;margin:0 0 12px;font-size:13px}.config-item[data-v-2ff40722]{align-items:center;gap:12px;margin-bottom:12px;display:flex}.config-item label[data-v-2ff40722]{color:#666;min-width:80px;font-size:14px}.config-item select[data-v-2ff40722],.config-item input[type=number][data-v-2ff40722]{border:1px solid #ddd;border-radius:4px;flex:1;padding:6px 10px;font-size:14px}.config-item input[type=checkbox][data-v-2ff40722]{cursor:pointer;margin:0}.unit[data-v-2ff40722]{color:#999;font-size:12px}.color-grid[data-v-2ff40722]{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.color-item[data-v-2ff40722]{background:#fafafa;border:1px solid #e5e5e5;border-radius:4px;align-items:center;gap:8px;padding:8px;display:flex}.color-item label[data-v-2ff40722]{color:#666;flex:1;font-size:13px}.color-item input[type=color][data-v-2ff40722]{cursor:pointer;border:none;border-radius:4px;width:36px;height:36px}.color-value[data-v-2ff40722]{color:#999;font-family:monospace;font-size:12px}.config-footer[data-v-2ff40722]{background:#f9f9f9;border-top:1px solid #e5e5e5;justify-content:flex-end;gap:8px;padding:16px 20px;display:flex}.btn[data-v-2ff40722]{cursor:pointer;border:1px solid #ddd;border-radius:4px;padding:8px 16px;font-size:14px;transition:all .2s}.btn-secondary[data-v-2ff40722]{color:#666;background:#fff}.btn-secondary[data-v-2ff40722]:hover{background:#f5f5f5}.btn-primary[data-v-2ff40722]{color:#fff;background:#4a90e2;border-color:#4a90e2}.btn-primary[data-v-2ff40722]:hover{background:#357abd}
-/*$vite$:1*/
+.canvas-toolbar[data-v-06d62bc8]{display:flex;align-items:center;gap:4px;padding:8px 12px;background:#f5f5f5;border-bottom:1px solid #ddd;flex-wrap:wrap}.toolbar-btn[data-v-06d62bc8]{display:flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 8px;border:1px solid #ddd;background:#fff;border-radius:4px;cursor:pointer;font-size:16px;color:#666;transition:all .2s;white-space:nowrap}.toolbar-btn .icon[data-v-06d62bc8]{width:18px;height:18px;display:flex;align-items:center;justify-content:center}.toolbar-btn>span[data-v-06d62bc8]{font-size:14px;line-height:18px;display:inline-flex;align-items:center;justify-content:center}.toolbar-btn[data-v-06d62bc8]:hover{background:#e9e9e9;border-color:#999;color:#333;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.toolbar-btn[data-v-06d62bc8]:active{transform:translateY(0);box-shadow:none}.toolbar-btn.divider[data-v-06d62bc8]{width:1px;min-width:1px;height:20px;padding:0;margin:0 4px;background:#ddd;border:none;cursor:default}.toolbar-btn.divider[data-v-06d62bc8]:hover{background:#ddd;transform:none;box-shadow:none}.search-panel[data-v-57dc7601]{position:absolute;top:8px;right:8px;background:#fff;border:1px solid #e0e0e0;border-radius:8px;box-shadow:0 4px 16px #0000001f;padding:16px;z-index:1000;min-width:420px}.search-row[data-v-57dc7601],.replace-row[data-v-57dc7601]{display:flex;gap:8px;align-items:center;margin-bottom:10px}.search-input[data-v-57dc7601]{flex:1;padding:8px 12px;border:1px solid #d0d0d0;border-radius:6px;font-size:13px;outline:none;transition:all .2s}.search-input[data-v-57dc7601]:focus{border-color:#4a90e2;box-shadow:0 0 0 3px #4a90e21a}.search-count[data-v-57dc7601]{font-size:12px;color:#666;background:#f5f5f5;padding:4px 8px;border-radius:4px;min-width:45px;text-align:center;font-weight:500}.search-btn[data-v-57dc7601],.action-btn[data-v-57dc7601]{padding:8px 12px;border:1px solid #d0d0d0;background:#fff;border-radius:6px;cursor:pointer;font-size:13px;transition:all .2s;color:#555}.search-btn[data-v-57dc7601]:hover,.action-btn[data-v-57dc7601]:hover{background:#f8f8f8;border-color:#4a90e2;color:#4a90e2}.search-btn[data-v-57dc7601]:active,.action-btn[data-v-57dc7601]:active{background:#e8e8e8}.close-btn[data-v-57dc7601]{font-weight:700;color:#999}.close-btn[data-v-57dc7601]:hover{color:#f44;border-color:#f44;background:#fff5f5}.action-btn[data-v-57dc7601]{padding:8px 16px;background:#4a90e2;color:#fff;border-color:#4a90e2;font-weight:500}.action-btn[data-v-57dc7601]:hover{background:#357abd;border-color:#357abd;color:#fff}.search-options[data-v-57dc7601]{display:flex;gap:20px;padding-top:12px;border-top:1px solid #f0f0f0}.search-options label[data-v-57dc7601]{display:flex;align-items:center;gap:6px;font-size:12px;color:#666;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .2s}.search-options label[data-v-57dc7601]:hover{color:#4a90e2}.search-options input[type=checkbox][data-v-57dc7601]{cursor:pointer;width:14px;height:14px}.template-library-panel[data-v-67bcfd56]{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:9999;animation:fadeIn-67bcfd56 .2s}@keyframes fadeIn-67bcfd56{0%{opacity:0}to{opacity:1}}.panel-content[data-v-67bcfd56]{background:#fff;border-radius:8px;width:90%;max-width:900px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 4px 20px #0000004d;animation:slideUp-67bcfd56 .3s}@keyframes slideUp-67bcfd56{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.panel-header[data-v-67bcfd56]{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #e0e0e0}.panel-header h2[data-v-67bcfd56]{margin:0;font-size:20px;color:#333}.close-btn[data-v-67bcfd56]{background:none;border:none;font-size:24px;cursor:pointer;color:#666;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background .2s}.close-btn[data-v-67bcfd56]:hover{background:#f0f0f0}.panel-toolbar[data-v-67bcfd56]{display:flex;gap:12px;padding:16px 24px;border-bottom:1px solid #e0e0e0}.search-input[data-v-67bcfd56]{flex:1;padding:8px 12px;border:1px solid #d0d0d0;border-radius:4px;font-size:14px}.category-select[data-v-67bcfd56],.sort-select[data-v-67bcfd56]{padding:8px 12px;border:1px solid #d0d0d0;border-radius:4px;font-size:14px;background:#fff;cursor:pointer}.template-list[data-v-67bcfd56]{flex:1;overflow-y:auto;padding:16px 24px}.template-item[data-v-67bcfd56]{border:1px solid #e0e0e0;border-radius:6px;padding:16px;margin-bottom:12px;cursor:pointer;transition:all .2s}.template-item[data-v-67bcfd56]:hover{border-color:#1890ff;box-shadow:0 2px 8px #1890ff33}.template-header[data-v-67bcfd56]{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.template-header h3[data-v-67bcfd56]{margin:0;font-size:16px;color:#333}.template-actions[data-v-67bcfd56]{display:flex;gap:8px}.action-btn[data-v-67bcfd56]{padding:4px 12px;border:1px solid #d0d0d0;border-radius:4px;background:#fff;cursor:pointer;font-size:12px;transition:all .2s}.action-btn[data-v-67bcfd56]:hover{background:#f0f0f0;border-color:#1890ff}.delete-btn[data-v-67bcfd56]:hover{background:#fff1f0;border-color:#ff4d4f;color:#ff4d4f}.template-description[data-v-67bcfd56]{color:#666;font-size:14px;margin:8px 0;line-height:1.5}.template-meta[data-v-67bcfd56]{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:#999}.meta-item[data-v-67bcfd56]{display:flex;align-items:center;gap:4px}.empty-state[data-v-67bcfd56]{text-align:center;padding:60px 20px;color:#999}.empty-state p[data-v-67bcfd56]{font-size:16px;margin-bottom:20px}.create-btn[data-v-67bcfd56]{padding:10px 24px;background:#1890ff;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.create-btn[data-v-67bcfd56]:hover{background:#40a9ff}.panel-footer[data-v-67bcfd56]{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-top:1px solid #e0e0e0}.footer-btn[data-v-67bcfd56]{padding:8px 16px;border:1px solid #d0d0d0;border-radius:4px;background:#fff;cursor:pointer;font-size:14px;transition:all .2s}.footer-btn[data-v-67bcfd56]:hover{background:#f0f0f0;border-color:#1890ff}.template-count[data-v-67bcfd56]{color:#666;font-size:14px}.template-list[data-v-67bcfd56]::-webkit-scrollbar{width:8px}.template-list[data-v-67bcfd56]::-webkit-scrollbar-track{background:#f1f1f1}.template-list[data-v-67bcfd56]::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}.template-list[data-v-67bcfd56]::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.canvas-editor-container[data-v-ebfb2298]{width:100%;height:100%;display:flex;flex-direction:column}.canvas-editor[data-v-ebfb2298]{flex:1;width:100%;overflow:hidden;position:relative}canvas[data-v-ebfb2298]{display:block;cursor:text;position:absolute;left:0;top:0;z-index:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smooth:always;text-rendering:optimizeLegibility}/*!
+  Theme: GitHub
+  Description: Light theme as seen on github.com
+  Author: github.com
+  Maintainer: @Hirse
+  Updated: 2021-05-15
+
+  Outdated base version: https://github.com/primer/github-syntax-light
+  Current colors taken from GitHub's CSS
+*/.hljs{color:#24292e;background:#fff}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#005cc5}.hljs-regexp,.hljs-string,.hljs-meta .hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-comment,.hljs-code,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-tag,.hljs-selector-pseudo{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{color:#22863a;background-color:#f0fff4}.hljs-deletion{color:#b31d28;background-color:#ffeef0}.preview-panel[data-v-fd42aef8]{width:100%;height:100%;overflow-y:auto;overflow-x:hidden;background:#fff;transition:background-color .3s}.preview-panel[data-v-fd42aef8]::-webkit-scrollbar{width:8px}.preview-panel[data-v-fd42aef8]::-webkit-scrollbar-track{background:#f1f1f1}.preview-panel[data-v-fd42aef8]::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.preview-panel[data-v-fd42aef8]::-webkit-scrollbar-thumb:hover{background:#555}.preview-content[data-v-fd42aef8]{padding:20px;max-width:900px;margin:0 auto;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:16px;line-height:1.6;color:#333}.preview-panel[data-theme=dark][data-v-fd42aef8]{background:#1e1e1e}.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8]{color:#ccc}.preview-content[data-v-fd42aef8] h1,.preview-content[data-v-fd42aef8] h2,.preview-content[data-v-fd42aef8] h3,.preview-content[data-v-fd42aef8] h4,.preview-content[data-v-fd42aef8] h5,.preview-content[data-v-fd42aef8] h6{margin-top:24px;margin-bottom:16px;font-weight:600;line-height:1.25}.preview-content[data-v-fd42aef8] h1{font-size:2em;border-bottom:1px solid #eaecef;padding-bottom:.3em}.preview-content[data-v-fd42aef8] h2{font-size:1.5em;border-bottom:1px solid #eaecef;padding-bottom:.3em}.preview-content[data-v-fd42aef8] h3{font-size:1.25em}.preview-content[data-v-fd42aef8] h4{font-size:1em}.preview-content[data-v-fd42aef8] h5{font-size:.875em}.preview-content[data-v-fd42aef8] h6{font-size:.85em;color:#6a737d}.preview-content[data-v-fd42aef8] p{margin-top:0;margin-bottom:16px}.preview-content[data-v-fd42aef8] a{color:#0366d6;text-decoration:none}.preview-content[data-v-fd42aef8] a:hover{text-decoration:underline}.preview-content[data-v-fd42aef8] strong{font-weight:600}.preview-content[data-v-fd42aef8] em{font-style:italic}.preview-content[data-v-fd42aef8] code{padding:.2em .4em;margin:0;font-size:85%;background-color:#1b1f230d;border-radius:3px;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace}.preview-content[data-v-fd42aef8] pre{padding:16px;overflow:auto;font-size:85%;line-height:1.45;background-color:#f6f8fa;border-radius:6px;margin-bottom:16px}.preview-content[data-v-fd42aef8] pre code{display:inline;padding:0;margin:0;overflow:visible;line-height:inherit;word-wrap:normal;background-color:transparent;border:0}.preview-content[data-v-fd42aef8] blockquote{padding:0 1em;color:#6a737d;border-left:.25em solid #dfe2e5;margin:0 0 16px}.preview-content[data-v-fd42aef8] ul,.preview-content[data-v-fd42aef8] ol{padding-left:2em;margin-top:0;margin-bottom:16px}.preview-content[data-v-fd42aef8] li{margin-bottom:.25em}.preview-content[data-v-fd42aef8] li>p{margin-bottom:0}.preview-content[data-v-fd42aef8] img{max-width:100%;box-sizing:content-box;background-color:#fff}.preview-content[data-v-fd42aef8] hr{height:.25em;padding:0;margin:24px 0;background-color:#e1e4e8;border:0}.preview-content[data-v-fd42aef8] table{border-spacing:0;border-collapse:collapse;display:block;width:100%;overflow:auto;margin-bottom:16px}.preview-content[data-v-fd42aef8] table th{font-weight:600;padding:6px 13px;border:1px solid #dfe2e5;background-color:#f6f8fa}.preview-content[data-v-fd42aef8] table td{padding:6px 13px;border:1px solid #dfe2e5}.preview-content[data-v-fd42aef8] table tr{background-color:#fff;border-top:1px solid #c6cbd1}.preview-content[data-v-fd42aef8] table tr:nth-child(2n){background-color:#f6f8fa}.preview-content[data-v-fd42aef8] input[type=checkbox]{margin-right:.5em}.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8] code{background-color:#6e768166}.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8] pre{background-color:#2d2d2d}.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8] table th{background-color:#2d2d2d;border-color:#444}.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8] table td{border-color:#444}.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8] table tr{background-color:#1e1e1e;border-color:#444}.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8] table tr:nth-child(2n){background-color:#252525}.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8] blockquote{color:#8b949e;border-left-color:#3b3b3b}.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8] hr{background-color:#3b3b3b}.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8] h1,.preview-panel[data-theme=dark] .preview-content[data-v-fd42aef8] h2{border-bottom-color:#3b3b3b}.editor-config[data-v-33327619]{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;max-height:80vh;background:#fff;border-radius:8px;box-shadow:0 4px 24px #0003;overflow:hidden;z-index:1000}.config-header[data-v-33327619]{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #e5e5e5;background:#f9f9f9}.config-header h3[data-v-33327619]{margin:0;font-size:18px;font-weight:600}.close-btn[data-v-33327619]{width:32px;height:32px;border:none;background:transparent;font-size:24px;cursor:pointer;color:#666;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.close-btn[data-v-33327619]:hover{background:#e5e5e5;color:#333}.config-body[data-v-33327619]{padding:20px;max-height:calc(80vh - 140px);overflow-y:auto}.config-section[data-v-33327619]{margin-bottom:24px}.config-section h4[data-v-33327619]{margin:0 0 12px;font-size:16px;font-weight:600;color:#333}.hint[data-v-33327619]{margin:0 0 12px;font-size:13px;color:#999}.config-item[data-v-33327619]{display:flex;align-items:center;gap:12px;margin-bottom:12px}.config-item label[data-v-33327619]{min-width:80px;font-size:14px;color:#666}.config-item select[data-v-33327619],.config-item input[type=number][data-v-33327619]{padding:6px 10px;border:1px solid #ddd;border-radius:4px;font-size:14px;flex:1}.config-item input[type=checkbox][data-v-33327619]{margin:0;cursor:pointer}.unit[data-v-33327619]{font-size:12px;color:#999}.color-grid[data-v-33327619]{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.color-item[data-v-33327619]{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid #e5e5e5;border-radius:4px;background:#fafafa}.color-item label[data-v-33327619]{flex:1;font-size:13px;color:#666}.color-item input[type=color][data-v-33327619]{width:36px;height:36px;border:none;border-radius:4px;cursor:pointer}.color-value[data-v-33327619]{font-size:12px;color:#999;font-family:monospace}.config-footer[data-v-33327619]{display:flex;justify-content:flex-end;gap:8px;padding:16px 20px;border-top:1px solid #e5e5e5;background:#f9f9f9}.btn[data-v-33327619]{padding:8px 16px;border:1px solid #ddd;border-radius:4px;font-size:14px;cursor:pointer;transition:all .2s}.btn-secondary[data-v-33327619]{background:#fff;color:#666}.btn-secondary[data-v-33327619]:hover{background:#f5f5f5}.btn-primary[data-v-33327619]{background:#4a90e2;color:#fff;border-color:#4a90e2}.btn-primary[data-v-33327619]:hover{background:#357abd}pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
+  Theme: GitHub Dark
+  Description: Dark theme as seen on github.com
+  Author: github.com
+  Maintainer: @Hirse
+  Updated: 2021-05-15
+
+  Outdated base version: https://github.com/primer/github-syntax-dark
+  Current colors taken from GitHub's CSS
+*/.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-variable,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id{color:#79c0ff}.hljs-regexp,.hljs-string,.hljs-meta .hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-comment,.hljs-code,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-tag,.hljs-selector-pseudo{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}