mirror of
https://github.com/amitwh/markdown-converter.git
synced 2026-08-03 02:11:07 +05:30
Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
01d833f520 | ||
|
|
10d2fc8b8f | ||
|
|
0344a48f20 | ||
|
|
3c11ac15ce | ||
|
|
c5a9881d8d | ||
|
|
15903e782a | ||
|
|
336b24365d | ||
|
|
b5409b7754 | ||
|
|
d3afd7ad86 | ||
|
|
59ef2028f8 | ||
|
|
f62a6b7e59 | ||
|
|
f650b04685 | ||
|
|
04480c1243 | ||
|
|
81a78412fd | ||
|
|
12dcd2d1a3 | ||
|
|
ae7b333cea | ||
|
|
e2703d8c57 | ||
|
|
ca0b250506 | ||
|
|
9348b2bd1d | ||
|
|
200e800eb2 | ||
|
|
a6456a7b4c | ||
|
|
3908df8b1d | ||
|
|
72ee803a95 | ||
|
|
37502fb733 | ||
|
|
affe1a7e33 | ||
|
|
ed48f254f1 | ||
|
|
0c2b6fe5cc | ||
|
|
233225f12c | ||
|
|
47f3b7557e | ||
|
|
7678c61602 | ||
|
|
6e7460def7 | ||
|
|
bf67156b9c | ||
|
|
824f659e13 | ||
|
|
e7eff01db6 | ||
|
|
7b15b2808e |
+1
-1
@@ -33,4 +33,4 @@ pdf\ modal.png
|
||||
# Claude/AI development files
|
||||
.claude/
|
||||
CLAUDE.md
|
||||
agents.md
|
||||
agents.mdcoverage/
|
||||
|
||||
+51
@@ -1,5 +1,56 @@
|
||||
# PanConverter - Updates & Changelog
|
||||
|
||||
## Version 4.0.0 (2026-03-04)
|
||||
|
||||
### Major Changes
|
||||
- **CodeMirror 6 Editor** — Replaced textarea with CodeMirror 6 featuring syntax highlighting, code folding, bracket matching, multiple cursors, and auto-indent
|
||||
- **Sidebar Panel System** — Collapsible sidebar with File Explorer, Git, Snippets, and Templates panels
|
||||
- **Command Palette** — Ctrl+Shift+P to search and execute all app actions
|
||||
- **Code Execution (REPL)** — Run JavaScript, Python, and Bash code blocks directly from the preview
|
||||
|
||||
### New Features
|
||||
- Print Preview dialog with paper size, orientation, margins, scale, and page range controls
|
||||
- Image paste from clipboard and drag-drop support with auto-save to assets folder
|
||||
- Document templates library (10 templates: blog post, meeting notes, tech spec, changelog, README, project plan, API docs, tutorial, release notes, comparison)
|
||||
- Markdown extensions: footnotes, admonitions (note/warning/tip/danger/info), and [[toc]] table of contents
|
||||
- PlantUML diagram rendering alongside Mermaid
|
||||
- Welcome tab with onboarding and "What's New" feature showcase
|
||||
- System spell checking with context menu suggestions and dictionary support
|
||||
- Enhanced status bar with word count, character count, line/column, encoding, and language mode
|
||||
- Grouped toolbar with visual section separators
|
||||
- Breadcrumb bar showing current file path
|
||||
|
||||
### New Export/Import Formats
|
||||
- Reveal.js slides (.html)
|
||||
- Beamer slides (.pdf)
|
||||
- Confluence/Jira wiki markup (.txt)
|
||||
- MOBI e-books (via Calibre)
|
||||
- Developer formats: JSON, YAML, XML, TOML
|
||||
|
||||
### Security
|
||||
- Content Security Policy (CSP) meta tag
|
||||
- File size validation (50MB limit)
|
||||
- Error message sanitization (stripped file paths)
|
||||
- Conversion rate limiting (2-second debounce)
|
||||
|
||||
### Dependencies Updated
|
||||
- marked: 16.x to 17.x (with marked-highlight extension)
|
||||
- pdfjs-dist: 3.x to 5.x (new worker model)
|
||||
- html2pdf.js: 0.10 to 0.14
|
||||
- pdfkit: 0.14 to 0.17
|
||||
- dompurify, docx, and others updated to latest
|
||||
|
||||
### Testing
|
||||
- 80 tests across 7 test suites
|
||||
- New tests for sidebar manager, command palette, print preview, markdown extensions, and utility functions
|
||||
|
||||
### Breaking Changes
|
||||
- Editor is now CodeMirror 6 (replaces textarea)
|
||||
- marked API changed to use marked.use() instead of marked.setOptions()
|
||||
- pdfjs-dist upgraded to v5 with new worker model
|
||||
|
||||
---
|
||||
|
||||
## Version 2.1.0 (December 14, 2025)
|
||||
|
||||
### 🎨 UI/UX Improvements
|
||||
|
||||
@@ -38,10 +38,30 @@ module.exports = [
|
||||
document: 'readonly',
|
||||
localStorage: 'readonly',
|
||||
alert: 'readonly',
|
||||
prompt: 'readonly',
|
||||
confirm: 'readonly',
|
||||
Event: 'readonly',
|
||||
CustomEvent: 'readonly',
|
||||
HTMLElement: 'readonly',
|
||||
MutationObserver: 'readonly',
|
||||
TextEncoder: 'readonly',
|
||||
FileReader: 'readonly',
|
||||
requestAnimationFrame: 'readonly',
|
||||
cancelAnimationFrame: 'readonly',
|
||||
navigator: 'readonly',
|
||||
location: 'readonly',
|
||||
fetch: 'readonly',
|
||||
URL: 'readonly',
|
||||
Blob: 'readonly',
|
||||
Image: 'readonly',
|
||||
DragEvent: 'readonly',
|
||||
ClipboardEvent: 'readonly',
|
||||
KeyboardEvent: 'readonly',
|
||||
MouseEvent: 'readonly',
|
||||
NodeList: 'readonly',
|
||||
HTMLInputElement: 'readonly',
|
||||
HTMLTextAreaElement: 'readonly',
|
||||
getComputedStyle: 'readonly',
|
||||
// Electron
|
||||
electronAPI: 'readonly',
|
||||
// Libraries
|
||||
@@ -49,6 +69,8 @@ module.exports = [
|
||||
DOMPurify: 'readonly',
|
||||
hljs: 'readonly',
|
||||
mermaid: 'readonly',
|
||||
// Node.js global object
|
||||
global: 'writable',
|
||||
// Jest
|
||||
jest: 'readonly',
|
||||
describe: 'readonly',
|
||||
|
||||
+6
-4
@@ -20,16 +20,18 @@ module.exports = {
|
||||
collectCoverageFrom: [
|
||||
'src/**/*.js',
|
||||
'!src/main.js', // Main process needs electron-mock
|
||||
'!src/renderer.js', // Large renderer file with duplicate declarations
|
||||
'!src/preload.js', // Electron preload requires contextBridge
|
||||
'!**/node_modules/**'
|
||||
],
|
||||
|
||||
// Coverage thresholds (start low, increase over time)
|
||||
// Coverage thresholds (raised with expanded test suite)
|
||||
coverageThreshold: {
|
||||
global: {
|
||||
branches: 10,
|
||||
functions: 10,
|
||||
lines: 10,
|
||||
statements: 10
|
||||
functions: 15,
|
||||
lines: 15,
|
||||
statements: 15
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
+25
-7
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "markdown-converter",
|
||||
"version": "3.0.0",
|
||||
"version": "4.0.0",
|
||||
"description": "Professional Markdown editor and universal file converter with PDF editing, batch processing, and syntax highlighting",
|
||||
"main": "src/main.js",
|
||||
"scripts": {
|
||||
@@ -52,19 +52,37 @@
|
||||
"sharp": "^0.34.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"@codemirror/autocomplete": "^6.20.1",
|
||||
"@codemirror/commands": "^6.10.2",
|
||||
"@codemirror/lang-css": "^6.3.1",
|
||||
"@codemirror/lang-html": "^6.4.11",
|
||||
"@codemirror/lang-javascript": "^6.2.5",
|
||||
"@codemirror/lang-json": "^6.0.2",
|
||||
"@codemirror/lang-markdown": "^6.5.0",
|
||||
"@codemirror/lang-python": "^6.2.1",
|
||||
"@codemirror/language": "^6.12.2",
|
||||
"@codemirror/lint": "^6.9.5",
|
||||
"@codemirror/search": "^6.6.0",
|
||||
"@codemirror/state": "^6.5.4",
|
||||
"@codemirror/theme-one-dark": "^6.1.3",
|
||||
"@codemirror/view": "^6.39.16",
|
||||
"codemirror": "^6.0.2",
|
||||
"core-util-is": "^1.0.3",
|
||||
"docx": "^9.5.1",
|
||||
"docx": "^9.6.0",
|
||||
"docx4js": "^3.3.0",
|
||||
"dompurify": "^3.2.6",
|
||||
"dompurify": "^3.3.1",
|
||||
"electron-store": "^10.1.0",
|
||||
"highlight.js": "^11.11.1",
|
||||
"html2pdf.js": "^0.10.1",
|
||||
"marked": "^16.2.1",
|
||||
"html2pdf.js": "^0.14.0",
|
||||
"marked": "^17.0.3",
|
||||
"marked-footnote": "^1.4.0",
|
||||
"marked-highlight": "^2.2.3",
|
||||
"mermaid": "^11.12.3",
|
||||
"pdf-lib": "^1.17.1",
|
||||
"pdfjs-dist": "^3.11.174",
|
||||
"pdfkit": "^0.14.0",
|
||||
"pdfjs-dist": "^5.5.207",
|
||||
"pdfkit": "^0.17.2",
|
||||
"pizzip": "^3.2.0",
|
||||
"simple-git": "^3.32.3",
|
||||
"tslib": "^2.8.1",
|
||||
"xlsx": "^0.18.5"
|
||||
},
|
||||
|
||||
@@ -0,0 +1,109 @@
|
||||
class CommandPalette {
|
||||
constructor() {
|
||||
this.overlay = document.getElementById('command-palette-overlay');
|
||||
this.input = document.getElementById('command-palette-input');
|
||||
this.results = document.getElementById('command-palette-results');
|
||||
this.commands = [];
|
||||
this.selectedIndex = 0;
|
||||
this.filteredCommands = [];
|
||||
this.setupEventListeners();
|
||||
}
|
||||
|
||||
register(label, shortcut, action) {
|
||||
this.commands.push({ label, shortcut, action });
|
||||
}
|
||||
|
||||
open() {
|
||||
this.overlay.classList.remove('hidden');
|
||||
this.input.value = '';
|
||||
this.input.focus();
|
||||
this.selectedIndex = 0;
|
||||
this.renderResults('');
|
||||
}
|
||||
|
||||
close() {
|
||||
this.overlay.classList.add('hidden');
|
||||
}
|
||||
|
||||
isOpen() {
|
||||
return !this.overlay.classList.contains('hidden');
|
||||
}
|
||||
|
||||
setupEventListeners() {
|
||||
this.input.addEventListener('input', () => {
|
||||
this.selectedIndex = 0;
|
||||
this.renderResults(this.input.value);
|
||||
});
|
||||
|
||||
this.overlay.addEventListener('click', (e) => {
|
||||
if (e.target === this.overlay) this.close();
|
||||
});
|
||||
|
||||
this.input.addEventListener('keydown', (e) => {
|
||||
if (e.key === 'Escape') {
|
||||
e.preventDefault();
|
||||
this.close();
|
||||
} else if (e.key === 'Enter') {
|
||||
e.preventDefault();
|
||||
this.executeSelected();
|
||||
} else if (e.key === 'ArrowDown') {
|
||||
e.preventDefault();
|
||||
this.selectedIndex = Math.min(this.selectedIndex + 1, this.filteredCommands.length - 1);
|
||||
this.updateSelection();
|
||||
} else if (e.key === 'ArrowUp') {
|
||||
e.preventDefault();
|
||||
this.selectedIndex = Math.max(this.selectedIndex - 1, 0);
|
||||
this.updateSelection();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
renderResults(query) {
|
||||
this.filteredCommands = query
|
||||
? this.commands.filter(cmd => cmd.label.toLowerCase().includes(query.toLowerCase()))
|
||||
: [...this.commands];
|
||||
|
||||
this.results.innerHTML = this.filteredCommands.map((cmd, i) => `
|
||||
<div class="command-item ${i === this.selectedIndex ? 'selected' : ''}" data-index="${i}">
|
||||
<span class="command-label">${this.highlightMatch(cmd.label, query)}</span>
|
||||
${cmd.shortcut ? `<span class="command-shortcut">${cmd.shortcut}</span>` : ''}
|
||||
</div>
|
||||
`).join('');
|
||||
|
||||
this.results.querySelectorAll('.command-item').forEach((el) => {
|
||||
el.addEventListener('click', () => {
|
||||
const idx = parseInt(el.dataset.index);
|
||||
this.filteredCommands[idx].action();
|
||||
this.close();
|
||||
});
|
||||
el.addEventListener('mouseenter', () => {
|
||||
this.selectedIndex = parseInt(el.dataset.index);
|
||||
this.updateSelection();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
highlightMatch(text, query) {
|
||||
if (!query) return text;
|
||||
const regex = new RegExp(`(${query.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')})`, 'gi');
|
||||
return text.replace(regex, '<strong>$1</strong>');
|
||||
}
|
||||
|
||||
updateSelection() {
|
||||
this.results.querySelectorAll('.command-item').forEach((el, i) => {
|
||||
el.classList.toggle('selected', i === this.selectedIndex);
|
||||
});
|
||||
// Scroll selected into view
|
||||
const selected = this.results.querySelector('.command-item.selected');
|
||||
if (selected) selected.scrollIntoView({ block: 'nearest' });
|
||||
}
|
||||
|
||||
executeSelected() {
|
||||
if (this.filteredCommands[this.selectedIndex]) {
|
||||
this.filteredCommands[this.selectedIndex].action();
|
||||
this.close();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = { CommandPalette };
|
||||
@@ -0,0 +1,123 @@
|
||||
// CodeMirror 6 wrapper module
|
||||
// Provides createEditor() and getLanguageExtension() for the rest of the app.
|
||||
|
||||
const {
|
||||
EditorView,
|
||||
keymap,
|
||||
lineNumbers,
|
||||
highlightActiveLine,
|
||||
drawSelection,
|
||||
} = require('@codemirror/view');
|
||||
const { EditorState } = require('@codemirror/state');
|
||||
const { markdown, markdownLanguage } = require('@codemirror/lang-markdown');
|
||||
// Language extensions loaded lazily on first use
|
||||
let _javascript, _html, _css, _json, _python;
|
||||
const {
|
||||
defaultKeymap,
|
||||
history,
|
||||
historyKeymap,
|
||||
indentWithTab,
|
||||
} = require('@codemirror/commands');
|
||||
const {
|
||||
searchKeymap,
|
||||
highlightSelectionMatches,
|
||||
} = require('@codemirror/search');
|
||||
const {
|
||||
autocompletion,
|
||||
completionKeymap,
|
||||
} = require('@codemirror/autocomplete');
|
||||
const {
|
||||
bracketMatching,
|
||||
foldGutter,
|
||||
indentOnInput,
|
||||
} = require('@codemirror/language');
|
||||
const { oneDark } = require('@codemirror/theme-one-dark');
|
||||
|
||||
/**
|
||||
* Create a CodeMirror 6 editor instance.
|
||||
*
|
||||
* @param {HTMLElement} parentElement - DOM element to mount the editor in
|
||||
* @param {Object} options
|
||||
* @param {string} options.content - initial document content (default '')
|
||||
* @param {Function} options.onChange - called with new content string on every doc change
|
||||
* @param {Function} options.onUpdate - called with the EditorView on every update (selection, doc change, etc.)
|
||||
* @param {boolean} options.isDark - apply oneDark theme when true (default false)
|
||||
* @param {boolean} options.showLineNumbers - show line-number gutter (default true)
|
||||
* @returns {EditorView} the created editor view
|
||||
*/
|
||||
function createEditor(parentElement, options = {}) {
|
||||
const {
|
||||
content = '',
|
||||
onChange = () => {},
|
||||
onUpdate = null,
|
||||
isDark = false,
|
||||
showLineNumbers = true,
|
||||
} = options;
|
||||
|
||||
const extensions = [
|
||||
markdown({ base: markdownLanguage }),
|
||||
history(),
|
||||
drawSelection(),
|
||||
highlightActiveLine(),
|
||||
bracketMatching(),
|
||||
indentOnInput(),
|
||||
highlightSelectionMatches(),
|
||||
autocompletion(),
|
||||
foldGutter(),
|
||||
keymap.of([
|
||||
...defaultKeymap,
|
||||
...historyKeymap,
|
||||
...searchKeymap,
|
||||
...completionKeymap,
|
||||
indentWithTab,
|
||||
]),
|
||||
EditorView.updateListener.of((update) => {
|
||||
if (update.docChanged) {
|
||||
onChange(update.state.doc.toString());
|
||||
}
|
||||
if (onUpdate && (update.docChanged || update.selectionSet)) {
|
||||
onUpdate(update.view);
|
||||
}
|
||||
}),
|
||||
EditorView.lineWrapping,
|
||||
];
|
||||
|
||||
if (showLineNumbers) {
|
||||
extensions.push(lineNumbers());
|
||||
}
|
||||
|
||||
if (isDark) {
|
||||
extensions.push(oneDark);
|
||||
}
|
||||
|
||||
const state = EditorState.create({ doc: content, extensions });
|
||||
const view = new EditorView({ state, parent: parentElement });
|
||||
return view;
|
||||
}
|
||||
|
||||
/**
|
||||
* Return the appropriate CodeMirror language extension for a given language name.
|
||||
*
|
||||
* Supported values: javascript, js, html, css, json, python, py, markdown.
|
||||
* Falls back to markdown when the language is unrecognised.
|
||||
*
|
||||
* @param {string} lang - language identifier
|
||||
* @returns {Extension} CodeMirror language extension
|
||||
*/
|
||||
function getLanguageExtension(lang) {
|
||||
const loaders = {
|
||||
javascript: () => { if (!_javascript) _javascript = require('@codemirror/lang-javascript').javascript; return _javascript(); },
|
||||
html: () => { if (!_html) _html = require('@codemirror/lang-html').html; return _html(); },
|
||||
css: () => { if (!_css) _css = require('@codemirror/lang-css').css; return _css(); },
|
||||
json: () => { if (!_json) _json = require('@codemirror/lang-json').json; return _json(); },
|
||||
python: () => { if (!_python) _python = require('@codemirror/lang-python').python; return _python(); },
|
||||
markdown: () => markdown({ base: markdownLanguage }),
|
||||
};
|
||||
loaders.js = loaders.javascript;
|
||||
loaders.py = loaders.python;
|
||||
|
||||
const loader = loaders[lang];
|
||||
return loader ? loader() : markdown({ base: markdownLanguage });
|
||||
}
|
||||
|
||||
module.exports = { createEditor, getLanguageExtension };
|
||||
+271
-116
@@ -2,15 +2,16 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval' https://cdn.jsdelivr.net; style-src 'self' 'unsafe-inline' https://cdnjs.cloudflare.com; img-src 'self' data: blob: file:; font-src 'self' data:; connect-src 'self' https://www.plantuml.com;">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>MarkdownConverter</title>
|
||||
<link rel="stylesheet" href="fonts.css">
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
<link rel="stylesheet" href="styles-modern.css">
|
||||
<link rel="stylesheet" href="styles-concreteinfo.css">
|
||||
<!-- Load external resources asynchronously -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css" media="print" onload="this.media='all'">
|
||||
<script defer src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script>
|
||||
<link rel="stylesheet" href="styles-sidebar.css">
|
||||
<link rel="stylesheet" href="styles-welcome.css">
|
||||
<link rel="stylesheet" href="../node_modules/highlight.js/styles/default.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
@@ -21,7 +22,7 @@
|
||||
<span class="app-title">MarkdownConverter</span>
|
||||
</div>
|
||||
<div class="app-header-right">
|
||||
<span class="app-version">v3.0.0</span>
|
||||
<span class="app-version">v4.0.0</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-bar" id="tab-bar">
|
||||
@@ -32,105 +33,122 @@
|
||||
<button class="new-tab-button" id="new-tab-btn" title="New tab">+</button>
|
||||
</div>
|
||||
<div class="toolbar">
|
||||
<button id="btn-bold" title="Bold">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M6 4h8a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"></path>
|
||||
<path d="M6 12h9a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-italic" title="Italic">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="19" y1="4" x2="10" y2="4"></line>
|
||||
<line x1="14" y1="20" x2="5" y2="20"></line>
|
||||
<line x1="15" y1="4" x2="9" y2="20"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-heading" title="Heading">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<polyline points="4 7 4 4 20 4 20 7"></polyline>
|
||||
<line x1="9" y1="20" x2="15" y2="20"></line>
|
||||
<line x1="12" y1="4" x2="12" y2="20"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-link" title="Link">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path>
|
||||
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-code" title="Code">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<polyline points="16 18 22 12 16 6"></polyline>
|
||||
<polyline points="8 6 2 12 8 18"></polyline>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-list" title="List">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="8" y1="6" x2="21" y2="6"></line>
|
||||
<line x1="8" y1="12" x2="21" y2="12"></line>
|
||||
<line x1="8" y1="18" x2="21" y2="18"></line>
|
||||
<line x1="3" y1="6" x2="3.01" y2="6"></line>
|
||||
<line x1="3" y1="12" x2="3.01" y2="12"></line>
|
||||
<line x1="3" y1="18" x2="3.01" y2="18"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-quote" title="Quote">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M3 21c3 0 7-1 7-8V5c0-1.25-.756-2.017-2-2H4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2 1 0 1 0 1 1v1c0 1-1 2-2 2s-1 .008-1 1.031V20c0 1 0 1 1 1z"></path>
|
||||
<path d="M15 21c3 0 7-1 7-8V5c0-1.25-.757-2.017-2-2h-4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2h.75c0 2.25.25 4-2.75 4v3c0 1 0 1 1 1z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-table" title="Insert Table">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
|
||||
<line x1="3" y1="9" x2="21" y2="9"></line>
|
||||
<line x1="3" y1="15" x2="21" y2="15"></line>
|
||||
<line x1="9" y1="3" x2="9" y2="21"></line>
|
||||
<line x1="15" y1="3" x2="15" y2="21"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-strikethrough" title="Strikethrough">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M16 4H9a3 3 0 0 0-2.83 4"></path>
|
||||
<path d="M14 12a4 4 0 0 1 0 8H6"></path>
|
||||
<line x1="4" y1="12" x2="20" y2="12"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-code-block" title="Code Block">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<rect x="2" y="6" width="20" height="12" rx="2"></rect>
|
||||
<path d="m10 10-2 2 2 2"></path>
|
||||
<path d="m14 10 2 2-2 2"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-horizontal-rule" title="Horizontal Rule">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="3" y1="12" x2="21" y2="12"></line>
|
||||
<line x1="3" y1="6" x2="21" y2="6"></line>
|
||||
<line x1="3" y1="18" x2="21" y2="18"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<div class="toolbar-group">
|
||||
<!-- Format: Bold, Italic, Strikethrough -->
|
||||
<button id="btn-bold" title="Bold (Ctrl+B)">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M6 4h8a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"></path>
|
||||
<path d="M6 12h9a4 4 0 0 1 4 4 4 4 0 0 1-4 4H6z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-italic" title="Italic (Ctrl+I)">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="19" y1="4" x2="10" y2="4"></line>
|
||||
<line x1="14" y1="20" x2="5" y2="20"></line>
|
||||
<line x1="15" y1="4" x2="9" y2="20"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-strikethrough" title="Strikethrough">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M16 4H9a3 3 0 0 0-2.83 4"></path>
|
||||
<path d="M14 12a4 4 0 0 1 0 8H6"></path>
|
||||
<line x1="4" y1="12" x2="20" y2="12"></line>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="toolbar-separator"></div>
|
||||
<button id="btn-find" title="Find & Replace (Ctrl+F)">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<circle cx="11" cy="11" r="8"></circle>
|
||||
<path d="m21 21-4.35-4.35"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-line-numbers" title="Toggle Line Numbers">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M3 6h18"></path>
|
||||
<path d="M3 12h18"></path>
|
||||
<path d="M3 18h18"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<div class="toolbar-group">
|
||||
<!-- Structure: Heading, List, Quote -->
|
||||
<button id="btn-heading" title="Heading">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<polyline points="4 7 4 4 20 4 20 7"></polyline>
|
||||
<line x1="9" y1="20" x2="15" y2="20"></line>
|
||||
<line x1="12" y1="4" x2="12" y2="20"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-list" title="List">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="8" y1="6" x2="21" y2="6"></line>
|
||||
<line x1="8" y1="12" x2="21" y2="12"></line>
|
||||
<line x1="8" y1="18" x2="21" y2="18"></line>
|
||||
<line x1="3" y1="6" x2="3.01" y2="6"></line>
|
||||
<line x1="3" y1="12" x2="3.01" y2="12"></line>
|
||||
<line x1="3" y1="18" x2="3.01" y2="18"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-quote" title="Quote">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M3 21c3 0 7-1 7-8V5c0-1.25-.756-2.017-2-2H4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2 1 0 1 0 1 1v1c0 1-1 2-2 2s-1 .008-1 1.031V20c0 1 0 1 1 1z"></path>
|
||||
<path d="M15 21c3 0 7-1 7-8V5c0-1.25-.757-2.017-2-2h-4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2h.75c0 2.25.25 4-2.75 4v3c0 1 0 1 1 1z"></path>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="toolbar-separator"></div>
|
||||
<button id="btn-preview-toggle" title="Toggle Preview">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
|
||||
<circle cx="12" cy="12" r="3"></circle>
|
||||
</svg>
|
||||
</button>
|
||||
<div class="toolbar-group">
|
||||
<!-- Insert: Link, Code, Code Block, Table, HR -->
|
||||
<button id="btn-link" title="Link">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path>
|
||||
<path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-code" title="Inline Code (Ctrl+`)">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<polyline points="16 18 22 12 16 6"></polyline>
|
||||
<polyline points="8 6 2 12 8 18"></polyline>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-code-block" title="Code Block">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<rect x="2" y="6" width="20" height="12" rx="2"></rect>
|
||||
<path d="m10 10-2 2 2 2"></path>
|
||||
<path d="m14 10 2 2-2 2"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-table" title="Insert Table">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
|
||||
<line x1="3" y1="9" x2="21" y2="9"></line>
|
||||
<line x1="3" y1="15" x2="21" y2="15"></line>
|
||||
<line x1="9" y1="3" x2="9" y2="21"></line>
|
||||
<line x1="15" y1="3" x2="15" y2="21"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-horizontal-rule" title="Horizontal Rule">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="3" y1="12" x2="21" y2="12"></line>
|
||||
<line x1="3" y1="6" x2="21" y2="6"></line>
|
||||
<line x1="3" y1="18" x2="21" y2="18"></line>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="toolbar-separator"></div>
|
||||
<div class="toolbar-group">
|
||||
<!-- View: Find, Line Numbers, Preview -->
|
||||
<button id="btn-find" title="Find & Replace (Ctrl+F)">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<circle cx="11" cy="11" r="8"></circle>
|
||||
<path d="m21 21-4.35-4.35"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-line-numbers" title="Toggle Line Numbers">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M3 6h18"></path>
|
||||
<path d="M3 12h18"></path>
|
||||
<path d="M3 18h18"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button id="btn-preview-toggle" title="Toggle Preview (Ctrl+Shift+P)">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path>
|
||||
<circle cx="12" cy="12" r="3"></circle>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="breadcrumb-bar" id="breadcrumb-bar">
|
||||
<span class="breadcrumb-path" id="breadcrumb-path">Untitled</span>
|
||||
</div>
|
||||
|
||||
<!-- Find & Replace Dialog -->
|
||||
@@ -312,16 +330,86 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Command Palette -->
|
||||
<div id="command-palette" class="command-palette hidden">
|
||||
<div class="command-palette-content">
|
||||
<input type="text" id="command-search" placeholder="Type a command..." autofocus>
|
||||
<div id="command-list" class="command-list"></div>
|
||||
<div class="command-palette-footer">
|
||||
<span>↑↓ Navigate</span>
|
||||
<span>Enter Execute</span>
|
||||
<span>Esc Close</span>
|
||||
<!-- Print Preview Dialog -->
|
||||
<div class="export-dialog hidden" id="print-preview-overlay">
|
||||
<div class="export-dialog-content print-preview-dialog">
|
||||
<div class="export-dialog-header">
|
||||
<h3>Print Preview</h3>
|
||||
<button id="print-preview-close" title="Close" style="background:none;border:none;color:white;font-size:24px;cursor:pointer;">×</button>
|
||||
</div>
|
||||
<div class="print-preview-body">
|
||||
<div class="print-preview-sidebar">
|
||||
<div class="print-option-group">
|
||||
<label>Paper Size</label>
|
||||
<select id="print-paper-size">
|
||||
<option value="A3">A3</option>
|
||||
<option value="A4" selected>A4</option>
|
||||
<option value="A5">A5</option>
|
||||
<option value="Letter">Letter</option>
|
||||
<option value="Legal">Legal</option>
|
||||
<option value="Tabloid">Tabloid</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="print-option-group">
|
||||
<label>Orientation</label>
|
||||
<select id="print-orientation">
|
||||
<option value="portrait" selected>Portrait</option>
|
||||
<option value="landscape">Landscape</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="print-option-group">
|
||||
<label>Margins</label>
|
||||
<select id="print-margins">
|
||||
<option value="default" selected>Default</option>
|
||||
<option value="narrow">Narrow</option>
|
||||
<option value="wide">Wide</option>
|
||||
<option value="none">None</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="print-option-group">
|
||||
<label>Scale</label>
|
||||
<div class="scale-control">
|
||||
<input type="range" id="print-scale" min="50" max="200" value="100">
|
||||
<span id="print-scale-value">100%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="print-option-group">
|
||||
<label class="checkbox-label">
|
||||
<input type="checkbox" id="print-headers" checked>
|
||||
Headers & Footers
|
||||
</label>
|
||||
</div>
|
||||
<div class="print-option-group">
|
||||
<label class="checkbox-label">
|
||||
<input type="checkbox" id="print-background" checked>
|
||||
Background Colors
|
||||
</label>
|
||||
</div>
|
||||
<div class="print-option-group">
|
||||
<label>Pages</label>
|
||||
<select id="print-pages">
|
||||
<option value="all" selected>All</option>
|
||||
<option value="custom">Custom Range</option>
|
||||
</select>
|
||||
<input type="text" id="print-page-range" placeholder="e.g., 1-3, 5" class="hidden print-range-input">
|
||||
</div>
|
||||
<div class="print-actions">
|
||||
<button class="btn-primary" id="print-execute">Print</button>
|
||||
<button class="btn-secondary" id="print-cancel">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="print-preview-content">
|
||||
<iframe id="print-preview-frame" style="width:100%;height:100%;border:none;background:white;"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Command Palette -->
|
||||
<div class="command-palette-overlay hidden" id="command-palette-overlay">
|
||||
<div class="command-palette">
|
||||
<input type="text" class="command-palette-input" id="command-palette-input" placeholder="Type a command..." autocomplete="off">
|
||||
<div class="command-palette-results" id="command-palette-results"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1293,12 +1381,52 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="editor-container">
|
||||
<div class="main-content" id="main-content">
|
||||
<!-- Sidebar -->
|
||||
<div class="sidebar collapsed" id="sidebar">
|
||||
<div class="sidebar-icons">
|
||||
<button class="sidebar-icon" data-panel="explorer" title="File Explorer (Ctrl+Shift+E)">
|
||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M22 19a2 2 0 01-2 2H4a2 2 0 01-2-2V5a2 2 0 012-2h5l2 3h9a2 2 0 012 2z"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button class="sidebar-icon" data-panel="git" title="Git (Ctrl+Shift+G)">
|
||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="6" y1="3" x2="6" y2="15"/>
|
||||
<circle cx="18" cy="6" r="3"/>
|
||||
<circle cx="6" cy="6" r="3"/>
|
||||
<path d="M18 9a9 9 0 01-9 9"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button class="sidebar-icon" data-panel="snippets" title="Snippets (Ctrl+Shift+S)">
|
||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<polyline points="16 18 22 12 16 6"/>
|
||||
<polyline points="8 6 2 12 8 18"/>
|
||||
</svg>
|
||||
</button>
|
||||
<button class="sidebar-icon" data-panel="templates" title="Templates">
|
||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<rect x="3" y="3" width="18" height="18" rx="2" ry="2"/>
|
||||
<line x1="3" y1="9" x2="21" y2="9"/>
|
||||
<line x1="9" y1="21" x2="9" y2="9"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="sidebar-panel" id="sidebar-panel">
|
||||
<div class="sidebar-panel-header">
|
||||
<span class="sidebar-panel-title"></span>
|
||||
<button class="sidebar-panel-close" title="Close panel">×</button>
|
||||
</div>
|
||||
<div class="sidebar-panel-content" id="sidebar-panel-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Editor Container -->
|
||||
<div class="editor-container">
|
||||
<div class="tab-content active" id="tab-content-1" data-tab-id="1">
|
||||
<div id="editor-pane-1" class="pane">
|
||||
<div class="editor-wrapper">
|
||||
<div id="line-numbers-1" class="line-numbers hidden"></div>
|
||||
<textarea id="editor-1" class="editor-textarea"></textarea>
|
||||
<div id="editor-cm-1" class="codemirror-container"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pane-resizer" id="pane-resizer-1" title="Drag to resize"></div>
|
||||
@@ -1401,11 +1529,38 @@
|
||||
<canvas id="pdf-canvas"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="status-bar">
|
||||
<span id="status-text">Ready</span>
|
||||
<span id="word-count">Words: 0 | Characters: 0</span>
|
||||
<!-- Bottom Panel (REPL Output) -->
|
||||
<div class="bottom-panel collapsed" id="bottom-panel">
|
||||
<div class="bottom-panel-header">
|
||||
<span class="bottom-panel-title">Output</span>
|
||||
<div class="bottom-panel-actions">
|
||||
<button class="bottom-panel-btn" id="repl-clear" title="Clear output">Clear</button>
|
||||
<button class="bottom-panel-btn" id="bottom-panel-toggle" title="Toggle panel">▼</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom-panel-content" id="repl-output"></div>
|
||||
</div>
|
||||
|
||||
<div class="status-bar" id="status-bar">
|
||||
<div class="status-bar-left">
|
||||
<span class="status-item" id="status-text">Ready</span>
|
||||
<span class="status-separator">|</span>
|
||||
<span class="status-item" id="status-file-path" title=""></span>
|
||||
</div>
|
||||
<div class="status-bar-right">
|
||||
<span class="status-item" id="word-count">Words: 0</span>
|
||||
<span class="status-separator">|</span>
|
||||
<span class="status-item" id="char-count">Chars: 0</span>
|
||||
<span class="status-separator">|</span>
|
||||
<span class="status-item" id="line-col">Ln 1, Col 1</span>
|
||||
<span class="status-separator">|</span>
|
||||
<span class="status-item" id="encoding">UTF-8</span>
|
||||
<span class="status-separator">|</span>
|
||||
<span class="status-item" id="language-mode">Markdown</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
+625
-24
@@ -50,6 +50,48 @@ function safeExecFile(command, args, options = {}) {
|
||||
});
|
||||
}
|
||||
|
||||
// File size validation
|
||||
const MAX_FILE_SIZE_MB = 50;
|
||||
const MAX_FILE_SIZE = MAX_FILE_SIZE_MB * 1024 * 1024;
|
||||
|
||||
// Sanitize error messages to strip absolute file paths
|
||||
function sanitizeErrorMessage(message) {
|
||||
if (typeof message !== 'string') return String(message);
|
||||
// Strip absolute Windows paths, keeping only filename
|
||||
return message
|
||||
.replace(/[A-Z]:\\[^\s"']+\\([^\s"'\\]+)/gi, '$1')
|
||||
.replace(/\/[^\s"']+\/([^\s"'/]+)/g, '$1');
|
||||
}
|
||||
|
||||
// Rate limiter for conversions
|
||||
function createRateLimiter(minIntervalMs = 2000) {
|
||||
let lastCall = 0;
|
||||
return function canProceed() {
|
||||
const now = Date.now();
|
||||
if (now - lastCall < minIntervalMs) return false;
|
||||
lastCall = now;
|
||||
return true;
|
||||
};
|
||||
}
|
||||
const conversionLimiter = createRateLimiter(2000);
|
||||
|
||||
// Convert structured data formats to markdown code blocks
|
||||
function convertDataToMarkdown(content, format) {
|
||||
switch (format) {
|
||||
case 'json':
|
||||
return '```json\n' + content + '\n```';
|
||||
case 'yaml':
|
||||
case 'yml':
|
||||
return '```yaml\n' + content + '\n```';
|
||||
case 'xml':
|
||||
return '```xml\n' + content + '\n```';
|
||||
case 'toml':
|
||||
return '```toml\n' + content + '\n```';
|
||||
default:
|
||||
return '```\n' + content + '\n```';
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Run Pandoc command safely with execFile
|
||||
* @param {string[]} args - Pandoc arguments array
|
||||
@@ -282,21 +324,60 @@ function createWindow() {
|
||||
mainWindow = new BrowserWindow({
|
||||
width: 1200,
|
||||
height: 800,
|
||||
show: false,
|
||||
webPreferences: {
|
||||
nodeIntegration: true,
|
||||
contextIsolation: false
|
||||
contextIsolation: false,
|
||||
spellcheck: true
|
||||
},
|
||||
icon: path.join(__dirname, '../assets/icon.png')
|
||||
});
|
||||
|
||||
mainWindow.loadFile(path.join(__dirname, 'index.html'));
|
||||
|
||||
// Show window only after content is ready — avoids blank flash
|
||||
mainWindow.once('ready-to-show', () => {
|
||||
mainWindow.show();
|
||||
});
|
||||
|
||||
createMenu();
|
||||
|
||||
mainWindow.on('closed', () => {
|
||||
mainWindow = null;
|
||||
});
|
||||
|
||||
// Spell check context menu
|
||||
mainWindow.webContents.on('context-menu', (event, params) => {
|
||||
const { Menu, MenuItem } = require('electron');
|
||||
const menu = new Menu();
|
||||
|
||||
// Add spell check suggestions
|
||||
if (params.misspelledWord) {
|
||||
for (const suggestion of params.dictionarySuggestions) {
|
||||
menu.append(new MenuItem({
|
||||
label: suggestion,
|
||||
click: () => mainWindow.webContents.replaceMisspelling(suggestion)
|
||||
}));
|
||||
}
|
||||
if (params.dictionarySuggestions.length > 0) {
|
||||
menu.append(new MenuItem({ type: 'separator' }));
|
||||
}
|
||||
menu.append(new MenuItem({
|
||||
label: 'Add to Dictionary',
|
||||
click: () => mainWindow.webContents.session.addWordToSpellCheckerDictionary(params.misspelledWord)
|
||||
}));
|
||||
menu.append(new MenuItem({ type: 'separator' }));
|
||||
}
|
||||
|
||||
// Standard context menu items
|
||||
menu.append(new MenuItem({ role: 'cut' }));
|
||||
menu.append(new MenuItem({ role: 'copy' }));
|
||||
menu.append(new MenuItem({ role: 'paste' }));
|
||||
menu.append(new MenuItem({ role: 'selectAll' }));
|
||||
|
||||
menu.popup();
|
||||
});
|
||||
|
||||
// Wait for the page to fully load before sending file data
|
||||
mainWindow.webContents.on('did-finish-load', () => {
|
||||
console.log('Window finished loading');
|
||||
@@ -321,11 +402,16 @@ function buildRecentFilesMenu() {
|
||||
label: filePath.split(/[\\/]/).pop(), // Get filename only
|
||||
click: () => {
|
||||
if (fs.existsSync(filePath)) {
|
||||
const stats = fs.statSync(filePath);
|
||||
if (stats.size > MAX_FILE_SIZE) {
|
||||
dialog.showErrorBox('File Too Large', `File exceeds the ${MAX_FILE_SIZE_MB}MB size limit.`);
|
||||
return;
|
||||
}
|
||||
currentFile = filePath;
|
||||
const content = fs.readFileSync(filePath, 'utf-8');
|
||||
mainWindow.webContents.send('file-opened', { path: filePath, content });
|
||||
} else {
|
||||
dialog.showErrorBox('File Not Found', `The file "${filePath}" could not be found.`);
|
||||
dialog.showErrorBox('File Not Found', sanitizeErrorMessage(`The file "${filePath}" could not be found.`));
|
||||
}
|
||||
},
|
||||
toolTip: filePath // Show full path in tooltip
|
||||
@@ -403,6 +489,22 @@ function createMenu() {
|
||||
submenu: buildRecentFilesMenu()
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: 'New from Template',
|
||||
submenu: [
|
||||
{ label: 'Blog Post', click: () => mainWindow.webContents.send('load-template-menu', 'blog-post.md') },
|
||||
{ label: 'Meeting Notes', click: () => mainWindow.webContents.send('load-template-menu', 'meeting-notes.md') },
|
||||
{ label: 'Technical Spec', click: () => mainWindow.webContents.send('load-template-menu', 'technical-spec.md') },
|
||||
{ label: 'Changelog', click: () => mainWindow.webContents.send('load-template-menu', 'changelog.md') },
|
||||
{ label: 'README', click: () => mainWindow.webContents.send('load-template-menu', 'readme.md') },
|
||||
{ label: 'Project Plan', click: () => mainWindow.webContents.send('load-template-menu', 'project-plan.md') },
|
||||
{ label: 'API Documentation', click: () => mainWindow.webContents.send('load-template-menu', 'api-docs.md') },
|
||||
{ label: 'Tutorial', click: () => mainWindow.webContents.send('load-template-menu', 'tutorial.md') },
|
||||
{ label: 'Release Notes', click: () => mainWindow.webContents.send('load-template-menu', 'release-notes.md') },
|
||||
{ label: 'Comparison', click: () => mainWindow.webContents.send('load-template-menu', 'comparison.md') }
|
||||
]
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: 'Import Document...',
|
||||
accelerator: 'CmdOrCtrl+I',
|
||||
@@ -425,6 +527,17 @@ function createMenu() {
|
||||
{ label: 'OpenDocument Presentation (ODP)', click: () => exportFile('odp') },
|
||||
{ type: 'separator' },
|
||||
{ label: 'CSV (Tables)', click: () => exportSpreadsheet('csv') },
|
||||
{ type: 'separator' },
|
||||
{ label: 'JSON (.json)', click: () => exportFile('json') },
|
||||
{ label: 'YAML (.yaml)', click: () => exportFile('yaml') },
|
||||
{ label: 'XML (.xml)', click: () => exportFile('xml') },
|
||||
{ label: 'TOML (.toml)', click: () => exportFile('toml') },
|
||||
{ type: 'separator' },
|
||||
{ label: 'Reveal.js Slides (.html)', click: () => exportFile('revealjs') },
|
||||
{ label: 'Beamer Slides (.pdf)', click: () => exportFile('beamer') },
|
||||
{ type: 'separator' },
|
||||
{ label: 'Confluence Wiki (.txt)', click: () => exportFile('confluence') },
|
||||
{ label: 'MOBI E-book (.mobi)', click: () => exportFile('mobi') },
|
||||
]
|
||||
},
|
||||
{ type: 'separator' },
|
||||
@@ -483,9 +596,29 @@ function createMenu() {
|
||||
submenu: [
|
||||
{
|
||||
label: 'Toggle Preview',
|
||||
accelerator: 'CmdOrCtrl+Shift+P',
|
||||
accelerator: 'CmdOrCtrl+Shift+V',
|
||||
click: () => mainWindow.webContents.send('toggle-preview')
|
||||
},
|
||||
{
|
||||
label: 'Command Palette',
|
||||
accelerator: 'CmdOrCtrl+Shift+P',
|
||||
click: () => mainWindow.webContents.send('toggle-command-palette')
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: 'Sidebar',
|
||||
submenu: [
|
||||
{ label: 'File Explorer', click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'explorer') },
|
||||
{ label: 'Git', click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'git') },
|
||||
{ label: 'Snippets', click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'snippets') },
|
||||
{ label: 'Templates', click: () => mainWindow.webContents.send('toggle-sidebar-panel', 'templates') }
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'Bottom Panel (REPL)',
|
||||
click: () => mainWindow.webContents.send('toggle-bottom-panel')
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: 'Theme',
|
||||
submenu: [
|
||||
@@ -541,6 +674,15 @@ function createMenu() {
|
||||
]
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{
|
||||
label: 'Spell Check',
|
||||
type: 'checkbox',
|
||||
checked: true,
|
||||
click: (menuItem) => {
|
||||
mainWindow.webContents.session.setSpellCheckerEnabled(menuItem.checked);
|
||||
}
|
||||
},
|
||||
{ type: 'separator' },
|
||||
{ label: 'Reload', accelerator: 'CmdOrCtrl+R', role: 'reload' },
|
||||
{ label: 'Toggle DevTools', accelerator: 'F12', role: 'toggleDevTools' },
|
||||
{ type: 'separator' },
|
||||
@@ -783,7 +925,7 @@ function showAboutDialog() {
|
||||
<body>
|
||||
<img src="${iconBase64}" class="logo" alt="MarkdownConverter">
|
||||
<h1>MarkdownConverter</h1>
|
||||
<div class="version">Version 3.0.0</div>
|
||||
<div class="version">Version 4.0.0</div>
|
||||
|
||||
<div class="company">
|
||||
<span>by</span>
|
||||
@@ -812,7 +954,7 @@ function showAboutDialog() {
|
||||
|
||||
<div class="footer">
|
||||
<p>License: MIT</p>
|
||||
<p>© 2024-2025 ConcreteInfo. All rights reserved.</p>
|
||||
<p>© 2024-2026 ConcreteInfo. All rights reserved.</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>`;
|
||||
@@ -945,6 +1087,11 @@ function openPDFFile() {
|
||||
});
|
||||
|
||||
if (files && files[0]) {
|
||||
const stats = fs.statSync(files[0]);
|
||||
if (stats.size > MAX_FILE_SIZE) {
|
||||
dialog.showErrorBox('File Too Large', `File exceeds the ${MAX_FILE_SIZE_MB}MB size limit.`);
|
||||
return;
|
||||
}
|
||||
mainWindow.webContents.send('open-pdf-viewer', files[0]);
|
||||
}
|
||||
}
|
||||
@@ -954,13 +1101,27 @@ function openFile() {
|
||||
properties: ['openFile'],
|
||||
filters: [
|
||||
{ name: 'Markdown', extensions: ['md', 'markdown'] },
|
||||
{ name: 'Developer Formats', extensions: ['json', 'yaml', 'yml', 'xml', 'toml'] },
|
||||
{ name: 'All Files', extensions: ['*'] }
|
||||
]
|
||||
});
|
||||
|
||||
if (files && files[0]) {
|
||||
const stats = fs.statSync(files[0]);
|
||||
if (stats.size > MAX_FILE_SIZE) {
|
||||
dialog.showErrorBox('File Too Large', `File exceeds the ${MAX_FILE_SIZE_MB}MB size limit.`);
|
||||
return;
|
||||
}
|
||||
currentFile = files[0];
|
||||
const content = fs.readFileSync(currentFile, 'utf-8');
|
||||
const ext = path.extname(currentFile).toLowerCase().slice(1);
|
||||
let content = fs.readFileSync(currentFile, 'utf-8');
|
||||
|
||||
// Wrap developer format files in code blocks for markdown display
|
||||
const devFormats = ['json', 'yaml', 'yml', 'xml', 'toml'];
|
||||
if (devFormats.includes(ext)) {
|
||||
content = convertDataToMarkdown(content, ext);
|
||||
}
|
||||
|
||||
mainWindow.webContents.send('file-opened', { path: currentFile, content });
|
||||
}
|
||||
}
|
||||
@@ -975,6 +1136,11 @@ function openPdfFile() {
|
||||
});
|
||||
|
||||
if (files && files[0]) {
|
||||
const stats = fs.statSync(files[0]);
|
||||
if (stats.size > MAX_FILE_SIZE) {
|
||||
dialog.showErrorBox('File Too Large', `File exceeds the ${MAX_FILE_SIZE_MB}MB size limit.`);
|
||||
return;
|
||||
}
|
||||
mainWindow.webContents.send('open-pdf-file', files[0]);
|
||||
}
|
||||
}
|
||||
@@ -1158,7 +1324,7 @@ ipcMain.on('browse-header-footer-logo', async (event, position) => {
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Logo browse error:', error);
|
||||
dialog.showErrorBox('Logo Error', `Failed to select logo: ${error.message}`);
|
||||
dialog.showErrorBox('Logo Error', sanitizeErrorMessage(`Failed to select logo: ${error.message}`));
|
||||
}
|
||||
});
|
||||
|
||||
@@ -1180,7 +1346,7 @@ ipcMain.on('save-header-footer-logo', async (event, { position, filePath }) => {
|
||||
|
||||
// Verify source file exists
|
||||
if (!fs.existsSync(filePath)) {
|
||||
dialog.showErrorBox('Logo Error', `Source file not found: ${filePath}`);
|
||||
dialog.showErrorBox('Logo Error', sanitizeErrorMessage(`Source file not found: ${filePath}`));
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -1202,7 +1368,7 @@ ipcMain.on('save-header-footer-logo', async (event, { position, filePath }) => {
|
||||
event.reply('header-footer-logo-saved', { position, path: destPath });
|
||||
} catch (error) {
|
||||
console.error('Logo save error:', error);
|
||||
dialog.showErrorBox('Logo Error', `Failed to save logo: ${error.message}`);
|
||||
dialog.showErrorBox('Logo Error', sanitizeErrorMessage(`Failed to save logo: ${error.message}`));
|
||||
}
|
||||
});
|
||||
|
||||
@@ -1457,7 +1623,7 @@ async function exportWordWithTemplate() {
|
||||
});
|
||||
|
||||
} catch (error) {
|
||||
dialog.showErrorBox('Export Error', `Failed to export document: ${error.message}`);
|
||||
dialog.showErrorBox('Export Error', sanitizeErrorMessage(`Failed to export document: ${error.message}`));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1505,7 +1671,7 @@ async function exportPDFViaWordTemplate() {
|
||||
|
||||
if (error) {
|
||||
dialog.showErrorBox('PDF Conversion Error',
|
||||
`Failed to convert to PDF. Please ensure LibreOffice is installed.\n\nError: ${error.message}`);
|
||||
sanitizeErrorMessage(`Failed to convert to PDF. Please ensure LibreOffice is installed.\n\nError: ${error.message}`));
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -1530,7 +1696,7 @@ async function exportPDFViaWordTemplate() {
|
||||
});
|
||||
|
||||
} catch (error) {
|
||||
dialog.showErrorBox('Export Error', `Failed to export PDF: ${error.message}`);
|
||||
dialog.showErrorBox('Export Error', sanitizeErrorMessage(`Failed to export PDF: ${error.message}`));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1579,6 +1745,10 @@ function checkConverterAvailable(tool) {
|
||||
|
||||
// Handle universal file conversion
|
||||
ipcMain.on('universal-convert', async (event, { tool, fromFormat, toFormat, filePath }) => {
|
||||
if (!conversionLimiter()) {
|
||||
mainWindow.webContents.send('conversion-status', 'Please wait before converting again...');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
mainWindow.webContents.send('conversion-status', 'Checking converter availability...');
|
||||
|
||||
@@ -1657,6 +1827,91 @@ ipcMain.on('universal-convert', async (event, { tool, fromFormat, toFormat, file
|
||||
}
|
||||
});
|
||||
|
||||
// Handle universal batch file conversion
|
||||
ipcMain.on('universal-convert-batch', async (event, { tool, fromFormat, toFormat, inputFolder, outputFolder, includeSubfolders, advancedOptions }) => {
|
||||
if (!conversionLimiter()) {
|
||||
mainWindow.webContents.send('conversion-status', 'Please wait before converting again...');
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const toolAvailable = await checkConverterAvailable(tool);
|
||||
if (!toolAvailable) {
|
||||
throw new Error(`${tool} is not installed or not found in PATH. Please install it first.`);
|
||||
}
|
||||
|
||||
// Collect matching files
|
||||
const files = [];
|
||||
function collectFiles(dir) {
|
||||
const entries = fs.readdirSync(dir, { withFileTypes: true });
|
||||
for (const entry of entries) {
|
||||
const fullPath = path.join(dir, entry.name);
|
||||
if (entry.isDirectory() && includeSubfolders) {
|
||||
collectFiles(fullPath);
|
||||
} else if (entry.isFile() && entry.name.toLowerCase().endsWith(`.${fromFormat}`)) {
|
||||
files.push(fullPath);
|
||||
}
|
||||
}
|
||||
}
|
||||
collectFiles(inputFolder);
|
||||
|
||||
if (files.length === 0) {
|
||||
mainWindow.webContents.send('conversion-complete', { success: false, error: `No .${fromFormat} files found in the selected folder.` });
|
||||
return;
|
||||
}
|
||||
|
||||
let completed = 0;
|
||||
let failed = 0;
|
||||
|
||||
for (const filePath of files) {
|
||||
const relativePath = path.relative(inputFolder, filePath);
|
||||
const outputPath = path.join(outputFolder, relativePath.replace(/\.[^/.]+$/, `.${toFormat}`));
|
||||
|
||||
// Ensure output subdirectory exists
|
||||
fs.mkdirSync(path.dirname(outputPath), { recursive: true });
|
||||
|
||||
mainWindow.webContents.send('conversion-status', `Converting ${completed + 1}/${files.length}: ${path.basename(filePath)}`);
|
||||
|
||||
let conversionInfo;
|
||||
switch (tool) {
|
||||
case 'libreoffice': conversionInfo = convertWithLibreOffice(filePath, toFormat, outputPath); break;
|
||||
case 'imagemagick': conversionInfo = convertWithImageMagick(filePath, outputPath); break;
|
||||
case 'ffmpeg': conversionInfo = convertWithFFmpeg(filePath, outputPath); break;
|
||||
case 'pandoc': conversionInfo = convertWithPandoc(filePath, outputPath); break;
|
||||
default: throw new Error(`Unknown conversion tool: ${tool}`);
|
||||
}
|
||||
|
||||
await new Promise((resolve) => {
|
||||
execFile(conversionInfo.command, conversionInfo.args, (error) => {
|
||||
if (error) { failed++; } else { completed++; }
|
||||
resolve();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
mainWindow.webContents.send('conversion-complete', {
|
||||
success: true,
|
||||
outputPath: outputFolder
|
||||
});
|
||||
|
||||
dialog.showMessageBox(mainWindow, {
|
||||
type: 'info',
|
||||
title: 'Batch Conversion Complete',
|
||||
message: `Batch conversion finished!`,
|
||||
detail: `Converted: ${completed}/${files.length} files${failed > 0 ? ` (${failed} failed)` : ''}\nOutput: ${outputFolder}`,
|
||||
buttons: ['OK']
|
||||
});
|
||||
} catch (error) {
|
||||
mainWindow.webContents.send('conversion-complete', { success: false, error: error.message });
|
||||
dialog.showMessageBox(mainWindow, {
|
||||
type: 'error',
|
||||
title: 'Batch Conversion Failed',
|
||||
message: 'Batch conversion failed',
|
||||
detail: error.message,
|
||||
buttons: ['OK']
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// LibreOffice conversion - returns {command, args} for execFile (safer than exec)
|
||||
function convertWithLibreOffice(inputFile, outputFormat, outputPath) {
|
||||
const outputDir = path.dirname(outputPath);
|
||||
@@ -1717,10 +1972,19 @@ function convertWithPandoc(inputFile, outputPath) {
|
||||
}
|
||||
|
||||
function performExportWithOptions(format, options) {
|
||||
// Map format names to file extensions
|
||||
const formatExtMap = {
|
||||
revealjs: 'html',
|
||||
beamer: 'pdf',
|
||||
confluence: 'txt',
|
||||
jira: 'txt',
|
||||
};
|
||||
const fileExt = formatExtMap[format] || format;
|
||||
|
||||
const outputFile = dialog.showSaveDialogSync(mainWindow, {
|
||||
defaultPath: currentFile.replace(/\.[^/.]+$/, `.${format}`),
|
||||
defaultPath: currentFile.replace(/\.[^/.]+$/, `.${fileExt}`),
|
||||
filters: [
|
||||
{ name: format.toUpperCase(), extensions: [format] }
|
||||
{ name: format.toUpperCase(), extensions: [fileExt] }
|
||||
]
|
||||
});
|
||||
|
||||
@@ -1851,13 +2115,59 @@ function performExportWithOptions(format, options) {
|
||||
pandocCmd += ` --variable footer="${footerText}"`;
|
||||
}
|
||||
exportWithPandoc(pandocCmd, outputFile, format);
|
||||
} else if (format === 'json') {
|
||||
pandocCmd = `${getPandocPath()} "${currentFile}" -t json -o "${outputFile}"`;
|
||||
exportWithPandoc(pandocCmd, outputFile, format);
|
||||
} else if (format === 'yaml' || format === 'xml' || format === 'toml') {
|
||||
// For YAML/XML/TOML, save the raw markdown content with the new extension
|
||||
try {
|
||||
const content = fs.readFileSync(currentFile, 'utf-8');
|
||||
fs.writeFileSync(outputFile, content, 'utf-8');
|
||||
showExportSuccess(outputFile);
|
||||
} catch (err) {
|
||||
dialog.showErrorBox('Export Error', sanitizeErrorMessage(`Failed to export: ${err.message}`));
|
||||
}
|
||||
} else if (format === 'revealjs') {
|
||||
pandocCmd = `${getPandocPath()} "${currentFile}" -t revealjs -s -o "${outputFile}" --slide-level=2`;
|
||||
exportWithPandoc(pandocCmd, outputFile, format);
|
||||
} else if (format === 'beamer') {
|
||||
pandocCmd = `${getPandocPath()} "${currentFile}" -t beamer -o "${outputFile}"`;
|
||||
exportWithPandoc(pandocCmd, outputFile, format);
|
||||
} else if (format === 'confluence' || format === 'jira') {
|
||||
pandocCmd = `${getPandocPath()} "${currentFile}" -t jira -o "${outputFile}"`;
|
||||
exportWithPandoc(pandocCmd, outputFile, format);
|
||||
} else if (format === 'mobi') {
|
||||
// First export to EPUB, then try ebook-convert if available
|
||||
const epubFile = outputFile.replace(/\.mobi$/i, '.epub');
|
||||
pandocCmd = `${getPandocPath()} "${currentFile}" -o "${epubFile}"`;
|
||||
runPandocCmd(pandocCmd, (error) => {
|
||||
if (error) {
|
||||
dialog.showErrorBox('Export Error', sanitizeErrorMessage(`Failed to export EPUB intermediate: ${error.message}`));
|
||||
return;
|
||||
}
|
||||
// Try ebook-convert (Calibre) for MOBI
|
||||
execFile('ebook-convert', [epubFile, outputFile], (ebookError) => {
|
||||
if (ebookError) {
|
||||
dialog.showMessageBox(mainWindow, {
|
||||
type: 'warning',
|
||||
title: 'MOBI Export - Partial',
|
||||
message: `Calibre's ebook-convert was not found. The file has been exported as EPUB instead.\n\nEPUB saved to: ${epubFile}\n\nTo get MOBI output, install Calibre from: https://calibre-ebook.com/`,
|
||||
buttons: ['OK']
|
||||
});
|
||||
} else {
|
||||
// Clean up intermediate EPUB
|
||||
try { fs.unlinkSync(epubFile); } catch (e) { /* ignore */ }
|
||||
showExportSuccess(outputFile);
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
// Generic export for other formats
|
||||
exportWithPandoc(pandocCmd, outputFile, format);
|
||||
}
|
||||
}).catch((error) => {
|
||||
console.error('Error checking pandoc availability:', error);
|
||||
dialog.showErrorBox('Export Error', `Error checking system requirements: ${error.message}`);
|
||||
dialog.showErrorBox('Export Error', sanitizeErrorMessage(`Error checking system requirements: ${error.message}`));
|
||||
});
|
||||
}
|
||||
|
||||
@@ -1967,7 +2277,7 @@ function exportWithPandoc(pandocCmd, outputFile, format) {
|
||||
|
||||
errorMessage += `\n\nCommand used: ${pandocCmd}`;
|
||||
|
||||
dialog.showErrorBox('Export Error', errorMessage);
|
||||
dialog.showErrorBox('Export Error', sanitizeErrorMessage(errorMessage));
|
||||
} else {
|
||||
console.log(`Successfully exported to ${format}:`, outputFile);
|
||||
console.log(`Pandoc stdout:`, stdout);
|
||||
@@ -2159,7 +2469,7 @@ function exportToHTML(outputFile) {
|
||||
showExportSuccess(outputFile);
|
||||
} catch (error) {
|
||||
console.error('HTML export error:', error);
|
||||
dialog.showErrorBox('HTML Export Error', `Failed to export HTML: ${error.message}`);
|
||||
dialog.showErrorBox('HTML Export Error', sanitizeErrorMessage(`Failed to export HTML: ${error.message}`));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2291,13 +2601,13 @@ function exportToPDFElectron(outputFile) {
|
||||
pdfWindow.close();
|
||||
console.error('Electron PDF export error:', error);
|
||||
dialog.showErrorBox('PDF Export Error',
|
||||
`Failed to export PDF using built-in engine: ${error.message}\n\n` +
|
||||
`For better PDF export, please install Pandoc with LaTeX support.`
|
||||
sanitizeErrorMessage(`Failed to export PDF using built-in engine: ${error.message}\n\n` +
|
||||
`For better PDF export, please install Pandoc with LaTeX support.`)
|
||||
);
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('PDF export setup error:', error);
|
||||
dialog.showErrorBox('PDF Export Error', `Failed to setup PDF export: ${error.message}`);
|
||||
dialog.showErrorBox('PDF Export Error', sanitizeErrorMessage(`Failed to setup PDF export: ${error.message}`));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2323,13 +2633,18 @@ function importDocument() {
|
||||
{ name: 'Web Formats', extensions: ['html', 'htm', 'xhtml'] },
|
||||
{ name: 'Wiki Formats', extensions: ['mediawiki', 'dokuwiki', 'tikiwiki', 'twiki'] },
|
||||
{ name: 'CSV/TSV', extensions: ['csv', 'tsv'] },
|
||||
{ name: 'JSON', extensions: ['json'] },
|
||||
{ name: 'Developer Formats', extensions: ['json', 'yaml', 'yml', 'xml', 'toml'] },
|
||||
{ name: 'All Files', extensions: ['*'] }
|
||||
]
|
||||
});
|
||||
|
||||
if (files && files[0]) {
|
||||
const inputFile = files[0];
|
||||
const stats = fs.statSync(inputFile);
|
||||
if (stats.size > MAX_FILE_SIZE) {
|
||||
dialog.showErrorBox('File Too Large', `File exceeds the ${MAX_FILE_SIZE_MB}MB size limit.`);
|
||||
return;
|
||||
}
|
||||
const ext = path.extname(inputFile).toLowerCase().slice(1);
|
||||
const outputFile = inputFile.replace(/\.[^/.]+$/, '.md');
|
||||
|
||||
@@ -2351,12 +2666,29 @@ function importDocument() {
|
||||
additionalOptions = '--from=json -t markdown';
|
||||
}
|
||||
|
||||
// For YAML, XML, TOML - wrap content in code blocks directly
|
||||
if (['yaml', 'yml', 'xml', 'toml'].includes(ext)) {
|
||||
const rawContent = fs.readFileSync(inputFile, 'utf-8');
|
||||
const mdContent = convertDataToMarkdown(rawContent, ext);
|
||||
const mdOutputFile = inputFile.replace(/\.[^/.]+$/, '.md');
|
||||
fs.writeFileSync(mdOutputFile, mdContent, 'utf-8');
|
||||
currentFile = mdOutputFile;
|
||||
mainWindow.webContents.send('file-opened', { path: mdOutputFile, content: mdContent });
|
||||
dialog.showMessageBox(mainWindow, {
|
||||
type: 'info',
|
||||
title: 'Import Complete',
|
||||
message: `Document imported successfully as ${path.basename(mdOutputFile)}\n\nOriginal format: ${ext.toUpperCase()}\nConverted to: Markdown`,
|
||||
buttons: ['OK']
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// Convert to markdown using pandoc (using runPandocCmd for safety)
|
||||
const pandocCmd = `${getPandocPath()} "${inputFile}" -t markdown ${additionalOptions} -o "${outputFile}"`;
|
||||
|
||||
runPandocCmd(pandocCmd, (error, stdout, stderr) => {
|
||||
if (error) {
|
||||
dialog.showErrorBox('Import Error', `Failed to import: ${error.message}\n\nMake sure Pandoc is installed.\n\nSupported formats: DOCX, ODT, RTF, HTML, LaTeX, EPUB, PDF, PPTX, ODP, RST, Textile, MediaWiki, Org-mode, AsciiDoc, CSV, and more.`);
|
||||
dialog.showErrorBox('Import Error', sanitizeErrorMessage(`Failed to import: ${error.message}\n\nMake sure Pandoc is installed.\n\nSupported formats: DOCX, ODT, RTF, HTML, LaTeX, EPUB, PDF, PPTX, ODP, RST, Textile, MediaWiki, Org-mode, AsciiDoc, CSV, and more.`));
|
||||
} else {
|
||||
// Open the converted markdown file
|
||||
currentFile = outputFile;
|
||||
@@ -2418,6 +2750,32 @@ ipcMain.on('do-print', (event, { withStyles }) => {
|
||||
}
|
||||
});
|
||||
|
||||
// Handle printing with custom options from print preview dialog
|
||||
ipcMain.on('do-print-with-options', (event, options) => {
|
||||
if (!mainWindow) return;
|
||||
|
||||
const marginsMap = {
|
||||
'default': { marginType: 'default' },
|
||||
'narrow': { top: 0.4, bottom: 0.4, left: 0.4, right: 0.4 },
|
||||
'wide': { top: 1.0, bottom: 1.0, left: 1.0, right: 1.0 },
|
||||
'none': { top: 0, bottom: 0, left: 0, right: 0 },
|
||||
};
|
||||
|
||||
const printOptions = {
|
||||
silent: false,
|
||||
printBackground: options.background,
|
||||
landscape: options.orientation === 'landscape',
|
||||
scaleFactor: options.scale / 100,
|
||||
pageSize: options.paperSize,
|
||||
};
|
||||
|
||||
if (options.margins && options.margins !== 'default') {
|
||||
printOptions.margins = marginsMap[options.margins];
|
||||
}
|
||||
|
||||
mainWindow.webContents.print(printOptions);
|
||||
});
|
||||
|
||||
// Handle renderer ready for file association
|
||||
ipcMain.on('renderer-ready', (event) => {
|
||||
console.log('[MAIN] renderer-ready received, rendererReady was:', rendererReady);
|
||||
@@ -2441,11 +2799,19 @@ ipcMain.on('renderer-ready', (event) => {
|
||||
|
||||
// Handle export with options
|
||||
ipcMain.on('export-with-options', (event, { format, options }) => {
|
||||
if (!conversionLimiter()) {
|
||||
mainWindow.webContents.send('conversion-status', 'Please wait before converting again...');
|
||||
return;
|
||||
}
|
||||
performExportWithOptions(format, options);
|
||||
});
|
||||
|
||||
// Handle batch conversion
|
||||
ipcMain.on('batch-convert', (event, { inputFolder, outputFolder, format, options }) => {
|
||||
if (!conversionLimiter()) {
|
||||
mainWindow.webContents.send('conversion-status', 'Please wait before converting again...');
|
||||
return;
|
||||
}
|
||||
performBatchConversion(inputFolder, outputFolder, format, options);
|
||||
});
|
||||
|
||||
@@ -2506,7 +2872,7 @@ ipcMain.on('export-spreadsheet', (event, { content, format }) => {
|
||||
buttons: ['OK']
|
||||
});
|
||||
} catch (error) {
|
||||
dialog.showErrorBox('Export Error', `Failed to export: ${error.message}`);
|
||||
dialog.showErrorBox('Export Error', sanitizeErrorMessage(`Failed to export: ${error.message}`));
|
||||
}
|
||||
}
|
||||
});
|
||||
@@ -2564,7 +2930,7 @@ function performBatchConversion(inputFolder, outputFolder, format, options) {
|
||||
try {
|
||||
fs.mkdirSync(outputFolder, { recursive: true });
|
||||
} catch (error) {
|
||||
dialog.showErrorBox('Error', `Failed to create output folder: ${error.message}`);
|
||||
dialog.showErrorBox('Error', sanitizeErrorMessage(`Failed to create output folder: ${error.message}`));
|
||||
return;
|
||||
}
|
||||
}
|
||||
@@ -3077,6 +3443,36 @@ function buildPandocCommand(content, format, outputPath) {
|
||||
command += ` --variable footer="${footerText}"`;
|
||||
}
|
||||
break;
|
||||
|
||||
case 'json':
|
||||
command = `pandoc "${inputFile}" -t json -o "${outputPath}"`;
|
||||
break;
|
||||
|
||||
case 'yaml':
|
||||
command = `pandoc "${inputFile}" -t markdown -o "${outputPath}"`;
|
||||
break;
|
||||
|
||||
case 'xml':
|
||||
command = `pandoc "${inputFile}" -t jats -o "${outputPath}"`;
|
||||
break;
|
||||
|
||||
case 'toml':
|
||||
// TOML: save raw markdown content with .toml extension
|
||||
command = `pandoc "${inputFile}" -t markdown -o "${outputPath}"`;
|
||||
break;
|
||||
|
||||
case 'revealjs':
|
||||
command = `pandoc "${inputFile}" -t revealjs -s -o "${outputPath}" --slide-level=2`;
|
||||
break;
|
||||
|
||||
case 'beamer':
|
||||
command = `pandoc "${inputFile}" -t beamer -o "${outputPath}"`;
|
||||
break;
|
||||
|
||||
case 'confluence':
|
||||
case 'jira':
|
||||
command = `pandoc "${inputFile}" -t jira -o "${outputPath}"`;
|
||||
break;
|
||||
}
|
||||
|
||||
return command;
|
||||
@@ -3192,6 +3588,11 @@ function openFileFromPath(filePath) {
|
||||
console.log('[MAIN] openFileFromPath called with:', filePath);
|
||||
console.log('[MAIN] rendererReady:', rendererReady, 'mainWindow exists:', !!mainWindow);
|
||||
if (fs.existsSync(filePath)) {
|
||||
const stats = fs.statSync(filePath);
|
||||
if (stats.size > MAX_FILE_SIZE) {
|
||||
dialog.showErrorBox('File Too Large', `File exceeds the ${MAX_FILE_SIZE_MB}MB size limit.`);
|
||||
return;
|
||||
}
|
||||
currentFile = filePath;
|
||||
const content = fs.readFileSync(filePath, 'utf-8');
|
||||
console.log('[MAIN] File read successfully, content length:', content.length);
|
||||
@@ -3787,9 +4188,209 @@ ipcMain.on('open-table-generator', () => {
|
||||
openTableGenerator();
|
||||
});
|
||||
|
||||
// IPC Handler for loading document templates
|
||||
ipcMain.handle('load-template', async (event, filename) => {
|
||||
try {
|
||||
const templatePath = path.join(__dirname, 'templates', filename);
|
||||
return fs.readFileSync(templatePath, 'utf-8');
|
||||
} catch (err) {
|
||||
console.error('Failed to load template:', err);
|
||||
return null;
|
||||
}
|
||||
});
|
||||
|
||||
// IPC Handler for saving pasted/dropped images
|
||||
ipcMain.handle('save-pasted-image', async (event, { base64, ext }) => {
|
||||
try {
|
||||
let saveDir;
|
||||
|
||||
if (currentFile) {
|
||||
// Save relative to current file
|
||||
saveDir = path.join(path.dirname(currentFile), 'assets');
|
||||
} else {
|
||||
// Use temp directory
|
||||
saveDir = path.join(app.getPath('temp'), 'markdown-converter-images');
|
||||
}
|
||||
|
||||
if (!fs.existsSync(saveDir)) {
|
||||
fs.mkdirSync(saveDir, { recursive: true });
|
||||
}
|
||||
|
||||
const filename = `image-${Date.now()}.${ext}`;
|
||||
const filePath = path.join(saveDir, filename);
|
||||
const buffer = Buffer.from(base64, 'base64');
|
||||
fs.writeFileSync(filePath, buffer);
|
||||
|
||||
return { relativePath: `assets/${filename}`, absolutePath: filePath };
|
||||
} catch (error) {
|
||||
console.error('Failed to save pasted image:', error);
|
||||
return null;
|
||||
}
|
||||
});
|
||||
|
||||
// IPC Handler to receive generated content from generator windows
|
||||
ipcMain.on('insert-generated-content', (event, content) => {
|
||||
if (mainWindow && !mainWindow.isDestroyed()) {
|
||||
mainWindow.webContents.send('insert-content', content);
|
||||
}
|
||||
});
|
||||
|
||||
// ============================================
|
||||
// File Explorer IPC Handlers
|
||||
// ============================================
|
||||
ipcMain.handle('list-directory', async (event, dirPath) => {
|
||||
try {
|
||||
if (!dirPath) {
|
||||
const result = await dialog.showOpenDialog(mainWindow, {
|
||||
properties: ['openDirectory']
|
||||
});
|
||||
if (result.canceled || !result.filePaths[0]) return null;
|
||||
dirPath = result.filePaths[0];
|
||||
}
|
||||
const entries = fs.readdirSync(dirPath, { withFileTypes: true })
|
||||
.filter(e => !e.name.startsWith('.'))
|
||||
.sort((a, b) => {
|
||||
if (a.isDirectory() && !b.isDirectory()) return -1;
|
||||
if (!a.isDirectory() && b.isDirectory()) return 1;
|
||||
return a.name.localeCompare(b.name);
|
||||
})
|
||||
.map(e => ({
|
||||
name: e.name,
|
||||
isDirectory: e.isDirectory(),
|
||||
path: path.join(dirPath, e.name)
|
||||
}));
|
||||
return { path: dirPath, entries };
|
||||
} catch (err) {
|
||||
console.error('list-directory error:', err);
|
||||
return null;
|
||||
}
|
||||
});
|
||||
|
||||
// Open a file by path (from explorer panel)
|
||||
ipcMain.on('open-file-path', (event, filePath) => {
|
||||
try {
|
||||
if (!fs.existsSync(filePath)) return;
|
||||
const stat = fs.statSync(filePath);
|
||||
if (stat.size > MAX_FILE_SIZE) return;
|
||||
currentFile = filePath;
|
||||
const content = fs.readFileSync(filePath, 'utf-8');
|
||||
mainWindow.webContents.send('file-opened', { path: filePath, content });
|
||||
} catch (err) {
|
||||
console.error('open-file-path error:', err);
|
||||
}
|
||||
});
|
||||
|
||||
// ============================================
|
||||
// Git IPC Handlers
|
||||
// ============================================
|
||||
const simpleGit = require('simple-git');
|
||||
|
||||
function getGitRepo() {
|
||||
// Use the directory of the current file, or the app's working directory
|
||||
const dir = currentFile ? path.dirname(currentFile) : process.cwd();
|
||||
return simpleGit(dir);
|
||||
}
|
||||
|
||||
ipcMain.handle('git-status', async () => {
|
||||
try {
|
||||
const git = getGitRepo();
|
||||
return await git.status();
|
||||
} catch (err) {
|
||||
return { error: 'Not a git repository' };
|
||||
}
|
||||
});
|
||||
|
||||
ipcMain.handle('git-stage', async (event, { files }) => {
|
||||
try {
|
||||
const git = getGitRepo();
|
||||
await git.add(files);
|
||||
return await git.status();
|
||||
} catch (err) {
|
||||
return { error: err.message };
|
||||
}
|
||||
});
|
||||
|
||||
ipcMain.handle('git-commit', async (event, { message }) => {
|
||||
try {
|
||||
const git = getGitRepo();
|
||||
return await git.commit(message);
|
||||
} catch (err) {
|
||||
return { error: err.message };
|
||||
}
|
||||
});
|
||||
|
||||
ipcMain.handle('git-log', async () => {
|
||||
try {
|
||||
const git = getGitRepo();
|
||||
return await git.log({ maxCount: 20 });
|
||||
} catch (err) {
|
||||
return { error: err.message };
|
||||
}
|
||||
});
|
||||
|
||||
// ============================================
|
||||
// Snippets IPC Handlers
|
||||
// ============================================
|
||||
const snippetsPath = path.join(app.getPath('userData'), 'snippets.json');
|
||||
|
||||
function loadSnippets() {
|
||||
try {
|
||||
if (fs.existsSync(snippetsPath)) {
|
||||
return JSON.parse(fs.readFileSync(snippetsPath, 'utf-8'));
|
||||
}
|
||||
} catch (err) { console.error('Failed to load snippets:', err); }
|
||||
return [];
|
||||
}
|
||||
|
||||
function saveSnippetsFile(snippets) {
|
||||
fs.writeFileSync(snippetsPath, JSON.stringify(snippets, null, 2));
|
||||
}
|
||||
|
||||
ipcMain.handle('get-snippets', async () => loadSnippets());
|
||||
|
||||
ipcMain.handle('save-snippet', async (event, snippet) => {
|
||||
const snippets = loadSnippets();
|
||||
const existing = snippets.findIndex(s => s.id === snippet.id);
|
||||
if (existing >= 0) snippets[existing] = snippet;
|
||||
else snippets.push(snippet);
|
||||
saveSnippetsFile(snippets);
|
||||
return snippets;
|
||||
});
|
||||
|
||||
ipcMain.handle('delete-snippet', async (event, id) => {
|
||||
const snippets = loadSnippets().filter(s => s.id !== id);
|
||||
saveSnippetsFile(snippets);
|
||||
return snippets;
|
||||
});
|
||||
|
||||
// ============================================
|
||||
// Code Execution (REPL) IPC Handler
|
||||
// ============================================
|
||||
ipcMain.handle('execute-code', async (event, { code, language }) => {
|
||||
const timeout = 10000;
|
||||
|
||||
return new Promise((resolve) => {
|
||||
let cmd, args;
|
||||
if (language === 'javascript' || language === 'js') {
|
||||
cmd = 'node';
|
||||
args = ['-e', code];
|
||||
} else if (language === 'python' || language === 'py') {
|
||||
cmd = process.platform === 'win32' ? 'python' : 'python3';
|
||||
args = ['-c', code];
|
||||
} else if (language === 'bash' || language === 'sh') {
|
||||
cmd = process.platform === 'win32' ? 'cmd' : 'bash';
|
||||
args = process.platform === 'win32' ? ['/c', code] : ['-c', code];
|
||||
} else {
|
||||
resolve({ error: `Unsupported language: ${language}` });
|
||||
return;
|
||||
}
|
||||
|
||||
execFile(cmd, args, { timeout, maxBuffer: 1024 * 1024 }, (err, stdout, stderr) => {
|
||||
resolve({
|
||||
stdout: stdout || '',
|
||||
stderr: stderr || '',
|
||||
error: err?.killed ? 'Execution timed out (10s limit)' : (err?.message || null)
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
+49
-3
@@ -9,7 +9,7 @@
|
||||
* - All IPC channels are explicitly whitelisted
|
||||
* - Prevents XSS from escalating to full system access
|
||||
*
|
||||
* @version 2.2.0
|
||||
* @version 4.0.0
|
||||
*/
|
||||
|
||||
const { contextBridge, ipcRenderer } = require('electron');
|
||||
@@ -29,6 +29,7 @@ const ALLOWED_SEND_CHANNELS = [
|
||||
|
||||
// Print
|
||||
'do-print',
|
||||
'do-print-with-options',
|
||||
|
||||
// Export
|
||||
'export-with-options',
|
||||
@@ -90,7 +91,43 @@ const ALLOWED_SEND_CHANNELS = [
|
||||
'open-table-generator',
|
||||
|
||||
// Insert generated content
|
||||
'insert-generated-content'
|
||||
'insert-generated-content',
|
||||
|
||||
// Image paste/drop
|
||||
'save-pasted-image',
|
||||
|
||||
// Templates
|
||||
'load-template',
|
||||
|
||||
// File Explorer
|
||||
'list-directory',
|
||||
|
||||
// Git
|
||||
'git-status',
|
||||
'git-stage',
|
||||
'git-commit',
|
||||
'git-log',
|
||||
|
||||
// Snippets
|
||||
'get-snippets',
|
||||
'save-snippet',
|
||||
'delete-snippet',
|
||||
|
||||
// Code execution (REPL)
|
||||
'execute-code',
|
||||
|
||||
// File open by path
|
||||
'open-file-path',
|
||||
|
||||
// PDF editor from toolbar
|
||||
'show-pdf-editor-from-toolbar',
|
||||
|
||||
// Menu triggers
|
||||
'menu-open',
|
||||
'export',
|
||||
|
||||
// Git diff
|
||||
'git-diff'
|
||||
];
|
||||
|
||||
const ALLOWED_RECEIVE_CHANNELS = [
|
||||
@@ -176,7 +213,16 @@ const ALLOWED_RECEIVE_CHANNELS = [
|
||||
'pdf-operation-progress',
|
||||
|
||||
// Insert content from generator windows
|
||||
'insert-content'
|
||||
'insert-content',
|
||||
|
||||
// Batch converter
|
||||
'show-batch-converter',
|
||||
|
||||
// v4 menu-triggered events
|
||||
'load-template-menu',
|
||||
'toggle-command-palette',
|
||||
'toggle-sidebar-panel',
|
||||
'toggle-bottom-panel'
|
||||
];
|
||||
|
||||
/**
|
||||
|
||||
@@ -0,0 +1,139 @@
|
||||
class PrintPreview {
|
||||
constructor() {
|
||||
this.overlay = document.getElementById('print-preview-overlay');
|
||||
this._lastContent = '';
|
||||
this.setupEventListeners();
|
||||
}
|
||||
|
||||
open(htmlContent) {
|
||||
this._lastContent = htmlContent;
|
||||
this.overlay.classList.remove('hidden');
|
||||
this.updatePreview(htmlContent);
|
||||
this.updateScaleLabel();
|
||||
}
|
||||
|
||||
close() {
|
||||
this.overlay.classList.add('hidden');
|
||||
}
|
||||
|
||||
setupEventListeners() {
|
||||
document.getElementById('print-preview-close')?.addEventListener('click', () => this.close());
|
||||
document.getElementById('print-cancel')?.addEventListener('click', () => this.close());
|
||||
document.getElementById('print-execute')?.addEventListener('click', () => this.executePrint());
|
||||
|
||||
// Update preview on option changes
|
||||
['print-paper-size', 'print-orientation', 'print-margins'].forEach(id => {
|
||||
document.getElementById(id)?.addEventListener('change', () => this.refreshPreview());
|
||||
});
|
||||
|
||||
// Scale slider
|
||||
const scaleSlider = document.getElementById('print-scale');
|
||||
scaleSlider?.addEventListener('input', () => this.updateScaleLabel());
|
||||
|
||||
// Page range toggle
|
||||
document.getElementById('print-pages')?.addEventListener('change', (e) => {
|
||||
const rangeInput = document.getElementById('print-page-range');
|
||||
if (rangeInput) {
|
||||
rangeInput.classList.toggle('hidden', e.target.value !== 'custom');
|
||||
}
|
||||
});
|
||||
|
||||
// Close on overlay click
|
||||
this.overlay?.addEventListener('click', (e) => {
|
||||
if (e.target === this.overlay) this.close();
|
||||
});
|
||||
|
||||
// Close on Escape
|
||||
document.addEventListener('keydown', (e) => {
|
||||
if (e.key === 'Escape' && !this.overlay.classList.contains('hidden')) {
|
||||
this.close();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
updateScaleLabel() {
|
||||
const scale = document.getElementById('print-scale')?.value || 100;
|
||||
const label = document.getElementById('print-scale-value');
|
||||
if (label) label.textContent = `${scale}%`;
|
||||
}
|
||||
|
||||
updatePreview(htmlContent) {
|
||||
const frame = document.getElementById('print-preview-frame');
|
||||
if (!frame) return;
|
||||
|
||||
this._lastContent = htmlContent;
|
||||
|
||||
const orientation = document.getElementById('print-orientation')?.value || 'portrait';
|
||||
const paperSize = document.getElementById('print-paper-size')?.value || 'A4';
|
||||
|
||||
// Get dimensions for paper size
|
||||
const sizes = {
|
||||
'A3': { width: '297mm', height: '420mm' },
|
||||
'A4': { width: '210mm', height: '297mm' },
|
||||
'A5': { width: '148mm', height: '210mm' },
|
||||
'Letter': { width: '8.5in', height: '11in' },
|
||||
'Legal': { width: '8.5in', height: '14in' },
|
||||
'Tabloid': { width: '11in', height: '17in' },
|
||||
};
|
||||
|
||||
const size = sizes[paperSize] || sizes['A4'];
|
||||
const width = orientation === 'landscape' ? size.height : size.width;
|
||||
const height = orientation === 'landscape' ? size.width : size.height;
|
||||
|
||||
const previewHtml = `
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<style>
|
||||
body {
|
||||
margin: 20px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
@page { size: ${width} ${height}; }
|
||||
pre { background: #f5f5f5; padding: 12px; border-radius: 6px; overflow-x: auto; }
|
||||
code { background: #f0f0f0; padding: 2px 6px; border-radius: 3px; font-size: 13px; }
|
||||
pre code { background: none; padding: 0; }
|
||||
table { border-collapse: collapse; width: 100%; }
|
||||
th, td { border: 1px solid #ddd; padding: 8px; }
|
||||
blockquote { border-left: 4px solid #ddd; margin-left: 0; padding-left: 16px; color: #666; }
|
||||
img { max-width: 100%; }
|
||||
h1, h2, h3 { margin-top: 1.5em; }
|
||||
</style>
|
||||
</head>
|
||||
<body>${htmlContent || ''}</body>
|
||||
</html>
|
||||
`;
|
||||
|
||||
frame.srcdoc = previewHtml;
|
||||
}
|
||||
|
||||
refreshPreview() {
|
||||
if (this._lastContent) {
|
||||
this.updatePreview(this._lastContent);
|
||||
}
|
||||
}
|
||||
|
||||
getOptions() {
|
||||
return {
|
||||
paperSize: document.getElementById('print-paper-size')?.value || 'A4',
|
||||
orientation: document.getElementById('print-orientation')?.value || 'portrait',
|
||||
margins: document.getElementById('print-margins')?.value || 'default',
|
||||
scale: parseInt(document.getElementById('print-scale')?.value || '100'),
|
||||
headers: document.getElementById('print-headers')?.checked ?? true,
|
||||
background: document.getElementById('print-background')?.checked ?? true,
|
||||
pages: document.getElementById('print-pages')?.value || 'all',
|
||||
pageRange: document.getElementById('print-page-range')?.value || '',
|
||||
};
|
||||
}
|
||||
|
||||
executePrint() {
|
||||
const options = this.getOptions();
|
||||
const { ipcRenderer } = require('electron');
|
||||
ipcRenderer.send('do-print-with-options', options);
|
||||
this.close();
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = { PrintPreview };
|
||||
+645
-714
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,49 @@
|
||||
class ReplPanel {
|
||||
constructor() {
|
||||
this.panel = document.getElementById('bottom-panel');
|
||||
this.output = document.getElementById('repl-output');
|
||||
this.setupEventListeners();
|
||||
}
|
||||
|
||||
setupEventListeners() {
|
||||
document.getElementById('bottom-panel-toggle')?.addEventListener('click', () => this.toggle());
|
||||
document.getElementById('repl-clear')?.addEventListener('click', () => this.clear());
|
||||
}
|
||||
|
||||
toggle() {
|
||||
this.panel.classList.toggle('collapsed');
|
||||
const btn = document.getElementById('bottom-panel-toggle');
|
||||
if (btn) btn.textContent = this.panel.classList.contains('collapsed') ? '\u25BC' : '\u25B2';
|
||||
}
|
||||
|
||||
show() {
|
||||
this.panel.classList.remove('collapsed');
|
||||
const btn = document.getElementById('bottom-panel-toggle');
|
||||
if (btn) btn.textContent = '\u25B2';
|
||||
}
|
||||
|
||||
clear() {
|
||||
if (this.output) this.output.innerHTML = '';
|
||||
}
|
||||
|
||||
appendOutput(command, result) {
|
||||
const entry = document.createElement('div');
|
||||
entry.className = 'repl-entry';
|
||||
entry.innerHTML = `
|
||||
<div class="repl-command">\u25B6 ${command}</div>
|
||||
${result.stdout ? `<div class="repl-stdout">${this.escapeHtml(result.stdout)}</div>` : ''}
|
||||
${result.stderr ? `<div class="repl-stderr">${this.escapeHtml(result.stderr)}</div>` : ''}
|
||||
${result.error ? `<div class="repl-error">Error: ${this.escapeHtml(result.error)}</div>` : ''}
|
||||
`;
|
||||
this.output?.appendChild(entry);
|
||||
this.output?.scrollTo(0, this.output.scrollHeight);
|
||||
}
|
||||
|
||||
escapeHtml(text) {
|
||||
const div = document.createElement('div');
|
||||
div.textContent = text;
|
||||
return div.innerHTML;
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = { ReplPanel };
|
||||
@@ -0,0 +1,70 @@
|
||||
const path = require('path');
|
||||
|
||||
function renderExplorerPanel(container, { listDirectory, onFileOpen, currentDir }) {
|
||||
container.innerHTML = `
|
||||
<div class="explorer-panel">
|
||||
<div class="explorer-toolbar">
|
||||
<input type="text" class="explorer-path" id="explorer-path" value="${currentDir || ''}" placeholder="Open a folder..." readonly>
|
||||
<button class="explorer-browse-btn" id="explorer-browse" title="Browse folder">📂</button>
|
||||
</div>
|
||||
<div class="explorer-tree" id="explorer-tree"></div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
document.getElementById('explorer-browse')?.addEventListener('click', async () => {
|
||||
const dir = await listDirectory(null); // null means open folder dialog
|
||||
if (dir) {
|
||||
document.getElementById('explorer-path').value = dir.path;
|
||||
renderTree(document.getElementById('explorer-tree'), dir.entries, listDirectory, onFileOpen, dir.path);
|
||||
}
|
||||
});
|
||||
|
||||
if (currentDir) {
|
||||
listDirectory(currentDir).then(dir => {
|
||||
if (dir) renderTree(document.getElementById('explorer-tree'), dir.entries, listDirectory, onFileOpen, currentDir);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function renderTree(container, entries, listDirectory, onFileOpen, basePath) {
|
||||
container.innerHTML = entries.map(entry => {
|
||||
if (entry.isDirectory) {
|
||||
return `<div class="tree-item tree-folder collapsed" data-path="${entry.path}">
|
||||
<span class="tree-icon">▶</span>
|
||||
<span class="tree-name">${entry.name}</span>
|
||||
<div class="tree-children"></div>
|
||||
</div>`;
|
||||
}
|
||||
return `<div class="tree-item tree-file" data-path="${entry.path}">
|
||||
<span class="tree-icon">${getFileIcon(entry.name)}</span>
|
||||
<span class="tree-name">${entry.name}</span>
|
||||
</div>`;
|
||||
}).join('');
|
||||
|
||||
container.querySelectorAll('.tree-folder').forEach(el => {
|
||||
el.querySelector('.tree-name').addEventListener('click', async () => {
|
||||
const isCollapsed = el.classList.contains('collapsed');
|
||||
if (isCollapsed) {
|
||||
const dir = await listDirectory(el.dataset.path);
|
||||
if (dir) {
|
||||
const childContainer = el.querySelector('.tree-children');
|
||||
renderTree(childContainer, dir.entries, listDirectory, onFileOpen, el.dataset.path);
|
||||
}
|
||||
}
|
||||
el.classList.toggle('collapsed');
|
||||
el.querySelector('.tree-icon').textContent = el.classList.contains('collapsed') ? '\u25B6' : '\u25BC';
|
||||
});
|
||||
});
|
||||
|
||||
container.querySelectorAll('.tree-file').forEach(el => {
|
||||
el.addEventListener('click', () => onFileOpen(el.dataset.path));
|
||||
});
|
||||
}
|
||||
|
||||
function getFileIcon(filename) {
|
||||
const ext = filename.split('.').pop().toLowerCase();
|
||||
const icons = { md: '\u{1F4DD}', js: '\u{1F4DC}', json: '{}', html: '\u{1F310}', css: '\u{1F3A8}', py: '\u{1F40D}', pdf: '\u{1F4D5}', txt: '\u{1F4C4}' };
|
||||
return icons[ext] || '\u{1F4C4}';
|
||||
}
|
||||
|
||||
module.exports = { renderExplorerPanel };
|
||||
@@ -0,0 +1,84 @@
|
||||
function renderGitPanel(container, { gitStatus, gitDiff, gitStage, gitCommit, gitLog }) {
|
||||
container.innerHTML = `
|
||||
<div class="git-panel">
|
||||
<div class="git-section">
|
||||
<h4 class="git-section-title">Changes</h4>
|
||||
<div class="git-changes" id="git-changes">
|
||||
<p class="git-loading">Loading...</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="git-section">
|
||||
<h4 class="git-section-title">Commit</h4>
|
||||
<textarea class="git-commit-input" id="git-commit-msg" placeholder="Commit message..." rows="3"></textarea>
|
||||
<button class="git-commit-btn" id="git-commit-btn">Commit</button>
|
||||
</div>
|
||||
<div class="git-section">
|
||||
<h4 class="git-section-title">Recent Commits</h4>
|
||||
<div class="git-log" id="git-log"></div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
loadGitStatus();
|
||||
|
||||
async function loadGitStatus() {
|
||||
const status = await gitStatus();
|
||||
const changesEl = document.getElementById('git-changes');
|
||||
if (!status || !changesEl) return;
|
||||
|
||||
if (status.error) {
|
||||
changesEl.innerHTML = `<p class="git-info">${status.error}</p>`;
|
||||
return;
|
||||
}
|
||||
|
||||
const files = [
|
||||
...status.modified.map(f => ({ file: f, status: 'M', color: '#f59e0b' })),
|
||||
...status.not_added.map(f => ({ file: f, status: '?', color: '#6b7280' })),
|
||||
...status.created.map(f => ({ file: f, status: 'A', color: '#10b981' })),
|
||||
...status.deleted.map(f => ({ file: f, status: 'D', color: '#ef4444' })),
|
||||
...status.staged.map(f => ({ file: f, status: 'S', color: '#3b82f6' })),
|
||||
];
|
||||
|
||||
if (files.length === 0) {
|
||||
changesEl.innerHTML = '<p class="git-info">No changes</p>';
|
||||
} else {
|
||||
changesEl.innerHTML = files.map(f => `
|
||||
<div class="git-file" data-file="${f.file}">
|
||||
<span class="git-file-status" style="color:${f.color}">${f.status}</span>
|
||||
<span class="git-file-name">${f.file}</span>
|
||||
<button class="git-stage-btn" data-file="${f.file}" title="Stage file">+</button>
|
||||
</div>
|
||||
`).join('');
|
||||
|
||||
changesEl.querySelectorAll('.git-stage-btn').forEach(btn => {
|
||||
btn.addEventListener('click', async (e) => {
|
||||
e.stopPropagation();
|
||||
await gitStage([btn.dataset.file]);
|
||||
loadGitStatus();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Load log
|
||||
const log = await gitLog();
|
||||
const logEl = document.getElementById('git-log');
|
||||
if (log && logEl) {
|
||||
logEl.innerHTML = (log.all || []).slice(0, 10).map(entry => `
|
||||
<div class="git-log-entry">
|
||||
<div class="git-log-msg">${entry.message}</div>
|
||||
<div class="git-log-meta">${entry.date?.substring(0, 10) || ''} · ${entry.author_name || ''}</div>
|
||||
</div>
|
||||
`).join('') || '<p class="git-info">No commits</p>';
|
||||
}
|
||||
}
|
||||
|
||||
document.getElementById('git-commit-btn')?.addEventListener('click', async () => {
|
||||
const msg = document.getElementById('git-commit-msg')?.value?.trim();
|
||||
if (!msg) return;
|
||||
await gitCommit(msg);
|
||||
document.getElementById('git-commit-msg').value = '';
|
||||
loadGitStatus();
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = { renderGitPanel };
|
||||
@@ -0,0 +1,50 @@
|
||||
class SidebarManager {
|
||||
constructor() {
|
||||
this.sidebar = document.getElementById('sidebar');
|
||||
this.panelContent = document.getElementById('sidebar-panel-content');
|
||||
this.panelTitle = document.querySelector('.sidebar-panel-title');
|
||||
this.activePanel = null;
|
||||
this.panels = new Map();
|
||||
this.setupEventListeners();
|
||||
}
|
||||
|
||||
setupEventListeners() {
|
||||
document.querySelectorAll('.sidebar-icon').forEach(btn => {
|
||||
btn.addEventListener('click', () => this.togglePanel(btn.dataset.panel));
|
||||
});
|
||||
document.querySelector('.sidebar-panel-close')?.addEventListener('click', () => this.collapse());
|
||||
}
|
||||
|
||||
registerPanel(name, { title, render }) {
|
||||
this.panels.set(name, { title, render });
|
||||
}
|
||||
|
||||
togglePanel(name) {
|
||||
if (this.activePanel === name) {
|
||||
this.collapse();
|
||||
} else {
|
||||
this.expand(name);
|
||||
}
|
||||
}
|
||||
|
||||
expand(name) {
|
||||
const panel = this.panels.get(name);
|
||||
if (!panel) return;
|
||||
this.sidebar.classList.remove('collapsed');
|
||||
this.panelTitle.textContent = panel.title;
|
||||
this.panelContent.innerHTML = '';
|
||||
panel.render(this.panelContent);
|
||||
this.activePanel = name;
|
||||
document.querySelectorAll('.sidebar-icon').forEach(btn => {
|
||||
btn.classList.toggle('active', btn.dataset.panel === name);
|
||||
});
|
||||
}
|
||||
|
||||
collapse() {
|
||||
this.sidebar.classList.add('collapsed');
|
||||
this.activePanel = null;
|
||||
document.querySelectorAll('.sidebar-icon').forEach(btn => btn.classList.remove('active'));
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = { SidebarManager };
|
||||
@@ -0,0 +1,71 @@
|
||||
function renderSnippetsPanel(container, { getSnippets, saveSnippet, deleteSnippet, onInsert }) {
|
||||
container.innerHTML = `
|
||||
<div class="snippets-panel">
|
||||
<div class="snippets-toolbar">
|
||||
<input type="text" class="snippets-search" id="snippets-search" placeholder="Search snippets...">
|
||||
<button class="snippets-add-btn" id="snippets-add" title="Add snippet">+</button>
|
||||
</div>
|
||||
<div class="snippets-list" id="snippets-list"></div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
let snippets = [];
|
||||
|
||||
async function loadSnippets() {
|
||||
snippets = await getSnippets() || [];
|
||||
renderList(document.getElementById('snippets-search')?.value || '');
|
||||
}
|
||||
|
||||
function renderList(query) {
|
||||
const list = document.getElementById('snippets-list');
|
||||
if (!list) return;
|
||||
|
||||
const filtered = query
|
||||
? snippets.filter(s => s.name.toLowerCase().includes(query.toLowerCase()) || (s.language || '').toLowerCase().includes(query.toLowerCase()))
|
||||
: snippets;
|
||||
|
||||
list.innerHTML = filtered.length ? filtered.map(s => `
|
||||
<div class="snippet-item" data-id="${s.id}">
|
||||
<div class="snippet-header">
|
||||
<span class="snippet-name">${s.name}</span>
|
||||
<span class="snippet-lang">${s.language || 'text'}</span>
|
||||
</div>
|
||||
<pre class="snippet-preview"><code>${(s.code || '').substring(0, 100)}${(s.code || '').length > 100 ? '...' : ''}</code></pre>
|
||||
<div class="snippet-actions">
|
||||
<button class="snippet-insert" data-id="${s.id}" title="Insert">Insert</button>
|
||||
<button class="snippet-delete" data-id="${s.id}" title="Delete">×</button>
|
||||
</div>
|
||||
</div>
|
||||
`).join('') : '<p class="git-info">No snippets yet. Click + to add one.</p>';
|
||||
|
||||
list.querySelectorAll('.snippet-insert').forEach(btn => {
|
||||
btn.addEventListener('click', () => {
|
||||
const s = snippets.find(sn => sn.id === btn.dataset.id);
|
||||
if (s) onInsert(s.code);
|
||||
});
|
||||
});
|
||||
|
||||
list.querySelectorAll('.snippet-delete').forEach(btn => {
|
||||
btn.addEventListener('click', async () => {
|
||||
await deleteSnippet(btn.dataset.id);
|
||||
loadSnippets();
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
document.getElementById('snippets-search')?.addEventListener('input', (e) => renderList(e.target.value));
|
||||
|
||||
document.getElementById('snippets-add')?.addEventListener('click', () => {
|
||||
const name = prompt('Snippet name:');
|
||||
if (!name) return;
|
||||
const language = prompt('Language (e.g., javascript, python, html):') || 'text';
|
||||
const code = prompt('Paste your code snippet:');
|
||||
if (!code) return;
|
||||
|
||||
saveSnippet({ id: Date.now().toString(), name, language, code }).then(() => loadSnippets());
|
||||
});
|
||||
|
||||
loadSnippets();
|
||||
}
|
||||
|
||||
module.exports = { renderSnippetsPanel };
|
||||
@@ -0,0 +1,34 @@
|
||||
const fs = require('fs');
|
||||
const path = require('path');
|
||||
|
||||
const templates = [
|
||||
{ name: 'Blog Post', file: 'blog-post.md', description: 'Article with frontmatter' },
|
||||
{ name: 'Meeting Notes', file: 'meeting-notes.md', description: 'Agenda, notes, action items' },
|
||||
{ name: 'Technical Spec', file: 'technical-spec.md', description: 'Requirements and architecture' },
|
||||
{ name: 'Changelog', file: 'changelog.md', description: 'Keep a Changelog format' },
|
||||
{ name: 'README', file: 'readme.md', description: 'Project documentation' },
|
||||
{ name: 'Project Plan', file: 'project-plan.md', description: 'Goals, milestones, timeline' },
|
||||
{ name: 'API Docs', file: 'api-docs.md', description: 'API endpoint documentation' },
|
||||
{ name: 'Tutorial', file: 'tutorial.md', description: 'Step-by-step guide' },
|
||||
{ name: 'Release Notes', file: 'release-notes.md', description: 'Version release summary' },
|
||||
{ name: 'Comparison', file: 'comparison.md', description: 'Feature comparison table' },
|
||||
];
|
||||
|
||||
function renderTemplatesPanel(container, onSelect) {
|
||||
container.innerHTML = `
|
||||
<div class="panel-list">
|
||||
${templates.map(t => `
|
||||
<div class="panel-list-item template-item" data-file="${t.file}">
|
||||
<div class="panel-list-item-title">${t.name}</div>
|
||||
<div class="panel-list-item-desc">${t.description}</div>
|
||||
</div>
|
||||
`).join('')}
|
||||
</div>
|
||||
`;
|
||||
|
||||
container.querySelectorAll('.template-item').forEach(el => {
|
||||
el.addEventListener('click', () => onSelect(el.dataset.file));
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = { renderTemplatesPanel, templates };
|
||||
+223
-1
@@ -290,6 +290,20 @@ body {
|
||||
/* Color controlled by theme */
|
||||
}
|
||||
|
||||
/* CodeMirror container */
|
||||
.codemirror-container {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
.codemirror-container .cm-editor {
|
||||
height: 100%;
|
||||
font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
|
||||
font-size: 14px;
|
||||
}
|
||||
.codemirror-container .cm-scroller {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.pane:last-child {
|
||||
padding: 0;
|
||||
/* Background controlled by theme */
|
||||
@@ -309,10 +323,12 @@ body {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 8px 20px;
|
||||
padding: 2px 12px;
|
||||
/* Background and color controlled by theme */
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
min-height: 24px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* Preview Styles - Modern Typography */
|
||||
@@ -2111,3 +2127,209 @@ body.theme-rosepine-dawn .batch-dialog-footer {
|
||||
background: #f2e9e1;
|
||||
border-top-color: #dfdad9;
|
||||
}
|
||||
|
||||
/* ========================================
|
||||
Command Palette (Ctrl+Shift+P)
|
||||
======================================== */
|
||||
.command-palette-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
z-index: 1000;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 80px;
|
||||
}
|
||||
.command-palette-overlay.hidden {
|
||||
display: none;
|
||||
}
|
||||
.command-palette {
|
||||
width: 560px;
|
||||
max-height: 400px;
|
||||
background: #fff;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 16px 48px rgba(0, 0, 0, 0.2);
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.command-palette-input {
|
||||
width: 100%;
|
||||
padding: 14px 18px;
|
||||
border: none;
|
||||
outline: none;
|
||||
font-size: 15px;
|
||||
border-bottom: 1px solid #e5e7eb;
|
||||
font-family: inherit;
|
||||
}
|
||||
.command-palette-results {
|
||||
overflow-y: auto;
|
||||
max-height: 340px;
|
||||
}
|
||||
.command-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 10px 18px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
}
|
||||
.command-item:hover,
|
||||
.command-item.selected {
|
||||
background: #f3f4f6;
|
||||
}
|
||||
.command-label strong {
|
||||
color: #5661b3;
|
||||
}
|
||||
.command-shortcut {
|
||||
font-size: 12px;
|
||||
color: #9ca3af;
|
||||
background: #f3f4f6;
|
||||
padding: 2px 8px;
|
||||
border-radius: 4px;
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
}
|
||||
|
||||
/* Dark theme command palette */
|
||||
body[class*="dark"] .command-palette {
|
||||
background: #1e1e1e;
|
||||
border: 1px solid #333;
|
||||
}
|
||||
body[class*="dark"] .command-palette-input {
|
||||
background: #1e1e1e;
|
||||
color: #eee;
|
||||
border-color: #333;
|
||||
}
|
||||
body[class*="dark"] .command-item:hover,
|
||||
body[class*="dark"] .command-item.selected {
|
||||
background: #2d2d2d;
|
||||
}
|
||||
body[class*="dark"] .command-shortcut {
|
||||
background: #333;
|
||||
color: #888;
|
||||
}
|
||||
|
||||
/* ========================================
|
||||
Breadcrumb Bar
|
||||
======================================== */
|
||||
.breadcrumb-bar {
|
||||
padding: 4px 12px;
|
||||
font-size: 12px;
|
||||
color: var(--gray-500, #6b7280);
|
||||
border-bottom: 1px solid var(--gray-200, #e5e7eb);
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
flex-shrink: 0;
|
||||
background: var(--gray-50, #f9fafb);
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
}
|
||||
body[class*="dark"] .breadcrumb-bar {
|
||||
background: #1a1a1a;
|
||||
color: #888;
|
||||
border-color: #333;
|
||||
}
|
||||
|
||||
/* Print Preview Dialog */
|
||||
.print-preview-dialog {
|
||||
width: 90vw;
|
||||
max-width: 1200px;
|
||||
height: 80vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.print-preview-body {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
.print-preview-sidebar {
|
||||
width: 260px;
|
||||
padding: 16px;
|
||||
border-right: 1px solid var(--gray-200, #e5e7eb);
|
||||
overflow-y: auto;
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
}
|
||||
.print-preview-content {
|
||||
flex: 1;
|
||||
padding: 16px;
|
||||
background: #e5e7eb;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
overflow: auto;
|
||||
}
|
||||
.print-preview-content iframe {
|
||||
box-shadow: 0 2px 8px rgba(0,0,0,0.15);
|
||||
border-radius: 4px;
|
||||
}
|
||||
.print-option-group {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
.print-option-group label {
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: var(--gray-600, #4b5563);
|
||||
}
|
||||
.print-option-group select,
|
||||
.print-option-group input[type="text"] {
|
||||
padding: 8px 10px;
|
||||
border: 1px solid var(--gray-300, #d1d5db);
|
||||
border-radius: 8px;
|
||||
font-size: 13px;
|
||||
background: white;
|
||||
}
|
||||
.scale-control {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
.scale-control input[type="range"] {
|
||||
flex: 1;
|
||||
}
|
||||
.checkbox-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.print-range-input {
|
||||
margin-top: 6px;
|
||||
}
|
||||
.print-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
margin-top: auto;
|
||||
padding-top: 16px;
|
||||
}
|
||||
.btn-primary {
|
||||
flex: 1;
|
||||
padding: 10px;
|
||||
background: var(--primary-dark, #5661b3);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
}
|
||||
.btn-primary:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
.btn-secondary {
|
||||
flex: 1;
|
||||
padding: 10px;
|
||||
background: var(--gray-100, #f3f4f6);
|
||||
color: var(--gray-700, #374151);
|
||||
border: 1px solid var(--gray-300, #d1d5db);
|
||||
border-radius: 8px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,268 @@
|
||||
/* Sidebar */
|
||||
.main-content {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
height: 100%;
|
||||
transition: width 0.2s ease;
|
||||
}
|
||||
|
||||
.sidebar.collapsed {
|
||||
width: 48px;
|
||||
}
|
||||
|
||||
.sidebar:not(.collapsed) {
|
||||
width: 328px; /* 48px icons + 280px panel */
|
||||
}
|
||||
|
||||
.sidebar-icons {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 48px;
|
||||
background: var(--gray-100, #f3f4f6);
|
||||
border-right: 1px solid var(--gray-200, #e5e7eb);
|
||||
padding: 8px 0;
|
||||
gap: 4px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.sidebar-icon {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
background: transparent;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
color: var(--gray-500, #6b7280);
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
|
||||
.sidebar-icon:hover {
|
||||
background: var(--gray-200, #e5e7eb);
|
||||
color: var(--gray-700, #374151);
|
||||
}
|
||||
|
||||
.sidebar-icon.active {
|
||||
background: var(--gray-200, #e5e7eb);
|
||||
color: var(--primary-dark, #5661b3);
|
||||
box-shadow: inset 3px 0 0 var(--primary-dark, #5661b3);
|
||||
}
|
||||
|
||||
.sidebar-panel {
|
||||
width: 280px;
|
||||
background: var(--gray-50, #f9fafb);
|
||||
border-right: 1px solid var(--gray-200, #e5e7eb);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sidebar.collapsed .sidebar-panel {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.sidebar-panel-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 12px 16px;
|
||||
border-bottom: 1px solid var(--gray-200, #e5e7eb);
|
||||
font-weight: 600;
|
||||
font-size: 13px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
color: var(--gray-600, #4b5563);
|
||||
}
|
||||
|
||||
.sidebar-panel-close {
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: 18px;
|
||||
cursor: pointer;
|
||||
color: var(--gray-400, #9ca3af);
|
||||
padding: 0 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.sidebar-panel-close:hover {
|
||||
background: var(--gray-200, #e5e7eb);
|
||||
color: var(--gray-600, #4b5563);
|
||||
}
|
||||
|
||||
.sidebar-panel-content {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
/* Dark theme support */
|
||||
body[class*="dark"] .sidebar-icons,
|
||||
body[class*="dark"] .sidebar-panel {
|
||||
background: #1e1e1e;
|
||||
border-color: #333;
|
||||
}
|
||||
|
||||
body[class*="dark"] .sidebar-icon {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
body[class*="dark"] .sidebar-icon:hover {
|
||||
background: #333;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
body[class*="dark"] .sidebar-icon.active {
|
||||
background: #333;
|
||||
color: #8b9aff;
|
||||
box-shadow: inset 3px 0 0 #8b9aff;
|
||||
}
|
||||
|
||||
body[class*="dark"] .sidebar-panel-header {
|
||||
border-color: #333;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
/* Panel list items (templates, etc.) */
|
||||
.panel-list-item {
|
||||
padding: 10px 12px;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.panel-list-item:hover {
|
||||
background: var(--gray-200, #e5e7eb);
|
||||
}
|
||||
.panel-list-item-title {
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
color: var(--gray-800, #1f2937);
|
||||
}
|
||||
.panel-list-item-desc {
|
||||
font-size: 11px;
|
||||
color: var(--gray-500, #6b7280);
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
body[class*="dark"] .panel-list-item:hover {
|
||||
background: #333;
|
||||
}
|
||||
body[class*="dark"] .panel-list-item-title {
|
||||
color: #ddd;
|
||||
}
|
||||
body[class*="dark"] .panel-list-item-desc {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
/* Explorer Panel */
|
||||
.explorer-toolbar {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.explorer-path {
|
||||
flex: 1;
|
||||
padding: 6px 8px;
|
||||
border: 1px solid var(--gray-300, #d1d5db);
|
||||
border-radius: 6px;
|
||||
font-size: 12px;
|
||||
background: white;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.explorer-browse-btn {
|
||||
border: 1px solid var(--gray-300, #d1d5db);
|
||||
border-radius: 6px;
|
||||
background: white;
|
||||
cursor: pointer;
|
||||
padding: 4px 8px;
|
||||
}
|
||||
.tree-item {
|
||||
padding: 3px 0;
|
||||
cursor: pointer;
|
||||
font-size: 13px;
|
||||
user-select: none;
|
||||
}
|
||||
.tree-item:hover {
|
||||
background: var(--gray-100, #f3f4f6);
|
||||
border-radius: 4px;
|
||||
}
|
||||
.tree-icon {
|
||||
margin-right: 4px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.tree-children {
|
||||
padding-left: 16px;
|
||||
}
|
||||
.tree-folder.collapsed .tree-children {
|
||||
display: none;
|
||||
}
|
||||
.tree-name {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
/* Git Panel */
|
||||
.git-section { margin-bottom: 16px; }
|
||||
.git-section-title { font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--gray-500); margin-bottom: 8px; }
|
||||
.git-file { display: flex; align-items: center; padding: 4px 6px; border-radius: 4px; font-size: 13px; gap: 6px; }
|
||||
.git-file:hover { background: var(--gray-100, #f3f4f6); }
|
||||
.git-file-status { font-weight: 700; font-family: monospace; width: 16px; text-align: center; }
|
||||
.git-file-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.git-stage-btn { border: none; background: var(--gray-200); border-radius: 4px; cursor: pointer; font-size: 14px; width: 22px; height: 22px; }
|
||||
.git-commit-input { width: 100%; padding: 8px; border: 1px solid var(--gray-300); border-radius: 6px; font-size: 13px; font-family: inherit; resize: vertical; box-sizing: border-box; }
|
||||
.git-commit-btn { width: 100%; margin-top: 8px; padding: 8px; background: var(--primary-dark, #5661b3); color: white; border: none; border-radius: 6px; font-size: 13px; cursor: pointer; }
|
||||
.git-commit-btn:hover { opacity: 0.9; }
|
||||
.git-log-entry { padding: 6px 0; border-bottom: 1px solid var(--gray-100); }
|
||||
.git-log-msg { font-size: 13px; }
|
||||
.git-log-meta { font-size: 11px; color: var(--gray-500); margin-top: 2px; }
|
||||
.git-info { font-size: 13px; color: var(--gray-500); padding: 8px 0; }
|
||||
.git-loading { font-size: 13px; color: var(--gray-400); }
|
||||
|
||||
/* Snippets Panel */
|
||||
.snippets-toolbar { display: flex; gap: 4px; margin-bottom: 8px; }
|
||||
.snippets-search { flex: 1; padding: 6px 10px; border: 1px solid var(--gray-300); border-radius: 6px; font-size: 13px; }
|
||||
.snippets-add-btn { width: 32px; border: 1px solid var(--gray-300); border-radius: 6px; background: white; font-size: 18px; cursor: pointer; }
|
||||
.snippet-item { padding: 8px; border: 1px solid var(--gray-200); border-radius: 6px; margin-bottom: 6px; }
|
||||
.snippet-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
|
||||
.snippet-name { font-size: 13px; font-weight: 500; }
|
||||
.snippet-lang { font-size: 11px; background: var(--gray-100); padding: 2px 6px; border-radius: 4px; color: var(--gray-500); }
|
||||
.snippet-preview { font-size: 12px; background: var(--gray-50); padding: 6px; border-radius: 4px; margin: 4px 0; overflow: hidden; max-height: 60px; }
|
||||
.snippet-preview code { font-family: 'JetBrains Mono', monospace; }
|
||||
.snippet-actions { display: flex; gap: 4px; }
|
||||
.snippet-insert { font-size: 12px; padding: 4px 8px; border: 1px solid var(--gray-300); border-radius: 4px; background: white; cursor: pointer; }
|
||||
.snippet-delete { font-size: 14px; padding: 4px 8px; border: 1px solid var(--gray-300); border-radius: 4px; background: white; cursor: pointer; color: #ef4444; }
|
||||
|
||||
/* Dark theme for sidebar panels */
|
||||
body[class*="dark"] .explorer-path,
|
||||
body[class*="dark"] .explorer-browse-btn,
|
||||
body[class*="dark"] .snippets-search,
|
||||
body[class*="dark"] .snippets-add-btn,
|
||||
body[class*="dark"] .snippet-insert,
|
||||
body[class*="dark"] .snippet-delete {
|
||||
background: #2d2d2d;
|
||||
border-color: #444;
|
||||
color: #ccc;
|
||||
}
|
||||
body[class*="dark"] .git-commit-input {
|
||||
background: #2d2d2d;
|
||||
border-color: #444;
|
||||
color: #ccc;
|
||||
}
|
||||
body[class*="dark"] .snippet-item {
|
||||
border-color: #444;
|
||||
}
|
||||
body[class*="dark"] .snippet-preview {
|
||||
background: #2d2d2d;
|
||||
}
|
||||
body[class*="dark"] .tree-item:hover,
|
||||
body[class*="dark"] .git-file:hover {
|
||||
background: #333;
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
.welcome-container { padding: 40px; max-width: 900px; margin: 0 auto; }
|
||||
.welcome-hero { text-align: center; margin-bottom: 40px; }
|
||||
.welcome-title { font-size: 32px; font-weight: 700; color: var(--gray-800, #1f2937); }
|
||||
.welcome-version { font-size: 14px; color: var(--primary-dark, #5661b3); margin-top: 4px; font-weight: 500; }
|
||||
.welcome-subtitle { font-size: 16px; color: var(--gray-500, #6b7280); margin-top: 8px; }
|
||||
.welcome-grid { display: grid; gap: 32px; }
|
||||
.welcome-section h2 { font-size: 18px; margin-bottom: 16px; color: var(--gray-700, #374151); }
|
||||
.welcome-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
|
||||
.welcome-card { padding: 20px; border: 1px solid var(--gray-200, #e5e7eb); border-radius: 12px; cursor: pointer; text-align: center; transition: all 0.2s; }
|
||||
.welcome-card:hover { border-color: var(--primary-dark, #5661b3); box-shadow: 0 4px 12px rgba(0,0,0,0.08); transform: translateY(-2px); }
|
||||
.welcome-card-icon { font-size: 28px; margin-bottom: 8px; }
|
||||
.welcome-card h3 { font-size: 15px; margin-bottom: 4px; }
|
||||
.welcome-card p { font-size: 13px; color: var(--gray-500); }
|
||||
.welcome-card kbd { display: inline-block; margin-top: 8px; padding: 2px 8px; background: var(--gray-100); border: 1px solid var(--gray-300); border-radius: 4px; font-size: 12px; font-family: 'JetBrains Mono', monospace; }
|
||||
.welcome-features { list-style: none; padding: 0; }
|
||||
.welcome-features li { padding: 6px 0; font-size: 14px; border-bottom: 1px solid var(--gray-100, #f3f4f6); }
|
||||
.welcome-features strong { color: var(--primary-dark, #5661b3); }
|
||||
.welcome-recent-item { padding: 8px 12px; border-radius: 6px; cursor: pointer; margin-bottom: 4px; }
|
||||
.welcome-recent-item:hover { background: var(--gray-100); }
|
||||
.welcome-recent-name { font-size: 14px; font-weight: 500; display: block; }
|
||||
.welcome-recent-path { font-size: 12px; color: var(--gray-500); display: block; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; }
|
||||
.welcome-muted { color: var(--gray-400); font-size: 14px; }
|
||||
.welcome-footer { margin-top: 32px; text-align: center; }
|
||||
.welcome-checkbox { font-size: 13px; color: var(--gray-500); cursor: pointer; }
|
||||
+116
-136
@@ -139,11 +139,18 @@ body {
|
||||
background: #d0d0d0;
|
||||
}
|
||||
|
||||
.toolbar-group {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
}
|
||||
.toolbar-separator {
|
||||
width: 1px;
|
||||
height: 24px;
|
||||
background: #ccc;
|
||||
margin: 0 8px;
|
||||
height: 20px;
|
||||
background: rgba(0, 0, 0, 0.12);
|
||||
margin: 0 6px;
|
||||
align-self: center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* Editor Container */
|
||||
@@ -181,34 +188,6 @@ body {
|
||||
background: #666;
|
||||
}
|
||||
|
||||
/* Preview Header */
|
||||
.preview-header {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
padding: 4px 8px;
|
||||
background: #f6f8fa;
|
||||
border-bottom: 1px solid #dfe2e5;
|
||||
min-height: 32px;
|
||||
}
|
||||
|
||||
.preview-popout-btn {
|
||||
background: transparent;
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
padding: 2px 6px;
|
||||
cursor: pointer;
|
||||
font-size: 11px;
|
||||
color: #8c959f;
|
||||
opacity: 0.5;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.preview-popout-btn:hover {
|
||||
background: rgba(0, 0, 0, 0.05);
|
||||
opacity: 1;
|
||||
color: #24292f;
|
||||
}
|
||||
|
||||
.editor-textarea {
|
||||
width: 100%;
|
||||
@@ -222,6 +201,20 @@ body {
|
||||
resize: none;
|
||||
}
|
||||
|
||||
/* CodeMirror container */
|
||||
.codemirror-container {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
.codemirror-container .cm-editor {
|
||||
height: 100%;
|
||||
font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
|
||||
font-size: 14px;
|
||||
}
|
||||
.codemirror-container .cm-scroller {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.pane:last-child {
|
||||
padding: 0;
|
||||
background: #fff;
|
||||
@@ -269,15 +262,67 @@ body {
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
/* Bottom Panel (REPL Output) */
|
||||
.bottom-panel { display: flex; flex-direction: column; border-top: 1px solid var(--gray-200, #e5e7eb); flex-shrink: 0; }
|
||||
.bottom-panel.collapsed { height: 0; overflow: hidden; border: none; }
|
||||
.bottom-panel:not(.collapsed) { height: 200px; }
|
||||
.bottom-panel-header { display: flex; justify-content: space-between; align-items: center; padding: 6px 12px; background: var(--gray-50, #f9fafb); border-bottom: 1px solid var(--gray-200); }
|
||||
.bottom-panel-title { font-size: 13px; font-weight: 600; color: var(--gray-600); }
|
||||
.bottom-panel-actions { display: flex; gap: 4px; }
|
||||
.bottom-panel-btn { font-size: 12px; padding: 4px 8px; border: 1px solid var(--gray-300); border-radius: 4px; background: white; cursor: pointer; }
|
||||
.bottom-panel-content { flex: 1; overflow-y: auto; padding: 12px; font-family: 'JetBrains Mono', monospace; font-size: 13px; background: #1e1e1e; color: #d4d4d4; }
|
||||
.repl-entry { margin-bottom: 8px; }
|
||||
.repl-command { color: #569cd6; margin-bottom: 2px; }
|
||||
.repl-stdout { color: #d4d4d4; white-space: pre-wrap; }
|
||||
.repl-stderr { color: #f44747; white-space: pre-wrap; }
|
||||
.repl-error { color: #f44747; }
|
||||
|
||||
/* Code Run Button */
|
||||
.code-run-btn {
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: 6px;
|
||||
padding: 4px 10px;
|
||||
font-size: 12px;
|
||||
background: var(--primary-dark, #5661b3);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s;
|
||||
}
|
||||
pre:hover .code-run-btn { opacity: 1; }
|
||||
|
||||
/* Dark theme bottom panel */
|
||||
body[class*="dark"] .bottom-panel-header { background: #1e1e1e; border-color: #333; }
|
||||
body[class*="dark"] .bottom-panel-btn { background: #2d2d2d; border-color: #444; color: #ccc; }
|
||||
body[class*="dark"] .bottom-panel-title { color: #ccc; }
|
||||
|
||||
/* Status Bar */
|
||||
.status-bar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 4px 12px;
|
||||
align-items: center;
|
||||
padding: 2px 12px;
|
||||
background: #f5f5f5;
|
||||
border-top: 1px solid #ddd;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
min-height: 24px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.status-bar-left, .status-bar-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
}
|
||||
.status-separator {
|
||||
color: var(--gray-300, #d1d5db);
|
||||
margin: 0 2px;
|
||||
}
|
||||
.status-item {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* Preview Styles */
|
||||
@@ -3973,108 +4018,43 @@ body.theme-github .mermaid {
|
||||
border-color: #e1e4e8;
|
||||
}
|
||||
|
||||
/* Task List Styles */
|
||||
.preview-content input[type="checkbox"] {
|
||||
margin-right: 6px;
|
||||
pointer-events: none;
|
||||
}
|
||||
.preview-content li.task-list-item {
|
||||
list-style: none;
|
||||
margin-left: -20px;
|
||||
}
|
||||
|
||||
/* Admonition Styles */
|
||||
.admonition {
|
||||
border-left: 4px solid;
|
||||
border-radius: 4px;
|
||||
padding: 12px 16px;
|
||||
margin: 16px 0;
|
||||
}
|
||||
.admonition-title {
|
||||
font-weight: 600;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.admonition-note, .admonition-info { border-color: #3b82f6; background: #eff6ff; }
|
||||
.admonition-warning { border-color: #f59e0b; background: #fffbeb; }
|
||||
.admonition-tip { border-color: #10b981; background: #ecfdf5; }
|
||||
.admonition-danger { border-color: #ef4444; background: #fef2f2; }
|
||||
|
||||
/* TOC Styles */
|
||||
.toc { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px; margin: 16px 0; }
|
||||
.toc h2 { font-size: 14px; margin-bottom: 8px; }
|
||||
.toc ul { list-style: none; padding: 0; }
|
||||
.toc li { padding: 2px 0; }
|
||||
.toc .toc-h1 { padding-left: 0; }
|
||||
.toc .toc-h2 { padding-left: 16px; }
|
||||
.toc .toc-h3 { padding-left: 32px; }
|
||||
.toc .toc-h4 { padding-left: 48px; }
|
||||
.toc a { color: #5661b3; text-decoration: none; }
|
||||
.toc a:hover { text-decoration: underline; }
|
||||
|
||||
/* Command Palette Styles */
|
||||
.command-palette {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
padding-top: 100px;
|
||||
z-index: 10000;
|
||||
}
|
||||
|
||||
.command-palette.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.command-palette-content {
|
||||
background: #fff;
|
||||
border-radius: 12px;
|
||||
width: 600px;
|
||||
max-width: 90%;
|
||||
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#command-search {
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
font-size: 18px;
|
||||
border: none;
|
||||
border-bottom: 1px solid #e0e0e0;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.command-list {
|
||||
max-height: 400px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.command-item {
|
||||
padding: 12px 20px;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
transition: background 0.15s;
|
||||
}
|
||||
|
||||
.command-item:hover,
|
||||
.command-item.selected {
|
||||
background: #f0f0f0;
|
||||
}
|
||||
|
||||
.command-name {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.command-shortcut {
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
background: #f5f5f5;
|
||||
padding: 3px 8px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.command-palette-footer {
|
||||
padding: 12px 20px;
|
||||
background: #f9f9f9;
|
||||
border-top: 1px solid #e0e0e0;
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* Dark theme support for command palette */
|
||||
body.theme-dark .command-palette-content {
|
||||
background: #2d2d2d;
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
body.theme-dark #command-search {
|
||||
background: #2d2d2d;
|
||||
color: #f0f0f0;
|
||||
border-color: #444;
|
||||
}
|
||||
|
||||
body.theme-dark .command-item:hover,
|
||||
body.theme-dark .command-item.selected {
|
||||
background: #3d3d3d;
|
||||
}
|
||||
|
||||
body.theme-dark .command-shortcut {
|
||||
background: #3d3d3d;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
body.theme-dark .command-palette-footer {
|
||||
background: #252525;
|
||||
border-color: #444;
|
||||
color: #999;
|
||||
}
|
||||
/* Command Palette styles moved to styles-modern.css */
|
||||
|
||||
@@ -0,0 +1,90 @@
|
||||
# API Documentation
|
||||
|
||||
**Base URL:** `https://api.example.com/v1`
|
||||
**Version:** 1.0
|
||||
**Date:** {{DATE}}
|
||||
|
||||
## Authentication
|
||||
|
||||
All requests require an API key in the header:
|
||||
|
||||
```
|
||||
Authorization: Bearer YOUR_API_KEY
|
||||
```
|
||||
|
||||
## Endpoints
|
||||
|
||||
### Get All Resources
|
||||
|
||||
```
|
||||
GET /resources
|
||||
```
|
||||
|
||||
**Query Parameters:**
|
||||
|
||||
| Parameter | Type | Required | Description |
|
||||
|-----------|------|----------|-------------|
|
||||
| page | integer | No | Page number (default: 1) |
|
||||
| limit | integer | No | Items per page (default: 20) |
|
||||
|
||||
**Response:**
|
||||
|
||||
```json
|
||||
{
|
||||
"data": [],
|
||||
"total": 0,
|
||||
"page": 1
|
||||
}
|
||||
```
|
||||
|
||||
### Get Resource by ID
|
||||
|
||||
```
|
||||
GET /resources/:id
|
||||
```
|
||||
|
||||
**Response:**
|
||||
|
||||
```json
|
||||
{
|
||||
"id": "1",
|
||||
"name": "Resource name",
|
||||
"created_at": "2024-01-01T00:00:00Z"
|
||||
}
|
||||
```
|
||||
|
||||
### Create Resource
|
||||
|
||||
```
|
||||
POST /resources
|
||||
```
|
||||
|
||||
**Request Body:**
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "New resource",
|
||||
"description": "Description"
|
||||
}
|
||||
```
|
||||
|
||||
### Update Resource
|
||||
|
||||
```
|
||||
PUT /resources/:id
|
||||
```
|
||||
|
||||
### Delete Resource
|
||||
|
||||
```
|
||||
DELETE /resources/:id
|
||||
```
|
||||
|
||||
## Error Codes
|
||||
|
||||
| Code | Description |
|
||||
|------|-------------|
|
||||
| 400 | Bad Request |
|
||||
| 401 | Unauthorized |
|
||||
| 404 | Not Found |
|
||||
| 500 | Internal Server Error |
|
||||
@@ -0,0 +1,20 @@
|
||||
---
|
||||
title: Blog Post Title
|
||||
date: {{DATE}}
|
||||
author: Your Name
|
||||
tags: []
|
||||
---
|
||||
|
||||
# Blog Post Title
|
||||
|
||||
## Introduction
|
||||
|
||||
Write your introduction here.
|
||||
|
||||
## Main Content
|
||||
|
||||
Your main content goes here.
|
||||
|
||||
## Conclusion
|
||||
|
||||
Wrap up your thoughts.
|
||||
@@ -0,0 +1,20 @@
|
||||
# Changelog
|
||||
|
||||
## [Unreleased]
|
||||
|
||||
### Added
|
||||
- New feature
|
||||
|
||||
### Changed
|
||||
- Updated feature
|
||||
|
||||
### Fixed
|
||||
- Bug fix
|
||||
|
||||
### Removed
|
||||
- Removed feature
|
||||
|
||||
## [1.0.0] - {{DATE}}
|
||||
|
||||
### Added
|
||||
- Initial release
|
||||
@@ -0,0 +1,59 @@
|
||||
# Comparison: [Option A] vs [Option B]
|
||||
|
||||
**Date:** {{DATE}}
|
||||
**Author:** Your Name
|
||||
|
||||
## Overview
|
||||
|
||||
Brief description of what is being compared and why.
|
||||
|
||||
## Feature Comparison
|
||||
|
||||
| Feature | Option A | Option B |
|
||||
|---------|----------|----------|
|
||||
| Feature 1 | Yes | Yes |
|
||||
| Feature 2 | Yes | No |
|
||||
| Feature 3 | No | Yes |
|
||||
| Feature 4 | Partial | Yes |
|
||||
|
||||
## Pricing
|
||||
|
||||
| Plan | Option A | Option B |
|
||||
|------|----------|----------|
|
||||
| Free | Limited | Limited |
|
||||
| Pro | $10/mo | $15/mo |
|
||||
| Enterprise | Custom | Custom |
|
||||
|
||||
## Pros and Cons
|
||||
|
||||
### Option A
|
||||
|
||||
**Pros:**
|
||||
- Pro 1
|
||||
- Pro 2
|
||||
|
||||
**Cons:**
|
||||
- Con 1
|
||||
- Con 2
|
||||
|
||||
### Option B
|
||||
|
||||
**Pros:**
|
||||
- Pro 1
|
||||
- Pro 2
|
||||
|
||||
**Cons:**
|
||||
- Con 1
|
||||
- Con 2
|
||||
|
||||
## Performance
|
||||
|
||||
| Metric | Option A | Option B |
|
||||
|--------|----------|----------|
|
||||
| Speed | Fast | Moderate |
|
||||
| Memory | Low | Medium |
|
||||
| Scalability | Good | Excellent |
|
||||
|
||||
## Recommendation
|
||||
|
||||
Based on the analysis above, [Option A/B] is recommended for [use case] because [reason].
|
||||
@@ -0,0 +1,26 @@
|
||||
# Meeting Notes
|
||||
|
||||
**Date:** {{DATE}}
|
||||
**Attendees:**
|
||||
- Name 1
|
||||
- Name 2
|
||||
|
||||
## Agenda
|
||||
|
||||
1. Topic 1
|
||||
2. Topic 2
|
||||
|
||||
## Discussion
|
||||
|
||||
### Topic 1
|
||||
|
||||
Notes here.
|
||||
|
||||
## Action Items
|
||||
|
||||
- [ ] Action item 1 — Owner — Due date
|
||||
- [ ] Action item 2 — Owner — Due date
|
||||
|
||||
## Next Meeting
|
||||
|
||||
Date: TBD
|
||||
@@ -0,0 +1,54 @@
|
||||
# Project Plan: [Project Name]
|
||||
|
||||
**Date:** {{DATE}}
|
||||
**Project Lead:** Your Name
|
||||
**Status:** Planning
|
||||
|
||||
## Goals
|
||||
|
||||
1. Primary goal
|
||||
2. Secondary goal
|
||||
|
||||
## Scope
|
||||
|
||||
### In Scope
|
||||
- Item 1
|
||||
- Item 2
|
||||
|
||||
### Out of Scope
|
||||
- Item 1
|
||||
|
||||
## Milestones
|
||||
|
||||
| Milestone | Target Date | Status |
|
||||
|-----------|-------------|--------|
|
||||
| Kickoff | {{DATE}} | Not Started |
|
||||
| MVP | TBD | Not Started |
|
||||
| Launch | TBD | Not Started |
|
||||
|
||||
## Resources
|
||||
|
||||
| Role | Person | Allocation |
|
||||
|------|--------|------------|
|
||||
| Lead | Name | 100% |
|
||||
| Developer | Name | 50% |
|
||||
|
||||
## Risks
|
||||
|
||||
| Risk | Impact | Likelihood | Mitigation |
|
||||
|------|--------|------------|------------|
|
||||
| Risk 1 | High | Medium | Plan |
|
||||
|
||||
## Timeline
|
||||
|
||||
### Phase 1: Planning
|
||||
- [ ] Define requirements
|
||||
- [ ] Create design documents
|
||||
|
||||
### Phase 2: Development
|
||||
- [ ] Implement core features
|
||||
- [ ] Write tests
|
||||
|
||||
### Phase 3: Launch
|
||||
- [ ] Deploy to production
|
||||
- [ ] Monitor and iterate
|
||||
@@ -0,0 +1,38 @@
|
||||
# Project Name
|
||||
|
||||
Brief description of the project.
|
||||
|
||||
## Features
|
||||
|
||||
- Feature 1
|
||||
- Feature 2
|
||||
|
||||
## Installation
|
||||
|
||||
```bash
|
||||
npm install project-name
|
||||
```
|
||||
|
||||
## Usage
|
||||
|
||||
```javascript
|
||||
const project = require('project-name');
|
||||
```
|
||||
|
||||
## Configuration
|
||||
|
||||
| Option | Default | Description |
|
||||
|--------|---------|-------------|
|
||||
| option1 | true | Description |
|
||||
|
||||
## Contributing
|
||||
|
||||
1. Fork the repository
|
||||
2. Create your feature branch
|
||||
3. Commit your changes
|
||||
4. Push to the branch
|
||||
5. Open a Pull Request
|
||||
|
||||
## License
|
||||
|
||||
MIT
|
||||
@@ -0,0 +1,42 @@
|
||||
# Release Notes - v1.0.0
|
||||
|
||||
**Release Date:** {{DATE}}
|
||||
|
||||
## Highlights
|
||||
|
||||
Brief summary of the most important changes in this release.
|
||||
|
||||
## New Features
|
||||
|
||||
- **Feature 1:** Description of the new feature
|
||||
- **Feature 2:** Description of the new feature
|
||||
|
||||
## Improvements
|
||||
|
||||
- Improved performance of feature X
|
||||
- Updated dependency Y to version Z
|
||||
|
||||
## Bug Fixes
|
||||
|
||||
- Fixed issue where X would cause Y (#123)
|
||||
- Resolved crash when performing Z (#456)
|
||||
|
||||
## Breaking Changes
|
||||
|
||||
- Changed API endpoint from `/old` to `/new`
|
||||
- Removed deprecated method `oldMethod()`
|
||||
|
||||
## Migration Guide
|
||||
|
||||
### From v0.9.x to v1.0.0
|
||||
|
||||
1. Update configuration file format
|
||||
2. Replace deprecated API calls
|
||||
|
||||
## Known Issues
|
||||
|
||||
- Issue description (#789)
|
||||
|
||||
## Contributors
|
||||
|
||||
Thanks to everyone who contributed to this release.
|
||||
@@ -0,0 +1,42 @@
|
||||
# Technical Specification: [Feature Name]
|
||||
|
||||
**Version:** 1.0
|
||||
**Date:** {{DATE}}
|
||||
**Author:** Your Name
|
||||
**Status:** Draft
|
||||
|
||||
## Overview
|
||||
|
||||
Brief description of what this feature does.
|
||||
|
||||
## Requirements
|
||||
|
||||
### Functional Requirements
|
||||
1. Requirement 1
|
||||
2. Requirement 2
|
||||
|
||||
### Non-Functional Requirements
|
||||
1. Performance requirement
|
||||
2. Security requirement
|
||||
|
||||
## Architecture
|
||||
|
||||
Describe the technical approach.
|
||||
|
||||
## API Design
|
||||
|
||||
### Endpoints
|
||||
|
||||
| Method | Path | Description |
|
||||
|--------|------|-------------|
|
||||
| GET | /api/resource | Get resource |
|
||||
|
||||
## Testing Strategy
|
||||
|
||||
Describe how this will be tested.
|
||||
|
||||
## Timeline
|
||||
|
||||
| Phase | Duration | Deliverables |
|
||||
|-------|----------|-------------|
|
||||
| Phase 1 | 1 week | Core implementation |
|
||||
@@ -0,0 +1,71 @@
|
||||
# Tutorial: [Topic Name]
|
||||
|
||||
**Date:** {{DATE}}
|
||||
**Difficulty:** Beginner / Intermediate / Advanced
|
||||
**Time:** ~30 minutes
|
||||
|
||||
## Prerequisites
|
||||
|
||||
- Prerequisite 1
|
||||
- Prerequisite 2
|
||||
|
||||
## What You Will Learn
|
||||
|
||||
- Learning objective 1
|
||||
- Learning objective 2
|
||||
|
||||
## Step 1: Getting Started
|
||||
|
||||
Description of the first step.
|
||||
|
||||
```bash
|
||||
# Example command
|
||||
echo "Hello, World!"
|
||||
```
|
||||
|
||||
## Step 2: Core Concepts
|
||||
|
||||
Explain the main concepts here.
|
||||
|
||||
### Key Concept A
|
||||
|
||||
Details about concept A.
|
||||
|
||||
### Key Concept B
|
||||
|
||||
Details about concept B.
|
||||
|
||||
## Step 3: Building the Feature
|
||||
|
||||
Walk through the implementation.
|
||||
|
||||
```javascript
|
||||
// Example code
|
||||
function example() {
|
||||
return 'Hello';
|
||||
}
|
||||
```
|
||||
|
||||
## Step 4: Testing
|
||||
|
||||
How to verify everything works.
|
||||
|
||||
## Common Issues
|
||||
|
||||
### Issue 1
|
||||
**Problem:** Description of the problem.
|
||||
**Solution:** How to fix it.
|
||||
|
||||
### Issue 2
|
||||
**Problem:** Description of the problem.
|
||||
**Solution:** How to fix it.
|
||||
|
||||
## Next Steps
|
||||
|
||||
- Suggested follow-up 1
|
||||
- Suggested follow-up 2
|
||||
|
||||
## Resources
|
||||
|
||||
- [Resource 1](https://example.com)
|
||||
- [Resource 2](https://example.com)
|
||||
@@ -0,0 +1,78 @@
|
||||
function createWelcomeContent(recentFiles = []) {
|
||||
const recentHtml = recentFiles.length
|
||||
? recentFiles.map(f => {
|
||||
const name = f.split(/[/\\]/).pop();
|
||||
return `<div class="welcome-recent-item" data-path="${f}"><span class="welcome-recent-name">${name}</span><span class="welcome-recent-path">${f}</span></div>`;
|
||||
}).join('')
|
||||
: '<p class="welcome-muted">No recent files</p>';
|
||||
|
||||
return `
|
||||
<div class="welcome-container">
|
||||
<div class="welcome-hero">
|
||||
<h1 class="welcome-title">MarkdownConverter</h1>
|
||||
<p class="welcome-version">Version 4.0.0</p>
|
||||
<p class="welcome-subtitle">Professional Markdown Editor & Universal Document Converter</p>
|
||||
</div>
|
||||
|
||||
<div class="welcome-grid">
|
||||
<div class="welcome-section">
|
||||
<h2>Quick Start</h2>
|
||||
<div class="welcome-cards">
|
||||
<div class="welcome-card" data-action="new-file">
|
||||
<div class="welcome-card-icon">+</div>
|
||||
<h3>New Document</h3>
|
||||
<p>Create a blank document</p>
|
||||
<kbd>Ctrl+N</kbd>
|
||||
</div>
|
||||
<div class="welcome-card" data-action="open-file">
|
||||
<div class="welcome-card-icon">📂</div>
|
||||
<h3>Open File</h3>
|
||||
<p>Open an existing file</p>
|
||||
<kbd>Ctrl+O</kbd>
|
||||
</div>
|
||||
<div class="welcome-card" data-action="open-template">
|
||||
<div class="welcome-card-icon">📋</div>
|
||||
<h3>From Template</h3>
|
||||
<p>Start from a template</p>
|
||||
</div>
|
||||
<div class="welcome-card" data-action="command-palette">
|
||||
<div class="welcome-card-icon">⌘</div>
|
||||
<h3>Command Palette</h3>
|
||||
<p>Search all actions</p>
|
||||
<kbd>Ctrl+Shift+P</kbd>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="welcome-section">
|
||||
<h2>What's New in v4.0.0</h2>
|
||||
<ul class="welcome-features">
|
||||
<li><strong>CodeMirror Editor</strong> — Syntax highlighting, code folding, multiple cursors</li>
|
||||
<li><strong>Sidebar Panels</strong> — File Explorer, Git, Snippets, Templates</li>
|
||||
<li><strong>Command Palette</strong> — Quick access to all actions</li>
|
||||
<li><strong>Code Execution</strong> — Run JS, Python, Bash from code blocks</li>
|
||||
<li><strong>Print Preview</strong> — Full print customization dialog</li>
|
||||
<li><strong>New Formats</strong> — Reveal.js, YAML, JSON, Confluence, and more</li>
|
||||
<li><strong>Spell Checking</strong> — System dictionary with suggestions</li>
|
||||
<li><strong>Markdown Extensions</strong> — Footnotes, admonitions, TOC</li>
|
||||
<li><strong>Image Handling</strong> — Paste and drag-drop images</li>
|
||||
<li><strong>PlantUML</strong> — Diagram rendering in preview</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="welcome-section">
|
||||
<h2>Recent Files</h2>
|
||||
<div class="welcome-recent">${recentHtml}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="welcome-footer">
|
||||
<label class="welcome-checkbox">
|
||||
<input type="checkbox" id="show-welcome-startup" checked>
|
||||
Show this tab on startup
|
||||
</label>
|
||||
</div>
|
||||
</div>`;
|
||||
}
|
||||
|
||||
module.exports = { createWelcomeContent };
|
||||
@@ -0,0 +1,144 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
|
||||
/**
|
||||
* Tests for CommandPalette
|
||||
* Tests command registration, filtering, execution, and keyboard navigation
|
||||
*/
|
||||
|
||||
describe('CommandPalette', () => {
|
||||
let CommandPalette;
|
||||
|
||||
beforeEach(() => {
|
||||
document.body.innerHTML = `
|
||||
<div class="command-palette-overlay hidden" id="command-palette-overlay">
|
||||
<div class="command-palette">
|
||||
<input type="text" id="command-palette-input">
|
||||
<div id="command-palette-results"></div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
CommandPalette = require('../src/command-palette').CommandPalette;
|
||||
});
|
||||
|
||||
test('starts hidden', () => {
|
||||
const palette = new CommandPalette();
|
||||
expect(palette.isOpen()).toBe(false);
|
||||
});
|
||||
|
||||
test('opens and focuses input', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.open();
|
||||
expect(palette.isOpen()).toBe(true);
|
||||
});
|
||||
|
||||
test('closes', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.open();
|
||||
palette.close();
|
||||
expect(palette.isOpen()).toBe(false);
|
||||
});
|
||||
|
||||
test('registers and renders commands', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.register('Test Command', 'Ctrl+T', () => {});
|
||||
palette.register('Another Command', '', () => {});
|
||||
palette.open();
|
||||
const items = document.querySelectorAll('.command-item');
|
||||
expect(items.length).toBe(2);
|
||||
});
|
||||
|
||||
test('filters commands by search', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.register('Save File', 'Ctrl+S', () => {});
|
||||
palette.register('Open File', 'Ctrl+O', () => {});
|
||||
palette.register('Bold Text', 'Ctrl+B', () => {});
|
||||
palette.renderResults('file');
|
||||
const items = document.querySelectorAll('.command-item');
|
||||
expect(items.length).toBe(2);
|
||||
});
|
||||
|
||||
test('executes command', () => {
|
||||
const palette = new CommandPalette();
|
||||
const action = jest.fn();
|
||||
palette.register('Test', '', action);
|
||||
palette.open();
|
||||
palette.executeSelected();
|
||||
expect(action).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
test('highlights matching text', () => {
|
||||
const palette = new CommandPalette();
|
||||
const result = palette.highlightMatch('Save File', 'save');
|
||||
expect(result).toContain('<strong>');
|
||||
expect(result).toContain('Save');
|
||||
});
|
||||
|
||||
test('highlightMatch returns original text when no query', () => {
|
||||
const palette = new CommandPalette();
|
||||
const result = palette.highlightMatch('Save File', '');
|
||||
expect(result).toBe('Save File');
|
||||
});
|
||||
|
||||
test('filters case-insensitively', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.register('Save File', '', () => {});
|
||||
palette.register('Open File', '', () => {});
|
||||
palette.renderResults('SAVE');
|
||||
const items = document.querySelectorAll('.command-item');
|
||||
expect(items.length).toBe(1);
|
||||
});
|
||||
|
||||
test('shows all commands when query is empty', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.register('Cmd1', '', () => {});
|
||||
palette.register('Cmd2', '', () => {});
|
||||
palette.register('Cmd3', '', () => {});
|
||||
palette.renderResults('');
|
||||
const items = document.querySelectorAll('.command-item');
|
||||
expect(items.length).toBe(3);
|
||||
});
|
||||
|
||||
test('displays shortcut when provided', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.register('Save File', 'Ctrl+S', () => {});
|
||||
palette.open();
|
||||
const shortcut = document.querySelector('.command-shortcut');
|
||||
expect(shortcut).not.toBeNull();
|
||||
expect(shortcut.textContent).toBe('Ctrl+S');
|
||||
});
|
||||
|
||||
test('does not display shortcut when empty', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.register('Test Command', '', () => {});
|
||||
palette.open();
|
||||
const shortcut = document.querySelector('.command-shortcut');
|
||||
expect(shortcut).toBeNull();
|
||||
});
|
||||
|
||||
test('closes on overlay click', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.open();
|
||||
// Simulate click on the overlay itself
|
||||
const event = new Event('click', { bubbles: true });
|
||||
Object.defineProperty(event, 'target', { value: palette.overlay });
|
||||
palette.overlay.dispatchEvent(event);
|
||||
expect(palette.isOpen()).toBe(false);
|
||||
});
|
||||
|
||||
test('executeSelected does nothing when no commands', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.open();
|
||||
// Should not throw
|
||||
expect(() => palette.executeSelected()).not.toThrow();
|
||||
});
|
||||
|
||||
test('closes after executing command', () => {
|
||||
const palette = new CommandPalette();
|
||||
palette.register('Test', '', jest.fn());
|
||||
palette.open();
|
||||
palette.executeSelected();
|
||||
expect(palette.isOpen()).toBe(false);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,100 @@
|
||||
/**
|
||||
* Tests for Main Process Utilities
|
||||
* Tests sanitization, rate limiting, and other main process helpers
|
||||
*/
|
||||
|
||||
describe('sanitizeErrorMessage', () => {
|
||||
const sanitizeErrorMessage = (message) => {
|
||||
if (typeof message !== 'string') return String(message);
|
||||
return message
|
||||
.replace(/[A-Z]:\\[^\s"']+\\([^\s"'\\]+)/gi, '$1')
|
||||
.replace(/\/[^\s"']+\/([^\s"'/]+)/g, '$1');
|
||||
};
|
||||
|
||||
test('strips Windows absolute paths', () => {
|
||||
expect(sanitizeErrorMessage('Error in C:\\Users\\test\\file.js'))
|
||||
.toBe('Error in file.js');
|
||||
});
|
||||
|
||||
test('strips Unix absolute paths', () => {
|
||||
expect(sanitizeErrorMessage('Error in /home/user/project/file.js'))
|
||||
.toBe('Error in file.js');
|
||||
});
|
||||
|
||||
test('handles non-string input', () => {
|
||||
expect(sanitizeErrorMessage(42)).toBe('42');
|
||||
expect(sanitizeErrorMessage(null)).toBe('null');
|
||||
});
|
||||
|
||||
test('preserves messages without paths', () => {
|
||||
expect(sanitizeErrorMessage('Something went wrong'))
|
||||
.toBe('Something went wrong');
|
||||
});
|
||||
|
||||
test('strips nested Windows paths', () => {
|
||||
expect(sanitizeErrorMessage('Cannot read C:\\Users\\admin\\AppData\\Local\\config.json'))
|
||||
.toBe('Cannot read config.json');
|
||||
});
|
||||
|
||||
test('strips nested Unix paths', () => {
|
||||
expect(sanitizeErrorMessage('File not found: /var/log/app/error.log'))
|
||||
.toBe('File not found: error.log');
|
||||
});
|
||||
|
||||
test('handles undefined input', () => {
|
||||
expect(sanitizeErrorMessage(undefined)).toBe('undefined');
|
||||
});
|
||||
});
|
||||
|
||||
describe('createRateLimiter', () => {
|
||||
const createRateLimiter = (minIntervalMs = 2000) => {
|
||||
let lastCall = 0;
|
||||
return function canProceed() {
|
||||
const now = Date.now();
|
||||
if (now - lastCall < minIntervalMs) return false;
|
||||
lastCall = now;
|
||||
return true;
|
||||
};
|
||||
};
|
||||
|
||||
test('allows first call', () => {
|
||||
const limiter = createRateLimiter(1000);
|
||||
expect(limiter()).toBe(true);
|
||||
});
|
||||
|
||||
test('blocks rapid calls', () => {
|
||||
const limiter = createRateLimiter(1000);
|
||||
limiter(); // first call
|
||||
expect(limiter()).toBe(false); // too soon
|
||||
});
|
||||
|
||||
test('allows call after interval', () => {
|
||||
jest.useFakeTimers();
|
||||
const limiter = createRateLimiter(1000);
|
||||
limiter();
|
||||
jest.advanceTimersByTime(1001);
|
||||
expect(limiter()).toBe(true);
|
||||
jest.useRealTimers();
|
||||
});
|
||||
|
||||
test('uses default interval of 2000ms', () => {
|
||||
jest.useFakeTimers();
|
||||
const limiter = createRateLimiter();
|
||||
limiter();
|
||||
jest.advanceTimersByTime(1999);
|
||||
expect(limiter()).toBe(false);
|
||||
jest.advanceTimersByTime(2);
|
||||
expect(limiter()).toBe(true);
|
||||
jest.useRealTimers();
|
||||
});
|
||||
|
||||
test('resets after successful call', () => {
|
||||
jest.useFakeTimers();
|
||||
const limiter = createRateLimiter(500);
|
||||
limiter();
|
||||
jest.advanceTimersByTime(501);
|
||||
limiter(); // resets the timer
|
||||
expect(limiter()).toBe(false); // too soon after second call
|
||||
jest.useRealTimers();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,130 @@
|
||||
/**
|
||||
* Tests for Markdown Extensions
|
||||
* Tests TOC generation, admonition parsing, and PlantUML encoding
|
||||
*/
|
||||
|
||||
describe('Markdown Extensions', () => {
|
||||
describe('TOC generation from headings', () => {
|
||||
test('extracts all heading levels', () => {
|
||||
const html = '<h1>Title</h1><h2>Section 1</h2><h2>Section 2</h2><h3>Subsection</h3>';
|
||||
const headingRegex = /<h([1-6])[^>]*>(.*?)<\/h[1-6]>/gi;
|
||||
const toc = [];
|
||||
let match;
|
||||
while ((match = headingRegex.exec(html)) !== null) {
|
||||
toc.push({ level: parseInt(match[1]), text: match[2] });
|
||||
}
|
||||
expect(toc).toHaveLength(4);
|
||||
expect(toc[0]).toEqual({ level: 1, text: 'Title' });
|
||||
expect(toc[3]).toEqual({ level: 3, text: 'Subsection' });
|
||||
});
|
||||
|
||||
test('handles empty HTML', () => {
|
||||
const html = '<p>No headings here</p>';
|
||||
const headingRegex = /<h([1-6])[^>]*>(.*?)<\/h[1-6]>/gi;
|
||||
const toc = [];
|
||||
let match;
|
||||
while ((match = headingRegex.exec(html)) !== null) {
|
||||
toc.push({ level: parseInt(match[1]), text: match[2] });
|
||||
}
|
||||
expect(toc).toHaveLength(0);
|
||||
});
|
||||
|
||||
test('handles headings with attributes', () => {
|
||||
const html = '<h1 id="title" class="main">Title</h1><h2 id="sec">Section</h2>';
|
||||
const headingRegex = /<h([1-6])[^>]*>(.*?)<\/h[1-6]>/gi;
|
||||
const toc = [];
|
||||
let match;
|
||||
while ((match = headingRegex.exec(html)) !== null) {
|
||||
toc.push({ level: parseInt(match[1]), text: match[2] });
|
||||
}
|
||||
expect(toc).toHaveLength(2);
|
||||
expect(toc[0].text).toBe('Title');
|
||||
});
|
||||
});
|
||||
|
||||
describe('Admonition regex matching', () => {
|
||||
test('matches note admonition', () => {
|
||||
const src = ':::note\nThis is a note.\n:::\n';
|
||||
const match = src.match(/^:::(note|warning|tip|danger|info)\s*\n([\s\S]*?)^:::\s*$/m);
|
||||
expect(match).not.toBeNull();
|
||||
expect(match[1]).toBe('note');
|
||||
expect(match[2].trim()).toBe('This is a note.');
|
||||
});
|
||||
|
||||
test('matches all admonition types', () => {
|
||||
const types = ['note', 'warning', 'tip', 'danger', 'info'];
|
||||
types.forEach(type => {
|
||||
const src = `:::${type}\nContent\n:::\n`;
|
||||
const match = src.match(/^:::(note|warning|tip|danger|info)\s*\n([\s\S]*?)^:::\s*$/m);
|
||||
expect(match).not.toBeNull();
|
||||
expect(match[1]).toBe(type);
|
||||
});
|
||||
});
|
||||
|
||||
test('does not match invalid admonition type', () => {
|
||||
const src = ':::custom\nContent\n:::\n';
|
||||
const match = src.match(/^:::(note|warning|tip|danger|info)\s*\n([\s\S]*?)^:::\s*$/m);
|
||||
expect(match).toBeNull();
|
||||
});
|
||||
|
||||
test('captures multiline content', () => {
|
||||
const src = ':::warning\nLine 1\nLine 2\nLine 3\n:::\n';
|
||||
const match = src.match(/^:::(note|warning|tip|danger|info)\s*\n([\s\S]*?)^:::\s*$/m);
|
||||
expect(match).not.toBeNull();
|
||||
expect(match[2]).toContain('Line 1');
|
||||
expect(match[2]).toContain('Line 3');
|
||||
});
|
||||
});
|
||||
|
||||
describe('PlantUML hex encoding', () => {
|
||||
const plantumlEncode = (text) => {
|
||||
const hex = Array.from(Buffer.from(text, 'utf-8'))
|
||||
.map(b => b.toString(16).padStart(2, '0'))
|
||||
.join('');
|
||||
return '~h' + hex;
|
||||
};
|
||||
|
||||
test('encodes simple text', () => {
|
||||
const encoded = plantumlEncode('A -> B');
|
||||
expect(encoded).toBe('~h41202d3e2042');
|
||||
});
|
||||
|
||||
test('encodes empty string', () => {
|
||||
expect(plantumlEncode('')).toBe('~h');
|
||||
});
|
||||
|
||||
test('encodes special characters', () => {
|
||||
const encoded = plantumlEncode('@startuml');
|
||||
expect(encoded).toMatch(/^~h[0-9a-f]+$/);
|
||||
// '@' is 0x40, 's' is 0x73
|
||||
expect(encoded.startsWith('~h40')).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe('Slug generation for TOC anchors', () => {
|
||||
const slugify = (text) => {
|
||||
return text
|
||||
.toLowerCase()
|
||||
.replace(/[^\w\s-]/g, '')
|
||||
.replace(/\s+/g, '-')
|
||||
.replace(/-+/g, '-')
|
||||
.trim();
|
||||
};
|
||||
|
||||
test('converts heading to slug', () => {
|
||||
expect(slugify('Hello World')).toBe('hello-world');
|
||||
});
|
||||
|
||||
test('removes special characters', () => {
|
||||
expect(slugify('What is C++?')).toBe('what-is-c');
|
||||
});
|
||||
|
||||
test('collapses multiple dashes', () => {
|
||||
expect(slugify('Hello World')).toBe('hello-world');
|
||||
});
|
||||
|
||||
test('handles already lowercase text', () => {
|
||||
expect(slugify('simple')).toBe('simple');
|
||||
});
|
||||
});
|
||||
});
|
||||
+56
-2
@@ -14,12 +14,29 @@ describe('Preload Security', () => {
|
||||
'renderer-ready',
|
||||
'get-theme',
|
||||
'do-print',
|
||||
'do-print-with-options',
|
||||
'export-with-options',
|
||||
'export-spreadsheet',
|
||||
'batch-convert',
|
||||
'select-folder',
|
||||
'universal-convert',
|
||||
'universal-convert-batch',
|
||||
'image-convert',
|
||||
'image-batch-convert',
|
||||
'image-resize',
|
||||
'image-compress',
|
||||
'image-rotate',
|
||||
'audio-convert',
|
||||
'audio-batch-convert',
|
||||
'audio-extract',
|
||||
'audio-trim',
|
||||
'audio-merge',
|
||||
'video-convert',
|
||||
'video-batch-convert',
|
||||
'video-compress',
|
||||
'video-trim',
|
||||
'video-frames',
|
||||
'video-gif',
|
||||
'get-header-footer-settings',
|
||||
'save-header-footer-settings',
|
||||
'browse-header-footer-logo',
|
||||
@@ -30,7 +47,26 @@ describe('Preload Security', () => {
|
||||
'set-custom-start-page',
|
||||
'process-pdf-operation',
|
||||
'get-pdf-page-count',
|
||||
'select-pdf-folder'
|
||||
'select-pdf-folder',
|
||||
'open-ascii-generator',
|
||||
'open-table-generator',
|
||||
'insert-generated-content',
|
||||
'save-pasted-image',
|
||||
'load-template',
|
||||
'list-directory',
|
||||
'open-file-path',
|
||||
'git-status',
|
||||
'git-stage',
|
||||
'git-commit',
|
||||
'git-log',
|
||||
'git-diff',
|
||||
'get-snippets',
|
||||
'save-snippet',
|
||||
'delete-snippet',
|
||||
'execute-code',
|
||||
'show-pdf-editor-from-toolbar',
|
||||
'menu-open',
|
||||
'export'
|
||||
];
|
||||
|
||||
const EXPECTED_RECEIVE_CHANNELS = [
|
||||
@@ -54,18 +90,36 @@ describe('Preload Security', () => {
|
||||
'show-universal-converter-dialog',
|
||||
'show-table-generator',
|
||||
'show-pdf-editor-dialog',
|
||||
'show-image-converter',
|
||||
'show-audio-converter',
|
||||
'show-video-converter',
|
||||
'open-pdf-viewer',
|
||||
'conversion-status',
|
||||
'conversion-complete',
|
||||
'batch-progress',
|
||||
'image-conversion-complete',
|
||||
'audio-conversion-complete',
|
||||
'video-conversion-complete',
|
||||
'folder-selected',
|
||||
'pdf-folder-selected',
|
||||
'header-footer-settings-data',
|
||||
'header-footer-logo-selected',
|
||||
'header-footer-logo-saved',
|
||||
'header-footer-logo-cleared',
|
||||
'page-settings-data',
|
||||
'pdf-page-count',
|
||||
'pdf-operation-complete',
|
||||
'pdf-operation-error'
|
||||
'pdf-operation-error',
|
||||
'pdf-operation-progress',
|
||||
'show-ascii-generator-window',
|
||||
'show-ascii-generator',
|
||||
'show-table-generator-window',
|
||||
'open-header-footer-dialog',
|
||||
'insert-content',
|
||||
'load-template-menu',
|
||||
'toggle-command-palette',
|
||||
'toggle-sidebar-panel',
|
||||
'toggle-bottom-panel'
|
||||
];
|
||||
|
||||
test('should define all expected send channels', () => {
|
||||
|
||||
@@ -0,0 +1,109 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
|
||||
/**
|
||||
* Tests for PrintPreview
|
||||
* Tests print dialog options, open/close, and preview rendering
|
||||
*/
|
||||
|
||||
describe('PrintPreview', () => {
|
||||
beforeEach(() => {
|
||||
// Mock electron require for executePrint
|
||||
jest.mock('electron', () => ({
|
||||
ipcRenderer: { send: jest.fn(), invoke: jest.fn() }
|
||||
}), { virtual: true });
|
||||
|
||||
document.body.innerHTML = `
|
||||
<div class="dialog-overlay hidden" id="print-preview-overlay">
|
||||
<button id="print-preview-close"></button>
|
||||
<button id="print-cancel"></button>
|
||||
<button id="print-execute"></button>
|
||||
<select id="print-paper-size"><option value="A4">A4</option><option value="Letter">Letter</option></select>
|
||||
<select id="print-orientation"><option value="portrait">Portrait</option><option value="landscape">Landscape</option></select>
|
||||
<select id="print-margins"><option value="default">Default</option></select>
|
||||
<input type="range" id="print-scale" value="100">
|
||||
<span id="print-scale-value">100%</span>
|
||||
<input type="checkbox" id="print-headers" checked>
|
||||
<input type="checkbox" id="print-background" checked>
|
||||
<select id="print-pages"><option value="all">All</option><option value="custom">Custom</option></select>
|
||||
<input type="text" id="print-page-range" class="hidden">
|
||||
<iframe id="print-preview-frame"></iframe>
|
||||
</div>
|
||||
`;
|
||||
});
|
||||
|
||||
test('getOptions returns default values', () => {
|
||||
const { PrintPreview } = require('../src/print-preview');
|
||||
const preview = new PrintPreview();
|
||||
const options = preview.getOptions();
|
||||
expect(options.paperSize).toBe('A4');
|
||||
expect(options.orientation).toBe('portrait');
|
||||
expect(options.scale).toBe(100);
|
||||
expect(options.headers).toBe(true);
|
||||
expect(options.background).toBe(true);
|
||||
expect(options.pages).toBe('all');
|
||||
expect(options.margins).toBe('default');
|
||||
expect(options.pageRange).toBe('');
|
||||
});
|
||||
|
||||
test('opens and closes', () => {
|
||||
const { PrintPreview } = require('../src/print-preview');
|
||||
const preview = new PrintPreview();
|
||||
preview.open('<p>Test</p>');
|
||||
expect(document.getElementById('print-preview-overlay').classList.contains('hidden')).toBe(false);
|
||||
preview.close();
|
||||
expect(document.getElementById('print-preview-overlay').classList.contains('hidden')).toBe(true);
|
||||
});
|
||||
|
||||
test('updateScaleLabel reflects slider value', () => {
|
||||
const { PrintPreview } = require('../src/print-preview');
|
||||
const preview = new PrintPreview();
|
||||
document.getElementById('print-scale').value = '75';
|
||||
preview.updateScaleLabel();
|
||||
expect(document.getElementById('print-scale-value').textContent).toBe('75%');
|
||||
});
|
||||
|
||||
test('close button closes preview', () => {
|
||||
const { PrintPreview } = require('../src/print-preview');
|
||||
const preview = new PrintPreview();
|
||||
preview.open('<p>Test</p>');
|
||||
document.getElementById('print-preview-close').click();
|
||||
expect(document.getElementById('print-preview-overlay').classList.contains('hidden')).toBe(true);
|
||||
});
|
||||
|
||||
test('cancel button closes preview', () => {
|
||||
const { PrintPreview } = require('../src/print-preview');
|
||||
const preview = new PrintPreview();
|
||||
preview.open('<p>Test</p>');
|
||||
document.getElementById('print-cancel').click();
|
||||
expect(document.getElementById('print-preview-overlay').classList.contains('hidden')).toBe(true);
|
||||
});
|
||||
|
||||
test('getOptions reflects changed values', () => {
|
||||
const { PrintPreview } = require('../src/print-preview');
|
||||
const preview = new PrintPreview();
|
||||
|
||||
// Change paper size to Letter
|
||||
const paperSelect = document.getElementById('print-paper-size');
|
||||
paperSelect.value = 'Letter';
|
||||
|
||||
// Change scale
|
||||
document.getElementById('print-scale').value = '50';
|
||||
|
||||
// Uncheck headers
|
||||
document.getElementById('print-headers').checked = false;
|
||||
|
||||
const options = preview.getOptions();
|
||||
expect(options.paperSize).toBe('Letter');
|
||||
expect(options.scale).toBe(50);
|
||||
expect(options.headers).toBe(false);
|
||||
});
|
||||
|
||||
test('stores last content for refresh', () => {
|
||||
const { PrintPreview } = require('../src/print-preview');
|
||||
const preview = new PrintPreview();
|
||||
preview.open('<p>Hello World</p>');
|
||||
expect(preview._lastContent).toBe('<p>Hello World</p>');
|
||||
});
|
||||
});
|
||||
+1
-1
@@ -59,7 +59,7 @@ global.window.electronAPI = {
|
||||
// Mock marked library
|
||||
global.window.marked = {
|
||||
parse: jest.fn((text) => `<p>${text}</p>`),
|
||||
setOptions: jest.fn()
|
||||
use: jest.fn()
|
||||
};
|
||||
|
||||
// Mock DOMPurify
|
||||
|
||||
@@ -0,0 +1,121 @@
|
||||
/**
|
||||
* @jest-environment jsdom
|
||||
*/
|
||||
|
||||
/**
|
||||
* Tests for SidebarManager
|
||||
* Tests panel registration, toggling, expand/collapse behavior
|
||||
*/
|
||||
|
||||
describe('SidebarManager', () => {
|
||||
let SidebarManager;
|
||||
|
||||
beforeEach(() => {
|
||||
document.body.innerHTML = `
|
||||
<div class="sidebar collapsed" id="sidebar">
|
||||
<div class="sidebar-icons">
|
||||
<button class="sidebar-icon" data-panel="test1"></button>
|
||||
<button class="sidebar-icon" data-panel="test2"></button>
|
||||
</div>
|
||||
<div class="sidebar-panel" id="sidebar-panel">
|
||||
<div class="sidebar-panel-header">
|
||||
<span class="sidebar-panel-title"></span>
|
||||
<button class="sidebar-panel-close"></button>
|
||||
</div>
|
||||
<div class="sidebar-panel-content" id="sidebar-panel-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
SidebarManager = require('../src/sidebar/sidebar-manager').SidebarManager;
|
||||
});
|
||||
|
||||
test('starts collapsed', () => {
|
||||
const mgr = new SidebarManager();
|
||||
expect(document.getElementById('sidebar').classList.contains('collapsed')).toBe(true);
|
||||
});
|
||||
|
||||
test('expands on panel toggle', () => {
|
||||
const mgr = new SidebarManager();
|
||||
mgr.registerPanel('test1', { title: 'Test 1', render: (c) => { c.innerHTML = 'hello'; } });
|
||||
mgr.togglePanel('test1');
|
||||
expect(document.getElementById('sidebar').classList.contains('collapsed')).toBe(false);
|
||||
expect(document.querySelector('.sidebar-panel-title').textContent).toBe('Test 1');
|
||||
});
|
||||
|
||||
test('collapses on second toggle', () => {
|
||||
const mgr = new SidebarManager();
|
||||
mgr.registerPanel('test1', { title: 'Test 1', render: () => {} });
|
||||
mgr.togglePanel('test1');
|
||||
mgr.togglePanel('test1');
|
||||
expect(document.getElementById('sidebar').classList.contains('collapsed')).toBe(true);
|
||||
});
|
||||
|
||||
test('switches panels', () => {
|
||||
const mgr = new SidebarManager();
|
||||
mgr.registerPanel('test1', { title: 'Panel 1', render: (c) => { c.innerHTML = 'one'; } });
|
||||
mgr.registerPanel('test2', { title: 'Panel 2', render: (c) => { c.innerHTML = 'two'; } });
|
||||
mgr.togglePanel('test1');
|
||||
mgr.togglePanel('test2');
|
||||
expect(document.querySelector('.sidebar-panel-title').textContent).toBe('Panel 2');
|
||||
expect(document.getElementById('sidebar-panel-content').innerHTML).toBe('two');
|
||||
});
|
||||
|
||||
test('collapse resets active panel', () => {
|
||||
const mgr = new SidebarManager();
|
||||
mgr.registerPanel('test1', { title: 'Test', render: () => {} });
|
||||
mgr.expand('test1');
|
||||
mgr.collapse();
|
||||
expect(mgr.activePanel).toBe(null);
|
||||
});
|
||||
|
||||
test('expand sets active icon', () => {
|
||||
const mgr = new SidebarManager();
|
||||
mgr.registerPanel('test1', { title: 'Test 1', render: () => {} });
|
||||
mgr.expand('test1');
|
||||
const btn = document.querySelector('[data-panel="test1"]');
|
||||
expect(btn.classList.contains('active')).toBe(true);
|
||||
});
|
||||
|
||||
test('collapse removes active icon', () => {
|
||||
const mgr = new SidebarManager();
|
||||
mgr.registerPanel('test1', { title: 'Test 1', render: () => {} });
|
||||
mgr.expand('test1');
|
||||
mgr.collapse();
|
||||
const btn = document.querySelector('[data-panel="test1"]');
|
||||
expect(btn.classList.contains('active')).toBe(false);
|
||||
});
|
||||
|
||||
test('expand with unregistered panel does nothing', () => {
|
||||
const mgr = new SidebarManager();
|
||||
mgr.expand('nonexistent');
|
||||
expect(document.getElementById('sidebar').classList.contains('collapsed')).toBe(true);
|
||||
expect(mgr.activePanel).toBe(null);
|
||||
});
|
||||
|
||||
test('render function receives panel content element', () => {
|
||||
const mgr = new SidebarManager();
|
||||
const renderFn = jest.fn();
|
||||
mgr.registerPanel('test1', { title: 'Test 1', render: renderFn });
|
||||
mgr.expand('test1');
|
||||
expect(renderFn).toHaveBeenCalledWith(document.getElementById('sidebar-panel-content'));
|
||||
});
|
||||
|
||||
test('clicking sidebar icon toggles panel', () => {
|
||||
const mgr = new SidebarManager();
|
||||
mgr.registerPanel('test1', { title: 'Test 1', render: () => {} });
|
||||
const btn = document.querySelector('[data-panel="test1"]');
|
||||
btn.click();
|
||||
expect(mgr.activePanel).toBe('test1');
|
||||
btn.click();
|
||||
expect(mgr.activePanel).toBe(null);
|
||||
});
|
||||
|
||||
test('clicking close button collapses sidebar', () => {
|
||||
const mgr = new SidebarManager();
|
||||
mgr.registerPanel('test1', { title: 'Test 1', render: () => {} });
|
||||
mgr.expand('test1');
|
||||
document.querySelector('.sidebar-panel-close').click();
|
||||
expect(mgr.activePanel).toBe(null);
|
||||
expect(document.getElementById('sidebar').classList.contains('collapsed')).toBe(true);
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user